/* Kennel Kastenhofs – "Gården". Granskog, björk och råg. */
:root{
  --spruce:#1e3b30;
  --spruce-2:#2c5142;
  --moss:#5d7351;
  --birch:#eef0eb;
  --paper:#ffffff;
  --rye:#cfb46a;
  --falu:#8a2a1c;
  --ink:#17211d;
  --muted:#5b665f;
  --line:#d6dbd3;
  --sans:"Schibsted Grotesk",system-ui,sans-serif;
  --serif:"Newsreader",Georgia,serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--birch);color:var(--ink);font:400 1.0625rem/1.6 var(--sans)}
img{display:block;max-width:100%;height:auto}
a{color:var(--spruce-2);text-underline-offset:3px}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--rye);outline-offset:3px}
h1,h2,h3{font-weight:700;line-height:1.08;letter-spacing:-.02em;margin:0}
p{margin:0 0 1em;max-width:64ch}
.wrap{width:min(1180px,100% - 2.5rem);margin-inline:auto}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;background:#fff;padding:.5rem 1rem;z-index:10}
.kall{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:0}

/* Sidhuvud */
.top{background:var(--spruce);color:var(--birch)}
.top .wrap{display:flex;align-items:center;gap:2rem;min-height:72px;flex-wrap:wrap}
.logo{color:var(--birch);text-decoration:none;display:flex;flex-direction:column;line-height:1.05;margin-right:auto;padding:.6rem 0}
.logo b{font-size:1.35rem;letter-spacing:-.02em}
.logo span{font-size:.82rem;opacity:.75}
.top nav ul{display:flex;gap:.25rem;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.top nav a{display:block;color:var(--birch);text-decoration:none;font-weight:500;padding:.5rem .8rem;border-radius:6px}
.top nav a:hover{background:var(--spruce-2)}
.top nav a[aria-current="page"]{background:var(--birch);color:var(--spruce)}

/* Sidrubrik */
.pagehead{padding:clamp(3rem,7vw,5.5rem) 0 clamp(2rem,4vw,3rem)}
.pagehead h1{font-size:clamp(2.6rem,6vw,4.6rem)}
.pagehead p{font-size:1.2rem;color:var(--muted);margin-top:1rem}

/* Startsidan */
.hem{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(2rem,5vw,4rem);align-items:end;padding:clamp(3rem,7vw,6rem) 0 clamp(3rem,6vw,5rem)}
.hem h1{font-size:clamp(3rem,7.5vw,6rem);color:var(--spruce)}
.hem .under{font-family:var(--serif);font-style:italic;font-size:clamp(1.4rem,2.6vw,2rem);margin:.75rem 0 2rem;color:var(--moss)}
.hem figure{margin:0}
.hem figure img{width:100%;border-radius:4px}
.hem figcaption{font-size:.85rem;color:var(--muted);margin-top:.6rem}
@media (max-width:820px){.hem{grid-template-columns:1fr}}

.btn{display:inline-flex;align-items:center;gap:.5rem;background:var(--spruce);color:var(--birch);text-decoration:none;font-weight:600;padding:.85rem 1.3rem;border-radius:6px}
.btn:hover{background:var(--spruce-2)}
.btn.line{background:transparent;color:var(--spruce);box-shadow:inset 0 0 0 1.5px var(--spruce)}

.band{background:var(--paper);padding:clamp(3rem,7vw,5rem) 0}
.band.dark{background:var(--spruce);color:var(--birch)}
.band.dark a{color:var(--rye)}
.split{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(2rem,5vw,4rem)}
@media (max-width:820px){.split{grid-template-columns:1fr}}
.split>h2{font-size:clamp(1.8rem,3.4vw,2.6rem)}

/* Nyhetslogg */
.logg{list-style:none;margin:0;padding:0}
.logg li{display:grid;grid-template-columns:9.5rem 1fr;gap:1.5rem;padding:1.25rem 0;border-top:1px solid var(--line)}
.logg li:last-child{border-bottom:1px solid var(--line)}
.logg time{font-weight:600;color:var(--moss)}
.logg h3{font-size:1.15rem;margin-bottom:.35rem}
.logg p{margin:0;color:var(--muted)}
@media (max-width:600px){.logg li{grid-template-columns:1fr;gap:.25rem}}

/* Kullkort på startsidan */
.tva{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
@media (max-width:700px){.tva{grid-template-columns:1fr}}
.kullkort{background:var(--spruce-2);border-radius:6px;padding:1.5rem;color:var(--birch);text-decoration:none;display:grid;grid-template-columns:96px 1fr;gap:1.25rem;align-items:center}
.kullkort:hover{background:#355e4d}
.kullkort img{width:96px;height:96px;object-fit:cover;border-radius:50%}
.kullkort b{display:block;font-size:1.25rem}
.kullkort span{opacity:.8;font-size:.95rem}

/* Valpar */
.kull{padding:clamp(3rem,6vw,4.5rem) 0;border-top:1px solid var(--line)}
.kull-head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,5vw,4rem);margin-bottom:2.5rem}
@media (max-width:860px){.kull-head{grid-template-columns:1fr}}
.kull-head h2{font-size:clamp(2rem,4vw,3rem)}
.kull-head .fakta{display:flex;gap:2.5rem;flex-wrap:wrap;margin-top:1.5rem}
.kull-head .fakta div{display:flex;flex-direction:column}
.kull-head .fakta b{font-size:2rem;color:var(--spruce);line-height:1}
.kull-head .fakta span{font-size:.9rem;color:var(--muted)}
.foraldrar{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.foralder{margin:0;background:var(--paper);border-radius:6px;overflow:hidden}
.foralder img{width:100%;aspect-ratio:4/3;object-fit:cover}
.foralder figcaption{padding:1rem 1.1rem 1.2rem}
.foralder figcaption b{display:block;font-size:1.05rem;line-height:1.25}
.foralder dl{display:grid;grid-template-columns:auto 1fr;gap:.15rem .9rem;margin:.6rem 0 0;font-size:.9rem}
.foralder dt{color:var(--muted)}.foralder dd{margin:0}

/* Stamtavlan – sidans signatur */
.stamtavla{margin-top:1rem}
.stamtavla h3{font-size:1.1rem;margin-bottom:1rem}
.tree{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr) minmax(0,1.25fr);grid-template-rows:repeat(8,auto);gap:6px 28px;font-size:.88rem;line-height:1.3}
.tree .n{position:relative;background:var(--paper);border-left:4px solid var(--line);padding:.55rem .75rem;border-radius:0 4px 4px 0;display:flex;flex-direction:column;justify-content:center}
.tree .n b{font-weight:600}
.tree .n small{color:var(--muted);font-size:.76rem;display:block;margin-bottom:.1rem}
.tree .n.h{border-left-color:var(--spruce-2)}
.tree .n.t{border-left-color:var(--rye)}
.tree .g1{grid-column:1}.tree .g2{grid-column:2}.tree .g3{grid-column:3}
.tree .g1::after,.tree .g2::after{content:"";position:absolute;right:-28px;top:50%;width:28px;border-top:1.5px solid var(--line)}
.tree .kast{background:#f6f1e1}
@media (max-width:760px){
  .tree{grid-template-columns:1fr;grid-template-rows:none}
  .tree .n{grid-column:1!important;grid-row:auto!important}
  .tree .g2{margin-left:1rem}.tree .g3{margin-left:2rem}
  .tree .g1::after,.tree .g2::after{display:none}
}

.villkor{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2rem 4rem}
@media (max-width:760px){.villkor{grid-template-columns:1fr}}
.villkor ol{margin:0;padding:0;list-style:none;counter-reset:v}
.villkor ol li{padding:.7rem 0;border-top:1px solid rgba(238,240,235,.2);display:flex;gap:1rem}
.villkor ol li::before{content:"✓";color:var(--rye);font-weight:700}

/* Hundar */
.register{width:100%;border-collapse:collapse;background:var(--paper);border-radius:6px;overflow:hidden;font-size:.95rem}
.register th,.register td{text-align:left;padding:.85rem 1rem;border-bottom:1px solid var(--line);vertical-align:middle}
.register thead th{font-size:.82rem;font-weight:600;color:var(--muted);background:#f6f7f4}
.register td img{width:64px;height:64px;object-fit:cover;border-radius:50%}
.register td b{display:block}
.register .kall{color:var(--muted)}
.tablewrap{overflow-x:auto;margin-bottom:3rem}
.grupprubrik{font-size:1.5rem;margin:0 0 1rem}
.hundkort{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1.5rem;margin-bottom:3.5rem}
.hundkort figure{margin:0;background:var(--paper);border-radius:6px;overflow:hidden}
.hundkort img{width:100%;aspect-ratio:1;object-fit:cover}
.hundkort figcaption{padding:1rem 1.1rem 1.2rem}
.hundkort h3{font-size:1.15rem}
.hundkort .data{display:flex;gap:1rem;margin:.5rem 0;font-weight:600;font-size:.9rem;color:var(--spruce-2)}
.hundkort p{font-size:.9rem;color:var(--muted);margin:0}

/* Tidigare kullar */
.kullrad{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:1rem}
.kullrad figure{margin:0}
.kullrad img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:4px}
.kullrad figcaption{font-size:.85rem;margin-top:.5rem;line-height:1.35}
.kullrad figcaption b{display:block;font-size:.95rem}
.kullrad figcaption .farg{color:var(--muted)}
.namnlista{columns:3 220px;column-gap:2rem;list-style:none;margin:0;padding:0;font-size:.95rem}
.namnlista li{break-inside:avoid;padding:.5rem 0;border-top:1px solid var(--line)}
.namnlista .kall{color:var(--muted)}

/* Om oss */
.omoss{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(2rem,5vw,4rem);align-items:start}
@media (max-width:820px){.omoss{grid-template-columns:1fr}}
.omoss .bilder{display:grid;gap:1rem}
.omoss .bilder img{border-radius:4px;width:100%}
.ingress{font-size:1.3rem;line-height:1.5;color:var(--spruce)}
.minne{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:0 2rem}
.minne li{padding:.8rem 0;border-top:1px solid rgba(238,240,235,.2)}
.minne b{display:block;font-weight:600}
.minne span{opacity:.75;font-size:.9rem}
.lankar{columns:3 200px;list-style:none;padding:0;margin:0}
.lankar li{padding:.3rem 0}

/* Sidfot */
.fot{background:var(--ink);color:#c9d0cb;padding:3rem 0;font-size:.95rem}
.fot .wrap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem}
@media (max-width:760px){.fot .wrap{grid-template-columns:1fr}}
.fot b{color:#fff;display:block;margin-bottom:.4rem}
.fot a{color:#fff}
.fot address{font-style:normal}

@media (max-width:560px){.foraldrar{grid-template-columns:1fr}.kull-head .fakta{gap:1.5rem}}
