:root{
  --c-primary:#C19A6B;
  --c-secondary:#3E2723;
  --c-accent:#F5DEB3;
  --c-bg:#F1E3C8;
  --c-text:#2A1A10;
  --c-wood-dark:#6B4423;
  --c-wood-mid:#8B6336;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Lora',Georgia,serif;
  color:var(--c-text);
  background:var(--c-bg);
  line-height:1.7;
  font-size:17px;
  counter-reset:section;
  position:relative;
  overflow-x:hidden;
}

body::before{
  content:'';
  position:fixed; inset:0; pointer-events:none; opacity:0.32; z-index:1;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/><feColorMatrix values='0 0 0 0 0.17 0 0 0 0 0.13 0 0 0 0 0.10 0 0 0 0.40 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

.tramaterial{
  background-color:#A57845;
  background-image:
    repeating-linear-gradient(
      90deg,
      rgba(62,39,35,0.00) 0px,
      rgba(62,39,35,0.18) 1px,
      rgba(62,39,35,0.00) 2px,
      rgba(62,39,35,0.00) 7px,
      rgba(62,39,35,0.22) 8px,
      rgba(62,39,35,0.00) 9px,
      rgba(62,39,35,0.00) 18px,
      rgba(62,39,35,0.14) 19px,
      rgba(62,39,35,0.00) 20px,
      rgba(62,39,35,0.00) 33px,
      rgba(62,39,35,0.28) 34px,
      rgba(62,39,35,0.00) 35px
    ),
    repeating-linear-gradient(
      90deg,
      rgba(255,230,190,0.00) 0px,
      rgba(255,230,190,0.10) 3px,
      rgba(255,230,190,0.00) 6px,
      rgba(255,230,190,0.00) 40px
    ),
    repeating-linear-gradient(
      0deg,
      rgba(62,39,35,0.00) 0px,
      rgba(62,39,35,0.05) 60px,
      rgba(62,39,35,0.00) 120px
    );
  color:var(--c-accent);
}
.tramaterial--planka{
  border-top:2px solid rgba(62,39,35,0.5);
  border-bottom:2px solid rgba(62,39,35,0.5);
  box-shadow:inset 0 0 0 1px rgba(245,222,179,0.18), inset 0 0 60px rgba(62,39,35,0.35);
}

.traditionell-arkitektur{
  position:relative;
  padding:3.5rem 2.5rem 2.5rem;
  background:var(--c-accent);
  border:2px solid var(--c-secondary);
  margin-top:5.5rem;
}
.traditionell-arkitektur::before{
  content:'';
  position:absolute;
  top:-3.5rem; left:-2px; right:-2px;
  height:3.5rem;
  background:var(--c-secondary);
  clip-path:polygon(0 100%, 50% 0, 100% 100%);
}
.traditionell-arkitektur::after{
  content:'';
  position:absolute;
  top:-3rem; right:18%;
  width:18px; height:26px;
  background:var(--c-wood-dark);
  border:1px solid var(--c-secondary);
}
.traditionell-arkitektur .fonster{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:1.5rem;
  margin:1.5rem 0;
}
.traditionell-arkitektur .fonster > div{
  background:#FFF8E7;
  border:6px solid #FAF0D8;
  outline:2px solid var(--c-secondary);
  aspect-ratio:1/1.2;
  position:relative;
}
.traditionell-arkitektur .fonster > div::before,
.traditionell-arkitektur .fonster > div::after{
  content:'';
  position:absolute;
  background:var(--c-secondary);
}
.traditionell-arkitektur .fonster > div::before{ top:0; bottom:0; left:50%; width:2px; transform:translateX(-50%); }
.traditionell-arkitektur .fonster > div::after{ left:0; right:0; top:50%; height:2px; transform:translateY(-50%); }

.traditionell-arkitektur .dorr{
  display:flex; align-items:center; justify-content:center;
  margin:1.5rem auto 0;
  width:60%;
  aspect-ratio:1/1.6;
  background:var(--c-wood-dark);
  border:3px solid var(--c-secondary);
  position:relative;
}
.traditionell-arkitektur .dorr::before{
  content:'';
  position:absolute;
  width:14px; height:14px;
  background:var(--c-secondary);
  border-radius:50%;
  right:14%;
  top:50%;
  box-shadow: 0 -28px 0 var(--c-secondary), 0 28px 0 var(--c-secondary);
}

.hantverksprydda{
  position:relative;
  display:inline-block;
  padding:0.4em 1.6em;
  font-family:'Fraunces',serif;
  font-variation-settings:"SOFT" 50,"opsz" 144;
  letter-spacing:0.02em;
}
.hantverksprydda::before,
.hantverksprydda::after{
  content:'';
  position:absolute;
  top:50%;
  width:1.2em;
  height:1.4em;
  transform:translateY(-50%);
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
}
.hantverksprydda::before{
  left:0;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 50'><g fill='none' stroke='%233E2723' stroke-width='1.6'><path d='M20 2 C 8 12, 8 22, 20 25 C 32 22, 32 12, 20 2 Z'/><path d='M20 25 L20 48'/><path d='M20 30 C 12 33, 10 40, 14 46'/><path d='M20 30 C 28 33, 30 40, 26 46'/><circle cx='20' cy='14' r='2.2' fill='%233E2723'/></g></svg>");
}
.hantverksprydda::after{
  right:0;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 50'><g fill='none' stroke='%233E2723' stroke-width='1.6'><path d='M20 2 C 8 12, 8 22, 20 25 C 32 22, 32 12, 20 2 Z'/><path d='M20 25 L20 48'/><path d='M20 30 C 12 33, 10 40, 14 46'/><path d='M20 30 C 28 33, 30 40, 26 46'/><circle cx='20' cy='14' r='2.2' fill='%233E2723'/></g></svg>");
  transform:translateY(-50%) scaleX(-1);
}

h1,h2,h3{
  font-family:'Fraunces',serif;
  color:var(--c-secondary);
  line-height:1.1;
}
h1{
  font-size:clamp(2.4rem,6vw,4.4rem);
  font-variation-settings:"SOFT" 70,"opsz" 144;
  font-weight:300;
  text-shadow:4px 4px 0 var(--c-secondary);
  color:var(--c-accent);
  letter-spacing:-0.01em;
}
h2{
  font-size:clamp(1.7rem,3.4vw,2.6rem);
  font-variation-settings:"SOFT" 30,"opsz" 96;
  font-weight:500;
  text-shadow:3px 3px 0 var(--c-secondary);
  color:var(--c-primary);
}
h3{
  font-size:1.35rem;
  font-variation-settings:"opsz" 36;
  font-weight:500;
  margin-bottom:0.6rem;
}
p{margin-bottom:1.1rem}

.wrap{max-width:1100px;margin:0 auto;padding:0 1.5rem;position:relative;z-index:2}

.sektionsnumrering{
  display:block;
  font-family:'Fraunces',serif;
  font-variation-settings:"opsz" 24;
  font-size:0.9rem;
  letter-spacing:0.25em;
  text-transform:uppercase;
  color:var(--c-wood-mid);
  margin-bottom:0.8rem;
  counter-increment:section;
  text-shadow:2px 2px 0 var(--c-accent);
}
.sektionsnumrering::before{
  content:"— 0" counter(section) " · ";
  font-family:'Lora',serif;
  color:var(--c-secondary);
}

header.topp{
  position:relative;
  border-bottom:6px double var(--c-secondary);
  padding:1.2rem 0;
  background:var(--c-accent);
  z-index:3;
}
header.topp nav{
  max-width:1100px; margin:0 auto;
  padding:0 1.5rem;
  display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:1rem;
}
.logo{
  font-family:'Fraunces',serif;
  font-variation-settings:"SOFT" 100,"opsz" 144;
  font-weight:500;
  font-size:1.4rem;
  color:var(--c-secondary);
  letter-spacing:0.02em;
  text-shadow:2px 2px 0 var(--c-primary);
}
.logo span{display:block;font-size:0.7rem;letter-spacing:0.3em;color:var(--c-wood-mid);text-shadow:none;font-family:'Lora',serif;text-transform:uppercase;margin-top:0.2rem}
header.topp ul{list-style:none;display:flex;gap:1.6rem;flex-wrap:wrap}
header.topp a{
  color:var(--c-secondary);
  text-decoration:none;
  font-family:'Fraunces',serif;
  font-size:0.95rem;
  font-variation-settings:"opsz" 24;
  border-bottom:1px solid transparent;
  padding-bottom:2px;
  transition:border-color .2s;
}
header.topp a:hover{border-bottom-color:var(--c-secondary)}

.hero{
  position:relative;
  padding:6rem 0 5rem;
  overflow:hidden;
  border-bottom:2px solid var(--c-secondary);
}
.hero .hero-inner{
  position:relative;
  z-index:2;
  text-align:center;
  padding:3rem 1.5rem;
}
.hero .ortmarkering{
  display:inline-block;
  font-family:'Lora',serif;
  font-style:italic;
  letter-spacing:0.4em;
  text-transform:uppercase;
  color:var(--c-accent);
  font-size:0.8rem;
  margin-bottom:1.5rem;
  padding:0.4rem 1.2rem;
  border:1px solid var(--c-accent);
}
.hero .tagline{
  margin-top:1.5rem;
  font-family:'Lora',serif;
  font-style:italic;
  font-size:1.25rem;
  color:var(--c-accent);
  max-width:36rem;
  margin-left:auto;margin-right:auto;
}
.hero .ar-tryck{
  margin-top:2.5rem;
  font-family:'Fraunces',serif;
  letter-spacing:0.6em;
  font-size:0.75rem;
  color:var(--c-accent);
  opacity:0.85;
}

section{padding:5rem 0;position:relative;z-index:2}
section.alt{background:var(--c-accent)}

.ram{
  border:3px double var(--c-secondary);
  padding:2.5rem;
  background:rgba(255,248,231,0.55);
}

.tva-kolumn{
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:3rem;
  align-items:start;
}

.redaktionell p:first-of-type::first-letter{
  float:left;
  font-family:'Fraunces',serif;
  font-variation-settings:"SOFT" 100,"opsz" 144;
  font-size:4.6em;
  line-height:0.82;
  margin:0.05em 0.12em 0 0;
  color:var(--c-secondary);
  text-shadow:3px 3px 0 var(--c-primary);
}

.aktivitet-rutnat{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.5rem;
  margin-top:2.5rem;
}
.aktivitet-kort{
  padding:2rem 1.5rem;
  background:var(--c-bg);
  border:2px solid var(--c-secondary);
  position:relative;
  text-align:center;
  box-shadow:5px 5px 0 var(--c-primary);
}
.aktivitet-kort .nr{
  display:inline-block;
  font-family:'Fraunces',serif;
  font-size:0.8rem;
  letter-spacing:0.3em;
  color:var(--c-wood-mid);
  margin-bottom:0.6rem;
}
.aktivitet-kort h3{
  text-transform:capitalize;
  color:var(--c-secondary);
}

.malgrupp-lista{
  display:flex; flex-wrap:wrap; gap:0.8rem;
  margin-top:1.5rem;
}
.malgrupp-lista li{
  list-style:none;
  font-family:'Fraunces',serif;
  font-size:0.95rem;
  padding:0.4rem 1.2rem;
  border:2px solid var(--c-secondary);
  background:var(--c-bg);
  color:var(--c-secondary);
}

.milstolpar{
  position:relative;
  margin-top:3rem;
  padding-left:2.5rem;
}
.milstolpar::before{
  content:'';
  position:absolute;
  left:0.5rem; top:0.5rem; bottom:0.5rem;
  width:3px;
  background:repeating-linear-gradient(0deg, var(--c-secondary) 0 8px, transparent 8px 14px);
}
.milstolpar li{
  list-style:none;
  position:relative;
  padding:1rem 0 1rem 1.5rem;
  font-family:'Fraunces',serif;
  font-size:1.1rem;
  color:var(--c-secondary);
}
.milstolpar li::before{
  content:'';
  position:absolute;
  left:-2.05rem;
  top:1.3rem;
  width:16px; height:16px;
  background:var(--c-primary);
  border:2px solid var(--c-secondary);
  transform:rotate(45deg);
}

.bystugu-rad{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:2rem;
  margin-top:3rem;
}

.kulturpris_sigill{
  display:inline-block;
  margin-top:2rem;
  padding:1.2rem 1.8rem;
  border:2px solid var(--c-secondary);
  background:var(--c-accent);
  font-family:'Fraunces',serif;
  font-variation-settings:"opsz" 36;
  color:var(--c-secondary);
  transform:rotate(-4deg);
  box-shadow:4px 4px 0 var(--c-secondary);
  text-align:center;
  text-shadow:2px 2px 0 var(--c-primary);
}
.kulturpris_sigill small{display:block;font-size:0.7rem;letter-spacing:0.3em;margin-top:0.2rem;font-family:'Lora',serif;font-style:italic;text-shadow:none}

footer{
  background:var(--c-secondary);
  color:var(--c-accent);
  padding:3rem 0 2rem;
  border-top:6px double var(--c-primary);
  position:relative;
  z-index:2;
}
footer .wrap{text-align:center}
footer h3{color:var(--c-accent);margin-bottom:0.6rem}
footer p{font-family:'Lora',serif;font-style:italic;color:var(--c-accent);opacity:0.9}
footer .ort{
  margin-top:1.5rem;
  letter-spacing:0.4em;
  text-transform:uppercase;
  font-size:0.75rem;
  font-family:'Fraunces',serif;
  opacity:0.7;
}

.reveal{opacity:0;transform:translateY(20px);transition:opacity .7s ease, transform .7s ease}
.reveal.visible{opacity:1;transform:translateY(0)}

@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1;transform:none;transition:none}
  *{animation-duration:0.01ms !important}
  html{scroll-behavior:auto}
}

@media (max-width:768px){
  body{font-size:16px}
  .tva-kolumn{grid-template-columns:1fr;gap:2rem}
  .aktivitet-rutnat{grid-template-columns:1fr}
  .bystugu-rad{grid-template-columns:1fr;gap:2.5rem}
  header.topp nav{justify-content:center}
  header.topp ul{justify-content:center}
  .hero{padding:4rem 0 3rem}
  .ram{padding:1.6rem}
  .hantverksprydda{padding:0.4em 1.4em}
  .hantverksprydda::before,.hantverksprydda::after{width:0.9em}
}