/* v49 cleaned (no !important) */

:root{
  --ink:#e7ebf4; --muted:#c8d0dd; --line:#263047; --accent:#d8b870; --red:#a64b4b; --max:1120px;
  --warm:#f8f5ef;
}
@font-face{ font-family:'Recoleta'; src:url('/assets/fonts/Recoleta-Regular.otf') format('opentype'); font-weight:400; font-style:normal; font-display:swap; }
@font-face{ font-family:'Recoleta'; src:url('/assets/fonts/Recoleta-Bold.otf') format('opentype'); font-weight:800; font-style:normal; font-display:swap; }
@font-face{ font-family:'Recoleta'; src:url('/assets/fonts/Recoleta-Light.otf') format('opentype'); font-weight:300; font-style:normal; font-display:swap; }
*{box-sizing:border-box}
html,body{height:100%}
body{ margin:0; background:#0b1020; color:var(--ink); font-family:'Recoleta', ui-serif, Georgia, serif; line-height:1.6; min-height:100dvh; }
header{position:sticky; top:0; z-index:20; background:rgba(7,10,18,.55); backdrop-filter:blur(6px) saturate(140%); border-bottom:1px solid var(--line)}
.wrap{max-width:var(--max); margin:auto; padding:16px 24px}
.nav{display:flex; align-items:center; gap:16px}
.brand{font-weight:800; letter-spacing:.02em; font-size:18px}
.brand a{color:#fff; text-decoration:none}
.spacer{flex:1}
nav ul{display:flex; gap:18px; list-style:none; margin:0; padding:0}
nav a{padding:8px 10px; border-radius:10px; letter-spacing:.06em; text-transform:uppercase; font-size:.82rem; color:var(--muted); text-decoration:none}
nav a:hover, nav a[aria-current="page"]{color:#fff}
a:focus-visible, button:focus-visible{outline:3px solid #99b2ff; outline-offset:2px; border-radius:10px}

.menu-btn{display:none; appearance:none; background:rgba(255,255,255,.08); color:#fff; border:1px solid rgba(255,255,255,.2); padding:10px 12px; border-radius:12px; font-family:inherit}
@media (max-width: 960px){
  .menu-btn{display:inline-flex; align-items:center; gap:8px}
  nav{position:fixed; top:64px; right:16px; background:rgba(7,10,18,.9); border:1px solid rgba(255,255,255,.18); border-radius:14px; padding:12px; display:none;}
  nav.open{display:block}
  nav ul{flex-direction:column; gap:8px}
}

.cta{display:inline-flex; align-items:center; gap:.6ch; padding:12px 18px; border-radius:999px; font-weight:800; box-shadow:0 6px 18px rgba(0,0,0,.22)}
.cta.gold{background:var(--accent); color:#1a1a1a}
.cta.low{background:var(--red); color:#fff}
.cta.secondary{background:transparent; border:1px solid #e8dfcd; color:#fff}
.cta.disabled{opacity:.6; pointer-events:none}

.hero{min-height:100dvh; display:grid; place-items:center; position:relative; isolation:isolate;}
.hero::before{ content:""; position:fixed; inset:0; z-index:-2; background:60% center / cover no-repeat url('/assets/hero.jpg'); filter:grayscale(100%) contrast(98%) brightness(90%); }
.hero::after{ content:""; position:fixed; inset:0; z-index:-1; background:radial-gradient(1200px 800px at 20% 20%, rgba(68,97,150,.18), rgba(7,10,18,.6) 60%), linear-gradient(180deg, rgba(12,18,32,.55), rgba(7,10,18,.55)); }
.title{ text-align:center; padding:20px; margin-top:-64px; transform: translateY(-10vh); }
.logo-top{ display:block; font-weight:400; letter-spacing:0.10em; font-size:clamp(58px, 10vw, 148px); line-height:0.9; color:var(--warm); text-transform:none; white-space:nowrap; opacity:.88; }
.logo-sub{ display:block; margin-top:0.45rem; font-weight:300; letter-spacing:0.02em; font-size:clamp(18px, 2.1vw, 36px); color:var(--warm); white-space:nowrap; transform: translateX(-2px); }

.decor{position:absolute; inset:0; pointer-events:none; z-index:1}
.dot, .pill{position:absolute; background:rgba(248,245,239,0.85)}
.dot{ width:14px; height:14px; border-radius:50% }
.pill{ height:14px; width:64px; border-radius:999px }
.decor .dot.dot1{ left:6%; top:30% }
.decor .dot.dot2{ left:6%; top:38% }
.decor .pill.right{ right:6%; top:36% }
@media (max-width: 960px){
  .dot{ width:12px; height:12px }
  .pill{ height:12px; width:48px }
  .decor .dot.dot1{ left:26px; top:20vh }
  .decor .dot.dot2{ left:26px; top:27vh }
  .decor .pill.right{ right:18px; top:24vh }
  .title{ transform: translateY(-6vh); }
}

.main{padding-block:40px}
h1{font:800 42px/1.1 'Recoleta', ui-serif, Georgia, serif; letter-spacing:.01em; margin:0 0 16px}
.section{background:#fffefb; color:#0c1424; border:1px solid #e8dfcd; border-radius:18px; padding:18px; box-shadow:0 10px 24px rgba(0,0,0,.22)}

.events{display:grid; grid-template-columns:1fr; gap:14px}
.event{background:#fffefb; border:1px solid #e8dfcd; border-radius:16px}
.event .row{display:grid; grid-template-columns:160px 1fr 220px; gap:22px; align-items:center; padding:18px 24px; min-height:118px}
.date{font-weight:800; font-size:20px; color:#111827; white-space:nowrap}
.info{display:flex; flex-direction:column; gap:8px}
.venue>span{font-weight:800; font-size:22px; color:#0c1424; line-height:1.25; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden}
.map-line .map-link{text-decoration:underline; text-underline-offset:3px; color:#163072; font-weight:600}
.actions{display:flex; justify-content:flex-end}

@media (max-width: 960px){
  .event .row{grid-template-columns:1fr; gap:8px; padding:14px; min-height:auto}
  .date{font-weight:800; font-size:18px; color:#0c1424; opacity:.95; margin-bottom:4px; order:-1}
  .actions{justify-content:center}
  .cta{max-width:280px; width:90%; text-align:center}
  .venue>span{-webkit-line-clamp:unset}
}
footer{border-top:1px solid var(--line); background:rgba(7,10,18,.55); color:#c8d0dd}


/* v4.7.1 – finjuster mobil-prikker */
@media (max-width: 960px){
  .hero .decor .dot.dot1{ left:30px; top:26vh; }
  .hero .decor .dot.dot2{ left:30px; top:33vh; }
  .hero .decor .pill.right{ right:18px; top:28vh; }
}

/* v4.7.1 – Om Emil split card */
.about-card{
  display:grid; grid-template-columns: 1.1fr 1.4fr; gap:28px; align-items:stretch;
  background:#fffefb; color:#0c1424; border:1px solid #e8dfcd; border-radius:22px; 
  padding:18px; box-shadow:0 10px 24px rgba(0,0,0,.22);
}
.about-media{
  position:relative; border-radius:18px; overflow:hidden; background:#0b1020;
}
.about-media img{
  display:block; width:100%; height:100%; object-fit:cover; filter:contrast(96%) saturate(96%);
  transform:scale(1.02);
}
.about-body{display:flex; flex-direction:column; gap:12px; justify-content:center}
.about-body p{margin:0 0 8px}
.about-body details{margin-top:6px}
@media (max-width: 960px){
  .about-card{ grid-template-columns: 1fr; }
  .about-media{ height: 48vh; }
}


/* === Booking info styling (light, modern mailto) === */
.booking-info{ color:#f3f4ff; font-size:1.1rem; opacity:1; margin:8px 0 18px; }
.booking-info a{ color:#f3f4ff; text-decoration:none; font-weight:600; }
.booking-info a:hover{ text-decoration:underline; text-decoration-thickness:2px; }


/* === Booking contrast hotfix (v49b) ===
   Ensures booking info is clearly visible on white .section cards */
.section .booking-info{ 
  color:#0c1424;        /* dark ink on white card */
  opacity:1;
}
.section .booking-info a{
  color:#0c1424;
  text-decoration:none;
  font-weight:700;
}
.section .booking-info a:hover{ text-decoration:underline; text-decoration-thickness:2px; }

/* Neutralize any global low-opacity paragraph rules inside .section */
.section p{ opacity:1; }


/* === v50: page-scoped rules === */
/* Booking page: white card + dark text */
.page-booking .section{ background:#ffffff; color:#0c1424; }
.page-booking .booking-info{ color:#0c1424; opacity:1; }
.page-booking .booking-info a{ color:#0c1424; text-decoration:none; font-weight:700; }
.page-booking .booking-info a:hover{ text-decoration:underline; text-decoration-thickness:2px; }
/* Avoid global paragraph dimming on booking card */
.page-booking .section p{ opacity:1; }

/* Om page: restore blue/glass look */
.page-about .section{ background:none; box-shadow:none; border:none; }
.page-about .about-card{
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
  color:#eaf2ff;
  border:1px solid rgba(170,200,255,.18);
  border-radius:22px;
  box-shadow:0 10px 30px rgba(10,25,60,.35), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter: blur(12px) saturate(135%);
}
.page-about .about-body, .page-about .about-body p, .page-about .about-body strong{ color:#eaf2ff; opacity:0.92; }
.page-about .about-media{ border:1px solid rgba(170,200,255,.18); box-shadow:0 12px 30px rgba(8,15,30,.45); }

