:root{
  --bg:#0b0b0c;--fg:#ffffff;--muted:#d6d9e0; /* hærri kontrast á tagline */
  --tiktok:#000000; --facebook:#1877F2; --youtube:#FF0000; --instagram:#E4405F;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,system-ui,Segoe UI,Roboto,Helvetica,Arial;background:var(--bg);color:var(--fg);line-height:1.6}
.wrap{max-width:980px;margin:0 auto;padding:0 20px}

/* HERO */
.hero{position:relative;min-height:68vh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.hero::before{content:'';position:absolute;inset:0;background:url('../assets/fokk.png') center/cover no-repeat;filter:brightness(.6)}
.hero__content{position:relative;z-index:1;padding:48px 0;text-shadow:0 1px 0 rgba(0,0,0,.6)}
.avatar{width:110px;height:110px;border-radius:50%;border:3px solid #fff;object-fit:cover;box-shadow:0 8px 28px rgba(0,0,0,.45)}
h1{font-size:clamp(36px,7vw,72px);margin:.5em 0 0;font-weight:800;letter-spacing:.3px}
.tagline{color:var(--muted);margin:.5em auto 1.4em;max-width:700px}
.cta{display:flex;flex-direction:column;align-items:center;gap:16px}

/* SOCIAL BUTTONS */
.section{padding:44px 0;border-top:1px solid rgba(255,255,255,.07)}
.section.center{text-align:center}
.section h2{font-size:clamp(22px,3.5vw,30px);margin:0 0 18px}

.social{list-style:none;margin:0 auto;padding:0;display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));max-width:820px}
.social a{display:flex;align-items:center;justify-content:center;gap:12px;padding:14px 16px;border-radius:12px;color:#fff;text-decoration:none;font-weight:600;box-shadow:0 8px 24px rgba(0,0,0,.25);transition:transform .08s ease, filter .08s ease}
.social a:hover{transform:translateY(-1px);filter:brightness(1.05)}
.social a:active{transform:translateY(1px)}
.icon{display:inline-flex}
.icon svg{width:22px;height:22px;display:block}

/* Brand colors */
.tiktok{background:var(--tiktok)}
.facebook{background:var(--facebook)}
.youtube{background:var(--youtube)}
.instagram{background:var(--instagram)}

/* CTA fallbacks */
.bmc-btn{background:#FFDD00;color:#000;font-weight:800;text-decoration:none;padding:14px 22px;border-radius:12px;border:2px solid #000;box-shadow:0 8px 0 #000;display:inline-block}
.bmc-btn:hover{transform:translateY(-1px);box-shadow:0 10px 0 #000}
.bmc-btn:active{transform:translateY(2px);box-shadow:0 6px 0 #000}

/* CONTACT */
.contact-card{display:flex;justify-content:center}
.contact-btn{background:#ffffff;color:#000;text-decoration:none;font-weight:700;padding:12px 18px;border-radius:999px;border:2px solid #000;box-shadow:0 8px 0 #000;transition:transform .08s ease, box-shadow .08s ease}
.contact-btn:hover{transform:translateY(-1px);box-shadow:0 10px 0 #000}
.contact-btn:active{transform:translateY(2px);box-shadow:0 6px 0 #000}

.footer{margin:40px 0;text-align:center;color:#aaa}

/* Mobile tweaks */
@media (max-width:640px){
  .hero{min-height:100svh}
  .bmc-sticky{position:fixed;left:16px;right:16px;bottom:16px;z-index:50}
}