/* emys-home.de – Teichprofil */
@font-face{font-family:"Spectral";src:url(/assets/fonts/spectral-500-normal.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Spectral";src:url(/assets/fonts/spectral-700-normal.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Spectral";src:url(/assets/fonts/spectral-500-italic.woff2) format("woff2");font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:"Cabin";src:url(/assets/fonts/cabin-wght.woff2) format("woff2");font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:"Cabin";src:url(/assets/fonts/cabin-wght-italic.woff2) format("woff2");font-weight:400 700;font-style:italic;font-display:swap}

:root{
  --vass:#eceee3;       /* Seggen-Grund */
  --blad:#fafbf5;       /* Blatt */
  --dy:#1a1f1a;         /* Moor-Tinte */
  --slam:#565b51;       /* Schlamm, Nebentext */
  --alg:#4b6320;        /* Algengrün, Links */
  --alg-mork:#33461a;
  --torv:#2b2419;       /* Torf, Kopf & Fuß */
  --torv-ljus:#3d3325;
  --svavel:#efcd4e;     /* Schwefelgelb der Panzerpunkte */
  --iris:#a3402a;       /* Iris-Rot, Warnungen */
  --vatten:#6f8f8a;     /* Wasser */
  --vatten-ljus:#d7e2dc;
  --linje:#d3d6c6;
  --serif:"Spectral",Georgia,"Times New Roman",serif;
  --sans:"Cabin","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--vass);color:var(--dy);font:400 1.0625rem/1.68 var(--sans)}
img,svg{max-width:100%;height:auto;display:block}
a{color:var(--alg);text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{color:var(--alg-mork);text-decoration-thickness:2px}
em,i{font-style:italic}
h1,h2,h3{font-family:var(--serif);font-weight:700;line-height:1.2;color:var(--dy);margin:0 0 .5em}
h1{font-size:clamp(1.9rem,1.2rem + 2.6vw,2.9rem);letter-spacing:-.01em}
h2{font-size:clamp(1.4rem,1.1rem + 1vw,1.8rem);margin-top:1.8em}
h3{font-size:1.2rem;margin-top:1.4em}
p{margin:0 0 1em}
.hoppa{position:absolute;left:-999px;top:0;background:var(--svavel);color:var(--torv);padding:.5rem 1rem;z-index:9}
.hoppa:focus{left:1rem}
.ram{max-width:1180px;margin:0 auto;padding:0 16px}

/* Kopf */
.huvud{background:var(--torv);color:#efeadf}
.huvud .ram{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem 2rem;padding-top:.9rem;padding-bottom:.7rem}
.marke{display:flex;align-items:center;gap:.7rem;color:#fff;text-decoration:none}
.marke:hover{color:#fff}
.marke svg{width:46px;height:40px;flex:none}
.marke-namn{font:700 1.45rem/1 var(--serif);letter-spacing:.01em}
.marke-namn span{color:var(--svavel)}
.marke-under{display:block;font:500 .72rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#cfc6b2;margin-top:.25rem}
.meny ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.2rem .3rem}
.meny a{display:block;color:#efeadf;text-decoration:none;font-weight:600;font-size:.95rem;padding:.35rem .6rem;border-radius:3px}
.meny a:hover,.meny a[aria-current]{background:var(--torv-ljus);color:var(--svavel)}
.vattenlinje{display:block;width:100%;height:18px;background:var(--torv)}

/* Brotkrumen */
.stig{font-size:.88rem;color:var(--slam);margin:1.3rem 0 .6rem}
.stig ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.2rem}
.stig li+li::before{content:"›";margin:0 .45rem 0 .25rem;color:var(--vatten)}

/* Startseite */
.profil{background:var(--blad);border-bottom:1px solid var(--linje)}
.profil .ram{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:2.2rem;padding-top:2.2rem;padding-bottom:2.4rem;align-items:start}
.profil-kicker{font:600 .78rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--iris);margin:0 0 .8rem}
.profil-ingress{font-size:1.14rem;color:#2d332c;max-width:40em}
.snitt{margin:1.4rem 0 0}
.snitt figcaption{font-size:.86rem;color:var(--slam);margin-top:.5rem}
.snitt a circle{transition:r .15s}
.snitt a:hover circle,.snitt a:focus circle{fill:var(--iris)}
.nycklar{list-style:none;margin:0;padding:0;counter-reset:n}
.nycklar li{counter-increment:n;display:grid;grid-template-columns:2rem 1fr;gap:.6rem;padding:.7rem 0;border-bottom:1px dotted var(--linje)}
.nycklar li::before{content:counter(n);display:grid;place-items:center;width:1.7rem;height:1.7rem;border-radius:50%;background:var(--torv);color:var(--svavel);font:700 .85rem/1 var(--sans)}
.nycklar a{font-weight:700;text-decoration:none}
.nycklar a:hover{text-decoration:underline}
.nycklar span{display:block;font-size:.92rem;color:var(--slam);line-height:1.45}
.sektion{padding:2.6rem 0}
.sektion h2{margin-top:0}
.sektion-ljus{background:var(--blad);border-top:1px solid var(--linje);border-bottom:1px solid var(--linje)}
.tva{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2.4rem;align-items:start}
.avdelningar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.1rem;margin-top:1.2rem}
.avdelning{background:var(--blad);border:1px solid var(--linje);border-top:6px solid var(--alg);padding:1.1rem 1.1rem 1.2rem;display:flex;flex-direction:column}
.avdelning:nth-child(2){border-top-color:var(--vatten)}
.avdelning:nth-child(3){border-top-color:var(--iris)}
.avdelning:nth-child(4){border-top-color:#b08a2a}
.avdelning h3{margin:.1rem 0 .4rem}
.avdelning h3 a{color:var(--dy);text-decoration:none}
.avdelning h3 a:hover{color:var(--alg)}
.avdelning p{font-size:.95rem;color:#333a31}
.avdelning ul{margin:auto 0 0;padding:0;list-style:none;font-size:.92rem;border-top:1px dotted var(--linje);padding-top:.6rem}
.avdelning li{padding:.15rem 0}
.aret{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:3px;margin:1.2rem 0 .6rem}
.aret div{background:var(--vatten-ljus);padding:.5rem .2rem;text-align:center;font:600 .78rem/1.2 var(--sans);color:var(--dy)}
.aret .vila{background:#4a5a63;color:#e8eef0}
.aret .aktiv{background:#b9cfa0}
.aret .lagg{background:var(--svavel)}
.aret .klack{background:#e7a57f}
.aret-nyckel{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;font-size:.86rem;color:var(--slam);margin:0;padding:0;list-style:none}
.aret-nyckel i{display:inline-block;width:.9rem;height:.9rem;vertical-align:-.1rem;margin-right:.35rem;border:1px solid rgba(0,0,0,.15)}
.fragor details{border-bottom:1px solid var(--linje);padding:.2rem 0}
.fragor summary{cursor:pointer;font:700 1.05rem/1.4 var(--serif);padding:.7rem 0;list-style-position:outside}
.fragor details p{margin:.1rem 0 .9rem;color:#2d332c}
.senaste{list-style:none;margin:0;padding:0;columns:2;column-gap:2.4rem}
.senaste li{break-inside:avoid;padding:.45rem 0;border-bottom:1px dotted var(--linje)}
.senaste small{display:block;color:var(--slam);font-size:.84rem}

/* Etikett (Steckbrief wie ein Museumsschild) */
.etikett{background:#fffdf3;border:1px solid #bdb48f;outline:3px double #bdb48f;outline-offset:3px;padding:1rem 1.2rem;margin:1.6rem 4px;font-size:.95rem}
.etikett-rubrik{font:700 .78rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#7a6a2c;margin:0 0 .6rem}
.etikett dl{margin:0;display:grid;grid-template-columns:minmax(7.5rem,auto) 1fr;gap:.3rem 1rem}
.etikett dt{font-weight:700;color:#4d4531}
.etikett dd{margin:0}

/* Beiträge */
.uppslag{display:grid;grid-template-columns:15.5rem minmax(0,1fr);gap:2.6rem;align-items:start;padding-bottom:3rem}
.marginal{position:sticky;top:1rem;font-size:.9rem;border-top:4px solid var(--torv);padding-top:.8rem}
.marginal dl{margin:0 0 1.2rem;display:grid;grid-template-columns:auto 1fr;gap:.2rem .7rem}
.marginal dt{color:var(--slam)}
.marginal dd{margin:0;font-weight:600}
.marginal-rubrik{font:700 .74rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--slam);margin:0 0 .5rem}
.marginal ol{margin:0;padding:0 0 0 1.1rem;color:var(--slam)}
.marginal li{padding:.18rem 0;line-height:1.35}
.marginal a{text-decoration:none}
.marginal a:hover{text-decoration:underline}
.sida{background:var(--blad);border:1px solid var(--linje);padding:clamp(1.2rem,1rem + 2vw,2.6rem);min-width:0}
.sida>header{border-bottom:1px solid var(--linje);margin-bottom:1.4rem}
.ingress{font-size:1.16rem;line-height:1.6;color:#2b3129}
.text{max-width:44em}
.text ul,.text ol{padding-left:1.3rem;margin:0 0 1.1em}
.text li{margin:.25rem 0}
.text h2{scroll-margin-top:1rem}
.bild{margin:1.6rem 0}
.bild img{width:100%;background:var(--vatten-ljus)}
.bild figcaption,.ritning figcaption{font-size:.85rem;color:var(--slam);margin-top:.45rem;line-height:1.45}
.bild figcaption small{display:block;font-size:.78rem;opacity:.9}
.ritning{margin:1.6rem 0;background:#f2f4ea;border:1px solid var(--linje);padding:1rem}
.notis{background:#eef2e4;border-left:5px solid var(--alg);padding:.9rem 1.1rem;margin:1.5rem 0}
.notis>strong:first-child{display:block;font:700 1rem/1.3 var(--serif);margin-bottom:.35rem}
.notis p:last-child,.varning p:last-child{margin-bottom:0}
.varning{background:#fbf0ea;border:1px dashed var(--iris);padding:.9rem 1.1rem;margin:1.5rem 0}
.varning>strong:first-child{display:block;color:var(--iris);font:700 .8rem/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase;margin-bottom:.35rem}
.tabell{overflow-x:auto;margin:1.4rem 0}
.tabell table{border-collapse:collapse;width:100%;font-size:.93rem;background:#fff}
.tabell th,.tabell td{border:1px solid var(--linje);padding:.45rem .6rem;text-align:left;vertical-align:top}
.tabell th{background:var(--torv);color:#f3eee2;font-weight:600}
.tabell tr:nth-child(even) td{background:#f6f7f0}
.kallor{font-size:.9rem;border-top:1px solid var(--linje);margin-top:2rem;padding-top:1rem;color:var(--slam)}
.kallor ul{padding-left:1.1rem}

/* Anzeige */
.annons{position:relative;border:2px solid var(--torv);background:#fffef8;padding:1.5rem 1.2rem 1rem;margin:2.2rem 0 1rem}
.annons-flik{position:absolute;top:-.8rem;left:1rem;background:var(--torv);color:var(--svavel);font:700 .72rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;padding:.35rem .6rem}
.annons h2{font-size:1.2rem;margin:0 0 .7rem}
.annons ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(14rem,1fr));gap:.5rem}
.annons li a{display:block;height:100%;border:1px solid var(--linje);padding:.55rem .7rem;text-decoration:none;color:var(--dy);background:#fff}
.annons li a:hover{border-color:var(--alg);background:#f4f7ec}
.annons li strong{display:block;color:var(--alg)}
.annons li span{display:block;font-size:.86rem;color:var(--slam);line-height:1.4}
.annons-not{font-size:.8rem;color:var(--slam);margin:.8rem 0 0}
a.partner{font-weight:600}

/* Blättern & Verwandte */
.bladdra{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:2.4rem}
.bladdra a{display:block;border:1px solid var(--linje);padding:.8rem 1rem;text-decoration:none;background:#fff}
.bladdra a:hover{border-color:var(--alg)}
.bladdra small{display:block;color:var(--slam);font-size:.8rem;text-transform:uppercase;letter-spacing:.1em}
.bladdra .nasta{text-align:right}
.slakt{margin-top:2.6rem}
.slakt h2{font-size:1.25rem;margin-top:0}
.slakt-rad{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.kort{background:#fff;border:1px solid var(--linje);text-decoration:none;color:var(--dy);display:flex;flex-direction:column}
.kort:hover{border-color:var(--alg);color:var(--dy)}
.kort img{aspect-ratio:3/2;object-fit:cover;width:100%}
.kort-ritad{aspect-ratio:3/2;background:#e6ebdf;display:grid;place-items:center;padding:.6rem}
.kort-ritad svg{max-height:100%;width:auto}
.kort b{display:block;font:700 1rem/1.3 var(--serif);padding:.6rem .8rem .2rem}
.kort small{display:block;padding:0 .8rem .8rem;color:var(--slam);font-size:.85rem;line-height:1.4}

/* Rubrikseiten */
.rubrikhuvud{padding:1.2rem 0 1.8rem}
.lista{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.1rem}
.lista-rad{list-style:none;margin:0;padding:0}
.lista-rad li{display:grid;grid-template-columns:8.5rem 1fr;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--linje)}
.lista-rad img,.lista-rad .kort-ritad{aspect-ratio:4/3;object-fit:cover;width:100%}
.lista-rad h3{margin:0 0 .25rem;font-size:1.1rem}
.lista-rad p{margin:0;font-size:.93rem;color:#333a31}

/* Fuß */
.fot{background:var(--torv);color:#d8d1c1;margin-top:3rem;font-size:.93rem}
.fot a{color:#f1e7c8}
.fot a:hover{color:var(--svavel)}
.fot-skal{display:block;width:100%;height:14px}
.fot .ram{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2rem;padding-top:2rem;padding-bottom:1.4rem}
.fot h2{color:#fff;font-size:1rem;margin:0 0 .6rem;font-family:var(--sans);letter-spacing:.1em;text-transform:uppercase}
.fot ul{list-style:none;margin:0;padding:0}
.fot li{padding:.15rem 0}
.fot-botten{border-top:1px solid var(--torv-ljus);padding:.9rem 0 1.4rem;font-size:.84rem;color:#b3aa96}
.fot-botten .ram{display:block;padding-top:0;padding-bottom:0}

.fel{text-align:center;padding:3rem 0}
.fel svg{margin:0 auto 1rem;width:180px}

@media (max-width:980px){
  .profil .ram,.tva{grid-template-columns:1fr}
  .avdelningar{grid-template-columns:repeat(2,minmax(0,1fr))}
  .uppslag{grid-template-columns:1fr;gap:1rem}
  .marginal{position:static}
  .marginal nav{display:none}
  .lista,.slakt-rad{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fot .ram{grid-template-columns:1fr 1fr}
}
@media (max-width:600px){
  body{font-size:1rem}
  .avdelningar,.lista,.slakt-rad,.bladdra{grid-template-columns:1fr}
  .bladdra .nasta{text-align:left}
  .aret{grid-template-columns:repeat(6,minmax(0,1fr))}
  .senaste{columns:1}
  .lista-rad li{grid-template-columns:5.5rem 1fr}
  .fot .ram{grid-template-columns:1fr}
  .etikett dl{grid-template-columns:1fr}
  .etikett dd{margin-bottom:.35rem}
  .meny a{padding:.3rem .45rem;font-size:.9rem}
}