/*
Theme Name: Zeus
Theme URI: https://zeuspay.com.au
Author: Zeuspay
Description: Custom theme for the Zeuspay eligibility-matching platform. Sky & Spark design system.
Version: 1.0
Text Domain: zeus
*/

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@500;700;800&family=Manrope:wght@400;500;600&display=swap');

* { margin:0; padding:0; box-sizing:border-box; }

:root {
  --storm:#232349;
  --daybreak:#FBF6EC;
  --spark:#F2A93B;
  --ink:#1B1B2E;
  --ink-soft:#4A4A5E;
  --ink-softer:#5C5C70;
  --muted:#8A8A9A;
  --hairline:#D8C9A0;
  --gold-text:#8A5A17;
  --gold-bg:#F9E3BE;
  --maxw:1200px;
}

body {
  font-family:'Manrope',sans-serif;
  background:var(--daybreak);
  color:var(--ink);
}

body.page-mid    { --maxw:1000px; }
body.page-narrow { --maxw:860px; }

/* ---------- shared: nav ---------- */
.nav {
  display:flex; align-items:center; justify-content:space-between;
  padding:28px 48px; max-width:var(--maxw); margin:0 auto; position:relative;
}
.nav-logo {
  display:flex; align-items:center; gap:10px;
  font-family:'Plus Jakarta Sans',sans-serif; font-weight:800; font-size:20px;
  letter-spacing:-0.5px; color:var(--storm); text-decoration:none;
}
.nav-toggle { display:none; background:none; border:none; cursor:pointer; padding:8px; flex-direction:column; gap:5px; }
.nav-toggle span { display:block; width:22px; height:2px; background:var(--storm); border-radius:2px; }
.nav-links { display:flex; gap:32px; font-size:14px; font-weight:600; }
.nav-links li { list-style:none; }
.nav-links a { color:var(--storm); text-decoration:none; }
.nav-links a:hover { color:var(--spark); }

/* ---------- shared: eyebrow pill ---------- */
.eyebrow {
  display:inline-block; font-size:12px; font-weight:700; letter-spacing:1.5px;
  text-transform:uppercase; color:var(--gold-text); background:var(--gold-bg);
  padding:6px 14px; border-radius:20px; margin-bottom:18px;
}

/* ---------- shared: generic page header (How it works / FAQ / Privacy / Terms) ---------- */
.page-header { max-width:var(--maxw); margin:0 auto; padding:52px 48px 28px; }
.page-header h1 {
  font-family:'Plus Jakarta Sans',sans-serif; font-weight:800; font-size:34px;
  letter-spacing:-1px; margin-bottom:14px; max-width:600px; line-height:1.18;
}
.page-header .sub { font-size:15.5px; color:var(--ink-soft); max-width:480px; line-height:1.6; }
.updated { font-size:13px; color:var(--muted); }

/* ---------- shared: CTA band ---------- */
.cta-strip { max-width:var(--maxw); margin:20px auto 0; padding:0 48px; }
.cta-band {
  background:var(--storm); border-radius:22px; padding:48px 44px;
  display:flex; align-items:center; gap:28px; flex-wrap:wrap; position:relative; overflow:hidden;
}
.cta-band h2 {
  color:var(--daybreak); font-family:'Plus Jakarta Sans',sans-serif; font-size:23px;
  font-weight:800; letter-spacing:-0.5px; flex:1; position:relative; z-index:1;
}
.cta {
  font-family:'Plus Jakarta Sans',sans-serif; font-weight:700; font-size:14.5px;
  background:var(--spark); color:var(--storm); border:none; padding:15px 26px;
  border-radius:12px; letter-spacing:-0.2px; cursor:pointer; white-space:nowrap;
  position:relative; z-index:1;
}

/* ---------- shared: footer ---------- */
.footer { max-width:var(--maxw); margin:0 auto; padding:44px 48px; border-top:1px solid rgba(35,35,73,0.08); }
.footer-top { display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:24px; margin-bottom:24px; }
.footer-links { display:flex; gap:26px; font-size:14px; color:var(--ink-soft); flex-wrap:wrap; }
.footer-links li { list-style:none; }
.footer-links a { color:var(--ink-soft); text-decoration:none; }
.footer-links a:hover { color:var(--spark); }
.disclaimer { font-size:12px; color:var(--muted); line-height:1.6; max-width:900px; }
.copyright { font-size:12px; color:#A0A0AC; margin-top:18px; }

/* ================= HOME ================= */
.hero { max-width:var(--maxw); margin:0 auto; padding:40px 48px 80px; display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center; }
.hero h1 { font-family:'Plus Jakarta Sans',sans-serif; font-weight:800; font-size:52px; line-height:1.08; letter-spacing:-1.5px; margin-bottom:22px; }
.hero h1 span { color:#C97F17; }
.hero .sub { font-size:17px; line-height:1.6; color:var(--ink-soft); max-width:440px; margin-bottom:32px; }
.cta-row { display:flex; align-items:center; gap:18px; }
.cta-note { font-size:13px; color:#7A7A8C; }
.illustration { display:flex; align-items:center; justify-content:center; }

.section { max-width:var(--maxw); margin:0 auto; padding:70px 48px; }
.section-eyebrow { font-size:12px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:#C97F17; margin-bottom:12px; }
.section h2 { font-family:'Plus Jakarta Sans',sans-serif; font-weight:800; font-size:32px; letter-spacing:-1px; margin-bottom:14px; max-width:560px; }
.section-sub { font-size:15.5px; color:var(--ink-soft); max-width:560px; line-height:1.6; margin-bottom:48px; }

.steps-illus { display:grid; grid-template-columns:repeat(3,1fr); gap:36px; }
.step-i .art { display:flex; justify-content:center; margin-bottom:18px; }
.step-i .art svg { max-width:100%; height:auto; }
.step-kicker { font-size:11.5px; font-weight:700; letter-spacing:1.6px; text-transform:uppercase; color:#C97F17; margin-bottom:8px; }
.step-i h3 { font-family:'Plus Jakarta Sans',sans-serif; font-weight:700; font-size:16.5px; margin-bottom:8px; letter-spacing:-0.2px; }
.step-i p { font-size:13.5px; color:var(--ink-softer); line-height:1.65; }

.trust-bar { background:#F2E8D2; border-radius:16px; padding:26px 36px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:20px; }
.trust-item { text-align:center; flex:1; min-width:140px; }
.trust-num { font-family:'Plus Jakarta Sans',sans-serif; font-weight:800; font-size:24px; color:var(--storm); }
.trust-label { font-size:12.5px; color:#7A6A45; margin-top:4px; }

.props { display:grid; grid-template-columns:repeat(3,1fr); gap:36px; }
.prop-art { display:flex; justify-content:center; margin-bottom:16px; }
.prop-art svg { max-width:100%; height:auto; }
.prop-card h3 { font-family:'Plus Jakarta Sans',sans-serif; font-weight:700; font-size:16px; margin-bottom:8px; }
.prop-card p { font-size:14px; color:var(--ink-softer); line-height:1.6; }

/* ================= HOW IT WORKS ================= */
.journey { max-width:var(--maxw); margin:0 auto; padding:20px 48px 10px; position:relative; }
.spine { position:absolute; left:50%; width:2px; background:repeating-linear-gradient(to bottom,var(--hairline) 0,var(--hairline) 6px,transparent 6px,transparent 14px); transform:translateX(-50%); z-index:0; }
.spine-dot { position:absolute; left:50%; width:14px; height:14px; border-radius:50%; background:var(--spark); transform:translate(-50%,-50%); z-index:1; }

.scene { position:relative; z-index:1; padding:64px 0; display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.scene.reverse .scene-art { order:2; }

.fitmap-block { position:relative; z-index:1; padding:20px 0 64px; }
.fitmap-block .fitmap-illus { max-width:820px; margin:0 auto; }
.scene.reverse .scene-text { order:1; text-align:right; }
.scene-kicker { font-size:12px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:#C97F17; margin-bottom:10px; }
.scene-text h2 { font-family:'Plus Jakarta Sans',sans-serif; font-weight:800; font-size:23px; letter-spacing:-0.6px; margin-bottom:12px; line-height:1.2; }
.scene-text p { font-size:14.5px; color:var(--ink-soft); line-height:1.65; }
.scene-art { display:flex; align-items:center; justify-content:center; }

.hl {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='10' viewBox='0 0 100 10'%3E%3Cpath d='M0 6 Q8 2 16 6 T32 6 T48 6 T64 6 T80 6 T100 6' stroke='%23F2A93B' stroke-width='3' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:repeat-x; background-position:0 100%; background-size:70px 10px; padding-bottom:5px; font-weight:700; color:var(--storm);
}
.note { font-family:'Plus Jakarta Sans',sans-serif; font-weight:700; font-size:20px; line-height:1.55; color:var(--storm); letter-spacing:-0.3px; transform:rotate(-1.2deg); max-width:280px; }

.shortlist { list-style:none; }
.sl-row { display:flex; align-items:center; gap:18px; padding:16px 0; border-bottom:1px dashed var(--hairline); }
.sl-row:first-child { border-top:1px dashed var(--hairline); }
.sl-ghost { font-family:'Plus Jakarta Sans',sans-serif; font-weight:800; font-size:34px; color:transparent; -webkit-text-stroke:1.3px rgba(27,27,46,0.22); width:40px; flex:none; }
.sl-body { flex:1; }
.sl-name { font-family:'Plus Jakarta Sans',sans-serif; font-weight:700; font-size:15.5px; display:flex; align-items:center; gap:8px; }
.sl-sub { font-size:12.5px; color:#7A7A8C; margin-top:2px; }
.sl-right { text-align:right; }
.sl-rate { font-family:'Plus Jakarta Sans',sans-serif; font-weight:800; font-size:15px; }
.sl-match { font-size:12px; color:var(--ink-softer); margin-top:2px; }
.ribbon { display:inline-flex; }
.note-sm { font-size:11.5px; color:var(--muted); margin-top:18px; line-height:1.6; max-width:460px; }

.spark-deco { position:absolute; right:-10px; top:-20px; opacity:0.5; }

/* ================= FAQ ================= */
.faq-wrap { max-width:760px; margin:0 auto; padding:20px 48px 30px; }
.faq-cat { margin-top:44px; }
.faq-cat:first-child { margin-top:20px; }
.cat-label { font-size:12px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:#C97F17; margin-bottom:6px; }
.qa { border-bottom:1px dashed var(--hairline); }
.qa:first-of-type { border-top:1px dashed var(--hairline); }
.qa summary { list-style:none; cursor:pointer; padding:18px 34px 18px 0; position:relative; font-family:'Plus Jakarta Sans',sans-serif; font-weight:700; font-size:15.5px; letter-spacing:-0.2px; }
.qa summary::-webkit-details-marker { display:none; }
.qa summary::before { content:"+"; position:absolute; right:0; top:16px; width:22px; height:22px; color:var(--spark); font-size:19px; font-weight:800; text-align:center; line-height:22px; }
.qa[open] summary::before { content:"–"; }
.qa p { font-size:14px; color:var(--ink-soft); line-height:1.7; padding:0 34px 22px 0; }

/* ================= PRIVACY / TERMS (legal content) ================= */
.content { max-width:var(--maxw); margin:0 auto; padding:26px 48px 70px; }
.content h2 { font-family:'Plus Jakarta Sans',sans-serif; font-weight:700; font-size:18px; letter-spacing:-0.3px; margin:32px 0 10px; }
.content h2:first-child { margin-top:0; }
.content h3 { font-family:'Plus Jakarta Sans',sans-serif; font-weight:700; font-size:15px; margin:20px 0 8px; }
.content p { font-size:14px; color:#3D3D50; line-height:1.75; margin-bottom:12px; }
.content ul { margin:0 0 12px 20px; }
.content li { font-size:14px; color:#3D3D50; line-height:1.75; margin-bottom:6px; }
.content a { color:#C97F17; }
.content strong { font-weight:700; color:var(--storm); }
.entity-block { background:#F2E8D2; border-radius:14px; padding:20px 24px; margin:24px 0; }
.entity-block p { color:#5C4A22; margin-bottom:4px; }

/* ================= CONTACT ================= */
.wrap { max-width:var(--maxw); margin:0 auto; padding:30px 48px 80px; display:grid; grid-template-columns:0.85fr 1.15fr; gap:60px; align-items:start; }
.wrap h1 { font-family:'Plus Jakarta Sans',sans-serif; font-weight:800; font-size:38px; letter-spacing:-1.2px; margin-bottom:16px; }
.wrap .sub { font-size:15px; color:var(--ink-soft); line-height:1.65; margin-bottom:32px; max-width:380px; }
.detail { margin-bottom:24px; }
.detail-label { font-size:12px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase; color:var(--muted); margin-bottom:6px; }
.detail-value { font-family:'Plus Jakarta Sans',sans-serif; font-weight:700; font-size:18px; }
.detail-value a { color:var(--storm); text-decoration:none; }
.detail-sub { font-size:13px; color:#7A7A8C; margin-top:4px; }
.faq-nudge { font-size:13.5px; color:var(--ink-soft); line-height:1.6; margin-top:36px; padding-top:24px; border-top:1px dashed var(--hairline); max-width:380px; }
.faq-nudge a { color:#C97F17; font-weight:600; }
.form-note { font-family:'Plus Jakarta Sans',sans-serif; font-weight:700; font-size:19px; color:var(--storm); margin-bottom:8px; letter-spacing:-0.3px; transform:rotate(-0.6deg); }
.form-sub { font-size:13.5px; color:#7A7A8C; margin-bottom:34px; }
.field { margin-bottom:30px; }
.field label { display:block; font-size:12px; font-weight:700; letter-spacing:1.2px; text-transform:uppercase; color:var(--muted); margin-bottom:10px; }
.field input, .field textarea { width:100%; border:none; border-bottom:2px solid var(--hairline); background:transparent; font-family:'Manrope',sans-serif; font-size:16px; color:var(--ink); padding:6px 0 10px; outline:none; resize:none; }
.field input:focus, .field textarea:focus { border-bottom-color:var(--spark); }
.field textarea { height:90px; }
.send { font-family:'Plus Jakarta Sans',sans-serif; font-weight:700; font-size:15px; background:var(--storm); color:var(--daybreak); border:none; padding:15px 30px; border-radius:12px; letter-spacing:-0.2px; cursor:pointer; }
.form-status { font-size:13.5px; padding:12px 0; }
.form-status.success { color:#3B6D11; }
.form-status.error { color:#A32D2D; }

/* ================= RESPONSIVE ================= */
html, body { overflow-x:hidden; }

@media (max-width:820px) {
  .hero { grid-template-columns:1fr; }
  .steps-illus, .props { grid-template-columns:1fr; }
  .steps-illus { gap:44px; }
}
@media (max-width:760px) {
  .spine, .spine-dot { display:none; }
  .scene, .scene.reverse { grid-template-columns:1fr; text-align:left; gap:24px; padding:36px 0; }
  .fitmap-block { padding:12px 0 36px; }
  .scene.reverse .scene-art, .scene.reverse .scene-text { order:initial; text-align:left; }
  .cta-band { flex-direction:column; align-items:flex-start; }
  .wrap { grid-template-columns:1fr; gap:36px; }
}

@media (max-width:640px) {
  .nav, .hero, .section, .page-header, .content, .wrap, .journey, .faq-wrap, .cta-strip, .footer {
    padding-left:20px; padding-right:20px;
  }
  .nav { padding-top:20px; padding-bottom:20px; }
  .nav-toggle { display:flex; }
  .nav-links {
    display:none; position:absolute; left:20px; right:20px; top:60px;
    background:#FFFFFF; border-radius:14px; box-shadow:0 12px 32px -12px rgba(15,23,42,.25);
    flex-direction:column; gap:0; padding:8px; z-index:200;
  }
  .nav-links.open { display:flex; }
  .nav-links a { display:block; padding:12px 14px; border-radius:10px; }
  .nav-links a:hover { background:#F5F1E6; }

  .hero h1 { font-size:32px; letter-spacing:-1px; }
  .hero .sub { font-size:15.5px; }
  .page-header { padding-top:28px; padding-bottom:16px; }
  .page-header h1 { font-size:26px; line-height:1.2; }
  .eyebrow { margin-bottom:14px; }
  .section h2 { font-size:23px; }
  .scene-text h2 { font-size:19px; }
  .cta-band { padding:32px 24px; border-radius:18px; }
  .cta-band h2 { font-size:19px; }
  .trust-bar { padding:20px; }
  .trust-num { font-size:20px; }
}
