:root{
  color-scheme:light;
  --ink:#3a3733;
  --ink-soft:rgba(58,55,51,0.72);
  --ink-faint:rgba(58,55,51,0.5);
  --cream:#ece9e2;
  --hair:rgba(58,55,51,0.16);
  --accent:#d98a5c;
  --accent-soft:#f1ddcc;
  --silver:linear-gradient(100deg,#8b8e94 0%,#c9ccd2 14%,#f4f5f8 26%,#b4b7bf 42%,#eceef2 55%,#9a9da4 70%,#dfe1e6 84%,#a9acb3 100%);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:'Hanken Grotesk',ui-sans-serif,system-ui,sans-serif;font-weight:400;-webkit-font-smoothing:antialiased;overflow-x:clip}
#marble{position:fixed;inset:0;width:100vw;height:100vh;z-index:0;visibility:hidden}
#grain{position:fixed;inset:0;width:100vw;height:100vh;z-index:3;pointer-events:none;mix-blend-mode:soft-light;opacity:.6}
#veil{position:fixed;inset:0;z-index:2;pointer-events:none;background:radial-gradient(120% 90% at 50% 12%,rgba(236,233,226,0) 40%,rgba(236,233,226,.35) 100%),linear-gradient(180deg,rgba(236,233,226,.28) 0%,rgba(236,233,226,0) 22%,rgba(236,233,226,0) 78%,rgba(236,233,226,.3) 100%)}
main{position:relative;z-index:5}
.wrap{width:min(1120px,90vw);margin:0 auto}
.display{font-family:'Schibsted Grotesk',ui-sans-serif,sans-serif;line-height:1.0;letter-spacing:-.02em;margin:0}
.eyebrow{font-family:'Hanken Grotesk',sans-serif;font-weight:700;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin:0 0 1.4rem}
p.lede{font-family:'Hanken Grotesk',sans-serif;font-weight:500;font-size:clamp(1.15rem,2.1vw,1.55rem);line-height:1.6;color:var(--ink-soft);max-width:34ch;margin:0}
p.body{font-size:1rem;line-height:1.72;color:var(--ink-soft);max-width:46ch;font-weight:400}
.num{font-family:'Hanken Grotesk',sans-serif;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-faint);font-weight:700}
.silver{color:var(--ink)}
@keyframes sheen{0%{background-position:12% 50%}50%{background-position:188% 50%}100%{background-position:12% 50%}}
.rule{height:1px;border:0;margin:0;width:100%;background:var(--hair);opacity:1;border-radius:1px}
@keyframes sheenBar{0%{background-position:0% 50%}100%{background-position:200% 50%}}
.reveal{clip-path:inset(0 100% -0.15em 0);-webkit-clip-path:inset(0 100% -0.15em 0);transition:clip-path 1.35s cubic-bezier(.22,1,.36,1),-webkit-clip-path 1.35s cubic-bezier(.22,1,.36,1);will-change:clip-path}
.reveal.in{clip-path:inset(0 0 -0.15em 0);-webkit-clip-path:inset(0 0 -0.15em 0)}
a.link{position:relative;color:var(--ink);text-decoration:none;font-weight:500;padding-bottom:2px}
a.link::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.22,1,.36,1)}
a.link:hover::after,a.link:focus-visible::after{transform:scaleX(1)}
a.link::before{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;background:var(--accent);opacity:.28}
.card{background:rgba(240,238,231,0.9);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--hair);border-radius:26px}
.chip{font-family:'Hanken Grotesk',sans-serif;font-weight:600;font-size:.82rem;letter-spacing:.01em;color:var(--ink-soft);background:rgba(240,238,231,0.6);border:1px solid var(--hair);border-radius:20px 12px 20px 12px;padding:.55rem 1.05rem}
.place{font-family:'Schibsted Grotesk',sans-serif;font-weight:600;font-size:clamp(.95rem,2.1vw,1.32rem);letter-spacing:-.01em;color:var(--ink);background:var(--accent-soft);border-radius:64% 36% 58% 42% / 58% 62% 38% 42%;padding:.5rem 1.15rem;line-height:1}
.places .place:nth-of-type(1){border-radius:70% 30% 62% 38% / 66% 58% 42% 34%;transform:rotate(-1.4deg)}
.places .place:nth-of-type(3){border-radius:34% 66% 40% 60% / 40% 34% 66% 60%;transform:rotate(1deg)}
.places .place:nth-of-type(5){border-radius:58% 42% 34% 66% / 62% 46% 54% 38%;transform:rotate(-.8deg)}
.arrow{font-family:'Schibsted Grotesk',sans-serif;font-weight:600;font-size:clamp(1.1rem,2.4vw,1.5rem);color:var(--accent)}
.orb{width:clamp(230px,27vw,330px);height:clamp(230px,27vw,330px);animation:float 22s ease-in-out infinite}
.orb-ring{width:100%;height:100%;border-radius:58% 42% 47% 53% / 52% 55% 45% 48%;padding:9px;background:var(--silver);background-size:280% 100%;background-position:0% 50%;box-shadow:0 30px 70px -22px rgba(58,55,51,.45),inset 0 1px 3px rgba(255,255,255,.6);animation:sheenBar 24s cubic-bezier(.37,.02,.63,.98) infinite, morph 20s ease-in-out infinite}
.orb-inner{position:relative;width:100%;height:100%;border-radius:58% 42% 47% 53% / 52% 55% 45% 48%;overflow:hidden;background:var(--cream);animation:morph 20s ease-in-out infinite}
@keyframes float{0%{transform:translate(0,0)}25%{transform:translate(10px,-14px)}50%{transform:translate(-8px,-4px)}75%{transform:translate(6px,10px)}100%{transform:translate(0,0)}}
@keyframes morph{0%,100%{border-radius:58% 42% 47% 53% / 52% 55% 45% 48%}33%{border-radius:46% 54% 62% 38% / 50% 46% 54% 50%}66%{border-radius:54% 46% 40% 60% / 58% 52% 48% 42%}}
.blob-a{border-radius:34px 20px 40px 26px}
.blob-b{border-radius:22px 40px 24px 36px}
.blob-c{border-radius:40px 26px 34px 20px}
.blob-d{border-radius:24px 36px 40px 22px}
.shot{position:relative;overflow:hidden;border:1px solid var(--hair);background:rgba(236,233,226,.4);transition:transform .6s cubic-bezier(.22,1,.36,1)}
.shot-a{border-radius:34px 26px 40px 30px;transform:rotate(-.9deg)}
.shot-b{border-radius:28px 38px 26px 36px;transform:rotate(.7deg)}
.shot-c{border-radius:30px 34px 30px 40px;transform:rotate(-.5deg)}
.shot:hover{transform:rotate(0) scale(1.012)}
#work .body{font-size:.92rem;line-height:1.62;max-width:44ch}
#work .eyebrow{font-size:.68rem;margin-bottom:.7rem!important}
.proj .card{display:grid;grid-template-columns:150px 1fr;gap:clamp(1rem,2vw,1.5rem);align-items:center;padding:clamp(1.2rem,2.5vw,1.7rem);background:rgba(240,238,231,0.5);border-color:rgba(58,55,51,0.1);box-shadow:0 14px 32px -26px rgba(58,55,51,.38);height:100%}
@media (max-width:820px){.hero-grid{grid-template-columns:1fr!important}.work-grid{grid-template-columns:1fr!important}.slots-grid{grid-template-columns:1fr!important}.orb{margin:0 auto 2.5rem}.proj .card{grid-template-columns:1fr;text-align:center;justify-items:center}.proj .body{margin-left:auto;margin-right:auto}}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  #grain{display:none}
  .silver,.rule,a.link::after,.orb,.orb-ring,.orb-inner{animation:none!important}
  .shot{transition:none!important}
  .reveal{clip-path:none!important;-webkit-clip-path:none!important;transition:none!important}
}
.slot{position:absolute;inset:0;width:100%;height:100%;display:grid;place-items:center;padding:1.2rem;text-align:center;background:rgba(236,233,226,.5);color:var(--ink-faint);font-family:'Hanken Grotesk',sans-serif;font-size:.8rem;letter-spacing:.02em}
.orb-inner .slot{border-radius:inherit}
.socials{display:flex;gap:.7rem;align-items:center}
.social{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;color:var(--ink-soft);background:rgba(240,238,231,0.6);border:1px solid var(--hair);transition:color .35s ease,border-color .35s ease,transform .35s cubic-bezier(.22,1,.36,1),background .35s ease}
.social svg{width:19px;height:19px;display:block;fill:currentColor}
.social:hover,.social:focus-visible{color:var(--accent);border-color:var(--accent);background:var(--accent-soft);transform:translateY(-2px)}

/* ---- Blog index + article pages ---- */
.backlink{display:inline-flex;align-items:center;gap:.5rem;font-family:'Hanken Grotesk',sans-serif;font-weight:600;font-size:.82rem;letter-spacing:.02em;color:var(--ink-soft);text-decoration:none;transition:color .35s ease,transform .35s cubic-bezier(.22,1,.36,1)}
.backlink:hover,.backlink:focus-visible{color:var(--accent);transform:translateX(-3px)}
.post-meta{font-family:'Hanken Grotesk',sans-serif;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-faint);font-weight:700}

/* Post list (blog.html) */
.post-list{list-style:none;margin:0;padding:0}
.post-list li{margin:0}
.post-link{display:block;text-decoration:none;color:inherit;padding:1.8rem 0;border-top:1px solid var(--hair)}
.post-list li:last-child .post-link{border-bottom:1px solid var(--hair)}
.post-link .post-title{font-family:'Schibsted Grotesk',sans-serif;font-weight:600;font-size:clamp(1.35rem,3vw,2rem);letter-spacing:-.02em;line-height:1.12;color:var(--ink);margin:.5rem 0 .7rem;transition:color .35s ease}
.post-link:hover .post-title,.post-link:focus-visible .post-title{color:var(--accent)}
.post-link .post-excerpt{font-size:.98rem;line-height:1.6;color:var(--ink-soft);max-width:60ch;margin:0}
.post-link .more{display:inline-block;margin-top:.9rem;font-weight:600;color:var(--accent)}

/* Article body (post pages) */
.article{max-width:64ch;margin:0 auto}
.article h1{font-family:'Schibsted Grotesk',sans-serif;font-weight:600;font-size:clamp(2rem,5vw,3.1rem);letter-spacing:-.025em;line-height:1.06;margin:1.2rem 0 1.4rem;color:var(--ink)}
.prose p{font-size:clamp(1.05rem,1.4vw,1.18rem);line-height:1.78;color:var(--ink-soft);margin:0 0 1.5rem}
.prose p:first-of-type{color:var(--ink);font-weight:500}
.prose p .em{font-style:italic}
.article-foot{max-width:64ch;margin:0 auto}

/* Homepage blog teaser card */
.blog-teaser{display:block;text-decoration:none;color:inherit;padding:clamp(1.05rem,2.4vw,1.4rem);background:rgba(240,238,231,0.5);border-color:rgba(58,55,51,0.1);box-shadow:0 12px 30px -24px rgba(58,55,51,.35);transition:transform .5s cubic-bezier(.22,1,.36,1),box-shadow .5s ease,background .4s ease}
.blog-teaser:hover,.blog-teaser:focus-visible{transform:translateY(-3px);background:rgba(240,238,231,0.62);box-shadow:0 18px 36px -26px rgba(58,55,51,.4)}
.blog-teaser .post-title{font-family:'Schibsted Grotesk',sans-serif;font-weight:600;font-size:clamp(1.15rem,2.2vw,1.5rem);letter-spacing:-.02em;line-height:1.15;color:var(--ink);margin:.4rem 0 .55rem;transition:color .35s ease}
.blog-teaser:hover .post-title,.blog-teaser:focus-visible .post-title{color:var(--accent)}
.blog-teaser .post-excerpt{font-size:.92rem;line-height:1.6;color:var(--ink-soft);max-width:52ch;margin:0}

/* Hobbies & interests bubbles */
.hobbies-grid{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(1.4rem,3vw,2.6rem)}
.hobby{flex:0 0 auto;width:clamp(118px,15vw,158px);display:flex;flex-direction:column;align-items:center;text-align:center;gap:.9rem}
.hobby-img{width:100%;aspect-ratio:1;padding:5px;background:var(--silver);background-size:200% 100%;background-position:28% 50%;border-radius:58% 42% 47% 53% / 52% 55% 45% 48%;box-shadow:0 18px 40px -26px rgba(58,55,51,.5),inset 0 1px 2px rgba(255,255,255,.55);transition:transform .5s cubic-bezier(.22,1,.36,1)}
.hobby-inner{width:100%;height:100%;border-radius:inherit;overflow:hidden}
.hobby-inner img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.24);filter:saturate(.62) contrast(.96) brightness(1.02)}
.hobby:nth-child(1) .hobby-img{border-radius:70% 30% 62% 38% / 66% 58% 42% 34%}
.hobby:nth-child(2) .hobby-img{border-radius:42% 58% 46% 54% / 56% 44% 56% 44%}
.hobby:nth-child(3) .hobby-img{border-radius:34% 66% 40% 60% / 40% 34% 66% 60%}
.hobby:nth-child(4) .hobby-img{border-radius:58% 42% 34% 66% / 62% 46% 54% 38%}
.hobby:nth-child(5) .hobby-img{border-radius:48% 52% 58% 42% / 46% 60% 40% 54%}
.hobby:hover .hobby-img{transform:translateY(-4px) rotate(-2deg)}
.hobby-label{font-family:'Hanken Grotesk',sans-serif;font-weight:600;font-size:.88rem;line-height:1.3;color:var(--ink-soft);max-width:15ch}
@media (max-width:520px){.hobbies-grid{gap:1.6rem 1.2rem}.hobby{width:calc(50% - 1rem)}}

/* Quiet "elsewhere" links */
.elsewhere-title{font-family:'Hanken Grotesk',sans-serif;font-size:.82rem;letter-spacing:.02em;color:var(--ink-faint);font-weight:600;margin:0 0 1.3rem}
.ext-list{list-style:none;margin:0;padding:0;display:grid;gap:.7rem;max-width:640px}
.ext-list a{text-decoration:none;color:var(--ink-soft);font-size:.94rem;line-height:1.5;transition:color .3s ease}
.ext-list a:hover,.ext-list a:focus-visible{color:var(--accent)}
.ext-list .ctx{color:var(--ink-faint);font-size:.85rem}