@import url('https://fonts.googleapis.com/css2?family=Archivo:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400&display=swap');

/* ---- Design tokens (from Ruus Consulting design system) ---- */
:root{
  --purple-900:#382454;--purple-700:#4d3574;--purple-500:#7A6A9E;--purple-100:#EDECF4;--purple-50:#F7F6FA;
  --gold-500:#D9A93A;--gold-600:#B98C22;--gold-100:#F7EBCE;
  --ink-900:#191511;--ink-700:#46423D;--ink-500:#79746C;--ink-300:#B5B0A7;
  --cream-000:#FAF8F5;--cream-100:#F2EEE8;
  --slate-300:#CBD1D6;--slate-500:#B5BCC4;
  --success-500:#3F7A5C;--danger-500:#B4433A;

  --color-bg-page:var(--cream-000);--color-bg-surface:#FFFFFF;--color-bg-sunken:var(--cream-100);
  --color-bg-brand:var(--purple-900);--color-bg-brand-soft:var(--purple-100);
  --color-bg-accent:var(--gold-500);--color-bg-accent-soft:var(--gold-100);
  --color-text-primary:var(--ink-900);--color-text-secondary:var(--ink-700);--color-text-muted:var(--ink-500);
  --color-text-on-brand:var(--cream-000);--color-text-on-accent:var(--ink-900);
  --color-text-link:var(--purple-900);--color-text-link-hover:var(--purple-700);
  --color-border:var(--slate-300);--color-border-soft:var(--purple-100);
  --color-brand-primary:var(--purple-900);--color-brand-secondary:var(--purple-500);--color-brand-accent:var(--gold-500);

  --font-display:'Archivo',sans-serif;--font-body:'Archivo',sans-serif;
  --fs-display-xl:clamp(28px,6vw + 10px,64px);--fs-display-lg:clamp(24px,5vw + 9px,44px);--fs-display-md:clamp(20px,4vw + 8px,32px);--fs-display-sm:clamp(18px,2.5vw + 8px,24px);--fs-display-xs:clamp(16px,2vw + 8px,20px);
  --fs-body-lg:clamp(16px,0.6vw + 14px,19px);--fs-body-md:16px;--fs-body-sm:14px;--fs-label:11px;
  --lh-tight:1.05;--lh-snug:1.2;--lh-normal:1.45;--lh-relaxed:1.6;
  --ls-tight:-0.01em;--ls-normal:0;--ls-wide:0.06em;--ls-widest:0.18em;
  --fw-regular:400;--fw-medium:500;--fw-semibold:600;--fw-bold:700;--fw-black:800;

  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;--space-9:96px;
  --radius-sm:4px;--radius-md:8px;--radius-lg:14px;--radius-pill:999px;
  --shadow-sm:0 1px 2px rgba(25,21,17,0.06),0 1px 1px rgba(25,21,17,0.04);
  --shadow-md:0 4px 12px rgba(56,36,84,0.08),0 2px 4px rgba(25,21,17,0.05);
  --shadow-lg:0 12px 32px rgba(56,36,84,0.14),0 4px 8px rgba(25,21,17,0.06);
  --border-hairline:1px solid var(--color-border);
  --ease-standard:cubic-bezier(.4,0,.2,1);--duration-fast:120ms;--duration-base:180ms;
}

/* ---- Base ---- */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--color-bg-page);
  color:var(--color-text-primary);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:var(--color-text-link);text-decoration:none;}
a:hover{color:var(--color-text-link-hover);}
h1,h2,h3,p{margin:0;}

.wrap{max-width:1120px;margin:0 auto;padding:0 var(--space-6);}
.wrap-narrow{max-width:900px;}

/* ---- Header / nav ---- */
.site-header{background:var(--color-bg-brand);position:sticky;top:0;z-index:20;}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;padding-top:var(--space-4);padding-bottom:var(--space-4);gap:var(--space-6);}
.site-header img{height:34px;}
.nav-link{color:var(--color-text-on-brand);opacity:0.85;font-size:var(--fs-body-md);font-weight:var(--fw-medium);}
.nav-link:hover{opacity:1;color:var(--color-text-on-brand);}
.primary-nav{display:flex;align-items:center;gap:var(--space-6);}
.cta-nowrap .btn{white-space:nowrap;}

.nav-toggle{display:none;background:none;border:0;padding:8px;cursor:pointer;flex-shrink:0;}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--color-text-on-brand);margin:5px 0;transition:transform .15s ease,opacity .15s ease;}

/* ---- Buttons ---- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--font-body);font-weight:var(--fw-semibold);letter-spacing:var(--ls-normal);
  border-radius:var(--radius-md);cursor:pointer;border:1px solid transparent;
  transition:filter var(--duration-fast) var(--ease-standard);
  padding:12px 22px;font-size:var(--fs-body-md);
  text-decoration:none;
}
.btn:hover{filter:brightness(0.92);}
.btn-sm{padding:8px 16px;font-size:var(--fs-body-sm);}
.btn-accent{background:var(--gold-500);color:var(--ink-900);border-color:var(--gold-500);}
.btn-accent:hover{color:var(--ink-900);}
.btn-primary{background:var(--purple-900);color:var(--cream-000);border-color:var(--purple-900);}
.btn-primary:hover{color:var(--cream-000);}
.btn-ghost{background:transparent;color:var(--purple-900);border-color:var(--color-border);}

/* ---- Section label ---- */
.section-label .kicker{font-size:var(--fs-body-lg);font-weight:var(--fw-bold);color:var(--purple-500);margin-bottom:var(--space-2);}
.section-label .title{font-family:var(--font-display);font-size:var(--fs-display-md);font-weight:var(--fw-bold);color:var(--color-text-primary);letter-spacing:var(--ls-tight);line-height:var(--lh-tight);}
.kicker-on-brand{font-size:var(--fs-body-lg);font-weight:var(--fw-bold);color:var(--gold-500);margin-bottom:var(--space-2);}

/* ---- Hero ---- */
.hero{background:var(--color-bg-brand);position:relative;overflow:hidden;padding:var(--space-8) var(--space-6) var(--space-7);}
.hero-inner{max-width:760px;position:relative;}
.hero h1{font-family:var(--font-display);font-size:var(--fs-display-lg);font-weight:var(--fw-bold);color:var(--color-text-on-brand);letter-spacing:var(--ls-tight);line-height:var(--lh-tight);}
.hero p{font-size:var(--fs-body-lg);line-height:var(--lh-relaxed);color:var(--color-bg-brand-soft);margin-top:var(--space-4);}

/* ---- Målgruppe cards ---- */
.audience-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5);margin-top:var(--space-6);}
.audience-card{padding:var(--space-5);background:var(--color-bg-sunken);border-left:3px solid var(--gold-500);border-radius:0 var(--radius-md) var(--radius-md) 0;}
.audience-card h3{font-family:var(--font-display);font-size:var(--fs-display-sm);font-weight:var(--fw-bold);color:var(--color-text-primary);}
.audience-card p{font-size:var(--fs-body-md);line-height:var(--lh-relaxed);color:var(--color-text-secondary);margin-top:var(--space-2);}

/* ---- Workshop list ---- */
.workshop-row{display:grid;grid-template-columns:4px 1fr;gap:var(--space-5);padding:var(--space-5) var(--space-6);border-top:var(--border-hairline);text-decoration:none;color:inherit;transition:background 0.15s ease;}
.workshop-row:hover{background:var(--color-bg-brand-soft);}
.workshop-row .bar{background:var(--purple-500);height:28px;align-self:start;margin-top:4px;transform:translateX(calc(-1 * var(--space-4)));}
.pill-outline{display:inline-block;font-size:var(--fs-label);font-weight:var(--fw-bold);letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--purple-500);padding:3px 9px;border:1px solid var(--purple-500);border-radius:var(--radius-pill);}
.pill-outline-gold{display:inline-block;font-size:var(--fs-body-sm);font-weight:var(--fw-bold);letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--gold-500);padding:4px 10px;border:1px solid var(--gold-500);border-radius:var(--radius-pill);white-space:nowrap;}
.pill-outline-brand{font-size:var(--fs-body-sm);font-weight:var(--fw-bold);letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--color-bg-brand-soft);padding:4px 10px;border:1px solid var(--purple-500);border-radius:var(--radius-pill);white-space:nowrap;}
.workshop-row h3{font-family:var(--font-display);font-size:var(--fs-display-sm);font-weight:var(--fw-bold);color:var(--color-text-primary);}
.workshop-row .subtitle{font-size:var(--fs-body-sm);font-weight:var(--fw-semibold);color:var(--color-brand-secondary);letter-spacing:var(--ls-wide);text-transform:uppercase;margin-top:var(--space-3);}
.workshop-row .desc{font-size:var(--fs-body-md);line-height:var(--lh-relaxed);color:var(--color-text-secondary);margin-top:var(--space-3);max-width:760px;}
.workshop-row .more{display:inline-block;font-size:var(--fs-body-sm);font-weight:var(--fw-semibold);color:var(--purple-500);margin-top:var(--space-3);}

/* ---- Om (about) ---- */
.about-flex{display:flex;gap:var(--space-8);align-items:center;}
.about-portrait{flex:0 0 220px;width:220px;height:220px;border-radius:50%;overflow:hidden;}
.about-portrait img{width:100%;height:100%;object-fit:cover;}
.about-body{flex:1;min-width:280px;}
.about-body h2{font-family:var(--font-display);font-size:var(--fs-display-md);color:var(--color-text-primary);font-weight:var(--fw-bold);margin-top:var(--space-3);}
.about-body .bio{font-size:var(--fs-body-md);line-height:var(--lh-relaxed);color:var(--color-text-secondary);max-width:60ch;margin-top:var(--space-4);}
.about-body .bio p{margin:0 0 var(--space-4);}
.about-body .bio p:last-child{margin-bottom:0;}

/* ---- Forms ---- */
.form-field{display:flex;flex-direction:column;gap:6px;min-width:0;}
.form-field span{font-size:var(--fs-body-sm);font-weight:var(--fw-semibold);color:var(--color-text-primary);}
.form-field input,.form-field select,.form-field textarea{
  width:100%;box-sizing:border-box;
  font-family:var(--font-body);font-size:16px;padding:12px 14px;
  border:var(--border-hairline);border-radius:var(--radius-sm);
  background:var(--color-bg-surface);color:var(--color-text-primary);
}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{outline:2px solid var(--purple-500);outline-offset:1px;}
.form-field.has-error input,.form-field.has-error select{border:1px solid var(--danger-500);}
.form-error{font-size:var(--fs-body-sm);color:var(--danger-500);display:none;}
.form-field.has-error .form-error{display:block;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);min-width:0;}
.form-row-split{display:grid;grid-template-columns:1fr auto;gap:var(--space-4);align-items:start;min-width:0;}
.form-row-split input[type="number"]{width:64px;text-align:center;}
.contact-form{display:flex;flex-direction:column;gap:var(--space-5);}
.form-status{font-size:var(--fs-body-sm);color:var(--success-500);margin-top:var(--space-3);display:none;}
.form-status.visible{display:block;}
.form-status.error{color:var(--danger-500);}

/* ---- Footer ---- */
.site-footer{background:var(--color-bg-brand);}
.site-footer .top{padding:var(--space-6);display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap;max-width:1120px;margin:0 auto;}
.site-footer .top img{height:22px;}
.site-footer .top span{font-size:var(--fs-body-sm);color:var(--color-bg-brand-soft);}
.site-footer .bottom{background:var(--color-bg-sunken);padding:var(--space-3) var(--space-6);}
.site-footer .bottom-inner{max-width:1120px;margin:0 auto;text-align:center;font-size:var(--fs-body-sm);color:var(--color-text-secondary);}
.site-footer.with-border{border-top:1px solid rgba(255,255,255,0.12);}

/* ---- Article / workshop detail shared ---- */
.detail-hero{background:var(--color-bg-brand);position:relative;overflow:hidden;padding:var(--space-8) var(--space-6) var(--space-8);}
.detail-hero h1{font-family:var(--font-display);font-size:var(--fs-display-xl);font-weight:var(--fw-bold);color:var(--color-text-on-brand);letter-spacing:var(--ls-tight);line-height:var(--lh-tight);}
.detail-hero .subtitle{font-size:var(--fs-body-lg);font-weight:var(--fw-semibold);color:var(--gold-500);margin-top:var(--space-3);}
.detail-tags{display:flex;gap:var(--space-3);flex-wrap:wrap;margin-bottom:var(--space-4);}

.body-copy p{font-size:var(--fs-body-md);line-height:var(--lh-relaxed);color:var(--color-text-secondary);margin:0 0 var(--space-5);max-width:90ch;}
.body-copy h2{font-family:var(--font-display);font-size:var(--fs-display-xs);font-weight:var(--fw-bold);color:var(--color-text-primary);letter-spacing:var(--ls-tight);margin:0 0 var(--space-4);}
.cite{color:var(--purple-500);font-weight:var(--fw-medium);}

.section-heading{font-size:var(--fs-body-lg);font-weight:var(--fw-bold);color:var(--purple-500);margin-bottom:var(--space-4);}

.takeaway-list{display:flex;flex-direction:column;gap:var(--space-3);}
.takeaway-item{display:flex;gap:var(--space-4);align-items:flex-start;padding:var(--space-3) var(--space-4);border-top:var(--border-hairline);}
.takeaway-check{width:16px;height:16px;border-radius:50%;background:var(--purple-100);color:var(--purple-500);font-size:var(--fs-label);font-weight:900;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px;}
.takeaway-item span:last-child{font-size:var(--fs-body-md);line-height:var(--lh-relaxed);color:var(--color-text-primary);}

.cta-band{padding:var(--space-8) var(--space-6);background:var(--color-bg-sunken);text-align:center;}
.cta-band h2{font-family:var(--font-display);font-weight:var(--fw-bold);color:var(--color-text-primary);margin:0 0 var(--space-3);}
.cta-band p{font-size:var(--fs-body-md);line-height:var(--lh-relaxed);color:var(--color-text-secondary);margin:0 0 var(--space-6);}

.sources-block{border-top:1px solid rgba(56,36,84,0.18);padding-top:var(--space-4);margin-top:var(--space-3);max-width:90ch;}
.sources-block .label{display:block;font-size:var(--fs-label);font-weight:var(--fw-bold);letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--color-text-muted);margin-bottom:var(--space-3);}
.sources-block p{font-size:var(--fs-body-sm);line-height:var(--lh-relaxed);color:var(--color-text-muted);margin:0;}

.context-note{display:flex;gap:var(--space-3);align-items:baseline;margin-top:var(--space-5);}
.context-note .label{flex:none;font-size:var(--fs-label);line-height:var(--lh-relaxed);font-weight:var(--fw-bold);letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--color-text-muted);}
.context-note p{font-size:var(--fs-body-sm);color:var(--color-text-muted);line-height:var(--lh-relaxed);margin:0;max-width:90ch;}

/* ---- Articles list ---- */
.article-intro{display:grid;grid-template-columns:140px 1fr;gap:var(--space-6);}
.article-intro .label{font-size:var(--fs-body-lg);line-height:var(--lh-relaxed);font-weight:var(--fw-bold);letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--purple-500);}
.article-intro p{font-size:var(--fs-body-lg);line-height:var(--lh-relaxed);color:var(--color-text-secondary);max-width:64ch;}
.article-categories{display:flex;gap:var(--space-5);flex-wrap:wrap;margin-top:var(--space-7);border-top:var(--border-hairline);border-bottom:var(--border-hairline);padding:var(--space-3) 0;}
.article-categories button{background:none;border:0;cursor:pointer;font-family:var(--font-body);font-size:var(--fs-body-sm);font-weight:var(--fw-medium);color:var(--color-text-secondary);border-bottom:2px solid transparent;padding-bottom:2px;}
.article-categories button.active{font-weight:var(--fw-bold);color:var(--color-text-primary);border-bottom-color:var(--gold-500);}

.featured-post{display:block;background:var(--color-bg-sunken);border-radius:var(--radius-lg);padding:var(--space-6);text-decoration:none;}
.featured-tag{display:inline-block;font-size:var(--fs-label);font-weight:var(--fw-bold);letter-spacing:var(--ls-widest);text-transform:uppercase;color:var(--cream-000);background:var(--purple-900);padding:3px 9px;border-radius:var(--radius-pill);}
.post-meta{display:flex;gap:var(--space-3);align-items:baseline;margin-top:var(--space-4);}
.post-meta .tag{font-size:var(--fs-body-sm);font-weight:var(--fw-bold);letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--purple-500);}
.post-meta .date{font-size:var(--fs-body-sm);color:var(--color-text-muted);}
.featured-post h2{font-family:var(--font-display);font-size:var(--fs-display-sm);font-weight:var(--fw-bold);color:var(--color-text-primary);line-height:var(--lh-snug);margin-top:var(--space-3);}
.featured-post p{font-size:var(--fs-body-md);line-height:var(--lh-relaxed);color:var(--color-text-secondary);margin-top:var(--space-3);max-width:90ch;}
.featured-post .read-more{display:inline-block;font-size:var(--fs-body-sm);font-weight:var(--fw-semibold);color:var(--color-brand-secondary);margin-top:var(--space-3);}

.post-row{display:block;padding:var(--space-5) 0;border-top:var(--border-hairline);text-decoration:none;}
.post-row h3{font-family:var(--font-display);font-size:var(--fs-display-sm);font-weight:var(--fw-bold);color:var(--color-text-primary);margin-top:var(--space-2);}
.post-row p{font-size:var(--fs-body-md);line-height:var(--lh-relaxed);color:var(--color-text-secondary);margin-top:var(--space-2);max-width:90ch;}
.post-row .post-meta{margin-top:0;}

/* ---- Responsive ---- */
@media (max-width:820px){
  .hide-mobile{display:none !important;}
  .stack-mobile{flex-direction:column !important;}
  .audience-grid{grid-template-columns:1fr;}
  .about-flex{flex-direction:column;align-items:flex-start;}
  .form-row,.form-row-split{grid-template-columns:1fr;}
  .article-intro{grid-template-columns:1fr;}
  .nav-toggle{display:block;}
  .primary-nav{
    display:none;position:absolute;top:100%;left:0;right:0;background:var(--color-bg-brand);
    flex-direction:column;align-items:flex-start;gap:0;padding:var(--space-2) var(--space-6) var(--space-4);
    border-top:1px solid rgba(255,255,255,0.12);box-shadow:var(--shadow-lg);
  }
  .primary-nav.open{display:flex;}
  .primary-nav .nav-link{padding:var(--space-3) 0;width:100%;}
}
@media (min-width:821px){
  .nav-toggle{display:none;}
}