/* WildHeim – farger og skrifter. Endre variablene under for å justere hele siden. */
@font-face{font-family:"Playfair Display";font-weight:400;font-style:normal;font-display:swap;src:url(/fonts/playfair-display-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Playfair Display";font-weight:400;font-style:italic;font-display:swap;src:url(/fonts/playfair-display-latin-400-italic.woff2) format("woff2")}
@font-face{font-family:"Playfair Display";font-weight:700;font-style:normal;font-display:swap;src:url(/fonts/playfair-display-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Inter";font-weight:300;font-style:normal;font-display:swap;src:url(/fonts/inter-latin-300-normal.woff2) format("woff2")}
@font-face{font-family:"Inter";font-weight:400;font-style:normal;font-display:swap;src:url(/fonts/inter-latin-400-normal.woff2) format("woff2")}

:root{
  --bg:#1a1a18;          /* bakgrunn */
  --card:#222220;        /* kort */
  --line:#3a3933;        /* streker */
  --cream:#e9dfcd;       /* hovedtekst */
  --muted:#c4b9a5;       /* sekundærtekst (lysere enn før, for lesbarhet) */
  --gold:#8f7048;        /* knapper */
  --gold-text:#c9a36a;   /* gull som tekst på mørk bakgrunn */
  --heading:"Playfair Display",Georgia,serif;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --max:1200px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:5rem}
body{background:var(--bg);color:var(--cream);font-family:var(--sans);font-weight:400;line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:var(--max);margin:0 auto;padding:0 1.5rem}
@media(min-width:768px){.wrap{padding:0 2.5rem}}

/* Header */
.site-header{position:fixed;inset:0 0 auto 0;z-index:50;background:rgba(26,26,24,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.header-row{display:flex;align-items:center;justify-content:space-between;height:4rem}
@media(min-width:768px){.header-row{height:5rem}}
.brand{display:flex;align-items:center;gap:.75rem;text-decoration:none}
.brand img{height:2.4rem;width:auto}
.brand-name{font-family:var(--heading);font-weight:700;font-size:1.4rem;letter-spacing:-.01em}
.brand-name span,.hero-brand span{color:var(--gold-text)}
.nav{display:flex;align-items:center;gap:2rem}
.nav a:not(.btn-outline){font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;position:relative;padding:.25rem 0}
.nav a:not(.btn-outline)::after{content:"";position:absolute;left:0;bottom:-2px;height:1px;width:0;background:var(--gold-text);transition:width .4s}
.nav a:not(.btn-outline):hover::after{width:100%}
.btn-outline{font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;padding:.5rem 1.25rem;border:1px solid var(--gold-text);color:var(--gold-text);transition:.3s}
.btn-outline:hover{background:var(--gold);color:#fff;border-color:var(--gold)}
.lang{background:none;border:1px solid var(--line);color:var(--muted);font:inherit;font-size:.75rem;letter-spacing:.15em;padding:.3rem .6rem;cursor:pointer}
.lang:hover{color:var(--cream);border-color:var(--muted)}
.burger{display:none;background:none;border:0;padding:.5rem;cursor:pointer;flex-direction:column;gap:6px}
.burger span{display:block;width:24px;height:1px;background:var(--cream)}
@media(max-width:767px){
  .burger{display:flex}
  .nav{position:absolute;top:4rem;left:0;right:0;background:var(--bg);border-bottom:1px solid var(--line);flex-direction:column;align-items:flex-start;gap:1.25rem;padding:1.5rem;display:none}
  .nav.open{display:flex}
}

/* Hero */
.hero{position:relative;min-height:100vh;display:flex;align-items:flex-end;overflow:hidden}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-fade{position:absolute;inset:0;background:linear-gradient(to top,var(--bg) 0%,rgba(26,26,24,.75) 30%,rgba(26,26,24,.35) 60%,rgba(26,26,24,.2) 100%)}
.hero-content{position:relative;z-index:1;width:100%;padding-top:8rem;padding-bottom:5rem}
.hero-brand{font-family:var(--heading);font-weight:700;font-size:clamp(2.5rem,7vw,6rem);line-height:1;letter-spacing:-.01em;margin-bottom:1.25rem}
.hero-tagline{font-family:var(--heading);font-style:italic;font-size:clamp(1.5rem,3.6vw,2.6rem);line-height:1.2;margin-bottom:.75rem}
.hero-note{max-width:26rem;font-size:.9rem;color:var(--muted);margin-bottom:2.5rem}
.hero h1{font-family:var(--heading);font-weight:700;font-size:clamp(2.6rem,7vw,5.5rem);line-height:1.05;letter-spacing:-.02em;margin-bottom:1.5rem}
.hero h1 em{font-style:normal;color:var(--gold-text)}
.hero-sub{max-width:32rem;font-size:1.05rem;color:var(--muted);margin-bottom:2.25rem}
.hero-cta{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap}
.btn{display:inline-block;background:var(--gold);color:#fff;border:0;font:inherit;font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;padding:.85rem 2rem;text-decoration:none;cursor:pointer;transition:.3s}
.btn:hover{background:#a58257}
.link-underline{font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:2px}
.link-underline:hover{border-color:var(--gold-text)}

/* Sections */
.section{padding:6rem 0}
.eyebrow{font-size:.75rem;letter-spacing:.35em;text-transform:uppercase;color:var(--gold-text);margin-bottom:.75rem}
h2{font-family:var(--heading);font-weight:700;font-size:clamp(2rem,5vw,3.5rem);line-height:1.1;margin-bottom:3rem}

/* Cabins */
.cabins{display:grid;gap:1.5rem;grid-template-columns:1fr}
@media(min-width:768px){.cabins{grid-template-columns:1fr 1fr}}
.cabin{background:var(--card);overflow:hidden}
.cabin-img{position:relative;aspect-ratio:4/3;overflow:hidden}
.cabin-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.cabin:hover .cabin-img img{transform:scale(1.05)}
.cabin-img::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,var(--card),transparent 55%)}
.tag{position:absolute;top:1rem;left:1rem;z-index:1;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;padding:.25rem .75rem;background:rgba(26,26,24,.8);color:var(--gold-text)}
.cabin-body{padding:1.5rem 1.75rem 2rem}
.place{font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-text);margin-bottom:.4rem}
.cabin h3{font-family:var(--heading);font-weight:700;font-size:1.9rem;margin-bottom:.6rem}
.cabin p.desc{color:var(--muted);margin-bottom:1rem}
.facts{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;font-size:.85rem;color:var(--muted);margin-bottom:1.5rem}
.facts li::before{content:"✦ ";color:var(--gold-text);font-size:.65rem}
.cabin .price{font-size:.9rem;margin-bottom:1.25rem}

/* Mood */
.mood{position:relative;min-height:28rem;display:flex;align-items:center;overflow:hidden}
.mood img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mood-shade{position:absolute;inset:0;background:rgba(26,26,24,.62)}
.mood-inner{position:relative;max-width:46rem;margin:0 auto;padding:4rem 1.5rem;text-align:center}
.ornament{display:flex;align-items:center;gap:1rem;color:var(--gold-text);font-size:.7rem;letter-spacing:.3em}
.ornament i{flex:1;height:1px;background:var(--line)}
blockquote{font-family:var(--heading);font-style:italic;font-size:clamp(1.6rem,4vw,2.6rem);line-height:1.3;margin:2.5rem 0 1.25rem}
.mood-inner p{color:var(--muted);margin-bottom:2.5rem}

/* Why */
.why{display:grid;gap:2rem;grid-template-columns:1fr}
@media(min-width:768px){.why{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.why{grid-template-columns:repeat(4,1fr)}}
.why article{border-top:1px solid var(--line);padding-top:1.5rem}
.num{font-family:var(--heading);color:var(--gold-text);font-size:1.1rem}
.why h3{font-family:var(--heading);font-size:1.4rem;margin:.5rem 0}
.why p{color:var(--muted);font-size:.95rem}

/* Contact */
.contact{background:var(--card);border-top:1px solid var(--line)}
.contact-grid{display:grid;gap:3rem;grid-template-columns:1fr}
@media(min-width:900px){.contact-grid{grid-template-columns:1fr 1.3fr}}
.contact h2{margin-bottom:1.25rem}
.lead{color:var(--muted);margin-bottom:1.25rem}
.small{font-size:.8rem;color:var(--muted)}
.small a{color:var(--gold-text)}
.form{display:grid;gap:1rem}
.row{display:grid;gap:1rem;grid-template-columns:1fr}
@media(min-width:600px){.row{grid-template-columns:1fr 1fr}}
label span{display:block;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:.35rem}
input,select,textarea{width:100%;background:var(--bg);color:var(--cream);border:1px solid var(--line);padding:.75rem .9rem;font:inherit;font-weight:400;border-radius:0}
input:focus,select:focus,textarea:focus{outline:2px solid var(--gold-text);outline-offset:1px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.status{min-height:1.4em;font-size:.9rem}
.status.ok{color:#9fc79a}.status.err{color:#e0907f}

/* Footer */
.site-footer{padding:4rem 0 2rem;border-top:1px solid var(--line)}
.foot-ornament{display:flex;align-items:center;gap:1rem;color:var(--gold-text);font-family:var(--heading);margin-bottom:3rem}
.foot-ornament i{flex:1;height:1px;background:var(--line)}
.foot-grid{display:grid;gap:2.5rem;grid-template-columns:1fr}
@media(min-width:768px){.foot-grid{grid-template-columns:2fr 1fr 1fr}}
.foot-grid img{width:110px;height:auto;margin-bottom:1rem}
.foot-quote{font-family:var(--heading);font-style:italic;color:var(--muted);max-width:22rem}
.foot-h{font-size:.72rem;letter-spacing:.25em;text-transform:uppercase;color:var(--gold-text);margin-bottom:.9rem}
.site-footer ul{list-style:none}
.site-footer li{margin-bottom:.4rem}
.site-footer a{text-decoration:none;color:var(--muted)}
.site-footer a:hover{color:var(--cream)}
.site-footer p{color:var(--muted);font-size:.9rem}
.copy{margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--line);font-size:.8rem!important}

@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Hytte-detaljer, galleri og anmeldelser */
.actions{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}
.btn-ghost{background:none;color:var(--gold-text);border:1px solid var(--gold-text);font:inherit;font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;padding:.85rem 1.5rem;cursor:pointer;transition:.3s}
.btn-ghost:hover{background:var(--gold);color:#fff;border-color:var(--gold)}
.cabin-img.no-photo{background:linear-gradient(135deg,#2a2a26,#1d1d1a)}
.cabin-img.no-photo .soon{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--heading);font-style:italic;color:var(--muted);font-size:1.3rem;z-index:1}
.reviews{display:grid;gap:1.25rem;grid-template-columns:1fr;margin-bottom:1.5rem}
@media(min-width:768px){.reviews{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.reviews{grid-template-columns:repeat(3,1fr)}}
.review{background:var(--card);padding:1.5rem;border-top:2px solid var(--gold)}
.review .stars{color:var(--gold-text);letter-spacing:.15em;margin-bottom:.6rem;font-size:.95rem}
.review blockquote{font-family:var(--sans);font-style:normal;font-size:.95rem;line-height:1.6;margin:0 0 1rem;color:var(--cream)}
.review figcaption{font-size:.8rem;letter-spacing:.15em;text-transform:uppercase;color:var(--gold-text)}
.dlg{width:min(960px,94vw);max-height:92vh;margin:auto;background:var(--bg);color:var(--cream);border:1px solid var(--line);padding:0;overflow:auto}
.dlg::backdrop{background:rgba(0,0,0,.8)}
#dlg-body{padding:2rem 1.5rem 2.5rem}
@media(min-width:768px){#dlg-body{padding:2.5rem 2.5rem 3rem}}
.dlg-close{position:sticky;top:.5rem;float:right;margin:.5rem .5rem 0 0;z-index:5;background:var(--card);color:var(--cream);border:1px solid var(--line);width:2.5rem;height:2.5rem;font-size:1.5rem;line-height:1;cursor:pointer}
.dlg-title{font-family:var(--heading);font-size:2.2rem;margin-bottom:.25rem}
.dlg h4{font-family:var(--heading);font-size:1.3rem;margin:2rem 0 .6rem;color:var(--gold-text)}
.dlg-p{color:var(--muted);margin-bottom:.8rem}
.dlg-ul{list-style:none;color:var(--muted)}
.dlg-ul li{padding:.25rem 0 .25rem 1.2rem;position:relative}
.dlg-ul li::before{content:"✦";position:absolute;left:0;color:var(--gold-text);font-size:.6rem;top:.55rem}
.dlg .btn{margin-top:2rem}
.gal{margin:1.5rem 0 .5rem}
.gal-stage{position:relative;background:#111;display:flex;justify-content:center}
.gal-stage img{max-height:min(70vh,960px);width:auto;max-width:100%;object-fit:contain}
.gal-nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(26,26,24,.7);color:var(--cream);border:0;width:2.8rem;height:3.4rem;font-size:2rem;cursor:pointer}
.gal-nav.prev{left:0}.gal-nav.next{right:0}
.gal-cap{font-size:.85rem;color:var(--muted);margin:.6rem 0}
.gal-thumbs{display:flex;gap:.4rem;overflow-x:auto;padding-bottom:.4rem}
.gal-thumbs button{flex:0 0 auto;border:2px solid transparent;background:none;padding:0;cursor:pointer;opacity:.6}
.gal-thumbs button.on{border-color:var(--gold-text);opacity:1}
.gal-thumbs img{height:64px;width:auto}

.rating{background:var(--card);border-top:2px solid var(--gold);padding:1.75rem;margin-bottom:1.5rem;text-align:center}
.rating-top{display:flex;align-items:center;justify-content:center;gap:1.25rem;flex-wrap:wrap;margin-bottom:.5rem}
.rating-score{font-family:var(--heading);font-size:3rem;color:var(--gold-text);line-height:1}
.rating-fav{font-family:var(--heading);font-size:1.4rem;color:var(--cream)}
.rating-cats{list-style:none;display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem 1.5rem;margin-top:1.25rem;text-align:left}
@media(min-width:768px){.rating-cats{grid-template-columns:repeat(6,1fr)}}
.rating-cats li{display:flex;flex-direction:column;gap:.2rem;font-size:.85rem;color:var(--muted);border-top:1px solid var(--line);padding-top:.5rem}
.rating-cats strong{color:var(--cream);font-size:1.1rem;font-weight:400}
.review figcaption{display:flex;align-items:center;gap:.7rem}
.avatar{display:inline-flex;align-items:center;justify-content:center;width:2.2rem;height:2.2rem;border-radius:50%;background:var(--gold);color:var(--bg);font-family:var(--heading);font-size:1rem;letter-spacing:0}

/* ---- Hyttesider ---- */
.btn-ghost{display:inline-block;text-decoration:none}
.c-hero{position:relative;min-height:62vh;display:flex;align-items:flex-end;padding-top:5rem;background:var(--card);overflow:hidden}
.c-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.c-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,var(--bg) 4%,rgba(26,26,24,.35) 60%,rgba(26,26,24,.55))}
.c-hero-in{position:relative;z-index:1;padding-bottom:2.5rem;width:100%}
.c-hero h1{font-family:var(--heading);font-size:clamp(2.6rem,7vw,5rem);line-height:1.05;margin:.25rem 0 .75rem}
.c-price{color:var(--gold-text);font-size:1.1rem}
.back{display:inline-block;color:var(--muted);text-decoration:none;font-size:.85rem;margin-bottom:1.5rem}
.back:hover{color:var(--gold-text)}
.c-grid{display:grid;gap:2.5rem;padding-top:2rem;padding-bottom:5rem}
@media(min-width:960px){.c-grid{grid-template-columns:minmax(0,1fr) 300px;align-items:start}.c-aside{position:sticky;top:6rem}}
.c-aside{background:var(--card);border-top:2px solid var(--gold);padding:1.5rem}
.c-aside h2{font-family:var(--heading);font-size:1.4rem;margin-bottom:.75rem}
.c-aside .btn{margin-top:1.25rem;display:block;text-align:center}
.c-sec{margin-bottom:3rem}
.c-sec>h2{font-family:var(--heading);font-size:1.9rem;color:var(--gold-text);margin-bottom:1rem}
.lead{font-size:1.15rem;line-height:1.7;margin-bottom:1.25rem}
.facts.big{font-size:.95rem}
.grp{margin-bottom:2.25rem}
.grp h3{font-family:var(--heading);font-size:1.35rem;margin-bottom:.35rem}
.photo-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem;margin-top:.75rem}
@media(min-width:700px){.photo-grid{grid-template-columns:repeat(3,1fr)}}
.photo-grid button{padding:0;border:0;background:var(--card);cursor:zoom-in;aspect-ratio:3/4;overflow:hidden}
.photo-grid img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.photo-grid button:hover img,.photo-grid button:focus-visible img{transform:scale(1.04)}
.amen-grid{display:grid;gap:1.5rem}
@media(min-width:700px){.amen-grid{grid-template-columns:repeat(3,1fr)}}
.amen-grid h3,.notinc{font-family:var(--heading);font-size:1.15rem;margin-bottom:.4rem}
.notinc{margin-top:1.75rem}
.dlg-ul.no li::before{content:"–"}
.lb{width:100vw;max-width:100vw;height:100vh;max-height:100vh;margin:0;background:rgba(10,10,9,.96);border:0;color:var(--cream);padding:0}
.lb::backdrop{background:rgba(0,0,0,.9)}
.lb[open]{display:flex;flex-direction:column;align-items:center;justify-content:center}
.lb-stage{position:relative;display:flex;justify-content:center;align-items:center;max-width:100%}
.lb-stage img{max-height:84vh;max-width:100vw;width:auto;object-fit:contain}
.lb-close{position:absolute;top:.75rem;right:.75rem;background:var(--card);color:var(--cream);border:1px solid var(--line);width:2.6rem;height:2.6rem;font-size:1.5rem;cursor:pointer;z-index:3}
.lb .gal-cap{margin-top:.75rem;text-align:center}

/* Overstyring: hero uten strukket bakgrunnsbilde */
.c-hero{display:block;min-height:0;padding:6.5rem 0 1rem;background:radial-gradient(ellipse at 20% 0%,#2a2823 0%,var(--bg) 70%)}
.c-hero::after{display:none}
.c-hero-in{display:grid;gap:2rem;align-items:center;padding-bottom:1rem}
@media(min-width:860px){.c-hero-in.with-img{grid-template-columns:1fr minmax(300px,420px)}}
.c-hero-img img{position:static;width:100%;height:auto;max-height:70vh;object-fit:cover;border:1px solid var(--line);box-shadow:0 20px 60px rgba(0,0,0,.5)}

/* ---- Kart ---- */
.map-wrap{position:relative;max-width:1000px;margin:2rem auto 1rem;border:1px solid var(--line);box-shadow:0 20px 60px rgba(0,0,0,.45)}
.map-wrap img{display:block;width:100%;height:auto}
.pin{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;text-decoration:none;color:var(--cream)}
.pin i{width:14px;height:14px;border-radius:50%;background:var(--gold-text);border:2px solid var(--bg);box-shadow:0 0 0 1px var(--gold-text);position:relative}
.pin i::after{content:"";position:absolute;inset:-9px;border-radius:50%;border:1px solid var(--gold-text);opacity:.6;animation:pulse 2.6s ease-out infinite}
.pin span{position:absolute;bottom:22px;white-space:nowrap;font-family:var(--heading);font-size:.95rem;background:rgba(26,26,24,.88);padding:.15rem .6rem;border:1px solid var(--line)}
.pin.w span{right:-6px}.pin.e span{left:-6px}
.pin:hover span,.pin:focus-visible span{border-color:var(--gold-text);color:var(--gold-text)}
@media(max-width:600px){.pin span{font-size:.75rem;padding:.1rem .4rem}}
@keyframes pulse{from{transform:scale(.6);opacity:.7}to{transform:scale(1.6);opacity:0}}
/* ---- Runeskille ---- */
.rune-div{display:flex;justify-content:center;padding:1rem 1.5rem}
.rune-div img{width:min(520px,90%);height:auto;opacity:.9}
/* ---- Tekstur (korn over hele siden og sterkere over stemningsbildet) ---- */
body::before{content:"";position:fixed;inset:0;z-index:1;pointer-events:none;background:url(/img/grain.svg);opacity:.07;mix-blend-mode:overlay}
.mood{position:relative}
.mood::after{content:"";position:absolute;inset:0;pointer-events:none;background:url(/img/grain.svg);opacity:.18;mix-blend-mode:overlay;z-index:1}
.mood-inner{position:relative;z-index:2}
/* ---- Fade-in ved scrolling (slås på av fx.js) ---- */
.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .9s ease,transform .9s ease}
.js .reveal.in{opacity:1;transform:none}
.hero-img{will-change:transform}
@media(prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none}.pin i::after{animation:none}}

.plc{position:absolute;transform:translate(-50%,-50%);font-family:var(--heading);font-style:italic;font-size:.8rem;color:var(--muted);white-space:nowrap;text-shadow:0 0 6px #000,0 0 3px #000;pointer-events:none}
.plc::before{content:"";display:inline-block;width:5px;height:5px;background:var(--gold);transform:rotate(45deg);margin-right:.35rem;vertical-align:middle}
.plc.big{font-size:1.25rem;letter-spacing:.2em;text-transform:uppercase;font-style:normal;color:var(--gold-text);opacity:.85}
.plc.big::before{display:none}
.pin.here{pointer-events:none}
@media(max-width:600px){.plc{font-size:.62rem}.plc.big{font-size:.8rem}}
.plc.left{transform:translate(calc(-100% + 5px),-50%)}
