:root{
  --ink:#241F1C;
  --paper:#F3E9D2;
  --paper-2:#EADFC3;
  --red:#C63328;
  --mustard:#E3A72E;
  --forest:#2B3A2F;
  --line: rgba(36,31,28,0.18);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.001ms !important; transition-duration:0.001ms !important;}
}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:'Inter', sans-serif; font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;}
img{max-width:100%; display:block;}
.wrap{max-width:1080px; margin:0 auto; padding:0 26px;}
:focus-visible{outline:3px solid var(--red); outline-offset:3px;}
h1,h2,h3{font-family:'Anton', sans-serif; font-weight:400; text-transform:uppercase; letter-spacing:0.01em; margin:0;}

/* ---------- NAV ---------- */
header.site-nav{ position:sticky; top:0; z-index:50; background:var(--paper); border-bottom:3px solid var(--ink); }
.nav-inner{ display:flex; align-items:center; justify-content:space-between; padding:12px 26px; max-width:1080px; margin:0 auto; }
.brand{display:flex; align-items:center; gap:10px; text-decoration:none;}
.brand img{height:42px; width:42px; border-radius:50%; border:2px solid var(--ink);}
.brand span{font-family:'Lobster', cursive; font-size:1.4rem; color:var(--red);}
nav.links{display:flex; gap:22px; align-items:center; flex-wrap:wrap;}
nav.links a{ text-decoration:none; color:var(--ink); font-weight:600; font-size:0.9rem; text-transform:uppercase; letter-spacing:0.03em; padding:6px 2px; border-bottom:3px solid transparent; }
nav.links a:hover, nav.links a.active{border-color:var(--red);}
nav.links a.eng{ background:var(--ink); color:var(--paper); padding:8px 14px; border-bottom:none; }
.nav-toggle{display:none;}
@media (max-width:900px){
  nav.links{ position:fixed; inset:63px 0 0 0; background:var(--paper); flex-direction:column; align-items:flex-start; padding:26px; display:none; gap:20px; overflow-y:auto; border-top:3px solid var(--ink); }
  nav.links.open{display:flex;}
  .nav-toggle{ display:block; background:var(--ink); color:var(--paper); border:none; font-size:1.1rem; padding:8px 14px; cursor:pointer; font-weight:700;}
}

/* ---------- PAGE HERO / BANNER ---------- */
.hero{ padding:64px 26px 76px; position:relative; overflow:hidden;}
.hero-inner{max-width:1080px; margin:0 auto; position:relative;}
.stamp{
  position:absolute; top:8px; right:26px; width:104px; height:104px;
  border:3px solid var(--red); border-radius:50%; display:flex; align-items:center; justify-content:center;
  text-align:center; transform:rotate(9deg); color:var(--red); font-family:'Anton',sans-serif;
  font-size:0.68rem; letter-spacing:0.05em; line-height:1.3; padding:8px;
}
@media (max-width:700px){ .stamp{display:none;} }
.kicker{ font-weight:700; font-size:0.88rem; text-transform:uppercase; letter-spacing:0.08em; color:var(--red); margin-bottom:16px; }
h1.hero-title{ font-size:clamp(2.6rem, 7.5vw, 5.4rem); line-height:0.94; color:var(--ink); max-width:13ch; }
h1.hero-title .accent{color:var(--red);}
.hero-sub{font-size:1.1rem; max-width:46ch; margin:22px 0 0; opacity:0.85;}
.hero-cta{display:flex; gap:14px; flex-wrap:wrap; margin-top:32px;}

/* compact banner for subpages */
.page-banner{ padding:50px 26px 56px; }
.page-banner .kicker{margin-bottom:10px;}
.page-banner h1{font-size:clamp(2.2rem, 6vw, 3.6rem);}

.btn{
  font-family:'Inter'; font-weight:700; font-size:0.95rem; text-transform:uppercase; letter-spacing:0.03em;
  padding:15px 28px; text-decoration:none; display:inline-block; border:3px solid var(--ink);
}
.btn-primary{background:var(--red); color:var(--paper); border-color:var(--red); box-shadow:5px 5px 0 var(--ink);}
.btn-ghost{background:transparent; color:var(--ink); box-shadow:5px 5px 0 var(--ink);}
.btn:hover{transform:translate(2px,2px); box-shadow:3px 3px 0 var(--ink);}
.hero-meta{display:flex; gap:30px; flex-wrap:wrap; font-size:0.85rem; font-weight:600; margin-top:34px;}
.hero-meta strong{display:block; color:var(--red); font-size:0.68rem; text-transform:uppercase; letter-spacing:0.08em; margin-bottom:3px; font-weight:700;}

/* ---------- SECTIONS ---------- */
section{padding:70px 0;}
section.forest{background:var(--forest); color:var(--paper);}
section.forest h2, section.forest .count{color:var(--mustard);}
section.ink{background:var(--ink); color:var(--paper);}
section.ink .count{color:var(--red);}
section.mustard{background:var(--mustard); color:var(--ink);}
section.mustard .count{color:var(--forest);}

.section-head{margin-bottom:40px; max-width:620px;}
.count{ font-weight:700; font-size:0.85rem; color:var(--red); letter-spacing:0.1em; display:block; margin-bottom:12px; }
.count .rest{opacity:0.35;}
h2.section-title{font-size:clamp(2rem, 4vw, 2.8rem); margin-bottom:12px;}
.section-lede{opacity:0.85; font-size:1.03rem; max-width:52ch;}

/* pinned poster card - used everywhere, incl. Kurser now */
.pin-card{ background:var(--paper); border:3px solid var(--ink); padding:28px; box-shadow:7px 7px 0 var(--ink); position:relative; }
.pin-card::before{ content:""; position:absolute; top:-11px; left:50%; transform:translateX(-50%); width:20px; height:20px; background:var(--red); border-radius:50%; border:2px solid var(--ink); }
.rot-l{ transform:rotate(-1.4deg); }
.rot-r{ transform:rotate(1.2deg); }
.pin-card.on-dark{background:var(--paper-2);}

.ticket-row{display:grid; grid-template-columns:1fr 1fr; gap:30px; align-items:start;}
@media (max-width:820px){ .ticket-row{grid-template-columns:1fr;} }
.tk-label{font-weight:700; text-transform:uppercase; font-size:0.72rem; letter-spacing:0.08em; color:var(--red); display:block; margin-bottom:6px;}
.tk-val{font-family:'Anton',sans-serif; font-size:1.9rem; margin-bottom:4px;}
.tk-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px 28px; margin-top:20px; padding-top:20px; border-top:2px dashed var(--ink);}
.map-link{font-weight:700; font-size:0.9rem; text-decoration:underline; text-underline-offset:3px; color:var(--red);}

.duo{display:flex; flex-direction:column; gap:18px;}
.duo .pin-card h3{font-size:1.25rem; margin-bottom:8px;}
.duo .pin-card p{margin:0; opacity:0.82; font-size:0.96rem;}

/* KURSER — now matches the pinned-poster system instead of boxed SaaS cards */
.course-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px 24px; margin-top:6px;}
@media (max-width:900px){ .course-grid{grid-template-columns:1fr;} }
.course-card h3{font-size:1.5rem; margin:6px 0 4px;}
.course-card .lvl{font-weight:700; font-size:0.72rem; text-transform:uppercase; letter-spacing:0.08em; color:var(--red);}
.course-card .time{opacity:0.75; font-size:0.92rem; margin:6px 0 16px;}
.price-row{display:flex; align-items:baseline; gap:10px; padding-top:16px; border-top:2px dashed var(--ink);}
.price{font-family:'Anton',sans-serif; font-size:1.9rem; color:var(--red);}
.price-old{font-size:0.85rem; opacity:0.5; text-decoration:line-through;}
.price-tag{font-size:0.68rem; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; border:2px solid var(--ink); padding:3px 9px; display:inline-block; margin-top:12px;}

.pay-info{ margin-top:28px; padding:22px 26px; border-left:4px solid var(--ink); background:rgba(36,31,28,0.06); font-size:0.95rem; }
.pay-info b{color:var(--red);}

/* FÖRENING */
.about-grid{display:grid; grid-template-columns:1.15fr 1fr; gap:46px; align-items:start;}
@media (max-width:900px){ .about-grid{grid-template-columns:1fr;} }
.about-copy p{opacity:0.88; margin:0 0 18px; font-size:1.02rem;}
.board-title{font-weight:700; font-size:0.75rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--red); display:block; margin-bottom:14px;}
.board-list{list-style:none; margin:0 0 26px; padding:0;}
.board-list li{display:flex; justify-content:space-between; padding:12px 0; border-bottom:2px dotted var(--line); font-weight:600;}
.board-list .role{opacity:0.6; font-weight:400; font-size:0.85rem; text-transform:uppercase;}
.stat-row{display:flex; gap:16px;}
.stat{border:3px solid var(--ink); padding:18px 20px; flex:1; text-align:center;}
.stat .num{font-family:'Anton',sans-serif; font-size:1.6rem; color:var(--red); display:block;}
.stat .lbl{font-size:0.72rem; text-transform:uppercase; letter-spacing:0.05em; opacity:0.7;}

/* GALLERI - corkboard */
.board-wrap{ background:#5c4630; border:3px solid var(--ink); padding:34px 24px; background-image:radial-gradient(rgba(0,0,0,0.18) 1px, transparent 1px); background-size:14px 14px; }
.cork-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:22px 16px;}
@media (max-width:900px){ .cork-grid{grid-template-columns:repeat(2,1fr);} }
.photo{background:#fff; padding:10px 10px 26px; box-shadow:0 8px 16px rgba(0,0,0,0.35); position:relative; text-decoration:none; display:block;}
.photo:nth-child(odd){transform:rotate(-3deg);}
.photo:nth-child(even){transform:rotate(2.5deg);}
.photo:hover{transform:rotate(0deg) scale(1.03); transition:transform .25s ease;}
.photo img{width:100%; aspect-ratio:1/1; object-fit:cover;}
.photo::before{ content:""; position:absolute; top:-9px; left:50%; transform:translateX(-50%); width:16px; height:16px; border-radius:50%; background:var(--red); border:2px solid #7a1c11; }

/* NYHETER */
.news-list{display:flex; flex-direction:column; gap:22px;}
.news-item{ display:grid; grid-template-columns:140px 1fr; gap:24px; padding-bottom:22px; border-bottom:2px dotted var(--line); }
@media (max-width:700px){ .news-item{grid-template-columns:1fr;} }
.news-date{font-family:'Anton',sans-serif; font-size:1.1rem; color:var(--red);}
.news-item h3{font-size:1.3rem; margin-bottom:6px;}
.news-item p{margin:0; opacity:0.85;}
.news-preview{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
@media (max-width:900px){ .news-preview{grid-template-columns:1fr;} }

/* KONTAKT */
.contact-grid{display:grid; grid-template-columns:1.2fr 1fr; gap:46px;}
@media (max-width:900px){ .contact-grid{grid-template-columns:1fr;} }
.contact-row{display:flex; justify-content:space-between; align-items:center; padding:18px 0; border-bottom:2px dotted var(--line);}
.contact-row .lbl{font-weight:700; font-size:0.72rem; text-transform:uppercase; letter-spacing:0.06em; opacity:0.65;}
.contact-row a{font-size:1.05rem; font-weight:600; text-decoration:none; border-bottom:2px solid var(--red);}
.socials{display:flex; gap:12px; margin-top:22px;}
.socials a{ width:44px; height:44px; border:3px solid var(--ink); display:flex; align-items:center; justify-content:center; text-decoration:none; font-weight:700; font-size:0.75rem; }
.socials a:hover{background:var(--ink); color:var(--paper);}
.kar-badge{ display:inline-flex; align-items:center; gap:8px; margin-top:28px; font-weight:700; font-size:0.8rem; text-decoration:none; color:var(--ink); border:2px solid var(--ink); padding:9px 16px; }
.kar-badge:hover{background:var(--ink); color:var(--paper);}

footer{border-top:3px solid var(--ink); padding:32px 0; font-size:0.85rem; font-weight:600;}
.foot-inner{display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;}
