/* =========================
FONTS
========================= */

@font-face {
font-family: 'whisper-custom';
src: url('fonts/whisper.woff2') format('woff2');
}

@font-face {
font-family: 'ltperfume-custom';
src: url('fonts/lt-perfume.woff2') format('woff2');
}

@font-face {
font-family: 'bookman-custom';
src: url('fonts/URWBookman-LightItalic.woff2') format('woff2');
}

/* =========================
BASIS
========================= */

body {
margin: 0;
color: #f5f5f5;
overflow-x: hidden;
background: url('norway-path.png') center/cover no-repeat fixed;
}

/* =========================
NAV
========================= */

nav {
position: fixed;
top: 0;
width: 100%;
display: flex;
justify-content: center;
padding: 25px;
backdrop-filter: blur(8px);
background: rgba(0,0,0,0.25);
opacity: 0;
transition: opacity 0.6s ease;
z-index: 1000;
}

body:hover nav {
opacity: 1;
}

nav ul {
list-style: none;
display: flex;
gap: 60px;
}

nav a {
font-family: 'whisper-custom';
font-size: 1.8rem;
color: #e8e0c8;
text-decoration: none;
}

/* =========================
HOME
========================= */

.intro {
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
}

.intro h1 {
font-family: 'whisper-custom';
font-size: 3rem;
}

.quote {
font-family: 'ltperfume-custom';
font-size: 2rem;
}

/* CABIN */

.cabin-section {
min-height: 110vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}

.cabin-image {
width: 420px;
margin-top: 80px;
display: block;
margin-left: auto;
margin-right: auto;

-webkit-mask-image: radial-gradient(circle, black 60%, transparent 100%);
mask-image: radial-gradient(circle, black 60%, transparent 100%);
}

/* MINI GEDICHT */

.poem {
margin-top: 30px;
text-align: center;
font-family: 'ltperfume-custom';
font-size: 1.6rem;
line-height: 1.3;
}

.poem p {
margin: 6px 0;
}

/* RUNE */

.rune-section {
height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
margin-top: -20px;
}

.rune {
font-family: 'whisper-custom';
font-size: 5rem;
opacity: 0;
transition: all 3s ease;
}

.rune.visible {
opacity: 1;
}

.rune-text {
margin-top: 10px;
font-family: 'ltperfume-custom';
font-size: 1.6rem;
opacity: 0;
transition: all 3s ease;
}

.rune-text.visible {
opacity: 1;
}

.signature {
margin-top: 40px;
width: 150px;
opacity: 0;
transition: 4s;
}

.signature.visible {
opacity: 0.9;
}

/* =========================
AUDIO KNOP (HOME)
========================= */

.ambient-toggle {
position: fixed;
bottom: 30px;
right: 30px;
font-family: 'whisper-custom';
font-size: 2rem;
color: #e8e0c8;
background: rgba(0,0,0,0.6);
padding: 14px 24px;
border-radius: 40px;
cursor: pointer;
z-index: 2000;
backdrop-filter: blur(6px);
}

/* =========================
GEDICHTEN
========================= */

.poems-section {
padding: 200px 20px;
text-align: center;
}

.poems-title {
font-family: 'whisper-custom';
font-size: 3rem;
margin-bottom: 80px;
}

.poem-card {
max-width: 700px;
margin: 0 auto 120px auto;
}

.poem-image {
width: 100%;
}

/* 🎧 AUDIO KNOP BIJ GEDICHTEN */

.audio-button {
display: inline-block;
margin-bottom: 20px;
font-family: 'whisper-custom';
font-size: 1.6rem;
color: #e8e0c8;
background: rgba(0,0,0,0.6);
padding: 10px 22px;
border-radius: 30px;
cursor: pointer;
border: none;
backdrop-filter: blur(6px);
transition: all 0.3s ease;
}

.audio-button:hover {
background: rgba(0,0,0,0.8);
transform: scale(1.05);
}

/* MEER POËZIE LINK */

.more-poetry {
margin-top: 100px;
text-align: center;
font-family: 'bookman-custom';
font-size: 1.2rem;
}

.more-poetry a {
font-family: 'whisper-custom';
font-size: 1.8rem;
color: #e8e0c8;
text-decoration: none;
}

/* =========================
BUNDEL
========================= */

.bundel-section {
text-align: center;
padding: 200px 20px;
}

.bundel-image {
width: 280px;
margin-bottom: 40px;
}

.bundel-title {
font-family: 'ltperfume-custom';
font-size: 2.5rem;
margin-bottom: 30px;
}

.bundel-content {
max-width: 700px;
margin: 0 auto;
}

.bundel-content p {
font-family: 'bookman-custom';
line-height: 1.6;
}

.bundel-links a {
font-family: 'whisper-custom';
font-size: 1.6rem;
margin: 0 15px;
color: #e8e0c8 !important;
text-decoration: none;
}

/* 🔥 NIEUW: Bookmundo knop styling */

.buy-button {
display: inline-block;
margin-top: 20px;
padding: 12px 28px;
border-radius: 30px;
background: rgba(0,0,0,0.6);
backdrop-filter: blur(6px);
transition: all 0.3s ease;
}

.buy-button:hover {
background: rgba(0,0,0,0.85);
transform: scale(1.05);
}

/* =========================
OVER MIJ
========================= */

.about-section {
padding: 200px 20px;
display: flex;
justify-content: center;
}

.about-content {
max-width: 650px;
text-align: center;
}

.about-section h1 {
font-family: 'whisper-custom';
font-size: 3rem;
}

.about-section p {
font-family: 'bookman-custom';
font-size: 1.05rem;
line-height: 1.6;
}

.about-signature {
font-family: 'ltperfume-custom';
font-size: 2.2rem;
margin-top: 40px;
}

/* =========================
CONTACT
========================= */

.contact-section {
padding: 200px 20px;
display: flex;
justify-content: center;
}

.contact-content {
max-width: 650px;
text-align: center;
}

.contact-section h1 {
font-family: 'whisper-custom';
font-size: 3rem;
}

.contact-section p {
font-family: 'bookman-custom';
font-size: 1.05rem;
}

.contact-section a,
.contact-section a:visited,
.contact-section a:hover,
.contact-section a:active {
color: #e8e0c8 !important;
text-decoration: none;
}