/* ==========================================================================
   NFB Growth – 01-base.css
   Alapréteg — reset, tipográfia, layout, gombok, fejléc, lábléc.
   Minden oldalon betöltődik.
   ========================================================================== */

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; font-family:var(--font); font-weight:400; color:var(--ink); background:var(--cream); font-size:18px; line-height:1.65; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
h1,h2,h3,h4 { font-family:var(--font); color:var(--petrol); margin-top:0; }
p { margin:0 0 20px; }
a { color:var(--petrol); text-decoration:none; }
img { max-width:100%; display:block; }
.container { width:min(calc(100% - 40px),var(--container-max)); margin-inline:auto; }
.content { width:min(100%,var(--content-max)); }
.section { padding-block:clamp(64px,8vw,128px); }
.section--sm { padding-block:clamp(48px,6vw,88px); }
.bg-cream { background:var(--cream); }
.bg-white { background:var(--white); }
.bg-pale { background:var(--petrol-pale); }
.bg-dark { background:var(--petrol); color:var(--dark-body); }
.bg-dark h1,.bg-dark h2,.bg-dark h3,.bg-dark h4 { color:#fff; }
h1 { font-size:clamp(2.4rem,5vw,4rem); line-height:1.08; font-weight:700; letter-spacing:-1.5px; max-width:850px; }
h2 { font-size:clamp(1.9rem,3.8vw,3rem); line-height:1.15; font-weight:700; letter-spacing:-1px; max-width:760px; }
h3 { font-size:clamp(1.45rem,2.2vw,1.85rem); line-height:1.25; font-weight:600; }
h4 { font-size:1.35rem; line-height:1.3; font-weight:600; }
.kicker { font-size:13px; font-weight:700; letter-spacing:1px; text-transform:uppercase; color:var(--amber-dark); margin:0 0 14px; display:block; }
.bg-dark .kicker { color:var(--amber); }
.lead { font-size:clamp(1.15rem,1.6vw,1.4rem); line-height:1.5; font-weight:400; color:var(--ink-soft); max-width:720px; }
.bg-dark .lead { color:var(--dark-body); }
.section-head { margin-bottom:clamp(40px,5vw,56px); }
strong,b { font-weight:600; }
.bg-dark .hl { color:var(--amber); }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; font-family:var(--font); font-size:16px; font-weight:600; line-height:1; min-height:48px; padding:0 28px; border-radius:var(--radius-sm); border:1.5px solid transparent; cursor:pointer; transition:all .18s ease; text-align:center; }
.btn-primary { background:var(--amber); color:var(--ink); }
.btn-primary:hover { background:var(--amber-hover); transform:translateY(-1px); }
.btn-secondary { background:transparent; border-color:var(--petrol); color:var(--petrol); }
.btn-secondary:hover { background:var(--petrol); color:#fff; }
.bg-dark .btn-secondary { border-color:#fff; color:#fff; }
.bg-dark .btn-secondary:hover { background:#fff; color:var(--petrol); }
.btn-group { display:flex; flex-wrap:wrap; gap:14px; margin-top:32px; }
.textlink { font-weight:600; color:var(--petrol); display:inline-flex; align-items:center; gap:6px; }
.textlink:hover { color:var(--amber-dark); }
.textlink::after { content:"→"; transition:transform .18s ease; }
.textlink:hover::after { transform:translateX(3px); }
.site-header { position:sticky; top:0; z-index:50; background:rgba(255,255,255,.92); backdrop-filter:blur(8px); border-bottom:1px solid var(--line); }
.header-inner { display:flex; align-items:center; justify-content:space-between; height:80px; }
.logo { display:flex; flex-direction:column; line-height:1; }
.logo-mark { font-weight:700; font-size:24px; letter-spacing:-.5px; color:var(--petrol); }
.logo-sub { font-size:11px; font-weight:600; letter-spacing:.4px; color:var(--ink-soft); margin-top:3px; }
.nav { display:flex; align-items:center; gap:30px; }
.nav a { font-size:15px; font-weight:600; color:var(--ink); }
.nav a:hover { color:var(--petrol); }
.nav a.is-active { color:var(--petrol); border-bottom:2px solid var(--amber); padding-bottom:3px; }
.header-cta { display:flex; align-items:center; gap:18px; }
.menu-toggle { display:none; background:none; border:none; cursor:pointer; padding:8px; }
.menu-toggle span { display:block; width:24px; height:2px; background:var(--petrol); margin:5px 0; border-radius:2px; }
.hero { padding-block:clamp(80px,10vw,150px); }
.hero h1 { margin-bottom:24px; }
.hero .lead { margin-bottom:8px; }
.footer { background:var(--petrol); color:var(--dark-body); padding-block:clamp(56px,7vw,88px) 0; }
.footer h4 { color:#fff; font-size:15px; text-transform:uppercase; letter-spacing:.6px; margin-bottom:18px; }
.footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; }
.footer .brand-desc { font-size:16px; line-height:1.6; color:var(--dark-body); max-width:320px; }
.footer .logo-mark { color:#fff; margin-bottom:16px; display:inline-block; }
.footer ul { list-style:none; padding:0; margin:0; }
.footer li { margin-bottom:11px; }
.footer a { color:var(--dark-body); font-size:15px; }
.footer a:hover { color:var(--amber); }
.footer .contact-line { font-size:15px; margin-bottom:11px; }
.footer .contact-note { font-size:14px; color:#9fb4b2; margin-top:16px; line-height:1.5; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.12); margin-top:52px; padding:24px 0; font-size:14px; color:#9fb4b2; }
.mobile-cta { display:none; position:fixed; bottom:0; left:0; right:0; z-index:60; background:rgba(255,255,255,.96); backdrop-filter:blur(8px); border-top:1px solid var(--line); padding:12px 16px; }
.mobile-cta .btn { width:100%; }
.crumbs { padding:20px 0 0; font-size:14px; color:var(--ink-soft); }
.crumbs a { color:var(--ink-soft); font-weight:500; }
.crumbs a:hover { color:var(--petrol); }
.crumbs span { margin:0 7px; opacity:.5; }
.bg-dark .crumbs,.bg-dark .crumbs a { color:#9fb4b2; }
.bg-dark .crumbs a:hover { color:#fff; }
@keyframes condIn {from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:none;}}

a.card { display:block; text-decoration:none; transition:border-color .18s ease,transform .18s ease; }
a.card:hover { border-color:var(--petrol); transform:translateY(-3px); }

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

@media(max-width:1024px) {
  .footer-grid { grid-template-columns:1fr 1fr; gap:36px; }
}

@media(max-width:767px) {
  body { font-size:17px; }
  .nav,.header-cta .btn { display:none; }
  .menu-toggle { display:block; }
  .header-inner { height:66px; }
  .footer-grid { grid-template-columns:1fr; gap:32px; }
  .btn-group .btn { width:100%; }
  .mobile-cta { display:block; }
  body { padding-bottom:76px; }
}

/* ==========================================================================
   LOGÓ (feltöltött kép)
   A szöveges .logo-mark fallback marad, ha nincs feltöltött logó.
   ========================================================================== */
.logo--img{ display:flex;flex-direction:column;gap:2px;text-decoration:none; }
.logo-img{
  display:block;height:auto;width:auto;
  max-height:40px;max-width:200px;object-fit:contain;
}
.footer-logo{ max-height:36px;max-width:180px;margin-bottom:16px; }

/* Ha nincs feltöltött világos logó, a sötétet invertáljuk a láblécre.
   Ez egyszínű (fekete/petrol) logónál működik jól. Több színűnél
   tölts fel külön világos változatot. */
.footer-logo.is-inverted{ filter:brightness(0) invert(1);opacity:.92; }

@media(max-width:900px){
  .logo-img{ max-height:32px;max-width:150px; }
}
