/* Fatima Wilson – additions only. Existing player styles remain intact. */
html { scroll-behavior: smooth; }
#fatima-nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 10000;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 4px;
  padding: 0 12px;
  background: #341f0e;
  border-bottom: 2px solid #704624;
}
#fatima-nav a:link, #fatima-nav a:visited {
  color: #f5ede3;
  font-size: 14px;
  font-weight: 500;
  padding: 2px 14px;
  line-height: 18px;
  border-radius: 5px;
  text-decoration: none;
}
#fatima-nav a:hover, #fatima-nav a:focus-visible {
  color: #fff;
  background: #704624;
}
#musik { scroll-margin-top: calc(var(--fatima-nav-height) + 12px); }
#about-content {
  color: #f5ede3;
  padding: 0 20px;
  text-align: center;
  scroll-margin-top: calc(var(--fatima-nav-height) + 12px);
}
#about-content .about-kicker { color: #d4aa72; letter-spacing: .24em; font-size: 13px; margin-bottom: 14px; }
#about h2 { font-size: clamp(32px, 5vw, 54px); font-weight: 600; }
#about-content .about-rule { width: 75px; height: 2px; background: #b7864c; margin: 26px auto; }
#about p { line-height: 1.85; font-size: 18px; }
#about-content .about-lead { font-size: 23px; }
#about-content .about-listen:link, #about-content .about-listen:visited {
  display: inline-block; margin-top: 24px; padding: 12px 26px;
  background: #341f0e; border: 1px solid #b7864c; border-radius: 6px;
  color: #fff; text-decoration: none; font-size: 16px;
}
#about-content .about-listen:hover { background: #704624; color: #fff; }
@media (max-width: 600px) { #about-content { padding: 0 18px; } #fatima-nav a:link { padding: 2px 12px; } }

/* Fatima one-page layout: fixed navigation and full-height sections */
:root { --fatima-nav-height: 24px; }
html { scroll-padding-top: calc(var(--fatima-nav-height) + 12px); }
body { margin: 0 !important; padding-top: var(--fatima-nav-height) !important; }
#fatima-nav { min-height: var(--fatima-nav-height); align-items: center; }
section { min-height: 100vh; padding: 150px 0; box-sizing: border-box; }
.fatima-about-section { background: #24170f; border-top: 3px solid #704624; text-align: center; }
#radioModeBtn { display: none !important; }
#toTop { display: none !important; }
#toTop.visible { display: flex !important; }
@media (max-width: 600px) {
  :root { --fatima-nav-height: 24px; }
  section { padding: 100px 0; }
}

/* Flytta de två sidobilderna och loggan 5 px uppåt. */
#leftCover, #rightCover, #albumLogo {
  transform: translateY(-15px);
}
#leftCover:hover, #rightCover:hover {
  transform: translateY(-5px) scale(1.02);
	
}


/* Contact – Fatima Wilson */
.fatima-contact-inner {max-width:1260px;margin:auto;}
.fatima-contact-section h2 {text-align:center;color:#e5bd72;font-size:clamp(32px,4vw,50px);margin-bottom:8px;}
.fatima-contact-subtitle{text-align:center;color:#e9d4b7;margin-bottom:55px;}
.fatima-contact-columns{margin:0 auto;}
.fatima-contact-card{display:flex;align-items:flex-start;gap:16px;font-size:16px;line-height:1.8;padding:12px;}
.fatima-contact-card p{margin:5px 0 15px;}
.fatima-contact-card strong{color:#fff;}
.fatima-contact-symbol{font-size:31px;color:#d6a34b;line-height:1.2;flex:0 0 34px;}
.fatima-contact-card a:link,.fatima-contact-card a:visited{color:#e5bd72;font-size:16px;text-decoration:none;overflow-wrap:anywhere;}
.fatima-contact-card a:hover{color:#fff;text-decoration:underline;}
.fatima-contact-bottom{text-align:center;border-top:1px solid rgba(229,189,114,.4);margin-top:55px;padding-top:25px;color:#e5d3bb;}
#contact {scroll-margin-top:calc(var(--fatima-nav-height) + 12px);}
/* Restore original scroll-to-top arrow and display only in later sections. */
#toTop{position:fixed;right:22px;bottom:24px;width:48px;height:48px;align-items:center;justify-content:center;border-radius:6px;background:#341f0e;border:1px solid #b7864c;color:#f5ede3!important;font-size:29px!important;text-decoration:none!important;z-index:9998;box-shadow:0 3px 12px rgba(0,0,0,.4);}
#toTop:hover{background:#704624;color:white!important;}
@media(max-width:767px){.fatima-contact-section{padding:85px 0 75px;}.fatima-contact-subtitle{margin-bottom:25px;}.fatima-contact-card{padding:8px 16px;}.fatima-contact-bottom{margin-top:30px;}}

/* Sektionerna fyller hela skärmhöjden, inklusive Contact-bakgrunden. */
.fatima-about-section, .fatima-contact-section {
  min-height: 110vh;
  width: 100%;
  box-sizing: border-box;
}

/* Video – full-width section with a responsive 16:9 MP4 player */
.fatima-video-section { background: #24170f; color: #f5ede3; text-align: center; display: flex; align-items: center; width: 100%; min-height: 100vh; min-height: 100dvh; }
.fatima-video-inner { width: 100%; max-width: 1150px; margin: auto; padding: 0 20px; }
.fatima-video-section .about-kicker { color: #d4aa72; letter-spacing: .24em; font-size: 13px; }
.fatima-video-section h2 { font-size: clamp(32px, 5vw, 54px); margin-bottom: 28px; }
.fatima-video-frame { width: 100%; aspect-ratio: 16 / 9; background: #100c0a; border: 2px solid #704624; border-radius: 8px; overflow: hidden; box-shadow: 0 12px 38px rgba(0,0,0,.4); }
.fatima-video-frame video { display: block; width: 100%; height: 100%; object-fit: contain; }
.fatima-video-note { color: #d4aa72; margin-top: 18px; }
#video { scroll-margin-top: calc(var(--fatima-nav-height) + 12px); }

/* Layout corrections: one-page anchors, horizontal overflow and back-to-top. */
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--fatima-nav-height) + 8px); max-width: 100%; }
body { width: 100%; max-width: 100%; overflow-x: clip; }
#fatima-nav { box-sizing: border-box; max-width: 100%; }
#musik, #about, #video, #contact { scroll-margin-top: calc(var(--fatima-nav-height) + 8px); }
.fatima-about-section, .fatima-video-section, .fatima-contact-section {
  width: 100%; max-width: 100%; min-width: 0;
  box-sizing: border-box; overflow-x: clip;
}



/* Contact: two photos, 8 seconds each, soft crossfade. CSS only. */
.fatima-contact-section {
  position: relative;
  isolation: isolate;
  background: #170e0a;
  overflow: hidden;
  margin-bottom: 0 !important;
}
.fatima-contact-section::before,
.fatima-contact-section::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  pointer-events: none;
}
.fatima-contact-section::before {
  background-image: linear-gradient(rgba(19,10,7,.72),rgba(19,10,7,.84)), url('../img/fatima-bg1.jpg');
}
.fatima-contact-section::after {
  background-image: linear-gradient(rgba(19,10,7,.72),rgba(19,10,7,.84)), url('../img/fatima-bg2.jpg');
  animation: fatima-photo-switch 16s linear infinite;
}
@keyframes fatima-photo-switch {
  0%, 5% { opacity: 0; }
  12.5%, 50% { opacity: 1; }
  62.5%, 100% { opacity: 0; }
}
.fatima-contact-inner { position: relative; z-index: 1; }

.fatima-contact-inner { width: 100%; max-width: 1260px; min-width: 0; padding-left: 20px; padding-right: 20px; box-sizing: border-box; }
.fatima-contact-columns { width: 100%; max-width: 100%; margin-left: 0; margin-right: 0; }
.fatima-contact-columns > [class*="col-"] { min-width: 0; }
.fatima-contact-card { min-width: 0; }
.fatima-contact-card > div { min-width: 0; overflow-wrap: anywhere; }
.fatima-video-inner { max-width: min(1150px, 100%); min-width: 0; box-sizing: border-box; }
.fatima-video-frame { max-width: 100%; }
#toTop { display: none !important; }
#toTop.visible { display: flex !important; }
@media (max-width: 600px) { .fatima-contact-inner { padding-left: 12px; padding-right: 12px; } }