/* Fælles tema for alle sider. Kun variabler, resets og keyframes. */
body { margin: 0; background: #f1f4fb; }
a { color: inherit; text-decoration: none; }
a:hover { opacity: .85; }
button { font-family: inherit; }

.site-shell { width:100%; min-width:0; }
.site-nav-frame,
.home-terminal-wrap,
.project-filter-wrap,
.project-grid,
.project-status-wrap,
.about-page-grid,
.about-contact-wrap,
.case-page { width:100%; max-width:1240px; margin-left:auto; margin-right:auto; box-sizing:border-box; }

[data-t="light"] {
  --bg:#f1f4fb; --panel:#ffffff; --ink:#0a1020; --dim:#495276; --line:#dae1f2;
  --acc:#1d4ed8; --acc2:#c2410c; --hot:#ff7a1a; --chip:#ffe6d2; --chipink:#7c2d12;
  --term:#0a1020; --slot:#e4eaf8;
}
[data-t="dark"] {
  --bg:#060913; --panel:#0c1122; --ink:#eaeef8; --dim:#96a0bf; --line:#1a2139;
  --acc:#7aa2ff; --acc2:#ff8a3d; --hot:#ff8a3d; --chip:#2a1a10; --chipink:#ffc79b;
  --term:#070c18; --slot:#121a30;
}

[data-chip][data-on="true"] { background: var(--ink); color: var(--bg); border-color: var(--ink); }
[data-chip][data-on="false"] { background: var(--panel); color: var(--dim); border-color: var(--line); }

.project-grid { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:18px !important; align-items:start; }
.project-grid.is-masonry-ready { display:block !important; position:relative; }
.project-grid.is-masonry-ready .project-tile { position:absolute; opacity:0; transform:translateY(8px); }
.project-grid.is-masonry-ready .project-tile[data-masonry-ready="1"] { opacity:1; transform:none; transition:opacity .22s ease,transform .22s ease; }
.project-tile { width:100%; min-width:0; height:auto; margin:0; align-self:start; }
.project-tile > * { height:auto; }
.home-project-card > * { height:100%; }
.project-grid .project-card { border-radius:12px !important; transition:transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .28s ease, border-color .28s ease; }
.project-grid .project-card:hover { opacity:1; transform:translateY(-4px); border-color:color-mix(in srgb,var(--acc) 42%,var(--line)); }
.project-grid .project-card { display:flex !important; height:auto !important; }
.project-grid .project-card-media { min-width:0; min-height:0; overflow:hidden; }
.project-grid .project-card-image { height:var(--masonry-media,260px) !important; min-height:0; }
.project-grid .project-card-body { position:relative; overflow:hidden; padding:22px 24px 22px !important; }
.project-grid .project-card-body::before { content:''; position:absolute; inset:auto -70px -110px auto; width:210px; height:210px; border-radius:50%; background:radial-gradient(circle,var(--hot) 0,transparent 68%); opacity:.11; pointer-events:none; }
.project-grid .project-card-title { position:relative; z-index:1; font-size:clamp(27px,3vw,38px) !important; line-height:1; letter-spacing:-.045em !important; max-width:15ch; margin-bottom:14px !important; text-wrap:balance; }
.project-grid .project-card-copy { position:relative; z-index:1; }
.project-grid .project-card-footer { margin-top:18px !important; padding-top:0 !important; }
.project-tile:nth-child(3n+1) { --masonry-media:320px; }
.project-tile:nth-child(3n+2) { --masonry-media:245px; }
.project-tile:nth-child(3n) { --masonry-media:280px; }
.project-tile:nth-child(even) .project-card-body { background:linear-gradient(145deg,color-mix(in srgb,var(--hot) 8%,var(--panel)),var(--panel) 76%); }
.project-card-copy { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.project-card-tags { mask-image:none !important; -webkit-mask-image:none !important; }
.ai-image-badge,
.original-image-badge { position:absolute; right:14px; top:14px; z-index:5; display:inline-flex; align-items:center; gap:7px; padding:7px 10px; border-radius:8px; background:rgba(8,10,15,.58); color:#fff; box-shadow:0 5px 18px rgba(0,0,0,.14); font:700 11px/1 'Share Tech Mono', monospace; letter-spacing:.12em; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); pointer-events:auto; cursor:default; transition:background-color .18s ease, box-shadow .18s ease; }
.ai-image-badge:hover { background:rgba(8,10,15,.98); box-shadow:0 7px 22px rgba(0,0,0,.24); }
.ai-image-badge-large { right:18px; top:18px; padding:9px 12px; font-size:12px; }
.ai-image-badge-small { right:8px; top:8px; padding:6px 8px; font-size:10px; border-radius:6px; }
.ai-image-mark { position:relative; display:inline-block; width:1.32em; height:1em; overflow:hidden; color:inherit; font:700 1em/1 'Space Grotesk',system-ui,sans-serif; letter-spacing:0; white-space:nowrap; -webkit-text-fill-color:transparent; user-select:text; }
.ai-image-mark::before { content:''; position:absolute; inset:0; background:currentColor; -webkit-mask:url('/ai-mark.svg') center/contain no-repeat; mask:url('/ai-mark.svg') center/contain no-repeat; pointer-events:none; }
.original-image-badge { background:rgba(255,255,255,.92); color:#0a1020; }
.carousel-confetti { position:absolute; right:56px; top:2px; width:1px; height:1px; pointer-events:none; z-index:4; }
.carousel-confetti span { position:absolute; left:0; top:0; width:7px; height:11px; border-radius:2px; opacity:0; }
.carousel-confetti.is-active span { animation:confettiBurst .9s cubic-bezier(.18,.72,.24,1) var(--d) forwards; }
.case-gallery-process image-slot { height:auto !important; aspect-ratio:25 / 17; }

@keyframes pulse { 0%,100% { opacity:.3 } 50% { opacity:1 } }
@keyframes blink { 0%,49% { opacity:1 } 50%,100% { opacity:0 } }
@keyframes drift { 0% { transform: translate3d(0,0,0) scale(1) } 50% { transform: translate3d(70px,-40px,0) scale(1.2) } 100% { transform: translate3d(0,0,0) scale(1) } }
@keyframes marquee { from { transform: translateX(0) } to { transform: translateX(-50%) } }
@keyframes sweep { 0% { background-position: 0% 50% } 100% { background-position: 200% 50% } }
@keyframes float1 { 0%,100% { transform: translate3d(0,0,0) rotate(0deg) } 50% { transform: translate3d(0,-22px,0) rotate(14deg) } }
@keyframes float2 { 0%,100% { transform: translate3d(0,0,0) rotate(0deg) } 50% { transform: translate3d(14px,16px,0) rotate(-18deg) } }
@keyframes flicker { 0%,100% { opacity:.96 } 92% { opacity:.96 } 94% { opacity:.7 } 96% { opacity:1 } }
@keyframes glitchshift { 0% { transform: translate3d(0,0,0) } 18% { transform: translate3d(-7px,2px,0) } 34% { transform: translate3d(5px,-3px,0) } 52% { transform: translate3d(-3px,1px,0) } 70% { transform: translate3d(4px,2px,0) } 100% { transform: translate3d(0,0,0) } }
@keyframes glitchbars { 0% { opacity:0 } 10% { opacity:.9 } 26% { opacity:.25 } 44% { opacity:.8 } 62% { opacity:.15 } 80% { opacity:.6 } 100% { opacity:0 } }
@keyframes confettiBurst { 0% { opacity:0; transform:translate(0,0) rotate(0deg) scale(.7) } 12% { opacity:1 } 100% { opacity:0; transform:translate(var(--tx),var(--ty)) rotate(var(--r)) scale(1) } }
.hero-field-accent {
  --hero-start:#1748c7;
  --hero-mid:#3478f6;
  --hero-end:#6256d8;
  position:relative;
  display:inline-block;
  padding-bottom:.12em;
  margin-bottom:-.12em;
  color:var(--hero-start) !important;
  background-image:radial-gradient(ellipse at 38% 28%,rgba(255,255,255,.52) 0%,rgba(255,255,255,.12) 18%,transparent 34%),linear-gradient(112deg,var(--hero-start) 0%,var(--hero-mid) 48%,var(--hero-end) 100%);
  background-size:100% 100%,100% 100%;
  background-repeat:no-repeat;
  background-position:center;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  -webkit-text-stroke:.3px rgba(15,45,135,.22);
  filter:drop-shadow(0 3px 0 rgba(29,78,216,.12)) drop-shadow(0 7px 12px rgba(42,91,216,.16));
}
[data-t="dark"] .hero-field-accent { --hero-start:#6f99ff; --hero-mid:#91b0ff; --hero-end:#aa83ef; -webkit-text-stroke:.3px rgba(255,255,255,.18); filter:drop-shadow(0 4px 10px rgba(74,118,255,.24)); }
@media (prefers-reduced-motion: reduce) {
  .carousel-confetti { display:none; }
  .hero-agent-chip,
  .home-terminal-log,
  .site-nav-brand span { animation:none !important; }
  .project-grid.is-masonry-ready .project-tile[data-masonry-ready="1"] { transition:none; }
}

@media (max-width: 960px) {
  .hero-field-grid { grid-template-columns:1fr !important; padding:96px 40px 56px !important; gap:36px !important; }
  .hero-field-title { font-size:clamp(56px,9vw,72px) !important; max-width:100% !important; }
  .hero-field-actions { flex-wrap:nowrap !important; }
  .hero-field-actions a { white-space:nowrap; }
  .hero-field-portrait { height:min(62vw,500px) !important; margin:0 24px; }
}

@media (max-width: 900px) {
  .project-grid { display:grid !important; grid-template-columns:1fr !important; gap:18px !important; height:auto !important; }
  .project-grid.is-masonry-ready .project-tile { position:static !important; width:auto !important; left:auto !important; top:auto !important; }
}

@media (max-width: 760px) {
  .site-nav { padding:12px 14px !important; gap:12px !important; box-sizing:border-box; border-radius:22px !important; flex-wrap:wrap; }
  .site-nav-brand { gap:7px !important; font-size:14px !important; }
  .site-nav-menu-toggle { display:flex !important; }
  .site-nav-links { display:none !important; order:3; flex:0 0 100%; width:100%; box-sizing:border-box; flex-direction:column; align-items:stretch !important; gap:2px !important; font-size:14px !important; padding:10px 4px 4px; border-top:1px solid var(--line); }
  .site-nav-links.is-open { display:flex !important; }
  .site-nav-links > a { padding:11px 10px; border-radius:12px; }
  .site-nav-links > a:hover { background:var(--bg); opacity:1; }
  .site-nav-theme { margin:8px 10px 5px; }
  .site-nav-linkedin { display:block !important; }
  .hero-field-grid { grid-template-columns:1fr !important; padding:96px 22px 42px !important; gap:30px !important; }
  .hero-field-title { font-size:clamp(42px,12vw,54px) !important; max-width:100% !important; }
  .hero-field-actions { flex-wrap:wrap !important; }
  .hero-field-actions a { padding:14px 20px !important; }
  .hero-field-portrait { height:360px !important; margin:0 16px; }
  .hero-agent-chip { font-size:9px !important; padding:7px 10px !important; }
  .home-terminal-wrap { padding:34px 18px !important; }
  .home-terminal { padding:24px 18px !important; border-radius:20px !important; }
  .home-terminal-head { align-items:flex-start !important; flex-direction:column !important; gap:12px !important; }
  .home-terminal-head > div:last-child { flex-wrap:wrap !important; }
  .home-terminal-grid { grid-template-columns:1fr !important; }
  .home-terminal-status { display:none !important; }
  .home-terminal-stats { gap:12px !important; }
  .home-project-stage { height:auto !important; padding-top:28px !important; }
  .home-project-sticky { position:static !important; top:auto !important; gap:12px !important; overflow:visible !important; }
  .home-project-head { padding-left:18px !important; padding-right:18px !important; }
  .home-project-head h2 { font-size:34px !important; }
  .home-project-window { overflow-x:auto !important; overflow-y:hidden !important; padding:6px 18px 10px !important; scroll-snap-type:x mandatory; scroll-padding-left:18px; -webkit-overflow-scrolling:touch; overscroll-behavior-inline:contain; touch-action:pan-x pan-y pinch-zoom; scrollbar-width:none; }
  .home-project-window::-webkit-scrollbar { display:none; }
  .home-project-track { gap:14px !important; transform:none !important; }
  .home-project-card { flex-basis:calc(100vw - 52px) !important; height:460px !important; scroll-snap-align:start; }
  .home-project-track > div:last-child { flex-basis:calc(100vw - 52px) !important; height:460px !important; scroll-snap-align:start; }
  .home-project-progress { padding-left:18px !important; padding-right:18px !important; }
  .home-project-scroll-label { font-size:0 !important; }
  .home-project-scroll-label::after { content:'swipe'; font-size:12px; }
  .home-about-card { width:auto !important; margin:12px 18px 22px !important; grid-template-columns:110px minmax(0,1fr) !important; gap:16px !important; padding:16px !important; }
  .home-about-image { width:110px !important; height:132px !important; }
  .home-about-copy p { font-size:16px !important; line-height:1.45 !important; }
  .home-about-copy > div:last-child { gap:6px !important; }
  .home-about-copy > div:last-child span,
  .home-about-copy > div:last-child a { font-size:11px !important; padding:6px 9px !important; }
  .project-grid { display:grid !important; grid-template-columns:1fr !important; gap:14px !important; padding-left:18px !important; padding-right:18px !important; height:auto !important; }
  .project-grid.is-masonry-ready .project-tile { position:static !important; width:auto !important; left:auto !important; top:auto !important; }
  .project-tile { height:auto !important; margin-bottom:14px !important; }
  .project-grid .project-tile .project-card { display:flex !important; height:auto !important; }
  .project-grid .project-tile .project-card-media { order:0 !important; width:100% !important; height:auto !important; }
  .project-tile .project-card-body { order:1 !important; }
  .project-grid .project-card-image { height:var(--masonry-media,240px) !important; }
  .project-tile:nth-child(3n+1) { --masonry-media:265px; }
  .project-tile:nth-child(3n+2) { --masonry-media:215px; }
  .project-tile:nth-child(3n) { --masonry-media:240px; }
  .project-card-body { padding:19px 20px 20px !important; }
  .project-card-title { font-size:21px !important; margin-bottom:8px !important; }
  .project-card-copy { line-height:1.5 !important; }
  .project-card-footer { padding-top:14px !important; gap:10px !important; }
  .project-card-button { padding:9px 13px !important; }
  .project-grid .project-card-title { font-size:25px !important; line-height:1 !important; max-width:15ch; }
  .case-header { padding-left:22px !important; padding-right:22px !important; }
  .case-page { overflow-x:clip; }
  .case-title { max-width:100% !important; font-size:40px !important; overflow-wrap:anywhere; }
  .case-placeholder { margin-left:18px !important; margin-right:18px !important; }
  .case-placeholder-grid { grid-template-columns:1fr !important; gap:30px !important; padding:30px 24px !important; }
  .case-hero-figure { padding-left:18px !important; padding-right:18px !important; }
  .case-content-grid { grid-template-columns:1fr !important; gap:28px !important; padding-left:22px !important; padding-right:22px !important; }
  .case-content-grid aside { position:static !important; }
  .case-gallery { padding-left:18px !important; padding-right:18px !important; }
  .case-gallery-grid { grid-template-columns:1fr !important; }
  .case-gallery-item { grid-column:1 !important; }
  .case-gallery-item image-slot { height:480px !important; touch-action:auto !important; }
  .case-hero-figure image-slot { touch-action:auto !important; }
  .about-page-grid { grid-template-columns:minmax(0,1fr) !important; gap:28px !important; padding:38px 22px 16px !important; }
  .about-page-grid > * { min-width:0 !important; max-width:100% !important; }
  .about-page-grid > image-slot { width:100% !important; height:420px !important; }
  .about-skills-grid { grid-template-columns:1fr !important; }
  .about-contact-wrap { padding:36px 18px 44px !important; }
  .about-contact-card { grid-template-columns:1fr !important; gap:30px !important; padding:28px 22px !important; }
  .case-next { margin:24px 18px 40px !important; padding:24px !important; }
  .case-next-inner { align-items:flex-start !important; }
  .case-next-arrow { width:44px !important; height:44px !important; }
  .cta-banner-inner { padding:32px 22px !important; align-items:flex-start !important; flex-direction:column !important; }
  .site-footer-inner { padding:26px 22px !important; align-items:flex-start !important; flex-direction:column !important; }
  .site-footer-links { flex-wrap:wrap !important; gap:12px 18px !important; }
}

@media (max-width: 480px) {
  .home-terminal-stats { grid-template-columns:1fr 1fr !important; }
  .home-terminal-stats > div:last-child { display:none !important; }
  .home-about-card { grid-template-columns:88px minmax(0,1fr) !important; }
  .home-about-image { width:88px !important; height:118px !important; }
}