:root {
    --primary:#0E3B2E;   /* pine */
    --accent:#8E2A2A;    /* rune red */
    --ink:#1E293B;
    --muted:#475569;
    --bg:#FFFFFF;
    --bg-soft:#F8FAFC;
    --border:#E5E7EB;
    --radius:12px;
}

/* Base */
body {
    margin:0;
    font-family: Inter, system-ui, sans-serif;
    font-size:16px;
    line-height:1.7;
    color:var(--ink);
    background:var(--bg);
}
h1, .mainTitle { font-family: Norse, Geneva, Tahoma, sans-serif; letter-spacing:1px; }
h2, h3 { font-family: Geneva, Tahoma, sans-serif; font-weight:600; }
a { color:var(--primary); text-decoration:none; }
a:hover { text-decoration:underline; }

/* Hero */
.hero-section {
    position:relative; min-height:45vh;
    display:grid; place-items:center; text-align:center; color:#fff;
    background:url("../images/sites/borgund/borgund-hero.jpg") center/cover no-repeat;
}
.hero-section::before {
    content:""; position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.25));
}
.hero-inner { position:relative; z-index:1; max-width:900px; padding:0 16px; }
.mainTitle { font-size:clamp(2.4rem, 5vw, 3.6rem); margin-bottom:.4rem; color:#fff; }
.under-title { font-size:1.1rem; opacity:.95; }
.hero-ctas { margin-top:18px; display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

/* Buttons */
.btn {
    display:inline-flex; align-items:center;
    padding:10px 18px; border-radius:999px; font-weight:600;
    background:var(--primary); color:#fff; border:2px solid var(--primary);
    transition:background .15s ease, color .15s ease, transform .06s ease, border-color .15s ease;
}
.btn:hover { background:var(--accent); border-color:var(--accent); color:#fff; }
.btn:active { transform:translateY(1px); }
.btn.outline { background:transparent; color:var(--primary); border-color:var(--primary); }
.btn.outline:hover { background:var(--primary); color:#fff; }

/* Hero-specific button visibility */
.hero-ctas .btn {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
    box-shadow: 0 2px 10px rgba(0,0,0,.45);
}
.hero-ctas .btn:hover {
    background: var(--accent);
    border-color: var(--accent);
}
.hero-ctas .btn.outline {
    background: rgba(255,255,255,0.16);
    color: #fff;
    border-color: #ffffff;
    box-shadow: 0 2px 10px rgba(0,0,0,.35);
}
.hero-ctas .btn.outline:hover {
    background: #ffffff;
    color: var(--primary);
    border-color: #ffffff;
}

/* Breadcrumbs */
.breadcrumbs { max-width:1100px; margin:16px auto; padding:0 16px; font-size:.95rem; }
.breadcrumbs .current { color:#64748b; }

/* Cards / Facts */
.facts {
    max-width:1100px; margin:28px auto; padding:0 16px;
    display:grid; gap:18px;
}
@media (min-width:800px){ .facts { grid-template-columns:repeat(3,1fr); } }
.card {
    background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:18px;
    box-shadow:0 4px 14px rgba(0,0,0,.05);
    transition:transform .15s ease, box-shadow .15s ease;
}
.card:hover { transform:translateY(-2px); box-shadow:0 10px 20px rgba(0,0,0,.08); }
.card h2 { margin-top:0; font-size:1.2rem; }

/* Story */
.story { max-width:900px; margin:24px auto; padding:0 16px; }

/* Gallery */
.gallery {
    max-width:1100px; margin:36px auto; padding:0 16px;
    display:grid; gap:16px;
}
@media (min-width:800px){ .gallery { grid-template-columns:repeat(auto-fit, minmax(240px,1fr)); } }
.gallery figure { margin:0; border-radius:var(--radius); overflow:hidden; background:var(--bg-soft); border:1px solid var(--border); }
.gallery img { width:100%; display:block; aspect-ratio:4/3; object-fit:cover; transition:transform .3s ease; }
.gallery img:hover { transform:scale(1.04); }
.gallery figcaption { padding:8px 10px; font-size:.9rem; color:var(--muted); }

/* Map */
.map-cta { max-width:900px; margin:24px auto 32px; padding:0 16px; }
.map-wrap {
    position: relative;
    aspect-ratio: 16/9;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    overflow: hidden;
}
.map-wrap iframe { width: 100%; height: 100%; border: 0; }

/* Plan trip */
.plan-trip { max-width:900px; margin:24px auto; padding:0 16px; }
.checklist { margin-bottom:12px; padding-left:18px; }
.checklist li { margin:.35rem 0; }

/* Nearby section */
.nearby {
    max-width:900px;
    margin:32px auto;
    padding:0 16px;
}
.nearby-list {
    padding-left:18px;
    line-height:1.6;
}
.nearby-list a {
    color:var(--primary);
}
.nearby-list a:hover {
    text-decoration:underline;
}

/* FAQ section */
.faq {
    max-width:900px;
    margin:40px auto;
    padding:0 16px;
}
.faq details {
    background:var(--bg-soft);
    border:1px solid var(--border);
    border-radius:var(--radius);
    padding:12px 16px;
    margin-bottom:12px;
}
.faq summary {
    cursor:pointer;
    font-weight:600;
    outline:none;
}
.faq details[open] {
    background:#fff;
    box-shadow:0 4px 10px rgba(0,0,0,.04);
}

/* Footer */
.site-footer { margin-top:48px; background:var(--bg-soft); padding:20px; text-align:center; color:var(--muted); }

/* Accessibility */
.visually-hidden-focusable{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.visually-hidden-focusable:focus{ left:16px; top:16px; padding:.5rem .75rem; background:#fff; border:2px solid var(--primary); border-radius:8px; z-index:9999; }
a:focus-visible, .btn:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }

.card .buttons {
    margin-top: 1rem; /* adjust to taste, e.g. 1.5rem */
}