@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--navy:#062a5c;--navy2:#031c3c;--blue:#087df4;--ink:#071e41;--muted:#5f7088;--soft:#f5f9fe}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:Manrope,system-ui,sans-serif;color:var(--ink);background:#fff}.navbar{box-shadow:0 4px 18px rgba(5,35,75,.04)}.navbar-brand strong{font-size:2rem;line-height:.8;color:var(--navy);letter-spacing:-2px}.navbar-brand small{display:block;font-size:.48rem;font-weight:800;color:var(--navy)}.brand-icon{width:42px;height:42px;border-radius:10px;display:grid;place-items:center;background:var(--navy);color:#fff;font-size:1.35rem}.nav-link{font-size:.88rem;font-weight:600;color:var(--ink)!important}.btn{border-radius:9px;font-weight:700}.btn-primary{background:var(--blue);border-color:var(--blue)}.hero{background:radial-gradient(circle at 80% 25%,#174b79 0,#082f55 25%,#031c36 62%,#02162d 100%);color:#fff;overflow:hidden}.min-vh-75{min-height:74vh}.eyebrow{display:inline-block;background:#e8f3ff;color:var(--blue);font-size:.7rem;font-weight:800;letter-spacing:.08em;padding:7px 12px;border-radius:999px}.eyebrow.dark{background:#0b3964;color:#b9ddff}.hero h1{font-size:clamp(2.7rem,5vw,5rem);font-weight:800;line-height:1.05;letter-spacing:-.055em;margin:22px 0}.hero h1 span{color:#168cff}.hero .lead{max-width:650px;color:#d2dce8;font-size:1.15rem}.hero-benefits>div{display:flex;align-items:center;gap:10px;font-size:.78rem;font-weight:700}.hero-benefits i{font-size:1.3rem;background:#0d4778;border:1px solid #22608e;padding:10px;border-radius:12px}.dashboard{background:#eef5fb;color:var(--ink);border:8px solid #102d4c;border-radius:20px;padding:22px;transform:perspective(1200px) rotateY(-5deg) rotateX(2deg)}.dash-top{display:flex;align-items:center;gap:6px;margin-bottom:18px}.dash-top strong{margin-left:10px}.dot{width:8px;height:8px;background:#9fb0c0;border-radius:50%}.metric,.chart,.activity{background:#fff;border:1px solid #dbe6f0;border-radius:12px;padding:16px}.metric b{display:block;font-size:1.5rem}.metric small{color:var(--muted)}.chart{height:180px}.chart span{font-weight:700}.chart svg{width:100%;height:120px;margin-top:10px}.chart polyline{fill:none;stroke:var(--blue);stroke-width:4}.activity p{margin:.65rem 0 0;color:var(--muted);font-size:.82rem}.activity i{color:var(--blue)}.section{padding:100px 0}.bg-soft{background:var(--soft)}.section-head{max-width:820px;margin:auto}.section-head h2,.contact-section h2{font-size:clamp(2rem,3.5vw,3.2rem);font-weight:800;letter-spacing:-.045em;margin:15px 0}.section-head p{color:var(--muted)}.service-card{height:100%;padding:30px;border:1px solid #e3ebf4;border-radius:16px;box-shadow:0 10px 30px rgba(8,42,80,.06);transition:.25s;background:#fff}.service-card:hover{transform:translateY(-5px);box-shadow:0 18px 45px rgba(8,42,80,.1)}.service-card>i{font-size:1.8rem;color:var(--blue)}.service-card h3,.project h3,.step h3{font-size:1.05rem;font-weight:800;margin:16px 0 8px}.service-card p,.step p,.project p{font-size:.9rem;color:var(--muted);margin:0}.step{text-align:center;padding:20px}.step span{display:grid;place-items:center;width:46px;height:46px;margin:0 auto 25px;background:var(--blue);color:#fff;border-radius:50%;font-weight:800}.step>i{display:grid;place-items:center;width:66px;height:66px;margin:auto;border:1px solid #dbe7f4;border-radius:50%;font-size:1.6rem;color:var(--navy);background:#fff}.project{height:100%;border:1px solid #e3ebf4;border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 10px 30px rgba(8,42,80,.06)}.project-visual{height:180px;background:linear-gradient(135deg,#071f40,#0e5c9d);display:grid;place-items:center;color:#fff}.project-visual i{font-size:4rem}.project small{font-size:.65rem;color:var(--blue);font-weight:800}.contact-section{padding:100px 0;background:linear-gradient(135deg,#eef8ff,#fff 55%,#dceeff)}.contact-section .lead{color:var(--muted);max-width:620px}.contact-list{list-style:none;padding:0;margin:30px 0}.contact-list li{font-weight:700;margin:16px 0}.contact-list i{display:inline-grid;place-items:center;width:38px;height:38px;background:var(--navy);color:#fff;border-radius:50%;margin-right:10px}.contact-card{background:#fff;border:1px solid #dbe6f0;border-radius:18px;padding:30px;box-shadow:0 20px 50px rgba(8,42,80,.12)}.form-label{font-size:.8rem;font-weight:700}.form-control{border-color:#cbdbea;border-radius:8px;padding:.8rem}.form-control:focus{border-color:var(--blue);box-shadow:0 0 0 .2rem rgba(8,125,244,.12)}footer{background:#02162d;color:#aab9ca;padding:28px 0;font-size:.8rem}
@media(max-width:991.98px){.hero{text-align:center}.hero .lead{margin:auto}.hero .d-flex{justify-content:center}.hero-benefits{text-align:left}.dashboard{transform:none}.navbar-nav{padding:20px 0}.section{padding:75px 0}}
@media(max-width:575.98px){.hero h1{font-size:2.65rem}.hero-benefits>div{justify-content:center}.dashboard{padding:12px}.metric{padding:10px}.metric b{font-size:1.1rem}.section{padding:60px 0}.contact-card{padding:20px}}


/* Mobil fejléc / hero igazítás */
@media (max-width: 575.98px) {
  .hero-benefits {
    max-width: 290px;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .hero-benefits > div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    text-align: center;
    gap: 8px;
  }

  .hero-benefits i {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    padding: 0;
    margin: 0 auto;
    flex: 0 0 48px;
  }

  .hero-benefits span {
    display: block;
    width: 100%;
    min-height: 38px;
    line-height: 1.35;
    text-align: center;
  }
}


/* Mobil: a 3 hero előny egymás mellett */
@media (max-width: 575.98px) {
  .hero-benefits {
    max-width: 100%;
    margin-left: auto !important;
    margin-right: auto !important;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-start;
  }

  .hero-benefits > div {
    width: 33.333333%;
    flex: 0 0 33.333333%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    text-align: center;
    gap: 8px;
    padding-left: 4px;
    padding-right: 4px;
  }

  .hero-benefits i {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 0;
    margin: 0 auto;
    flex: 0 0 44px;
    font-size: 1.15rem;
  }

  .hero-benefits span {
    display: block;
    width: 100%;
    min-height: 38px;
    font-size: .68rem;
    line-height: 1.3;
    text-align: center;
  }
}