@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap');

:root{
  --blue:#2563eb;
  --blue-dark:#1d4ed8;
  --blue-darker:#1e3a8a;
  --blue-50:#eff6ff;
  --blue-100:#dbeafe;
  --white:#ffffff;
  --slate:#64748b;
  --slate-dark:#475569;
  --ink:#0f172a;
  --gray-bg:#f1f5f9;
  --gray-line:#e2e8f0;
  --gray-line-2:#cbd5e1;
  --green:#16a34a;
  --radius:10px;
  --shadow:0 1px 2px rgba(15,23,42,.04);
  --shadow-md:0 4px 16px rgba(37,99,235,.08);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Roboto',-apple-system,'Segoe UI',Arial,sans-serif;
  color:var(--ink);
  background:var(--gray-bg);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
ul{list-style:none}

.container{width:100%;max-width:1120px;margin:0 auto;padding:0 16px}

/* ---------- Header ---------- */
.site-header{
  background:var(--white);
  border-bottom:1px solid var(--gray-line);
  position:sticky;top:0;z-index:50;
}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  height:64px;
}
.logo img{height:36px;width:auto}
.main-nav{
  display:flex;align-items:center;gap:4px;
  position:fixed;top:64px;left:0;right:0;
  background:var(--white);
  flex-direction:column;align-items:stretch;
  padding:8px 16px 16px;
  border-bottom:1px solid var(--gray-line);
  transform:translateY(-120%);
  transition:transform .25s ease;
  box-shadow:0 10px 24px rgba(15,23,42,.06);
}
.main-nav.open{transform:translateY(0)}
.main-nav a{
  padding:12px 14px;
  font-size:15px;font-weight:500;color:var(--slate-dark);
  border-radius:8px;min-height:44px;display:flex;align-items:center;
}
.main-nav a:hover{background:var(--blue-50);color:var(--blue)}
.main-nav .nav-cta{
  background:var(--blue);color:var(--white);justify-content:center;
  margin-top:4px;font-weight:700;
}
.main-nav .nav-cta:hover{background:var(--blue-dark);color:var(--white)}

.burger{
  width:44px;height:44px;border:1px solid var(--gray-line);
  background:var(--white);border-radius:8px;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  gap:5px;cursor:pointer;
}
.burger span{width:20px;height:2px;background:var(--ink);border-radius:2px;transition:.2s}
.burger.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.active span:nth-child(2){opacity:0}
.burger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- Hero ---------- */
.hero{background:var(--white);padding:36px 0 44px;border-bottom:1px solid var(--gray-line)}
.hero-grid{display:grid;gap:28px}
.hero-badge{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--blue-50);color:var(--blue-dark);
  font-size:12.5px;font-weight:500;
  padding:7px 13px;border-radius:999px;border:1px solid var(--blue-100);
  margin-bottom:16px;
}
.hero-badge .dot{width:7px;height:7px;border-radius:50%;background:var(--green)}
.hero h1{
  font-size:28px;line-height:1.2;font-weight:900;
  letter-spacing:-.5px;margin-bottom:14px;color:var(--ink);
}
.hero-lead{font-size:16px;color:var(--slate-dark);margin-bottom:20px;max-width:560px}
.hero-lead strong{color:var(--blue-dark);font-weight:700}
.hero-points{display:grid;gap:10px;margin-bottom:24px}
.hero-points li{display:flex;gap:10px;font-size:15px;color:var(--ink)}
.hero-points .ic{
  flex:none;width:22px;height:22px;border-radius:6px;
  background:var(--blue-50);color:var(--blue);
  display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:700;
}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:26px}

.btn-primary{
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--blue);color:var(--white);
  font-weight:700;font-size:15px;
  padding:14px 24px;border-radius:var(--radius);min-height:48px;
  box-shadow:var(--shadow-md);transition:.18s;
}
.btn-primary:hover{background:var(--blue-dark);transform:translateY(-1px)}
.btn-lg{font-size:16px;padding:16px 30px}
.btn-ghost{
  display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--gray-line-2);background:var(--white);color:var(--slate-dark);
  font-weight:500;font-size:15px;padding:14px 22px;border-radius:var(--radius);min-height:48px;transition:.18s;
}
.btn-ghost:hover{border-color:var(--blue);color:var(--blue)}

.trust-row{display:flex;gap:22px;flex-wrap:wrap;padding-top:22px;border-top:1px solid var(--gray-line)}
.trust-item{display:flex;flex-direction:column}
.trust-item strong{font-size:22px;font-weight:900;color:var(--blue);line-height:1.1}
.trust-item span{font-size:12.5px;color:var(--slate)}

/* hero card */
.hero-card{
  background:var(--white);
  border:1px solid var(--gray-line);
  border-radius:14px;
  padding:22px;box-shadow:var(--shadow-md);
}
.hero-card-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px}
.hero-card-head span:first-child{font-size:13px;color:var(--slate)}
.hero-card-amount{font-size:24px;font-weight:900;color:var(--ink)}
.hero-meter{height:8px;background:var(--gray-bg);border-radius:999px;overflow:hidden;margin-bottom:18px}
.hero-meter span{display:block;height:100%;background:var(--blue);border-radius:999px}
.hero-card-list{display:grid;gap:0;margin-bottom:18px}
.hero-card-list li{
  display:flex;justify-content:space-between;align-items:center;
  padding:11px 0;border-bottom:1px solid var(--gray-line);font-size:14px;
}
.hero-card-list li:last-child{border-bottom:none}
.hero-card-list li span{color:var(--slate)}
.hero-card-list li b{color:var(--ink);font-weight:700}
.hero-card-btn{
  display:flex;align-items:center;justify-content:center;
  background:var(--blue);color:var(--white);font-weight:700;font-size:15px;
  padding:13px;border-radius:var(--radius);min-height:48px;transition:.18s;
}
.hero-card-btn:hover{background:var(--blue-dark)}
.hero-card-note{font-size:12px;color:var(--slate);text-align:center;margin-top:12px}

/* ---------- Strip ---------- */
.strip{background:var(--blue-darker);padding:24px 0}
.strip-grid{display:grid;gap:18px}
.strip-item{display:flex;gap:14px;align-items:flex-start}
.strip-num{
  font-size:18px;font-weight:900;color:#93c5fd;
  flex:none;line-height:1.2;
}
.strip-item p{color:#dbeafe;font-size:14.5px;margin:0}

/* ---------- Section heads ---------- */
.section-head{margin-bottom:24px}
.section-head h2{font-size:23px;font-weight:900;letter-spacing:-.4px;margin-bottom:8px}
.section-head p{font-size:15px;color:var(--slate);max-width:620px}

/* ---------- Offers ---------- */
.offers-section{padding:44px 0}
#offers{
  display:grid;grid-template-columns:1fr;gap:14px;
}
.offers-disclaimer{
  margin-top:22px;font-size:12px;color:var(--slate);
  background:var(--white);border:1px solid var(--gray-line);
  border-radius:var(--radius);padding:14px 16px;
}

/* ----- INJECTED OFFER CARD ----- */
.offer,.offer.offer-small{
  background:var(--white);
  border:1px solid var(--gray-line);
  border-radius:12px;
  padding:18px;
  display:flex;flex-direction:column;
  transition:border-color .18s, box-shadow .18s, transform .18s;
}
.offer:hover{border-color:var(--blue);box-shadow:var(--shadow-md);transform:translateY(-2px)}

.offer-key{display:none}

.offer-logo{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding-bottom:14px;margin-bottom:14px;
  border-bottom:1px solid var(--gray-line);
  min-height:70px;
}
.offer-logo a{display:inline-flex;align-items:center;flex:1 1 auto;min-width:0}
.offer-logo img{max-height:64px;max-width:190px;width:auto;object-fit:contain}

.offer-info{display:grid;gap:0;margin:0 0 14px}
.offer-info li{
  display:flex;align-items:center;justify-content:space-between;
  padding:9px 0;border-bottom:1px solid var(--gray-line);
  font-size:14px;
}
.offer-info li:last-child{border-bottom:none}
.offer-info .text{color:var(--slate);font-weight:400}
.offer-info .value{color:var(--ink);font-weight:700;text-align:right}

.offer-present{
  background:var(--gray-bg);
  border-radius:8px;
  padding:9px 12px;margin-bottom:12px;
  display:flex;align-items:center;justify-content:space-between;gap:8px;
}
.offer-present-text{font-size:11px;color:var(--slate);line-height:1.3;max-width:120px}
.offer-present-inner{display:flex;gap:6px;font-size:12px;color:var(--slate-dark);font-weight:500;white-space:nowrap}
.offer-present-inner div{line-height:1.2}

.offer-links{margin-bottom:14px}
.offer-links a{
  font-size:11.5px;color:var(--slate);text-decoration:underline;
  text-underline-offset:2px;
}
.offer-links a:hover{color:var(--blue)}

.offer-cta{
  margin-top:auto;
  display:flex;align-items:center;justify-content:center;
  width:100%;
  background:var(--blue);color:var(--white);
  font-size:16px;font-weight:700;
  padding:15px 18px;min-height:52px;
  border-radius:var(--radius);
  box-shadow:0 2px 8px rgba(37,99,235,.25);
  transition:.18s;letter-spacing:.2px;
}
.offer-cta:hover{background:var(--blue-dark);box-shadow:0 4px 16px rgba(37,99,235,.35);transform:translateY(-1px)}
.offer-cta:active{transform:translateY(0)}

/* ---------- How it works ---------- */
.how{background:var(--white);padding:44px 0;border-top:1px solid var(--gray-line);border-bottom:1px solid var(--gray-line)}
.steps{display:grid;gap:14px}
.step{
  background:var(--white);border:1px solid var(--gray-line);
  border-radius:12px;padding:22px;position:relative;
}
.step-num{
  width:40px;height:40px;border-radius:10px;
  background:var(--blue-50);color:var(--blue);
  font-size:18px;font-weight:900;
  display:flex;align-items:center;justify-content:center;margin-bottom:14px;
}
.step h3{font-size:17px;font-weight:700;margin-bottom:6px}
.step p{font-size:14px;color:var(--slate-dark)}

/* ---------- FAQ ---------- */
.faq{padding:44px 0}
.faq-list{display:grid;gap:10px}
.faq details{
  background:var(--white);border:1px solid var(--gray-line);
  border-radius:10px;overflow:hidden;
}
.faq summary{
  cursor:pointer;list-style:none;
  padding:16px 18px;font-size:15px;font-weight:500;color:var(--ink);
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  min-height:44px;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"+";font-size:20px;color:var(--blue);font-weight:400;flex:none;
}
.faq details[open] summary::after{content:"–"}
.faq details[open] summary{color:var(--blue)}
.faq details p{padding:0 18px 18px;font-size:14px;color:var(--slate-dark)}

/* ---------- CTA band ---------- */
.cta-band{background:var(--blue);padding:36px 0}
.cta-band-inner{display:grid;gap:18px;text-align:center}
.cta-band h2{color:var(--white);font-size:22px;font-weight:900;margin-bottom:6px}
.cta-band p{color:#dbeafe;font-size:15px}
.cta-band .btn-primary{background:var(--white);color:var(--blue-dark)}
.cta-band .btn-primary:hover{background:var(--blue-50)}

/* ---------- Footer ---------- */
.site-footer{background:var(--ink);color:#cbd5e1;padding:36px 0 28px}
.footer-inner{display:grid;gap:24px;padding-bottom:24px;border-bottom:1px solid #1e293b}
.footer-brand img{height:34px;filter:brightness(0) invert(1);opacity:.95;margin-bottom:12px}
.footer-brand p{font-size:13.5px;color:#94a3b8;max-width:320px}
.footer-nav{display:flex;flex-wrap:wrap;gap:8px 20px}
.footer-nav a{font-size:14px;color:#cbd5e1;min-height:32px;display:flex;align-items:center}
.footer-nav a:hover{color:var(--white)}
.footer-legal{padding-top:22px}
.legal-text{font-size:11.5px;color:#64748b;line-height:1.6;margin-bottom:14px}
.legal-copy{font-size:12.5px;color:#94a3b8}
.legal-copy a{color:#cbd5e1;text-decoration:underline;text-underline-offset:2px}
.legal-copy a:hover{color:var(--white)}

/* ---------- Tablet ---------- */
@media(min-width:640px){
  .hero h1{font-size:34px}
  .strip-grid{grid-template-columns:repeat(3,1fr)}
  #offers{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(3,1fr)}
  .footer-inner{grid-template-columns:1fr auto;align-items:start}
  .cta-band-inner{grid-template-columns:1fr auto;text-align:left;align-items:center}
}

/* ---------- Desktop ---------- */
@media(min-width:900px){
  .burger{display:none}
  .main-nav{
    position:static;transform:none;flex-direction:row;align-items:center;
    padding:0;border:none;box-shadow:none;background:transparent;gap:6px;
  }
  .main-nav a{min-height:auto;padding:9px 14px}
  .main-nav .nav-cta{margin-top:0;padding:11px 20px}
  .hero{padding:54px 0 60px}
  .hero-grid{grid-template-columns:1.25fr .9fr;align-items:center;gap:48px}
  .hero h1{font-size:40px}
  .section-head h2{font-size:28px}
  #offers{grid-template-columns:repeat(3,1fr);gap:18px}
}/* === logo size bump 2026-06-22 === */
.logo img,.header .logo img,header .logo img{height:56px !important;max-height:56px !important;width:auto !important;max-width:74vw}
.footer .logo img,.footer-brand img,.footer-top .logo img{height:46px !important;max-height:46px !important;width:auto !important}
@media(max-width:600px){.logo img,.header .logo img,header .logo img{height:46px !important;max-height:46px !important}}
/* === calculator css === */
/* ===== Reject-showcase loan calculator (replaces hero) ===== */
.rcalc-section{
  padding:28px 0 8px;
}
.rcalc-card{
  max-width:560px;
  margin:0 auto;
  background:#fff;
  border:1px solid #e6e8ee;
  border-radius:18px;
  box-shadow:0 10px 30px rgba(37,99,235,.08);
  padding:26px 26px 22px;
}
.rcalc-head{
  text-align:center;
  margin-bottom:20px;
}
.rcalc-eyebrow{
  display:inline-block;
  font-size:12px;
  font-weight:600;
  letter-spacing:.02em;
  text-transform:uppercase;
  color:#2563eb;
  background:rgba(37,99,235,.10);
  padding:5px 12px;
  border-radius:999px;
  margin-bottom:10px;
}
.rcalc-title{
  font-size:24px;
  line-height:1.2;
  font-weight:700;
  margin:0;
  color:#0f172a;
}

/* --- slider rows --- */
.rcalc-row{ margin-bottom:18px; }
.rcalc-row-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:10px;
}
.rcalc-row-top label{
  font-size:14px;
  font-weight:600;
  color:#475569;
  text-transform:uppercase;
  letter-spacing:.03em;
}
.rcalc-pill{
  font-size:16px;
  font-weight:700;
  color:#2563eb;
  background:rgba(37,99,235,.10);
  padding:6px 14px;
  border-radius:999px;
  min-width:90px;
  text-align:center;
}
.rcalc-scale{
  display:flex;
  justify-content:space-between;
  margin-top:7px;
  font-size:12px;
  color:#94a3b8;
}

/* --- range input (theme accent #2563eb) --- */
.rcalc-range{
  -webkit-appearance:none;
  appearance:none;
  width:100%;
  height:8px;
  border-radius:999px;
  background:#e2e8f0;
  outline:none;
  margin:0;
  cursor:pointer;
}
.rcalc-range::-webkit-slider-runnable-track{
  height:8px;
  border-radius:999px;
  background:transparent;
}
.rcalc-range::-moz-range-track{
  height:8px;
  border-radius:999px;
  background:#e2e8f0;
}
.rcalc-range::-moz-range-progress{
  height:8px;
  border-radius:999px;
  background:#2563eb;
}
.rcalc-range::-webkit-slider-thumb{
  -webkit-appearance:none;
  appearance:none;
  width:26px;
  height:26px;
  margin-top:-9px;
  border-radius:50%;
  background:#2563eb;
  border:4px solid #fff;
  box-shadow:0 2px 8px rgba(37,99,235,.45);
  cursor:pointer;
  transition:transform .12s ease;
}
.rcalc-range::-webkit-slider-thumb:active{ transform:scale(1.12); }
.rcalc-range::-moz-range-thumb{
  width:26px;
  height:26px;
  border-radius:50%;
  background:#2563eb;
  border:4px solid #fff;
  box-shadow:0 2px 8px rgba(37,99,235,.45);
  cursor:pointer;
}
.rcalc-range:focus-visible{ outline:none; }
.rcalc-range:focus-visible::-webkit-slider-thumb{ box-shadow:0 0 0 4px rgba(37,99,235,.25); }
.rcalc-range:focus-visible::-moz-range-thumb{ box-shadow:0 0 0 4px rgba(37,99,235,.25); }

/* --- result row --- */
.rcalc-result{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  background:#f5f8ff;
  border:1px solid #e2e9fb;
  border-radius:14px;
  padding:14px 12px;
  margin:18px 0 18px;
}
.rcalc-result-item{
  flex:1 1 0;
  min-width:96px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
  text-align:center;
}
.rcalc-result-label{
  font-size:12px;
  color:#64748b;
}
.rcalc-result-value{
  font-size:17px;
  font-weight:700;
  color:#0f172a;
}
.rcalc-result-total .rcalc-result-value{ color:#2563eb; }

/* --- CTA button --- */
.rcalc-cta{
  display:block;
  width:100%;
  min-height:54px;
  border:none;
  border-radius:14px;
  background:#2563eb;
  color:#fff;
  font-size:17px;
  font-weight:700;
  letter-spacing:.01em;
  cursor:pointer;
  box-shadow:0 6px 18px rgba(37,99,235,.35);
  transition:background .15s ease, transform .1s ease, box-shadow .15s ease;
  font-family:inherit;
}
.rcalc-cta:hover{ background:#1d4fd8; box-shadow:0 8px 22px rgba(37,99,235,.45); }
.rcalc-cta:active{ transform:translateY(1px) scale(.99); }
.rcalc-note{
  text-align:center;
  font-size:12px;
  color:#94a3b8;
  margin:12px 0 0;
}

/* --- mobile --- */
@media (max-width:560px){
  .rcalc-card{ padding:22px 18px 18px; border-radius:16px; }
  .rcalc-title{ font-size:21px; }
  .rcalc-pill{ font-size:15px; min-width:80px; }
  .rcalc-result-item{ min-width:84px; }
  .rcalc-result-value{ font-size:16px; }
}
/* === money24 fixes 2026-06-22 === */
#offers, #offers-top { scroll-margin-top: 110px; }                 /* anchor lands below sticky header */
.offer-links, .offer-button { display: none !important; } /* clean card */
/* logo bigger + loans-issued-today to the right */
.offer-logo { justify-content: space-between !important; gap: 16px; min-height:70px; }
.offer-logo a { flex: 1 1 auto; min-width: 0; }
.offer-logo img { max-height: 66px !important; max-width: 190px; }
.offer-issued { flex: none; min-width:92px; text-align: right; white-space: nowrap; line-height:1.05; }
.offer-issued b { display:block; font-size:24px; font-weight:900; color:var(--green); line-height:1; letter-spacing:-.4px; }
.offer-issued span { display:block; font-size:10.5px; color:var(--slate-dark); font-weight:700; margin-top:4px; text-transform:uppercase; letter-spacing:.03em; }
@media(max-width:560px){
  .offer{padding:16px}
  .offer-logo{gap:12px;min-height:66px;align-items:center}
  .offer-logo a{flex:1 1 auto;max-width:calc(100% - 88px)}
  .offer-logo img{max-height:58px !important;max-width:150px}
  .offer-issued{min-width:72px;max-width:78px;white-space:normal;text-align:right}
  .offer-issued b{font-size:23px}
  .offer-issued span{font-size:9px;line-height:1.05;letter-spacing:.02em}
}
/* greeting "гроші їдуть" banner -> site (blue) palette */
.gr-banner p { color: var(--blue-darker) !important; }
.gr-cur { background: var(--blue-darker) !important; }
.gr-typing i { background: rgba(37,99,235,.45) !important; }

/* gr-disc greeting -> blue */
.gr-disc p { color: var(--blue-darker) !important; }
.gr-disc span { filter: hue-rotate(190deg); }

/* reject-hide-apr: APR ставка + юр-лінки прибрані з карток */
.offer-present,.offer-links,.offer-button{display:none !important}

/* reject-hide-socialproof */
#fomo-popup,.sp-badge,.sp-popup,.social-proof{display:none !important}
