:root {
  --bg: #060914;
  --bg-2: #0b1020;
  --panel: rgba(255,255,255,.075);
  --panel-strong: rgba(255,255,255,.12);
  --line: rgba(255,255,255,.14);
  --text: #f5f7fb;
  --muted: #a9b2c7;
  --soft: #dce7f7;
  --cyan: #43e8ff;
  --blue: #4776ff;
  --gold: #e7c477;
  --green: #74f2a7;
  --shadow: 0 30px 100px rgba(0,0,0,.45);
  --radius: 28px;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: Inter, system-ui, -apple-system, Segoe UI, sans-serif;
  color: var(--text);
  background:
    radial-gradient(circle at 10% 0%, rgba(67,232,255,.18), transparent 32rem),
    radial-gradient(circle at 90% 10%, rgba(231,196,119,.12), transparent 34rem),
    linear-gradient(180deg, #060914, #080b12 45%, #05060a);
  overflow-x: hidden;
}
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
#techCanvas { position: fixed; inset: 0; z-index: -3; opacity: .52; }
.cursor-glow { position: fixed; width: 340px; height: 340px; pointer-events: none; z-index: -2; border-radius: 999px; background: radial-gradient(circle, rgba(67,232,255,.16), transparent 64%); transform: translate(-50%, -50%); transition: opacity .2s ease; }
.loader { position: fixed; inset: 0; z-index: 9999; display: grid; place-items: center; background: #050812; transition: opacity .7s ease, visibility .7s ease; }
.loader.hidden { opacity: 0; visibility: hidden; }
.loader-grid { position:absolute; inset:0; background-image: linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px); background-size: 56px 56px; mask-image: radial-gradient(circle, #000, transparent 72%); animation: gridPulse 2s linear infinite; }
@keyframes gridPulse { to { transform: translateY(56px); } }
.loader-inner { width: min(420px, 90vw); text-align: center; padding: 38px; border: 1px solid var(--line); border-radius: 30px; background: rgba(255,255,255,.06); backdrop-filter: blur(22px); box-shadow: var(--shadow); }
.loader-inner img { width: 80px; height: auto; margin-bottom: 14px; filter: drop-shadow(0 0 24px rgba(67,232,255,.26)); }
.loader-title { font-family: 'Space Grotesk'; font-weight: 700; font-size: 1.55rem; }
.loader-bar { height: 6px; background: rgba(255,255,255,.1); border-radius: 99px; overflow: hidden; margin: 22px 0 14px; }
.loader-bar span { display:block; height:100%; width:42%; border-radius:99px; background: linear-gradient(90deg, var(--cyan), var(--gold)); animation: load 1.15s ease-in-out infinite alternate; }
@keyframes load { from { transform: translateX(-90%); } to { transform: translateX(220%); } }
.loader p { color: var(--muted); font-size: .84rem; }
.site-header { position: fixed; top: 18px; left: 50%; transform: translateX(-50%); width: min(1180px, calc(100% - 32px)); z-index: 1000; display:flex; align-items:center; justify-content:space-between; gap: 22px; padding: 12px 14px; border: 1px solid rgba(255,255,255,.12); background: rgba(8,12,24,.68); backdrop-filter: blur(26px); border-radius: 999px; box-shadow: 0 20px 50px rgba(0,0,0,.25); transition: .35s ease; }
.site-header.scrolled { top: 10px; background: rgba(8,12,24,.86); }
.brand { display:flex; align-items:center; gap: 12px; min-width: max-content; }
.brand-mark { width: 48px; height: 48px; display:grid; place-items:center; border-radius: 50%; background: linear-gradient(135deg, rgba(255,255,255,.16), rgba(67,232,255,.08)); border: 1px solid rgba(255,255,255,.16); overflow:hidden; }
.brand-mark img { width: 43px; }
.brand-copy { display:flex; flex-direction:column; line-height:1.05; }
.brand-copy strong { font-family: 'Space Grotesk'; font-size: 1rem; }
.brand-copy small { color: var(--muted); font-size: .72rem; margin-top: 4px; }
.desktop-nav { display:flex; align-items:center; gap: 8px; }
.desktop-nav a { color: var(--soft); font-size: .83rem; font-weight: 700; padding: 12px 14px; border-radius: 999px; transition: .25s; }
.desktop-nav a:hover { background: rgba(255,255,255,.08); color: var(--cyan); }
.header-actions { display:flex; align-items:center; gap: 10px; }
.ghost-link { font-size: .8rem; color: var(--muted); padding: 12px 14px; border:1px solid rgba(255,255,255,.10); border-radius: 999px; }
.menu-btn { display:none; width: 48px; height: 48px; border: 0; border-radius: 50%; background: rgba(255,255,255,.08); color:#fff; cursor:pointer; }
.menu-btn span { display:block; width:20px; height:2px; background:#fff; margin:5px auto; transition:.25s; }
.mobile-menu { position: fixed; inset: 88px 16px auto; z-index: 999; padding: 18px; border-radius: 24px; background: rgba(8,12,24,.96); border:1px solid var(--line); backdrop-filter: blur(20px); display: none; box-shadow: var(--shadow); }
.mobile-menu.open { display:grid; gap: 8px; }
.mobile-menu a { padding: 16px; border-radius: 16px; background: rgba(255,255,255,.06); font-weight: 800; }
.section-shell { width: min(1180px, calc(100% - 32px)); margin: 0 auto; }
.hero { min-height: 100vh; display:grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); align-items:center; gap: 44px; padding: 150px 0 80px; position:relative; }
.hero-bg-orb { position:absolute; border-radius:50%; filter: blur(30px); z-index:-1; opacity:.7; }
.orb-a { width:340px; height:340px; background:rgba(67,232,255,.14); top:18%; left:-12%; animation: float 9s ease-in-out infinite; }
.orb-b { width:260px; height:260px; background:rgba(231,196,119,.12); right:5%; bottom:10%; animation: float 11s ease-in-out infinite reverse; }
@keyframes float { 50% { transform: translateY(-34px) translateX(20px); } }
.eyebrow, .section-kicker { display:inline-flex; align-items:center; gap:10px; color: var(--gold); font-weight: 900; letter-spacing: .13em; text-transform: uppercase; font-size: .76rem; }
.eyebrow span { width:8px; height:8px; border-radius:50%; background: var(--green); box-shadow: 0 0 22px var(--green); }
.hero-title { font-family: 'Space Grotesk', Inter, sans-serif; font-size: clamp(3.2rem, 7.8vw, 7.55rem); line-height: .86; letter-spacing: -.075em; margin: 22px 0 28px; max-width: 980px; }
.hero-title em { font-style: normal; color: transparent; -webkit-text-stroke: 1.25px rgba(245,247,251,.88); text-shadow: 0 0 50px rgba(67,232,255,.1); }
.hero-lead { color: var(--soft); max-width: 760px; font-size: clamp(1.05rem, 1.7vw, 1.35rem); line-height: 1.7; }
.hero-actions { display:flex; gap: 14px; flex-wrap: wrap; margin: 34px 0; }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height: 54px; padding: 0 22px; border-radius: 999px; font-weight: 900; border:1px solid transparent; cursor:pointer; transition: transform .25s ease, box-shadow .25s ease, background .25s ease; }
.btn:hover { transform: translateY(-3px); }
.btn-primary { background: linear-gradient(135deg, var(--cyan), #79f3ff 35%, var(--gold)); color:#06101a; box-shadow: 0 18px 44px rgba(67,232,255,.18); }
.btn-secondary { border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.06); color: var(--text); }
.trust-strip { display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; max-width: 760px; }
.trust-strip div { padding: 16px; border: 1px solid rgba(255,255,255,.12); border-radius: 18px; background: rgba(255,255,255,.055); }
.trust-strip strong { display:block; font-size: .92rem; }
.trust-strip span { color: var(--muted); font-size: .82rem; }
.hero-panel { min-height: 610px; border:1px solid rgba(255,255,255,.14); background: linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.045)); border-radius: var(--radius); padding: 22px; box-shadow: var(--shadow); backdrop-filter: blur(24px); position:relative; overflow:hidden; }
.hero-panel:before { content:""; position:absolute; inset:-1px; background: linear-gradient(120deg, transparent 20%, rgba(67,232,255,.16), transparent 60%); transform: translateX(-50%); animation: panelShine 6s ease-in-out infinite; }
@keyframes panelShine { 50% { transform: translateX(50%); } }
.panel-top { position:relative; display:flex; align-items:center; gap:10px; color:var(--muted); font-size:.86rem; padding: 12px 14px; border-radius: 16px; background: rgba(0,0,0,.18); }
.status-dot { width:10px; height:10px; border-radius:50%; background: var(--green); box-shadow: 0 0 18px var(--green); }
.robot-card { position:relative; min-height: 360px; margin: 18px 0; border-radius: 24px; background: radial-gradient(circle at 50% 42%, rgba(67,232,255,.18), transparent 32%), linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.18)); border: 1px solid rgba(255,255,255,.12); overflow:hidden; }
.robot-card:after { content:""; position:absolute; inset:0; background-image: linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px); background-size: 32px 32px; mask-image: radial-gradient(circle, #000, transparent 76%); }
.robot-arm { position:absolute; inset:0; z-index:2; animation: robotMove 5s ease-in-out infinite; transform-origin: 50% 55%; }
@keyframes robotMove { 50% { transform: rotate(4deg) translateY(-8px); } }
.joint { position:absolute; border-radius:50%; background: radial-gradient(circle at 30% 25%, #fff, #a8bac9 40%, #182436 70%); border: 8px solid rgba(67,232,255,.28); box-shadow: 0 0 44px rgba(67,232,255,.18); }
.j1 { width:88px; height:88px; left:80px; top:214px; }
.j2 { width:76px; height:76px; left:190px; top:118px; }
.j3 { width:62px; height:62px; left:304px; top:174px; }
.arm { position:absolute; height:44px; border-radius:999px; background: linear-gradient(90deg, #dce7f7, #738399 55%, #f4f7fb); border:1px solid rgba(255,255,255,.25); box-shadow: inset 0 -10px 20px rgba(0,0,0,.20); transform-origin:left center; }
.a1 { width:160px; left:132px; top:206px; transform: rotate(-42deg); }
.a2 { width:122px; left:244px; top:156px; transform: rotate(31deg); }
.grip { position:absolute; left:348px; top:213px; width:44px; height:72px; border:8px solid #dce7f7; border-top:0; border-radius: 0 0 30px 30px; transform: rotate(22deg); }
.scan-line { position:absolute; z-index:3; left:0; right:0; height:2px; background: linear-gradient(90deg, transparent, var(--cyan), transparent); box-shadow:0 0 18px var(--cyan); animation: scan 3.2s linear infinite; }
@keyframes scan { from { top: 10%; } to { top: 88%; } }
.metric-stack { position:relative; display:grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.metric-stack div { background: rgba(0,0,0,.20); border:1px solid rgba(255,255,255,.12); border-radius: 18px; padding: 18px 12px; text-align:center; }
.metric-stack span { display:block; font-family:'Space Grotesk'; font-size: 2rem; color: var(--cyan); font-weight: 800; }
.metric-stack small { color:var(--muted); }
.marquee { width:100%; overflow:hidden; border-block:1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.035); }
.marquee-track { display:flex; gap: 28px; width:max-content; padding: 18px 0; animation: marquee 26s linear infinite; }
.marquee span { color:var(--muted); font-weight: 900; text-transform: uppercase; letter-spacing:.15em; font-size:.8rem; }
@keyframes marquee { to { transform: translateX(-50%); } }
.split-section, .services-section, .proof-section, .process-section, .investor-section, .showcase, .quote-section, .contact-section { padding: 120px 0; }
.split-heading { display:grid; grid-template-columns: 1fr .72fr; gap: 50px; align-items:end; margin: 18px 0 34px; }
h2 { font-family:'Space Grotesk'; font-size: clamp(2.3rem, 4.8vw, 4.8rem); line-height: .95; letter-spacing: -.055em; }
.split-heading p, .section-header p, .investor-copy p, .contact-copy p { color: var(--muted); font-size: 1.05rem; line-height:1.8; }
.impact-grid, .services-grid, .proof-grid { display:grid; gap: 16px; }
.impact-grid { grid-template-columns: repeat(3, 1fr); }
.impact-card, .service-tile, .proof-card { border:1px solid rgba(255,255,255,.12); border-radius: var(--radius); background: rgba(255,255,255,.055); padding: 28px; backdrop-filter: blur(18px); box-shadow: 0 18px 60px rgba(0,0,0,.18); transition: transform .3s ease, border-color .3s ease, background .3s ease; }
.impact-card:hover, .service-tile:hover, .proof-card:hover { transform: translateY(-8px); border-color: rgba(67,232,255,.42); background: rgba(255,255,255,.08); }
.impact-card b, .proof-card span { color:var(--gold); font-family:'Space Grotesk'; }
h3 { font-family:'Space Grotesk'; font-size: 1.35rem; margin: 16px 0 10px; }
.impact-card p, .service-tile p, .proof-card p, .timeline-item p, .scenario-grid p, .investor-points p { color:var(--muted); line-height:1.7; }
.section-header { max-width: 850px; margin-bottom: 34px; }
.section-header h2 { margin: 14px 0 18px; }
.services-grid { grid-template-columns: repeat(3, 1fr); align-items:stretch; }
.service-tile { min-height: 430px; position:relative; overflow:hidden; }
.service-tile.featured { background: linear-gradient(160deg, rgba(67,232,255,.13), rgba(255,255,255,.06)); }
.tile-icon { width:62px; height:62px; display:grid; place-items:center; border-radius: 18px; background: rgba(67,232,255,.11); border:1px solid rgba(67,232,255,.22); color: var(--cyan); font-family:'Space Grotesk'; font-size: 1.6rem; font-weight:800; }
ul { list-style:none; margin-top: 24px; display:grid; gap:10px; }
li { color: var(--soft); font-weight:700; }
li:before { content:"→"; color: var(--gold); margin-right:10px; }
.showcase-card, .investor-card, .contact-card { border:1px solid rgba(255,255,255,.13); border-radius: calc(var(--radius) + 10px); background: linear-gradient(145deg, rgba(255,255,255,.095), rgba(255,255,255,.045)); box-shadow: var(--shadow); backdrop-filter: blur(24px); overflow:hidden; }
.showcase-card { padding: 46px; display:grid; grid-template-columns: .9fr 1.1fr; gap: 40px; }
.showcase-card h2 { font-size: clamp(2rem, 3.4vw, 3.7rem); margin-top:14px; }
.scenario-grid { display:grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.scenario-grid div { padding: 22px; border-radius: 22px; background: rgba(0,0,0,.18); border:1px solid rgba(255,255,255,.1); }
.scenario-grid strong { color:var(--cyan); font-size: 1.05rem; }
.proof-grid { grid-template-columns: repeat(4, 1fr); }
.proof-card { min-height: 260px; }
.investor-card { display:grid; grid-template-columns: .9fr 1.1fr; gap: 30px; padding: 50px; position:relative; }
.investor-card:before { content:""; position:absolute; inset:auto -10% -40% -10%; height: 260px; background: radial-gradient(ellipse, rgba(231,196,119,.13), transparent 60%); }
.investor-copy, .investor-points { position:relative; }
.investor-copy h2 { margin:14px 0 18px; font-size: clamp(2.1rem, 3.8vw, 4.1rem); }
.investor-points { display:grid; gap: 12px; }
.investor-points div { padding: 24px; border-radius: 24px; background: rgba(0,0,0,.18); border:1px solid rgba(255,255,255,.10); }
.investor-points span { display:block; width: 34px; height: 3px; border-radius:99px; background: linear-gradient(90deg, var(--cyan), var(--gold)); margin-bottom: 16px; }
.timeline { position:relative; display:grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.timeline:before { content:""; position:absolute; top: 44px; left: 8%; right:8%; height:1px; background: linear-gradient(90deg, transparent, rgba(67,232,255,.45), transparent); }
.timeline-item { position:relative; padding: 28px; border:1px solid rgba(255,255,255,.12); border-radius: 26px; background: rgba(255,255,255,.055); backdrop-filter: blur(18px); }
.timeline-item span { width: 54px; height:54px; display:grid; place-items:center; border-radius:50%; background:#071526; border:1px solid rgba(67,232,255,.3); color: var(--cyan); font-weight: 900; box-shadow: 0 0 28px rgba(67,232,255,.12); }
.quote-section { padding-top: 40px; }
blockquote { font-family:'Space Grotesk'; font-size: clamp(2rem, 4.6vw, 5.2rem); line-height:1; letter-spacing:-.055em; color: #fff; max-width: 1120px; }
blockquote span { color: var(--gold); }
.contact-card { display:grid; grid-template-columns: .9fr 1.1fr; gap: 40px; padding: 46px; }
.contact-copy h2 { margin: 14px 0 18px; }
.contact-direct { display:grid; gap:12px; margin-top: 28px; }
.contact-direct a { color:var(--cyan); font-weight:900; }
.contact-form { display:grid; gap: 14px; }
label { display:grid; gap:8px; color:var(--soft); font-weight:800; }
input, textarea, select { width:100%; border:1px solid rgba(255,255,255,.13); background: rgba(0,0,0,.2); color:#fff; border-radius: 18px; padding: 16px 18px; outline: none; transition:.2s; }
select { appearance:auto; }
input:focus, textarea:focus, select:focus { border-color: rgba(67,232,255,.6); box-shadow: 0 0 0 4px rgba(67,232,255,.08); }
textarea { resize: vertical; min-height: 140px; }
.footer { width:min(1180px, calc(100% - 32px)); margin: 0 auto; padding: 36px 0 60px; display:flex; justify-content:space-between; gap:20px; color: var(--muted); border-top:1px solid rgba(255,255,255,.1); }
.footer strong { display:block; color:#fff; font-family:'Space Grotesk'; }
.footer span { font-size:.86rem; }
.reveal { opacity:0; transform: translateY(28px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,1,.2,1); }
.reveal.visible { opacity:1; transform: translateY(0); }
@media (max-width: 980px) {
  .desktop-nav, .ghost-link { display:none; }
  .menu-btn { display:block; }
  .hero, .split-heading, .showcase-card, .investor-card, .contact-card { grid-template-columns: 1fr; }
  .hero-panel { min-height: 500px; }
  .impact-grid, .services-grid, .proof-grid, .timeline { grid-template-columns: 1fr 1fr; }
  .timeline:before { display:none; }
}
@media (max-width: 640px) {
  .site-header { top: 10px; border-radius: 24px; }
  .brand-copy small { display:none; }
  .hero { padding-top: 125px; }
  .hero-title { font-size: clamp(2.8rem, 17vw, 4.4rem); }
  .trust-strip, .impact-grid, .services-grid, .proof-grid, .timeline, .scenario-grid, .metric-stack { grid-template-columns: 1fr; }
  .hero-panel { min-height: 430px; padding: 14px; }
  .robot-card { min-height: 270px; }
  .j1 { left:38px; top:158px; } .j2 { left:126px; top:84px; } .j3 { left:218px; top:130px; }
  .a1 { left:86px; top:151px; width:120px; } .a2 { left:176px; top:116px; width:90px; } .grip { left:254px; top:164px; }
  .split-section, .services-section, .proof-section, .process-section, .investor-section, .showcase, .quote-section, .contact-section { padding: 76px 0; }
  .showcase-card, .investor-card, .contact-card { padding: 24px; border-radius: 28px; }
  .footer { flex-direction:column; }
}
@media (prefers-reduced-motion: reduce) {
  *, *:before, *:after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
/* ÁSZF checkbox egyedi formázása */
.terms-label {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start;
    gap: 12px;
    cursor: pointer;
    margin: 8px 0 16px;
}

    .terms-label input[type="checkbox"] {
        width: 22px;
        height: 22px;
        margin-top: 2px;
        cursor: pointer;
        flex-shrink: 0;
    }

.terms-text {
    font-size: 0.9rem;
    color: var(--muted);
    font-weight: 500;
    line-height: 1.4;
}
/* Letiltott gomb stílusa, amikor még nincs kipipálva */
.btn-primary:disabled {
    opacity: 0.35;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
    background: var(--muted);
    color: var(--bg);
}

/* Felugró ablak (Modal) alapstílusok */
.modal {
    position: fixed;
    inset: 0;
    z-index: 2000; /* A header felett kell legyen */
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(4, 6, 14, 0.8);
    backdrop-filter: blur(12px);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s ease, visibility 0.4s ease;
    padding: 16px;
}
    /* Nyitott állapot */
    .modal.modal-open {
        opacity: 1;
        visibility: visible;
    }
/* A belső fehér/sötét kártya */
.modal-content {
    width: min(650px, 100%);
    max-height: 80vh;
    background: linear-gradient(145deg, #0b1020, #060914);
    border: 1px solid rgba(67, 232, 255, 0.25);
    border-radius: 24px;
    box-shadow: 0 30px 100px rgba(0,0,0,0.8), 0 0 40px rgba(67, 232, 255, 0.05);
    display: flex;
    flex-direction: column;
    transform: translateY(30px);
    transition: transform 0.4s cubic-bezier(0.2, 1, 0.2, 1);
}

.modal.modal-open .modal-content {
    transform: translateY(0);
}
/* Fejléc */
.modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 24px 28px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

    .modal-header h2 {
        font-size: 1.8rem;
        letter-spacing: -0.03em;
        color: #fff;
    }
/* Bezárás gomb (X) */
.close-btn {
    background: transparent;
    border: 0;
    color: var(--muted);
    font-size: 2rem;
    cursor: pointer;
    transition: color 0.2s;
    line-height: 1;
}

    .close-btn:hover {
        color: var(--cyan);
    }
/* Szövegtörzs görgethető résszel */
.modal-body {
    padding: 28px;
    overflow-y: auto;
    flex-content: min-content;
}

    .modal-body h3 {
        font-size: 1.1rem;
        color: var(--gold);
        margin: 20px 0 8px 0;
    }

        .modal-body h3:first-child {
            margin-top: 0;
        }

    .modal-body p {
        color: var(--muted);
        font-size: 0.95rem;
        line-height: 1.6;
        margin-bottom: 12px;
    }
    /* Görgetősáv (scrollbar) testreszabása a modalban */
    .modal-body::-webkit-scrollbar {
        width: 6px;
    }

    .modal-body::-webkit-scrollbar-track {
        background: rgba(0, 0, 0, 0.1);
    }

    .modal-body::-webkit-scrollbar-thumb {
        background: rgba(255, 255, 255, 0.15);
        border-radius: 99px;
    }

        .modal-body::-webkit-scrollbar-thumb:hover {
            background: var(--cyan);
        }