/* ====== base ====== */
:root{
  --bg: #0b0b0c;
  --ink: #0a0a0a;
  --hero-gray: #e9e9eb;
  --accent: #e3443d;     /* a piros a képen */
  --text: #1a1b1e;
  --muted: #777a82;
  --white: #fff;
  --container: min(1140px, 92vw);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
img{display:block;max-width:100%}
.container{width:var(--container);margin-inline:auto}

/* ====== top nav ====== */
.topbar{
  position:fixed; inset:0 0 auto 0; z-index:30;
  background:rgba(0,0,0,.55);
  border-bottom:1px solid rgba(255,255,255,.06);
  backdrop-filter:saturate(120%) blur(6px);
}
.nav{display:flex;align-items:center;justify-content:space-between;height:56px}
.nav-spacer{width:120px} /* bal oldali üres rész, mint a képen */
.nav-links{display:flex;gap:26px;align-items:center;list-style:none;margin:0;padding:0}
.nav-links a{
  color:#f3f3f5;text-decoration:none;
  font:600 12px/1 Inter, system-ui, sans-serif;
  letter-spacing:.06em; text-transform:uppercase;
}
.btn-sign{
  padding:10px 12px; background:var(--accent); border-radius:3px; color:#fff !important;
}
.hamburger{display:none;background:none;border:0;padding:6px}
.hamburger span{display:block;width:26px;height:2px;background:#fff;margin:5px 0}

/* ====== hero ====== */
.hero{position:relative; background:#000; color:#fff; padding-top:56px}
.hero-img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:70% 35%;
  z-index:0;
}
.hero-shade{
  position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(0,0,0,0.95) 0 42%, rgba(0,0,0,.5) 68%, rgba(0,0,0,.1) 85%);
  z-index:1;
}
.hero-inner{position:relative; z-index:2; padding:110px 0 120px}
.hero-title{
  margin:0;
  font-family:'Bebas Neue', sans-serif;
  font-size: clamp(48px, 10vw, 124px);
  line-height:.88; letter-spacing:.6px; color:#fff;
}
.hero-title span{color:var(--accent)}
/* ferde alsó él */
.hero-slope{
  position:absolute; left:0; right:0; bottom:-1px; height:130px; z-index:2;
  background:var(--hero-gray);
  clip-path: polygon(0 44%, 100% 0, 100% 100%, 0 100%);
}

/* ====== content block ====== */
.content{background:var(--hero-gray)}
.about{
  display:grid; grid-template-columns: 520px 1fr; gap:72px;
  padding:90px 0 120px;
}
.about-media img{width:100%; height:auto; box-shadow:0 14px 34px rgba(0,0,0,.15)}
.about-text{max-width:560px}
.about-title{
  position:relative; margin:6px 0 18px;
  font-family:'Bebas Neue', sans-serif;
  font-size:44px; line-height:1; letter-spacing:.4px;
}
.about-title::before{
  content:''; position:absolute; left:-20px; top:6px;
  width:6px; height:34px; background:var(--accent); border-radius:2px;
}
.about p{color:#5a5d62; font: 400 14.5px/1.8 Inter, system-ui, sans-serif; margin:0 0 16px}

/* inline social icons (kör ikonok mint a képen) */
.inline-icons{display:flex;gap:10px;margin-top:8px}
.ico{
  width:32px;height:32px;border-radius:50%;display:inline-block;
  background:#111; position:relative;
}
.ico::after{
  content:''; position:absolute; inset:0; margin:auto;
  width:16px;height:16px; background:#fff; mask-size:contain; mask-repeat:no-repeat; mask-position:center;
}
.ico.ig::after{ mask-image: radial-gradient(circle,transparent 6px, #000 6px), linear-gradient(#000,#000); } /* sematikus kis piktogram */
.ico.in::after{ mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox=\\'0 0 24 24\\'><path fill=\\'black\\' d=\\'M4.98 3.5a2.5 2.5 0 1 1 0 4.999 2.5 2.5 0 0 1 0-5zM3 9h4v12H3zM9 9h3.8v1.9h.05c.53-1 1.84-2.05 3.78-2.05 4.04 0 4.79 2.66 4.79 6.12V21h-4v-5.3c0-1.26-.02-2.88-1.76-2.88-1.76 0-2.03 1.37-2.03 2.79V21H9z\\'/></svg>'); }
.ico.fb::after{ mask-image: url('data:image/svg+xml;utf8,<svg xmlns=\\'http://www.w3.org/2000/svg\\' viewBox=\\'0 0 24 24\\'><path fill=\\'black\\' d=\\'M13 22V12h3.5l.5-4H13V6.5c0-1.1.36-2 2-2H17V1.1A24.77 24.77 0 0 0 14.6 1C11.9 1 10 2.7 10 6v2H7v4h3v10z\\'/></svg>'); }

/* ====== footer ====== */
.footer{background:#0c0d0f;color:#cfd0d6}
.footer-top{
  display:flex; align-items:flex-end; justify-content:space-between;
  padding:70px 0 64px;
}
.footer-cta{
  margin:0; color:#fff; font-family:'Bebas Neue', sans-serif;
  font-size: clamp(34px, 6vw, 56px); line-height:1.02;
}
.footer-cta span{color:var(--accent)}
.footer-icons{display:flex; gap:10px}

.footer-bottom{
  display:grid; grid-template-columns: 1fr auto; align-items:center;
  padding:0 0 22px;
}
.legal{display:flex; gap:10px; align-items:center}
.legal a{color:#cfd0d6; text-decoration:none; font: 400 13px/1.6 Inter, system-ui, sans-serif}
.legal a:hover{color:#fff}

/* ====== responsive ====== */
@media (max-width: 1060px){
  .about{grid-template-columns:1fr; gap:32px}
}
@media (max-width: 860px){
  .nav-links{
    display:none;
    flex-direction:column;
    background:rgba(15,16,19, 0.6);
    position:absolute;
    top:57px; right:0; left:0;
    padding:18px 20px;
    gap:16px;
  }
  .hamburger{display:block}
  .hero-inner{padding:90px 0 110px}
  .nav-links.open{ display:flex; }
}