/* ==========================================================================
   NFB Growth – 03-pages.css
   Oldalspecifikus szekciók.
   Csak egy-egy oldalon jelennek meg. Ha egy elem itt van, de több oldalon kell,
   át kell mozgatni a components.css-be.
   ========================================================================== */

.hero-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(40px,5vw,72px); align-items:center; }
.hero-trust { margin-top:28px; font-weight:600; color:#fff; font-size:1.05rem; letter-spacing:.2px; border-left:3px solid var(--amber); padding-left:16px; }
.hero-visual { background:linear-gradient(155deg,#0f333b 0%,#1a4b56 100%); border-radius:var(--radius-lg); padding:38px; aspect-ratio:4/5; display:flex; flex-direction:column; justify-content:center; gap:14px; border:1px solid rgba(255,255,255,.08); }
.flow-step { display:flex; align-items:center; gap:14px; color:#fff; font-weight:600; font-size:1.05rem; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08); border-radius:12px; padding:14px 18px; }
.flow-step .dot { width:9px; height:9px; border-radius:50%; background:var(--amber); flex:none; }
.flow-arrow { color:var(--amber); text-align:center; font-size:14px; opacity:.7; }
.ref-card { background:var(--white); border:1px solid var(--line); border-radius:var(--radius-md); overflow:hidden; box-shadow:0 8px 30px rgba(18,60,69,.05); }
.ref-thumb { aspect-ratio:16/10; background:var(--petrol-pale); display:flex; align-items:center; justify-content:center; color:var(--petrol); font-weight:600; border-bottom:1px solid var(--line); }
.ref-thumb img { width:100%; height:100%; object-fit:cover; object-position:top center; }
.ref-body { padding:28px; }
.ref-body h4 { margin-bottom:8px; }
.ref-body .label { font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.6px; color:var(--amber-dark); margin-bottom:6px; display:block; }
.ref-body p { font-size:15px; color:var(--ink-soft); margin:0 0 14px; line-height:1.55; }
.ref-body .domain { font-size:14px; font-weight:600; color:var(--petrol); margin-bottom:16px; }
.final-cta { text-align:center; }
.final-cta h2 { margin:0 auto 24px; }
.final-cta .lead { margin:0 auto 8px; }
.final-cta .btn-group { justify-content:center; }
.micro { margin-top:22px; font-size:15px; color:var(--dark-body); font-weight:500; }
.form-card { background:var(--cream); border:1px solid var(--line); border-radius:var(--radius-lg); padding:clamp(28px,4vw,48px); }
.grid-2 > *,.grid-3 > *,.grid-5 > *,.trust-grid > *,.compare-grid > *,
.route-grid > *,.contact-strip > *,.adv-grid > *,.hero-grid > * { min-width:0; }
.card,.route-card,.compare-card,.trust-item,.work-card,.ref-card { overflow-wrap:break-word; }
.sol-block { background:var(--white); border:1px solid var(--line); border-radius:var(--radius-lg); padding:clamp(28px,4vw,48px); display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(28px,4vw,56px); box-shadow:0 8px 30px rgba(18,60,69,.05); }
.sol-block + .sol-block { margin-top:28px; }
.sol-num { display:inline-block; font-size:12px; font-weight:700; letter-spacing:1px; color:var(--amber-dark); margin-bottom:10px; }
.sol-left h3 { font-size:clamp(1.5rem,2.2vw,2rem); margin-bottom:6px; }
.sol-sub { font-size:clamp(1.05rem,1.5vw,1.2rem); font-weight:600; color:var(--amber-dark); line-height:1.35; margin:0 0 22px; }
.sol-left p { font-size:16px; line-height:1.65; color:var(--ink); margin:0 0 16px; }
.sol-left .btn { margin-top:10px; }
.sol-right .label { font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.7px; color:var(--petrol); opacity:.65; margin-bottom:12px; display:block; }
.sol-list { list-style:none; padding:0; margin:0 0 24px; columns:2; column-gap:28px; }
.sol-list li { position:relative; padding-left:20px; font-size:15px; line-height:1.5; margin-bottom:9px; break-inside:avoid; }
.sol-list li::before { content:""; position:absolute; left:0; top:8px; width:6px; height:6px; border-radius:50%; background:var(--amber); }
.sol-note { background:var(--petrol-pale); border-left:3px solid var(--petrol); border-radius:0 var(--radius-sm) var(--radius-sm) 0; padding:18px 22px; }
.sol-note .label { margin-bottom:6px; }
.sol-note p { margin:0; font-size:15px; line-height:1.55; color:var(--petrol); font-weight:500; }
.hero-mockup { position:relative; padding:10px 0 40px; }
.mock-back { position:absolute; top:0; right:0; width:76%; aspect-ratio:16/10; border-radius:12px; overflow:hidden; border:1px solid rgba(255,255,255,.14); transform:rotate(2.2deg); opacity:.55; box-shadow:0 20px 50px rgba(0,0,0,.35); }
.mock-laptop { position:relative; width:92%; margin-left:0; background:#0d2c33; border:1px solid rgba(255,255,255,.16); border-radius:14px; padding:12px 12px 0; box-shadow:0 30px 70px rgba(0,0,0,.45); }
.mock-bar { display:flex; gap:6px; padding:0 2px 10px; }
.mock-bar i { width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.22); }
.mock-screen { aspect-ratio:16/10; border-radius:8px 8px 0 0; overflow:hidden; background:var(--petrol-pale); }
.mock-screen img,.mock-back img { width:100%; height:100%; object-fit:cover; object-position:top center; display:block; }
.mock-phone { position:absolute; right:-6px; bottom:-26px; width:31%; background:#0d2c33; border:1px solid rgba(255,255,255,.2); border-radius:18px; padding:8px; box-shadow:0 24px 50px rgba(0,0,0,.5); }
.mock-phone .mock-screen { aspect-ratio:9/17; border-radius:12px; }
.feature { display:grid; grid-template-columns:1fr 1fr; gap:clamp(36px,5vw,72px); align-items:center; }
.feature + .feature { margin-top:clamp(64px,8vw,110px); }
.feature.reverse .feature-media { order:2; }
.feature-media { border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--line); box-shadow:0 20px 60px rgba(18,60,69,.14); background:var(--petrol-pale); aspect-ratio:4/3; }
.feature-media img { width:100%; height:100%; object-fit:cover; object-position:top center; display:block; }
.feature-body h3 { font-size:clamp(1.6rem,2.4vw,2.1rem); margin-bottom:6px; }
.feature-sub { font-size:clamp(1.05rem,1.5vw,1.25rem); font-weight:600; color:var(--amber-dark); line-height:1.35; margin:0 0 24px; }
.feature-block { margin-bottom:20px; }
.feature-block .label { font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.7px; color:var(--petrol); opacity:.65; margin-bottom:6px; display:block; }
.feature-block p { margin:0; font-size:16px; line-height:1.6; color:var(--ink); }
.feature-block ul { list-style:none; padding:0; margin:0; }
.feature-block li { position:relative; padding-left:22px; font-size:16px; line-height:1.5; margin-bottom:7px; }
.feature-block li::before { content:""; position:absolute; left:0; top:9px; width:6px; height:6px; border-radius:50%; background:var(--amber); }
.feature-result { background:var(--petrol-pale); border-left:3px solid var(--amber); border-radius:0 var(--radius-sm) var(--radius-sm) 0; padding:18px 22px; margin-bottom:22px; }
.feature-result p { font-size:16px; line-height:1.55; color:var(--petrol); font-weight:500; margin:0; }
.grid-2-ref { display:grid; grid-template-columns:repeat(2,1fr); gap:32px; }
.work-card { background:var(--white); border:1px solid var(--line); border-radius:var(--radius-md); overflow:hidden; box-shadow:0 8px 30px rgba(18,60,69,.05); display:flex; flex-direction:column; }
.work-thumb { aspect-ratio:16/10; overflow:hidden; background:var(--petrol-pale); border-bottom:1px solid var(--line); }
.work-thumb img { width:100%; height:100%; object-fit:cover; object-position:top center; display:block; }
.work-body { padding:clamp(24px,3vw,32px); display:flex; flex-direction:column; flex:1; }
.work-body h3 { font-size:1.4rem; margin-bottom:4px; }
.work-sub { font-size:1.02rem; font-weight:600; color:var(--amber-dark); line-height:1.35; margin:0 0 18px; }
.work-body .label { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.7px; color:var(--petrol); opacity:.6; margin-bottom:5px; display:block; }
.work-body p { font-size:15px; line-height:1.55; color:var(--ink); margin:0 0 16px; }
.work-body .tags { margin-top:auto; padding-top:6px; }
.method-strip { text-align:center; max-width:800px; margin-inline:auto; }
.method-strip h2 { margin-inline:auto; }
.form-state { display:none; text-align:center; padding:clamp(32px,5vw,56px); }
.form-state.show { display:block; }
.form-state .icon { width:64px; height:64px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:30px; margin:0 auto 22px; }
.form-state.ok .icon { background:rgba(53,122,97,.12); color:var(--success); }
.form-state.fail .icon { background:rgba(182,74,74,.1); color:var(--error); }
.form-state h3 { font-size:clamp(1.5rem,2.4vw,2rem); margin-bottom:14px; }
.form-state p { font-size:16px; line-height:1.6; color:var(--ink); max-width:560px; margin:0 auto 16px; }
.form-state .prep { text-align:left; max-width:520px; margin:26px auto 28px; background:var(--cream); border-radius:var(--radius-md); padding:24px 26px; }
.form-state .prep strong { display:block; margin-bottom:12px; color:var(--petrol); font-weight:600; font-size:15px; }
.form-state .prep ul { list-style:none; padding:0; margin:0; }
.form-state .prep li { position:relative; padding-left:20px; font-size:15px; line-height:1.5; margin-bottom:8px; }
.form-state .prep li::before { content:""; position:absolute; left:0; top:8px; width:6px; height:6px; border-radius:50%; background:var(--amber); }
.form-state .mail { font-size:1.15rem; font-weight:600; color:var(--petrol); }

/* ---------- Reszponzív ---------- */

@media(max-width:1024px) {
  .hero-grid { grid-template-columns:1fr; }
  .hero-visual { aspect-ratio:auto; max-width:460px; }
  .sol-block { grid-template-columns:1fr; }
  .feature { grid-template-columns:1fr; }
  .feature.reverse .feature-media { order:0; }
  .grid-2-ref { grid-template-columns:1fr; }
  .hero-mockup { max-width:520px; }
}

@media(max-width:767px) {
  .hero-trust { font-size:1rem; }
  .sol-list { columns:1; }
  .mock-back { display:none; }
  .mock-laptop { width:100%; }
  .mock-phone { width:34%; right:-4px; bottom:-20px; }
}

/* ==========================================================================
   ALAPÍTÓ
   ========================================================================== */
.founder{
  display:grid;grid-template-columns:340px 1fr;gap:clamp(36px,5vw,64px);
  align-items:start;
}
.founder-photo{
  border-radius:var(--radius-lg);overflow:hidden;
  border:1px solid var(--line);background:var(--petrol-pale);
  box-shadow:0 20px 60px rgba(18,60,69,.12);
  position:sticky;top:104px;
}
.founder-photo img{width:100%;height:auto;display:block;aspect-ratio:1/1;object-fit:cover;}
.founder-body h2{margin-bottom:26px;}
.founder-body p{font-size:17px;line-height:1.7;color:var(--ink);margin:0 0 18px;}
.founder-body strong{font-weight:600;color:var(--petrol);}

/* Kis kártya a Kapcsolat oldalra */
.founder-card{
  display:flex;align-items:center;gap:18px;
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius-md);
  padding:20px 24px;max-width:940px;margin:0 auto 28px;
}
.founder-card img{
  width:64px;height:64px;border-radius:50%;object-fit:cover;flex:none;
  border:2px solid var(--petrol-pale);
}
.founder-card .fc-name{font-size:16px;font-weight:600;color:var(--petrol);margin:0;line-height:1.3;}
.founder-card .fc-role{font-size:14px;color:var(--ink-soft);margin:2px 0 0;line-height:1.3;}
.founder-card .fc-note{font-size:14px;color:var(--ink);margin:8px 0 0;line-height:1.4;}

@media(max-width:900px){
  .founder{grid-template-columns:1fr;}
  .founder-photo{position:static;max-width:280px;}
}
@media(max-width:767px){
  .founder-card{flex-direction:column;text-align:center;align-items:center;}
}

/* Ha nincs feltöltött fotó, a szöveg ne szoruljon be a kép oszlopába.
   (A .founder-photo ilyenkor nem renderelődik, a .founder-body egyedül marad.) */
.founder-body:only-child{
  grid-column:1 / -1;
  max-width:760px;
}

/* Referencia kártya: kattintható, és kép nélkül sem esik szét */
a.ref-card{ text-decoration:none;display:flex;flex-direction:column; }
a.ref-card:hover{ border-color:var(--petrol);transform:translateY(-3px); }
.ref-thumb-empty{
  display:flex;align-items:center;justify-content:center;height:100%;
  background:linear-gradient(140deg,var(--petrol-pale) 0%,#dbe7e5 100%);
  color:var(--petrol);opacity:.5;font-size:14px;font-weight:600;
  letter-spacing:.5px;text-align:center;padding:16px;
}

/* 404 – a keresőmező sötét hátéren */
.bg-dark .kb-search input{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.22);
  color:#fff;
}
.bg-dark .kb-search input::placeholder{ color:rgba(255,255,255,.5); }
.bg-dark .kb-search input:focus{ border-color:var(--amber);background:rgba(255,255,255,.12);box-shadow:none; }
.bg-dark .kb-search::before{ color:rgba(255,255,255,.5); }