/*
 * Wireframe styles – structure only. The real design comes later and will
 * replace the tokens below.
 */

:root {
	--yn-bg: #fff;
	--yn-surface: #f3f3f3;
	--yn-text: #1a1a1a;
	--yn-muted: #666;
	--yn-line: #ddd;
	--yn-accent: #1a1a1a;
	--yn-accent-text: #fff;
	--yn-radius: 6px;
	--yn-max: 1200px;
	--yn-gap: 24px;
	--yn-font: system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
}

body {
	margin: 0;
	background: var(--yn-bg);
	color: var(--yn-text);
	font-family: var(--yn-font);
	line-height: 1.6;
}

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }

.screen-reader-text {
	position: absolute; width: 1px; height: 1px; overflow: hidden;
	clip: rect(0 0 0 0); white-space: nowrap;
}

.yn-skip { position: absolute; inset-inline-start: -9999px; }
.yn-skip:focus { inset-inline-start: 16px; top: 16px; z-index: 100; background: var(--yn-bg); padding: 8px 16px; }

.yn-container { max-width: var(--yn-max); margin-inline: auto; padding-inline: 16px; }
.yn-narrow { max-width: 760px; }

/* Header */
.yn-header { border-bottom: 1px solid var(--yn-line); position: sticky; top: 0; z-index: 50; background: var(--yn-bg); }
.yn-header__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--yn-gap); min-height: 72px; }
.yn-logo { font-weight: 700; font-size: 1.25rem; text-decoration: none; }
.yn-logo img { max-height: 48px; width: auto; }
.yn-nav { display: flex; align-items: center; gap: var(--yn-gap); }
.yn-nav__list { display: flex; gap: 20px; list-style: none; margin: 0; padding: 0; }
.yn-nav__list a { text-decoration: none; }
.yn-nav__list .current-menu-item > a { text-decoration: underline; }
.yn-menu-toggle { display: none; background: none; border: 0; padding: 8px; cursor: pointer; }
.yn-menu-toggle__bars, .yn-menu-toggle__bars::before, .yn-menu-toggle__bars::after {
	display: block; width: 24px; height: 2px; background: currentColor; position: relative; content: "";
}
.yn-menu-toggle__bars::before { position: absolute; top: -7px; }
.yn-menu-toggle__bars::after { position: absolute; top: 7px; }

@media (max-width: 900px) {
	.yn-menu-toggle { display: block; }
	.yn-nav {
		display: none; position: absolute; inset-inline: 0; top: 100%;
		flex-direction: column; align-items: stretch; padding: 16px;
		background: var(--yn-bg); border-bottom: 1px solid var(--yn-line);
	}
	.yn-nav.is-open { display: flex; }
	.yn-nav__list { flex-direction: column; gap: 12px; }
}

/* Buttons & links */
.yn-btn {
	display: inline-block; padding: 12px 24px; border-radius: var(--yn-radius);
	background: var(--yn-accent); color: var(--yn-accent-text); border: 2px solid var(--yn-accent);
	text-decoration: none; font: inherit; font-weight: 600; cursor: pointer;
}
.yn-btn--ghost { background: transparent; color: var(--yn-accent); }
.yn-btn--small { padding: 6px 16px; }
.yn-link { font-weight: 600; }
.yn-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 16px; }
.yn-badge { display: inline-block; padding: 6px 12px; background: var(--yn-surface); border-radius: var(--yn-radius); }

/* Placeholders for missing images */
.yn-placeholder {
	display: flex; align-items: center; justify-content: center; min-height: 200px; width: 100%;
	background: var(--yn-surface); color: var(--yn-muted); border: 1px dashed var(--yn-line);
	aspect-ratio: 4 / 3; text-align: center; padding: 16px; box-sizing: border-box;
}

/* Sections */
.yn-section { padding-block: 48px; }
.yn-section__title { font-size: 1.75rem; margin: 0 0 24px; }
.yn-page-head { padding-block: 48px 0; }
.yn-page-title { font-size: clamp(2rem, 5vw, 3rem); margin: 0 0 16px; }
.yn-lead { font-size: 1.15rem; }
.yn-eyebrow { color: var(--yn-muted); font-size: .9rem; margin: 0 0 4px; }
.yn-empty { color: var(--yn-muted); }

.yn-grid { display: grid; gap: var(--yn-gap); }
.yn-grid--2 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 420px), 1fr)); }
.yn-grid--4 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); }
.yn-grid--books { grid-template-columns: repeat(auto-fill, minmax(160px, 220px)); }
.yn-split { display: grid; gap: 48px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); align-items: start; }

/* Hero */
.yn-hero { position: relative; }
.yn-hero__media img, .yn-hero__media.yn-placeholder { width: 100%; aspect-ratio: 16 / 7; object-fit: cover; min-height: 320px; }
.yn-hero__body { padding-block: 32px; }
.yn-hero__title { font-size: clamp(2.5rem, 7vw, 4.5rem); margin: 0; line-height: 1.1; }
.yn-hero__subtitle { font-size: 1.25rem; color: var(--yn-muted); margin: 8px 0 0; }

/* Cards */
.yn-card { border: 1px solid var(--yn-line); border-radius: var(--yn-radius); overflow: hidden; display: flex; flex-direction: column; }
.yn-card__media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.yn-card__media .yn-placeholder { border: 0; }
.yn-card__body { padding: 16px 20px 20px; }
.yn-card__title { margin: 0 0 4px; font-size: 1.35rem; }
.yn-card__title a { text-decoration: none; }
.yn-card__meta { color: var(--yn-muted); margin: 0; }

/* Events */
.yn-events { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--yn-line); }
.yn-event { display: grid; grid-template-columns: 220px 1fr auto; gap: var(--yn-gap); align-items: center; padding-block: 20px; border-bottom: 1px solid var(--yn-line); }
.yn-event__date { margin: 0; font-weight: 600; }
.yn-event__title { margin: 0; font-size: 1.15rem; }
.yn-event__place { margin: 0; color: var(--yn-muted); }
@media (max-width: 700px) { .yn-event { grid-template-columns: 1fr; gap: 8px; } }

/* Books */
.yn-books { display: grid; gap: 64px; }
.yn-book { display: grid; grid-template-columns: minmax(160px, 280px) 1fr; gap: 40px; scroll-margin-top: 96px; }
.yn-book__cover .yn-placeholder { aspect-ratio: 2 / 3; }
.yn-book__title { font-size: 1.75rem; margin: 0 0 4px; }
.yn-review { margin: 16px 0; padding-inline-start: 16px; border-inline-start: 3px solid var(--yn-line); }
.yn-review p { margin: 0; }
.yn-review cite { color: var(--yn-muted); font-style: normal; }
.yn-book-tile { display: block; text-decoration: none; }
.yn-book-tile .yn-placeholder { aspect-ratio: 2 / 3; }
.yn-book-tile__title { display: block; margin-top: 8px; font-weight: 600; }
@media (max-width: 700px) { .yn-book { grid-template-columns: 1fr; } }

/* Show page */
.yn-show-head__media img { width: 100%; border-radius: var(--yn-radius); }
.yn-video iframe { width: 100%; height: auto; aspect-ratio: 16 / 9; }
.yn-checklist, .yn-contacts { padding-inline-start: 20px; }
.yn-contacts li { margin-bottom: 8px; }
.yn-contacts a { margin-inline-start: 8px; }
.yn-booking, .yn-epk { background: var(--yn-surface); }

/* Forms */
.yn-form { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
.yn-form--quick { grid-template-columns: 1fr; }
.yn-field { margin: 0 0 16px; display: flex; flex-direction: column; gap: 4px; }
.yn-field--wide { grid-column: 1 / -1; }
.yn-field input, .yn-field select, .yn-field textarea {
	font: inherit; padding: 10px 12px; border: 1px solid var(--yn-line); border-radius: var(--yn-radius); background: var(--yn-bg);
}
.yn-hp { position: absolute; inset-inline-start: -9999px; }
.yn-notice { padding: 12px 16px; border-radius: var(--yn-radius); background: var(--yn-surface); }
.yn-notice--error { outline: 2px solid #c00; }
@media (max-width: 600px) { .yn-form { grid-template-columns: 1fr; } }

/* Socials */
.yn-socials { display: flex; flex-wrap: wrap; gap: 12px; list-style: none; margin: 16px 0; padding: 0; }

/* Footer */
.yn-footer { border-top: 1px solid var(--yn-line); margin-top: 48px; padding-block: 40px 24px; }
.yn-footer__grid { display: grid; gap: var(--yn-gap); grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.yn-footer__title { font-weight: 700; margin: 0 0 8px; }
.yn-footer__list { list-style: none; margin: 0; padding: 0; }
.yn-footer__list li { margin-bottom: 4px; }
.yn-footer__copy { color: var(--yn-muted); font-size: .85rem; margin-top: 32px; }