/* Base Reset (minimal) */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; font-family: var(--font-sans); background: var(--bg); color: var(--text); line-height:1.5; }
img { max-width:100%; height:auto; display:block; }
a { color: var(--accent); text-decoration:none; }
a:hover, a:focus { color: var(--accent-hover); }

.container { width:100%; max-width: var(--max-width); margin:0 auto; padding: 0 var(--space-4); }

/* Header */
.site-header { position:sticky; top:0; background: var(--bg); border-bottom:1px solid var(--border); z-index:50; }
.header__inner { display:flex; align-items:center; justify-content:space-between; min-height:64px; }
.logo { display:inline-flex; align-items:center; gap: var(--space-2); font-weight:600; }

.primary-nav { position:relative; }
.nav-toggle { display:none; background: var(--accent); color:#fff; border:none; padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); cursor:pointer; }
.nav-menu { display:flex; list-style:none; gap: var(--space-4); margin:0; padding:0; align-items:center; }
.nav-menu a, .nav-menu button { padding: var(--space-2) var(--space-2); border-radius: var(--radius-sm); }
.nav-menu a:focus-visible, .nav-menu button:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
/* .theme-toggle fjernet (alltid mørk modus) */

@media (max-width: 740px) {
  .nav-toggle { display:inline-block; }
  .nav-menu { position:absolute; right:0; top:100%; background: var(--bg); flex-direction:column; padding: var(--space-4); border:1px solid var(--border); box-shadow: var(--shadow-md); min-width: 200px; display:none; }
  .nav-menu.open { display:flex; }
}

/* Hero */
.hero { padding: var(--space-8) 0 var(--space-7); background: linear-gradient(135deg, var(--bg-alt), var(--accent-soft)); }
.hero__content { text-align:center; }
.hero h1 { font-size: clamp(2rem,5vw,3rem); margin:0 0 var(--space-4); }
.lead { font-size:1.15rem; max-width:650px; margin:0 auto var(--space-5); color: var(--text-light); }
.hero-tags { display:flex; justify-content:center; gap: var(--space-2); flex-wrap:wrap; margin:0 0 var(--space-5); }
.tag-badge { background: var(--bg-alt); border:1px solid var(--border); padding:2px 10px; font-size:0.75rem; letter-spacing:0.5px; text-transform:uppercase; border-radius: var(--radius-sm); font-weight:600; }
.tag-badge:hover { background: var(--accent-soft); }
.btn { display:inline-block; padding: var(--space-3) var(--space-5); font-weight:600; border-radius: var(--radius-md); border:1px solid var(--accent); transition: var(--transition); }
.btn--primary { background: var(--accent); color:#fff; }
.btn--primary:hover { background: var(--accent-hover); }

/* Projects */
.projects { padding: var(--space-7) 0; }
.section-intro { color: var(--text-light); max-width:600px; }
.projects-grid { display:grid; gap: var(--space-5); grid-template-columns: repeat(auto-fit,minmax(250px,1fr)); margin-top: var(--space-5); }
.project-card { background: var(--bg-alt); padding: var(--space-4); border:1px solid var(--border); border-radius: var(--radius-md); display:flex; flex-direction:column; gap: var(--space-3); box-shadow: var(--shadow-sm); transition: var(--transition); }
.project-card:hover { box-shadow: var(--shadow-md); }
.project-card__head { display:flex; align-items:center; justify-content:space-between; gap: var(--space-2); }
.project-card__title { margin:0; font-size:1.25rem; }
.project-card__desc { margin:0; flex-grow:1; color: var(--text-light); }
.project-points { list-style:none; margin:0 0 var(--space-3); padding:0; display:flex; flex-direction:column; gap:4px; }
.project-points li { font-size:0.85rem; color: var(--text-light); position:relative; padding-left:14px; }
.project-points li:before { content:"•"; position:absolute; left:0; top:0; color: var(--accent); }
.project-card__link { font-weight:600; align-self:flex-start; }
.project-card__link--disabled { opacity:0.5; cursor: not-allowed; }
.status-badge { font-size:0.75rem; text-transform:uppercase; letter-spacing:0.5px; padding:2px 8px; border-radius: var(--radius-sm); font-weight:600; }
.status-badge--live { background: #10b981; color:#fff; }
.status-badge--wip { background: #f59e0b; color:#fff; }

/* About */
.about { padding: var(--space-7) 0; background: var(--bg-alt); }
.values-list { list-style: none; padding:0; margin: var(--space-4) 0 0; columns:2; column-gap: var(--space-6); }
.values-list li { position:relative; padding-left:20px; margin:0 0 var(--space-2); }
.values-list li:before { content:""; position:absolute; left:0; top:8px; width:10px; height:10px; border-radius:50%; background: var(--accent); }
@media (max-width:600px){ .values-list { columns:1; } }

/* Contact */
.contact { padding: var(--space-7) 0; }
.contact-links { list-style:none; padding:0; margin: var(--space-4) 0 0; display:flex; flex-wrap:wrap; gap: var(--space-3); }
.contact-links a { background: var(--bg-alt); padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); border:1px solid var(--border); }
.contact-links a:hover { background: var(--accent-soft); }

/* Footer */
.site-footer { padding: var(--space-5) 0; border-top:1px solid var(--border); background: var(--bg-alt); margin-top: var(--space-8); }
.footer__inner { display:flex; align-items:center; justify-content:space-between; }
.back-to-top { background: var(--accent); color:#fff; padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); }
.back-to-top:hover { background: var(--accent-hover); }

/* Utilities */
.dark .hero { background: linear-gradient(135deg, var(--bg-alt), rgba(59,130,246,0.25)); }
:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
[hidden] { display:none !important; }


/* Skip Link */
.skip-link { position:absolute; left:-999px; top:0; background: var(--accent); color:#fff; padding: var(--space-2) var(--space-3); z-index:100; }
.skip-link:focus { left: var(--space-4); }

/* Reduce motion for sensitive users */
@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
}