@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@600;700;800&display=swap');

:root{
  --pink:#FB2B4F;
  --pink-soft:#ffc2ce;
  --ink:#1a1a1a;
  --radius:10px;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Nunito',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:var(--ink);
  line-height:1.6;
}

/* logo (shared) */
.logo{font-weight:800;letter-spacing:-.02em;line-height:1;-webkit-font-smoothing:antialiased;}
.logo .ux{color:#fff;}
.logo .ilize{color:var(--pink-soft);}

/* top bar on subpages */
.topbar{
  background:var(--pink);
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 32px;position:sticky;top:0;z-index:10;
}
.topbar .logo{font-size:34px;text-decoration:none;}
.topbar .cta{
  background:#fff;color:var(--pink);
  font-weight:800;font-size:13px;letter-spacing:.04em;
  text-decoration:none;text-transform:uppercase;
  padding:12px 20px;border-radius:var(--radius);white-space:nowrap;
}

/* hero (index) */
.hero{
  background:var(--pink);min-height:100vh;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:40px 24px 90px;position:relative;
}
.hero .logo{font-size:clamp(64px,13vw,170px);}
.hero .slogan{color:#fff;font-size:clamp(20px,3.4vw,40px);font-weight:600;margin-top:6px;letter-spacing:-.01em;}
.hero .cta{
  margin-top:48px;background:#fff;color:var(--pink);
  font-weight:800;font-size:15px;letter-spacing:.05em;text-transform:uppercase;
  text-decoration:none;padding:18px 34px;border-radius:var(--radius);
  transition:transform .15s ease, box-shadow .15s ease;
}
.hero .cta:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.18);}

/* footer */
.site-footer{text-align:center;padding:26px 16px;font-size:15px;font-weight:600;}
.hero .site-footer{position:absolute;bottom:0;left:0;right:0;color:#fff;}
.hero .site-footer a{color:#fff;}
.site-footer a{color:var(--ink);text-decoration:underline;margin:0 4px;}

/* subpage content */
section.page{max-width:760px;margin:0 auto;padding:64px 28px 40px;}
section.page h1{font-size:clamp(40px,7vw,68px);font-weight:800;letter-spacing:-.02em;margin-bottom:28px;}
section.page h2{font-size:22px;font-weight:800;margin:28px 0 8px;}
section.page p{margin-bottom:14px;font-size:18px;}
section.page a{color:var(--pink);}

/* contact page */
.contact-head{text-align:center;}
.contact-card{
  display:flex;gap:28px;align-items:flex-start;
  margin:36px 0 8px;flex-wrap:wrap;justify-content:center;
}
.contact-photo{
  width:170px;height:170px;border-radius:50%;object-fit:cover;flex-shrink:0;
  background:#f0f0f0 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="170" height="170"><rect width="170" height="170" fill="%23eee"/><text x="50%25" y="52%25" font-size="13" fill="%23999" text-anchor="middle" font-family="sans-serif">Foto einfügen</text></svg>') center/cover;
}
.contact-info h3{font-size:30px;font-weight:800;margin-bottom:10px;}
.contact-info p{font-size:18px;margin-bottom:6px;}
.linkedin-link{
  display:inline-flex;align-items:center;gap:8px;
  margin-top:10px;font-weight:700;color:var(--pink);text-decoration:none;
}
.linkedin-link svg{flex-shrink:0;}
.linkedin-link:hover{text-decoration:underline;}

.divider{border:none;border-top:1px solid #eee;margin:56px auto;max-width:760px;}

@media(max-width:560px){
  .topbar{padding:14px 18px;}
  .topbar .logo{font-size:26px;}
}
