/*
Theme Name: Szép Jövő Theme
Theme URI: https://szepjovo.hu
Author: Szép Jövő Project
Description: Letisztult, szellős pénzügyi kalkulátor és leadgeneráló WordPress theme a szepjovo.hu projekthez.
Version: 1.2.4
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 8.0
Text Domain: szepjovo-theme
*/

:root {
  --sj-navy: #071b35;
  --sj-navy-2: #0b3154;
  --sj-green: #18b686;
  --sj-green-dark: #129b73;
  --sj-mint: #eaf8f3;
  --sj-mint-2: #dff3ec;
  --sj-cream: #fffaf1;
  --sj-paper: #ffffff;
  --sj-soft: #f8fcfb;
  --sj-line: #dfecea;
  --sj-muted: #607080;
  --sj-text: #0f2238;
  --sj-shadow: 0 20px 56px rgba(7, 27, 53, 0.09);
  --sj-shadow-soft: 0 10px 28px rgba(7, 27, 53, 0.06);
  --sj-container: 1180px;
}
* { 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(--sj-text);
  background:
    radial-gradient(circle at top right, rgba(19, 166, 122, 0.07), transparent 34%),
    linear-gradient(180deg, #ffffff 0%, #fbfdfc 46%, #ffffff 100%);
  line-height: 1.65;
}
a { color: inherit; }
img { max-width: 100%; height: auto; display:block; }
.sj-container { width: min(var(--sj-container), calc(100% - 48px)); margin: 0 auto; }
.sj-site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255, 255, 255, 0.82);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(223,236,234,.85);
}
.sj-nav { min-height: 86px; display:flex; align-items:center; justify-content:space-between; gap:30px; }
.sj-brand { display:inline-flex; align-items:center; gap:14px; text-decoration:none; }
.sj-brand-icon { width:54px; height:54px; object-fit:contain; flex:0 0 auto; }
.sj-brand-copy { display:flex; flex-direction:column; }
.sj-brand-title { display:block; color:var(--sj-navy); font-size:23px; line-height:1.05; font-weight:850; letter-spacing:-0.03em; }
.sj-brand-subtitle { display:block; margin-top:4px; color:#607080; font-size:12px; line-height:1.2; font-weight:650; }
.sj-menu { display:flex; align-items:center; gap:26px; margin-left:auto; }
.sj-menu a { font-size:14px; font-weight:700; color:#233750; text-decoration:none; }
.sj-menu a:hover { color:var(--sj-green-dark); }
.sj-nav-cta, .sj-button {
  border:0; text-decoration:none; display:inline-flex; align-items:center; justify-content:center;
  min-height:50px; padding:0 22px; border-radius:15px; font-weight:850; font-size:15px; cursor:pointer;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.sj-nav-cta, .sj-button-primary {
  background: var(--sj-navy); color:white; box-shadow: 0 14px 30px rgba(7,27,53,.18);
}
.sj-button-primary:hover, .sj-nav-cta:hover { transform: translateY(-1px); box-shadow: 0 18px 36px rgba(7,27,53,.22); }
.sj-button-secondary { color: var(--sj-green-dark); background:white; border:1px solid rgba(24,182,134,.34); }
.sj-button-secondary:hover { background: var(--sj-mint); }
.sj-mobile-toggle { display:none; background:white; border:1px solid var(--sj-line); border-radius:12px; width:46px; height:46px; font-size:22px; color:var(--sj-navy); }

.sj-hero { padding: 76px 0 58px; }
.sj-hero-grid { display:grid; grid-template-columns: 1.02fr .98fr; gap:76px; align-items:center; }
.sj-kicker {
  display:inline-flex; align-items:center; gap:8px; color:var(--sj-green-dark); background:rgba(24,182,134,.08);
  border:1px solid rgba(24,182,134,.15); border-radius:999px; padding:9px 14px; font-size:12px; line-height:1;
  font-weight:850; letter-spacing:.08em; text-transform:uppercase;
}
.sj-hero h1, .sj-page h1 {
  margin: 22px 0 18px; color:var(--sj-navy); font-size: clamp(42px, 5.1vw, 72px); line-height:.99;
  letter-spacing:-0.065em; max-width:720px;
}
.sj-hero p { max-width:640px; margin:0 0 30px; color:#41546a; font-size:19px; line-height:1.75; }
.sj-hero-actions { display:flex; flex-wrap:wrap; gap:14px; margin-top:8px; }
.sj-hero-note { margin-top:20px; display:flex; gap:12px; align-items:flex-start; max-width:580px; color:#607080; font-size:14px; }
.sj-hero-note span { width:24px; height:24px; flex:0 0 auto; border-radius:50%; display:grid; place-items:center; color:white; background:var(--sj-green); font-size:13px; font-weight:900; }
.sj-hero-visual { position:relative; min-height:500px; }
.sj-visual-blob {
  position:absolute; inset:18px 12px 0 40px; border-radius:44% 56% 47% 53% / 54% 42% 58% 46%;
  background: radial-gradient(circle at 36% 22%, rgba(255,255,255,.94), transparent 30%), linear-gradient(135deg, rgba(234,248,243,1), rgba(255,250,240,.95));
  border:1px solid rgba(223,236,234,.8);
}
.sj-visual-card {
  position:relative; width:min(570px,100%); margin-left:auto; padding:24px; border-radius:38px; background:rgba(255,255,255,.76);
  border:1px solid rgba(223,236,234,.95); box-shadow:var(--sj-shadow); backdrop-filter: blur(10px);
}
.sj-hero-photo-wrap {
  min-height:390px; border-radius:32px; overflow:hidden; background:linear-gradient(135deg,#f5f9f7,#fef9ee);
  box-shadow: inset 0 0 0 1px rgba(223,236,234,.75);
}
.sj-hero-photo-wrap img { width:100%; height:100%; object-fit:cover; }
.sj-floating-mini {
  position:absolute; right:0; bottom:0; width:min(290px,100%); padding:22px; border-radius:24px; background:white;
  border:1px solid var(--sj-line); box-shadow: var(--sj-shadow);
}
.sj-floating-mini strong { display:block; color:var(--sj-navy); font-size:17px; margin-bottom:8px; }
.sj-floating-mini span { color:var(--sj-green-dark); font-weight:900; font-size:28px; }

.sj-trust-row { padding: 18px 0 58px; }
.sj-trust-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap:18px; }
.sj-trust-card {
  background:white; border:1px solid var(--sj-line); border-radius:22px; padding:22px; box-shadow: var(--sj-shadow-soft); min-height:144px;
}
.sj-icon {
  width:56px; height:56px; border-radius:18px; background:var(--sj-mint); display:grid; place-items:center; margin-bottom:16px;
}
.sj-icon img { width:34px; height:34px; object-fit:contain; }
.sj-trust-card strong { display:block; color:var(--sj-navy); font-size:16px; margin-bottom:4px; }
.sj-trust-card p { margin:0; color:var(--sj-muted); font-size:14px; line-height:1.5; }

.sj-section { padding: 74px 0; }
.sj-section-soft { background: linear-gradient(180deg, rgba(246,250,249,.92), rgba(255,255,255,1)); border-top:1px solid var(--sj-line); border-bottom:1px solid var(--sj-line); }
.sj-section-head { max-width:680px; margin:0 auto 42px; text-align:center; }
.sj-section-head h2 { margin:12px 0; color:var(--sj-navy); font-size:clamp(32px,3.4vw,48px); line-height:1.08; letter-spacing:-0.045em; }
.sj-section-head p { margin:0; color:var(--sj-muted); font-size:18px; }
.sj-calculator-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:18px; }
.sj-calc-card {
  min-height:300px; padding:26px 22px 24px; border:1px solid var(--sj-line); border-radius:24px; background:white; box-shadow: var(--sj-shadow-soft);
  text-align:center; display:flex; flex-direction:column; align-items:center; transition: transform .18s ease, box-shadow .18s ease, border .18s ease;
}
.sj-calc-card:hover { transform: translateY(-4px); box-shadow: var(--sj-shadow); border-color: rgba(24,182,134,.28); }
.sj-calc-card .sj-icon { width:64px; height:64px; margin-bottom:18px; }
.sj-calc-card .sj-icon img { width:40px; height:40px; }
.sj-calc-card h3 { margin:0 0 10px; color:var(--sj-navy); font-size:18px; line-height:1.25; letter-spacing:-0.02em; }
.sj-calc-card p { margin:0 0 20px; color:var(--sj-muted); font-size:14px; line-height:1.55; flex:1; }
.sj-small-link { display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:0 18px; border-radius:12px; background:#f8fcfb; color:var(--sj-navy); border:1px solid var(--sj-line); text-decoration:none; font-weight:850; font-size:13px; }

.sj-dark-band {
  margin:0 auto; border-radius:34px; background: radial-gradient(circle at 84% 18%, rgba(24,182,134,.18), transparent 24%), linear-gradient(135deg, #071b35, #102b4f);
  color:white; padding:52px; display:grid; grid-template-columns:1.02fr 1fr; gap:56px; align-items:center; box-shadow:0 20px 50px rgba(7,27,53,.18);
}
.sj-dashboard-real {
  border-radius:26px; overflow:hidden; background:rgba(255,255,255,.08); box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.sj-dashboard-real img { width:100%; min-height:320px; object-fit:cover; object-position:center; }
.sj-dark-band h2 { margin:0 0 14px; font-size:38px; line-height:1.08; letter-spacing:-0.04em; }
.sj-dark-band p { color:rgba(255,255,255,.78); margin:0; font-size:17px; }
.sj-feature-list { margin-top:28px; display:grid; gap:18px; }
.sj-feature { display:flex; gap:14px; align-items:flex-start; }
.sj-feature .sj-icon { background: rgba(24,182,134,.12); margin:0; flex:0 0 auto; }
.sj-feature .sj-icon img { filter: brightness(0) invert(1) saturate(0) opacity(.96); }
.sj-feature strong { display:block; margin-bottom:3px; }
.sj-feature span { color:rgba(255,255,255,.72); font-size:14px; }

.sj-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.sj-step { background:white; border:1px solid var(--sj-line); border-radius:22px; padding:24px; box-shadow:var(--sj-shadow-soft); }
.sj-step-number { width:38px; height:38px; border-radius:14px; background:var(--sj-mint); display:grid; place-items:center; color:var(--sj-green-dark); font-weight:900; margin-bottom:18px; }
.sj-step h3 { margin:0 0 8px; color:var(--sj-navy); font-size:18px; }
.sj-step p { margin:0; color:var(--sj-muted); font-size:14px; }

.sj-cta {
  border-radius:34px; background: radial-gradient(circle at 74% 35%, rgba(215, 173, 79, 0.12), transparent 22%), linear-gradient(135deg, var(--sj-mint), var(--sj-cream));
  border:1px solid var(--sj-line); padding:56px; display:grid; grid-template-columns:1.05fr .95fr; gap:40px; align-items:center; overflow:hidden;
}
.sj-cta h2 { margin:0 0 14px; color:var(--sj-navy); font-size:clamp(34px, 4vw, 54px); line-height:1.04; letter-spacing:-0.05em; }
.sj-cta p { margin:0 0 26px; color:#506277; font-size:18px; max-width:650px; }
.sj-cta-photo-wrap {
  background: rgba(255,255,255,.46); border-radius:28px; overflow:hidden; box-shadow: var(--sj-shadow-soft);
}
.sj-cta-photo-wrap img { width:100%; min-height:260px; object-fit:cover; }

.sj-footer { margin-top:70px; background:var(--sj-navy); color:white; padding:56px 0 26px; }
.sj-footer-grid { display:grid; grid-template-columns:1.4fr .7fr .7fr; gap:36px; }
.sj-footer-grid.has-contact { grid-template-columns:1.2fr .7fr .7fr .9fr; }
.sj-footer-brand { display:inline-flex; align-items:center; }
.sj-footer .sj-brand-title { color:#ffffff; }
.sj-footer .sj-brand-subtitle { color:rgba(255,255,255,.84); }
.sj-footer .sj-brand-icon { width:52px; height:52px; }
.sj-footer h3 { margin:0 0 16px; font-size:15px; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.72); }
.sj-footer a, .sj-footer p { display:block; color:rgba(255,255,255,.72); text-decoration:none; margin:0 0 9px; font-size:14px; }
.sj-footer a:hover { color:white; }
.sj-footer-bottom { border-top:1px solid rgba(255,255,255,.12); margin-top:38px; padding-top:22px; display:flex; justify-content:space-between; gap:18px; color:rgba(255,255,255,.58); font-size:13px; }

.sj-page { padding:64px 0; }
.sj-page-card { background:white; border:1px solid var(--sj-line); border-radius:28px; box-shadow:var(--sj-shadow-soft); padding: clamp(28px, 5vw, 58px); }
.sj-page h1 { margin: 18px 0 20px; }
.sj-page .entry-content:empty { display:none; }
.sj-page p, .sj-page li { color:#506277; font-size:17px; }

@media (max-width: 1050px) {
  .sj-menu { display:none; }
  .sj-mobile-toggle { display:inline-grid; place-items:center; }
  .sj-hero-grid, .sj-dark-band, .sj-cta { grid-template-columns:1fr; }
  .sj-hero-visual { min-height:auto; }
  .sj-visual-card { margin:0; }
  .sj-calculator-grid { grid-template-columns:repeat(2,1fr); }
  .sj-trust-grid, .sj-steps, .sj-footer-grid, .sj-footer-grid.has-contact { grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 680px) {
  .sj-container { width:min(100% - 28px, var(--sj-container)); }
  .sj-nav { min-height:72px; }
  .sj-brand-icon { width:48px; height:48px; }
  .sj-brand-title { font-size:20px; }
  .sj-brand-subtitle { font-size:11px; }
  .sj-nav-cta { display:none; }
  .sj-hero { padding:42px 0 36px; }
  .sj-hero-grid { gap:34px; }
  .sj-hero h1, .sj-page h1 { font-size:43px; }
  .sj-hero p { font-size:17px; }
  .sj-hero-actions { flex-direction:column; }
  .sj-button { width:100%; }
  .sj-trust-grid, .sj-calculator-grid, .sj-steps, .sj-footer-grid, .sj-footer-grid.has-contact { grid-template-columns:1fr; }
  .sj-section { padding:54px 0; }
  .sj-dark-band, .sj-cta { padding:32px 24px; border-radius:26px; }
  .sj-dark-band h2 { font-size:31px; }
  .sj-footer-bottom { flex-direction:column; }
  .sj-floating-mini { position:relative; width:auto; margin-top:18px; }
}


/* v1.2.4: real text brand lockup, fixed logo sizing */
.sj-brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  text-decoration: none !important;
  width: auto !important;
  max-width: 320px !important;
}

.sj-brand-icon {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  object-fit: contain !important;
  flex: 0 0 42px !important;
}

.sj-brand-copy {
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
}

.sj-brand-title {
  display: block !important;
  color: var(--sj-navy) !important;
  font-size: 22px !important;
  line-height: 1.05 !important;
  font-weight: 850 !important;
  letter-spacing: -0.035em !important;
  white-space: nowrap !important;
}

.sj-brand-subtitle {
  display: block !important;
  margin-top: 4px !important;
  color: #607080 !important;
  font-size: 11px !important;
  line-height: 1.25 !important;
  font-weight: 650 !important;
  white-space: nowrap !important;
}

.sj-footer-brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  text-decoration: none !important;
  width: auto !important;
  max-width: 260px !important;
}

.sj-footer-brand-icon {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  object-fit: contain !important;
  flex: 0 0 42px !important;
  filter: brightness(0) invert(1) !important;
  opacity: .96 !important;
}

.sj-footer-brand-copy {
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
}

.sj-footer-brand-title {
  display: block !important;
  color: #ffffff !important;
  font-size: 22px !important;
  line-height: 1.05 !important;
  font-weight: 850 !important;
  letter-spacing: -0.035em !important;
  white-space: nowrap !important;
}

.sj-footer-brand-subtitle {
  display: block !important;
  margin-top: 4px !important;
  color: rgba(255,255,255,.82) !important;
  font-size: 11px !important;
  line-height: 1.25 !important;
  font-weight: 650 !important;
  white-space: nowrap !important;
}

.sj-footer-intro {
  margin-top: 18px !important;
  max-width: 340px !important;
}

.sj-footer-grid {
  align-items: start !important;
}

@media (max-width: 680px) {
  .sj-brand,
  .sj-footer-brand {
    max-width: 240px !important;
  }

  .sj-brand-icon,
  .sj-footer-brand-icon {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    flex-basis: 38px !important;
  }

  .sj-brand-title,
  .sj-footer-brand-title {
    font-size: 20px !important;
  }

  .sj-brand-subtitle,
  .sj-footer-brand-subtitle {
    font-size: 10px !important;
  }
}