:root{--ink:#10223a;--muted:#607086;--blue:#1768d4;--blue2:#0b4aa5;--ice:#f4f9ff;--line:#dce8f6;--white:#fff;--soft:#edf5ff;--green:#99b83c}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:linear-gradient(180deg,#fbfdff 0,#f6faff 46%,#fff 100%);line-height:1.55}.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:18px;top:18px;z-index:99;background:#fff;padding:10px 14px;border-radius:10px}.public-header{height:78px;display:flex;align-items:center;gap:24px;padding:0 clamp(20px,5vw,72px);position:sticky;top:0;z-index:20;background:rgba(255,255,255,.9);backdrop-filter:blur(14px);border-bottom:1px solid rgba(220,232,246,.85)}.public-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);min-width:max-content}.brand-spark{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(145deg,var(--blue),#3f8df1);color:#fff;font-weight:800;box-shadow:0 10px 26px rgba(23,104,212,.18)}.public-brand strong,.public-brand small{display:block}.public-brand strong{font-size:20px;letter-spacing:-.5px}.public-brand small{font-size:10px;color:var(--muted);letter-spacing:.12em;text-transform:uppercase}.public-nav{margin-left:auto;display:flex;gap:22px;align-items:center}.public-nav a{font-size:13px;color:#3f526a;text-decoration:none;font-weight:600}.public-nav a:hover{color:var(--blue)}.login-link{padding:10px 17px;border-radius:999px;text-decoration:none;background:var(--ink);color:white;font-weight:700;font-size:13px}.login-link.ghost{background:var(--soft);color:var(--blue2)}.public-section{padding:96px clamp(20px,7vw,110px);scroll-margin-top:76px}.hero{min-height:680px;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.8fr);gap:70px;align-items:center}.eyebrow{font-size:12px;letter-spacing:.16em;font-weight:800;color:var(--blue);margin:0 0 18px}.hero h1,.gateway-copy h1{font-size:clamp(44px,6.2vw,82px);line-height:.98;letter-spacing:-.055em;margin:0;max-width:870px}.hero-lead{font-size:20px;max-width:720px;color:var(--muted);margin:28px 0 32px}.hero-actions{display:flex;gap:20px;align-items:center;flex-wrap:wrap}.primary-button{display:inline-flex;align-items:center;justify-content:center;background:var(--blue);color:#fff;text-decoration:none;padding:14px 22px;border-radius:12px;font-weight:750;box-shadow:0 12px 30px rgba(23,104,212,.18)}.text-button{color:var(--blue2);text-decoration:none;font-weight:750}.ask-panel{background:#fff;border:1px solid var(--line);border-radius:28px;padding:34px;box-shadow:0 26px 90px rgba(39,88,137,.12)}.ask-icon{display:grid;width:42px;height:42px;border-radius:13px;place-items:center;background:var(--soft);color:var(--blue);font-size:21px}.ask-label{font-size:12px;letter-spacing:.13em;font-weight:800;color:var(--blue);margin:22px 0 5px}.ask-panel h2{font-size:28px;letter-spacing:-.03em;margin:0 0 20px}.public-ask-form{display:flex;border:1px solid #cbdcf0;border-radius:14px;overflow:hidden;background:#fbfdff}.public-ask-form input{flex:1;min-width:0;border:0;background:transparent;padding:15px 16px;font-size:15px;outline:none}.public-ask-form button{border:0;background:var(--blue);color:#fff;font-weight:800;padding:0 20px}.prompt-chips{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}.prompt-chips button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 10px;color:#51647a;font-size:11px;cursor:pointer}.ask-panel small{color:#78899b}.audience-intro{background:#fff}.section-heading{max-width:790px;margin-bottom:44px}.section-heading h2,.closing-section h2{font-size:clamp(34px,4.4vw,58px);line-height:1.04;letter-spacing:-.045em;margin:0 0 16px}.section-heading>p:last-child,.closing-section>p{font-size:18px;color:var(--muted);margin:0}.five-step-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.five-step-grid article,.business-grid article{padding:26px 22px;border:1px solid var(--line);border-radius:20px;background:#fbfdff}.five-step-grid span,.business-grid span{font-size:11px;font-weight:850;letter-spacing:.12em;color:var(--blue)}.five-step-grid h3,.business-grid h3{font-size:18px;margin:16px 0 9px}.five-step-grid p,.business-grid p{font-size:13px;color:var(--muted);margin:0}.claim-note{margin-top:18px;border-radius:16px;background:#eef8f5;padding:18px 22px;display:flex;gap:14px;justify-content:space-between;align-items:center;color:#225d51}.claim-note span{font-size:13px}.split-section{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}.feature-stack{display:grid;gap:12px}.feature-stack article{border-bottom:1px solid var(--line);padding:20px 0;display:grid;grid-template-columns:190px 1fr;gap:24px}.feature-stack strong{font-size:15px}.feature-stack span{font-size:14px;color:var(--muted)}.business-section{background:var(--ice)}.business-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.asset-section{background:#10223a;color:white}.asset-section .eyebrow{color:#8fc0ff}.asset-section .section-heading>p:last-child{color:#b6c5d7}.asset-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.asset-actions div{padding:28px;border-radius:20px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14)}.asset-actions strong,.asset-actions span{display:block}.asset-actions strong{font-size:22px;margin-bottom:7px}.asset-actions span{font-size:14px;color:#c7d3e2}.how-section{text-align:center}.how-section .section-heading{margin-left:auto;margin-right:auto}.how-flow{display:flex;align-items:center;justify-content:center;gap:18px;max-width:1050px;margin:auto}.how-flow div{flex:1;min-height:160px;padding:26px;background:#fff;border:1px solid var(--line);border-radius:20px;display:flex;flex-direction:column;align-items:flex-start;text-align:left}.how-flow div span{width:30px;height:30px;border-radius:10px;background:var(--soft);color:var(--blue);display:grid;place-items:center;font-weight:800}.how-flow strong{font-size:18px;margin:16px 0 6px}.how-flow small{color:var(--muted)}.how-flow i{font-style:normal;color:#91a6bd;font-size:24px}.closing-section{text-align:center;background:linear-gradient(145deg,#edf6ff,#f8fcff)}.closing-section p{max-width:720px;margin:0 auto 28px}.public-footer{padding:34px clamp(20px,7vw,110px);border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:40px;color:var(--muted);background:#fff}.public-footer div strong,.public-footer div span{display:block}.public-footer div strong{color:var(--ink);font-size:18px}.public-footer p{max-width:780px;font-size:11px;margin:0}.public-footer.compact{justify-content:center}.gateway-main{padding:90px clamp(20px,7vw,110px);display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;align-items:start}.gateway-copy{position:sticky;top:130px}.gateway-copy h1{font-size:clamp(42px,5vw,68px)}.gateway-copy>p:last-of-type{font-size:18px;color:var(--muted)}.question-carry{margin-top:30px;padding:20px;border-radius:16px;background:var(--soft);display:grid;gap:5px}.question-carry span,.question-carry small{font-size:11px;color:var(--muted)}.gateway-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.gateway-card{padding:28px;border-radius:20px;border:1px solid var(--line);background:#fff;text-decoration:none;color:var(--ink);transition:.2s ease;min-height:190px}.gateway-card:hover{transform:translateY(-3px);box-shadow:0 18px 48px rgba(39,88,137,.12);border-color:#aac9eb}.gateway-card>span{font-size:10px;letter-spacing:.14em;color:var(--blue);font-weight:850}.gateway-card h2{font-size:20px;margin:16px 0 8px}.gateway-card p{font-size:13px;color:var(--muted);margin:0 0 20px}.gateway-card em{font-style:normal;color:var(--blue);font-weight:800;font-size:13px}.gateway-card-wide{grid-column:1/-1;min-height:auto}@media(max-width:1050px){.public-nav{display:none}.hero,.split-section,.gateway-main{grid-template-columns:1fr}.gateway-copy{position:static}.five-step-grid{grid-template-columns:repeat(2,1fr)}.business-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:680px){.public-header{height:68px;padding:0 16px}.public-section{padding:64px 18px}.hero{min-height:auto;gap:38px}.hero h1,.gateway-copy h1{font-size:44px}.hero-lead{font-size:17px}.ask-panel{padding:24px;border-radius:22px}.five-step-grid,.business-grid,.asset-actions,.gateway-grid{grid-template-columns:1fr}.feature-stack article{grid-template-columns:1fr;gap:5px}.claim-note,.public-footer{align-items:flex-start;flex-direction:column}.how-flow{flex-direction:column}.how-flow i{transform:rotate(90deg)}.how-flow div{width:100%}.gateway-main{padding:60px 18px}.gateway-card-wide{grid-column:auto}.public-brand small{display:none}}

/* v2.4.2 — restrained public photography layer */
.hero-visual-stack{display:grid;gap:18px}.public-photo{margin:0;overflow:hidden;border-radius:24px;border:1px solid var(--line);background:#fff;box-shadow:0 18px 52px rgba(39,88,137,.10)}.public-photo img{display:block;width:100%;height:100%;object-fit:cover}.hero-photo{height:285px;position:relative}.hero-photo img{object-position:center 44%}.hero-photo figcaption{position:absolute;left:16px;right:16px;bottom:14px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.88);backdrop-filter:blur(8px);color:#334b66;font-size:12px;font-weight:650}.section-photo{height:230px;margin-top:26px}.section-photo img{object-position:center}.business-heading-row{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:48px;align-items:end;margin-bottom:34px}.business-heading-row .section-heading{margin-bottom:0}.business-photo{height:240px}.business-photo img{object-position:center 38%}@media(max-width:1050px){.business-heading-row{grid-template-columns:1fr}.business-photo{max-width:560px}.hero-photo{height:340px}}@media(max-width:680px){.hero-photo{height:260px}.section-photo,.business-photo{height:220px}.hero-photo figcaption{font-size:11px}.public-photo{border-radius:20px}}

/* v2.4.4 — connected interaction polish
   Subtle hover/focus states make related cards and rows feel linked without turning the public site into a dashboard. */
:root{--hover-blue:#1768d4;--hover-ring:rgba(23,104,212,.18);--hover-wash:#f4f9ff}

.public-nav a,.primary-button,.text-button,.login-link,.prompt-chips button,
.five-step-grid article,.business-grid article,.feature-stack article,
.asset-actions div,.how-flow div,.public-photo{
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,
             background-color .22s ease,color .22s ease,opacity .22s ease;
}

.public-nav a{position:relative;padding:8px 0}
.public-nav a::after{content:"";position:absolute;left:0;right:100%;bottom:2px;height:2px;border-radius:999px;background:var(--blue);transition:right .22s ease}
.public-nav a:hover::after,.public-nav a:focus-visible::after{right:0}

.primary-button:hover,.primary-button:focus-visible{transform:translateY(-2px);box-shadow:0 16px 34px rgba(23,104,212,.24)}
.login-link:hover,.login-link:focus-visible{transform:translateY(-1px);box-shadow:0 10px 28px rgba(16,34,58,.16)}
.prompt-chips button:hover,.prompt-chips button:focus-visible{border-color:#a8c8ec;background:var(--soft);color:var(--blue2)}

.five-step-grid article,.business-grid article{position:relative;overflow:hidden}
.five-step-grid article::before,.business-grid article::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--blue);transform:scaleY(0);transform-origin:center;transition:transform .22s ease}

.feature-stack article{position:relative;border-radius:14px;padding-left:14px;padding-right:14px;margin-left:-14px;margin-right:-14px}
.feature-stack article::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:999px;background:var(--blue);transform:scaleY(0);transition:transform .22s ease}

.asset-actions div,.how-flow div{position:relative}
.asset-actions div::after,.how-flow div::after{content:"→";position:absolute;right:20px;top:20px;font-size:18px;opacity:0;transform:translateX(-6px);transition:opacity .22s ease,transform .22s ease}
.asset-actions div::after{color:#8fc0ff}.how-flow div::after{color:var(--blue)}

.public-photo img{transition:transform .45s ease,filter .35s ease}

@media (hover:hover) and (pointer:fine){
  .five-step-grid:hover article:not(:hover),
  .business-grid:hover article:not(:hover),
  .feature-stack:hover article:not(:hover),
  .asset-actions:hover div:not(:hover),
  .how-flow:hover div:not(:hover){opacity:.72}

  .five-step-grid article:hover,.five-step-grid article:focus-within,
  .business-grid article:hover,.business-grid article:focus-within{
    transform:translateY(-5px);
    border-color:#a8c8ec;
    background:#fff;
    box-shadow:0 18px 42px rgba(39,88,137,.12);
  }
  .five-step-grid article:hover::before,.five-step-grid article:focus-within::before,
  .business-grid article:hover::before,.business-grid article:focus-within::before{transform:scaleY(1)}

  .feature-stack article:hover,.feature-stack article:focus-within{
    transform:translateX(6px);
    background:var(--hover-wash);
    border-bottom-color:#bfd6ef;
    box-shadow:0 10px 28px rgba(39,88,137,.07);
  }
  .feature-stack article:hover::before,.feature-stack article:focus-within::before{transform:scaleY(1)}
  .feature-stack article:hover strong{color:var(--blue2)}

  .asset-actions div:hover,.asset-actions div:focus-within{
    transform:translateY(-4px);
    background:rgba(255,255,255,.11);
    border-color:rgba(143,192,255,.46);
    box-shadow:0 18px 42px rgba(0,0,0,.16);
  }
  .asset-actions div:hover::after,.asset-actions div:focus-within::after,
  .how-flow div:hover::after,.how-flow div:focus-within::after{opacity:1;transform:translateX(0)}

  .how-flow div:hover,.how-flow div:focus-within{
    transform:translateY(-4px);
    border-color:#a8c8ec;
    box-shadow:0 16px 38px rgba(39,88,137,.11);
  }
  .how-flow div:hover span{background:var(--blue);color:#fff}

  .public-photo:hover{transform:translateY(-3px);border-color:#b5d1ef;box-shadow:0 22px 58px rgba(39,88,137,.14)}
  .public-photo:hover img{transform:scale(1.025);filter:saturate(1.03)}
}

/* Keep keyboard focus obvious and premium. */
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--hover-ring);outline-offset:3px}

@media (prefers-reduced-motion:reduce){
  .public-site *{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}


/* v2.4.6 — official Savingz brand identity
   Uses the supplied Savingz logo and a restrained blue + green accent system. */
:root{
  --brand-blue:#02145d;
  --brand-blue-bright:#1768d4;
  --brand-green:#99b83c;
  --brand-green-soft:#f3f8e7;
  --brand-green-line:#dbe9b7;
}
.savingz-logo{display:block;width:42px;height:42px;object-fit:contain;flex:0 0 auto;border-radius:11px;box-shadow:0 9px 24px rgba(2,20,93,.16)}
.public-brand .savingz-logo{width:42px;height:42px}
.public-nav a:hover,.public-nav a:focus-visible{color:var(--brand-blue-bright)}
.public-nav a::after{background:linear-gradient(90deg,var(--brand-blue-bright),var(--brand-green))}
.primary-button{background:linear-gradient(135deg,var(--brand-blue-bright),#0b4aa5)}
.primary-button:hover,.primary-button:focus-visible{box-shadow:0 16px 34px rgba(2,20,93,.22)}
.eyebrow,.ask-label,.five-step-grid span,.business-grid span{color:var(--brand-blue-bright)}
.claim-note{border-color:var(--brand-green-line)!important;background:linear-gradient(135deg,#fff,var(--brand-green-soft))!important}
.claim-note strong{color:#4c6514!important}
.prompt-chips button:hover,.prompt-chips button:focus-visible{border-color:var(--brand-green-line);background:var(--brand-green-soft);color:#526b18}
.five-step-grid article:nth-child(2n)::before,.business-grid article:nth-child(2n)::before,.feature-stack article:nth-child(2n)::before{background:var(--brand-green)}
.five-step-grid article:nth-child(2n):hover,.business-grid article:nth-child(2n):hover{border-color:var(--brand-green-line)}
.gateway-card:hover,.gateway-card:focus-visible{border-color:#b8d2ef!important;box-shadow:0 18px 42px rgba(2,20,93,.10)}
.gateway-card:nth-child(2n):hover,.gateway-card:nth-child(2n):focus-visible{border-color:var(--brand-green-line)!important}
.auth-role-pill{border-color:var(--brand-green-line)!important;background:var(--brand-green-soft)!important;color:#526b18!important}
@media(max-width:620px){.savingz-logo,.public-brand .savingz-logo{width:36px;height:36px;border-radius:9px}}

/* v2.4.7 — visible official Savingz wordmark sizing
   The supplied logo is a wordmark, not a tiny app icon. Keep it legible. */
.savingz-logo{
  width:156px!important;
  height:58px!important;
  object-fit:contain!important;
  object-position:left center!important;
  border-radius:10px!important;
  box-shadow:0 8px 22px rgba(2,20,93,.12)!important;
}
.public-brand{gap:12px!important}
.public-brand .brand-copy{display:flex;align-items:center}
.public-brand .brand-copy small{
  display:block!important;
  font-size:10px!important;
  line-height:1.25!important;
  letter-spacing:.12em!important;
  color:var(--muted)!important;
  white-space:nowrap;
}
.public-header{min-height:88px;height:auto!important;padding-top:8px;padding-bottom:8px}
@media(max-width:760px){
  .savingz-logo,.public-brand .savingz-logo{width:132px!important;height:50px!important}
  .public-brand .brand-copy small{display:none!important}
  .public-header{min-height:76px}
}
@media(max-width:420px){
  .savingz-logo,.public-brand .savingz-logo{width:118px!important;height:46px!important}
}
