/* ==========================================================
   AKV – Design E  v1.4
   Programm-Stil: hell, reduziert, Event-fokussiert
   ========================================================== */

:root {
  --ci:         #C1121F;
  --ci-hover:   #96000F;
  --text:       #111111;
  --text-muted: #888888;
  --text-light: #bbbbbb;
  --border:     #eeeeee;
  --border-dark:#111111;
  --bg:         #ffffff;
  --bg-soft:    #f7f7f5;
  --font-serif: 'Playfair Display', Georgia, serif;
  --font-sans:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --space-xs:   8px;
  --space-s:    16px;
  --space-m:    32px;
  --space-l:    64px;
  --space-xl:   100px;
  --transition: 0.22s ease;
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { font-family:var(--font-sans); font-size:17px; line-height:1.7;
       color:var(--text); background:var(--bg); }
img  { display:block; max-width:100%; height:auto; }
a    { text-decoration:none; color:inherit; transition:color var(--transition); }

/* LAYOUT */
.container { max-width:1100px; margin:0 auto; padding:0 24px; }

/* SKIP LINK */
.skip-link { position:absolute; top:-100px; left:24px; padding:8px 16px;
             background:var(--ci); color:#fff; font-size:13px; z-index:9999;
             transition:top var(--transition); }
.skip-link:focus { top:20px; }

/* ── HEADER ───────────────────────────────────────── */
.header { border-bottom:2px solid var(--border-dark); }
.header-inner { display:flex; align-items:center; justify-content:space-between;
                padding:16px 24px; }

.e-logo { font-family:var(--font-sans); font-size:14px; font-weight:700;
          letter-spacing:4px; text-transform:uppercase; color:var(--text); }
.e-logo:hover { color:var(--ci); }

/* NAV */
.nav { display:flex; }
.menu { list-style:none; display:flex; gap:32px; }
.menu a { font-size:11px; font-weight:500; text-transform:uppercase;
          letter-spacing:2px; color:var(--text-light); padding-bottom:2px;
          transition:color var(--transition); }
.menu a:hover,
.current-menu-item > a { color:var(--text); border-bottom:1px solid var(--text); }

.header-actions { display:flex; align-items:center; gap:12px; }
.search-toggle { background:none; border:none; padding:4px; cursor:pointer;
                 color:var(--text-light); display:flex; align-items:center;
                 transition:color var(--transition); }
.search-toggle:hover { color:var(--text); }

.menu-toggle { display:none; flex-direction:column; gap:5px; cursor:pointer;
               background:none; border:none; padding:4px; z-index:1100; }
.menu-toggle span { display:block; width:22px; height:1.5px; background:var(--text); }

/* SEARCH OVERLAY */
.search-overlay { position:fixed; inset:0; background:rgba(255,255,255,0.96);
                  z-index:2000; display:flex; align-items:center;
                  justify-content:center; opacity:0; pointer-events:none;
                  transition:opacity 0.2s ease; }
.search-overlay.active { opacity:1; pointer-events:all; }
.search-overlay-inner { position:relative; width:90%; max-width:600px; }
.search-overlay-inner .search-form { display:flex; }
.search-overlay-inner input[type="search"] { flex:1; padding:16px 20px; font-size:18px;
  font-family:var(--font-sans); border:none; border-bottom:2px solid var(--text);
  outline:none; background:transparent; color:var(--text); }
.search-overlay-inner input[type="submit"] { padding:16px 24px; background:var(--ci);
  color:#fff; border:none; font-family:var(--font-sans); font-size:12px;
  text-transform:uppercase; letter-spacing:1px; cursor:pointer; }
.search-close { position:absolute; top:-44px; right:0; background:none; border:none;
                color:var(--text); font-size:28px; cursor:pointer; }

/* ── NÄCHSTES EVENT ────────────────────────────────── */
.e-next { padding:var(--space-l) 0 var(--space-m);
          border-bottom:1px solid var(--border); }

.e-next-label { font-size:11px; text-transform:uppercase; letter-spacing:3px;
                color:var(--text-light); margin-bottom:12px; }

.e-next-date { font-family:var(--font-serif); font-size:14px; color:var(--ci);
               letter-spacing:0.3px; margin-bottom:10px; }

.e-next-title { font-family:var(--font-serif); font-size:72px; font-weight:400;
                color:var(--text); letter-spacing:-2px; line-height:0.95;
                margin-bottom:20px; }

.e-next-title a { color:inherit; transition:color var(--transition); }
.e-next-title a:hover { color:var(--ci); }

.e-next-meta { font-size:16px; color:var(--text-muted); max-width:560px;
               line-height:1.6; margin-bottom:0; }

.e-next-btn { display:inline-block; margin-top:28px; padding:13px 36px;
              border:1px solid var(--ci); color:var(--ci); font-size:12px;
              font-weight:500; text-transform:uppercase; letter-spacing:2px;
              transition:all var(--transition); }
.e-next-btn:hover { background:var(--ci); color:#fff; }

/* ── SECTION LABEL ─────────────────────────────────── */
.e-section-label { font-size:10px; text-transform:uppercase; letter-spacing:3px;
                   color:var(--text-light); padding:var(--space-m) 0 var(--space-s);
                   border-bottom:1px solid var(--border); margin-bottom:0; }

/* ── WEITERE EVENTS: LISTE ─────────────────────────── */
.e-events { margin-bottom:var(--space-l); }

.e-ev { display:grid; grid-template-columns:40px 1fr auto; gap:20px;
        align-items:center; padding:16px 0; border-bottom:1px solid var(--border);
        transition:transform var(--transition); }
.e-ev:hover { transform:translateX(6px); }

.e-ev-num { font-family:var(--font-serif); font-size:13px; color:var(--text-light); }

.e-ev-body { display:flex; flex-direction:column; gap:2px; min-width:0; }
.e-ev-title { font-family:var(--font-serif); font-size:22px; color:var(--text);
              line-height:1.2; transition:color var(--transition); }
.e-ev:hover .e-ev-title { color:var(--ci); }
.e-ev-ort { font-size:13px; color:var(--text-light); }

.e-ev-date { font-size:13px; color:var(--text-light); white-space:nowrap; }

.e-more-link { padding:var(--space-m) 0 0; }

/* ── KUNSTWERKE: HORIZONTALER STREIFEN ─────────────── */
.e-works { margin-bottom:var(--space-l); }

.e-works-strip { display:flex; gap:2px; overflow-x:auto; padding-bottom:4px;
                 scrollbar-width:none; }
.e-works-strip::-webkit-scrollbar { display:none; }

.e-work { flex-shrink:0; width:160px; transition:opacity var(--transition); }
.e-work:hover { opacity:0.85; }

.e-work-img { height:200px; overflow:hidden; margin-bottom:10px; }
.e-work-img img { width:100%; height:100%; object-fit:cover;
                  transition:transform 0.4s ease; }
.e-work:hover .e-work-img img { transform:scale(1.04); }

.e-work-name { font-family:var(--font-serif); font-size:14px; color:var(--text);
               margin-bottom:2px; }
.e-work-diz  { font-size:11px; text-transform:uppercase; letter-spacing:1px;
               color:var(--ci); }
.e-work-werk { font-size:12px; color:var(--text-light); font-style:italic; margin-top:2px; }

/* ── KÜNSTLER: LISTE ────────────────────────────────── */
.e-artists { margin-bottom:var(--space-xl); }

.e-artist { display:flex; align-items:center; gap:20px; padding:14px 0;
            border-bottom:1px solid var(--border);
            transition:transform var(--transition); }
.e-artist:hover { transform:translateX(6px); }

.e-artist-name { font-family:var(--font-serif); font-size:22px; color:var(--text);
                 flex:1; transition:color var(--transition); }
.e-artist:hover .e-artist-name { color:var(--ci); }

.e-artist-diz  { font-size:11px; text-transform:uppercase; letter-spacing:1.5px;
                 color:var(--text-light); }

.e-artist-arr  { font-size:16px; color:var(--ci); opacity:0;
                 transition:opacity var(--transition); }
.e-artist:hover .e-artist-arr { opacity:1; }

/* ── FOOTER ─────────────────────────────────────────── */
.e-footer { border-top:1px solid var(--border); padding:24px 0; }
.e-footer-inner { display:flex; justify-content:space-between; align-items:center; gap:20px; }

.e-footer-name { font-family:var(--font-serif); font-size:13px; color:var(--text-muted); }
.e-footer-social { font-size:12px; color:var(--text-light); margin-left:16px;
                   transition:color var(--transition); }
.e-footer-social:hover { color:var(--ci); }

.e-footer-right { display:flex; gap:16px; }
.e-footer-right a { font-size:12px; color:var(--text-light);
                    transition:color var(--transition); }
.e-footer-right a:hover { color:var(--text); }

/* ── BACK LINK ──────────────────────────────────────── */
.back-link { font-size:12px; text-transform:uppercase; letter-spacing:2px;
             color:var(--text-muted); transition:color var(--transition); }
.back-link:hover { color:var(--ci); }

/* ── DETAIL: SINGLE EVENT ───────────────────────────── */
.event-single { max-width:860px; padding-top:var(--space-l); }
.event-single-image { margin-bottom:var(--space-l); }
.event-single-image img { width:100%; height:auto; }
.event-single-title { font-family:var(--font-serif); font-size:64px; font-weight:400;
                      color:var(--ci); letter-spacing:-1.5px; line-height:1.04;
                      margin-bottom:16px; }
.event-single-meta { font-size:13px; color:var(--text-light); text-transform:uppercase;
                     letter-spacing:1px; margin-bottom:48px; }
.event-single-location { color:var(--text-light); }
.event-single-content { font-size:19px; line-height:1.9; color:#222; max-width:680px; }
.event-single-content p { margin-bottom:24px; }

/* TICKET BTN */
.event-ticket-btn { display:inline-block; margin-top:40px; padding:13px 36px;
                    border:1px solid var(--ci); color:var(--ci); font-size:12px;
                    text-transform:uppercase; letter-spacing:2px;
                    transition:all var(--transition); }
.event-ticket-btn:hover { background:var(--ci); color:#fff; }

/* ANMELDEFORMULAR */
.anmelde-wrap { margin-top:72px; padding-top:56px; border-top:1px solid var(--border);
                max-width:600px; scroll-margin-top:40px; }
.anmelde-title { font-family:var(--font-serif); font-size:32px; color:var(--ci);
                 font-weight:400; letter-spacing:-0.5px; margin-bottom:36px; }
.anmelde-erfolg { padding:18px 22px; background:#f0f7f0; border-left:3px solid #2d7a2d;
                  color:#1a4d1a; font-size:15px; line-height:1.6; }
.anmelde-form { display:flex; flex-direction:column; }
.anmelde-field { display:grid; grid-template-columns:160px 1fr; align-items:center;
                 border-bottom:1px solid var(--border); }
.anmelde-field:first-of-type { border-top:1px solid var(--border); }
.anmelde-field label { font-size:11px; font-weight:500; text-transform:uppercase;
                       letter-spacing:1.5px; color:var(--text); padding:16px 0; }
.anmelde-field input,
.anmelde-field textarea { font-family:var(--font-sans); font-size:16px; color:var(--text);
  background:transparent; border:none; border-left:1px solid var(--border);
  padding:14px 18px; outline:none; width:100%; -webkit-appearance:none;
  appearance:none; border-radius:0; transition:background var(--transition); }
.anmelde-field input:focus,
.anmelde-field textarea:focus { background:#fafaf8; }
.anmelde-field input::placeholder,
.anmelde-field textarea::placeholder { color:var(--text-light); }
.anmelde-field textarea { resize:vertical; min-height:90px; line-height:1.6;
                          align-self:stretch; padding-top:16px; }
.anmelde-field input[type="number"] { max-width:100px; }
.anmelde-field--textarea { align-items:start; }
.anmelde-field--textarea label { padding-top:18px; }
.anmelde-submit { margin-top:28px; display:flex; align-items:center; gap:24px;
                  flex-wrap:wrap; }
.anmelde-btn { font-family:var(--font-sans); font-size:12px; font-weight:500;
               text-transform:uppercase; letter-spacing:2px; color:#fff;
               background:var(--ci); border:none; padding:14px 36px; cursor:pointer;
               transition:background var(--transition); }
.anmelde-btn:hover { background:var(--ci-hover); }
.anmelde-hinweis { font-size:13px; color:var(--text-muted); }
.anmelde-hinweis a { color:var(--ci); border-bottom:1px solid transparent;
                     transition:border-color var(--transition); }
.anmelde-hinweis a:hover { border-bottom-color:var(--ci); }

/* PREV/NEXT */
.back-link { display:inline-block; margin:48px 0 64px; }
.event-nav { display:flex; justify-content:space-between; gap:20px;
             margin-top:80px; padding-top:40px; border-top:1px solid var(--border); }
.event-nav-link { font-size:13px; color:var(--text-muted); max-width:45%;
                  transition:color var(--transition); }
.event-nav-link:hover { color:var(--ci); }
.event-nav-next { text-align:right; margin-left:auto; }

/* ARCHIV */
.archive-title { font-family:var(--font-serif); font-size:52px; color:var(--ci);
                 letter-spacing:-1px; margin:72px 0 48px; font-weight:400; }
.archive-intro { font-size:16px; color:var(--text-muted); margin-top:-30px;
                 margin-bottom:var(--space-l); }
.archive-year { margin-bottom:var(--space-l); }
.archive-year-title { font-family:var(--font-serif); font-size:48px; color:var(--ci);
                      letter-spacing:-2px; font-weight:400; line-height:1;
                      margin-bottom:var(--space-xs); }
.archive-month { margin-bottom:var(--space-m); padding-left:20px;
                 border-left:2px solid var(--border); }
.archive-month-title { font-size:10px; font-weight:500; text-transform:uppercase;
                       letter-spacing:3px; color:var(--text-light); margin-bottom:12px; }
.archive-event { display:grid; grid-template-columns:44px 56px 1fr; gap:16px;
                 align-items:center; padding:12px 0; border-bottom:1px solid #f0f0f0;
                 transition:transform var(--transition); }
.archive-event:hover { transform:translateX(6px); }
.archive-event-day { font-family:var(--font-serif); font-size:22px; color:var(--ci); }
.archive-event-thumb img { width:56px; height:56px; object-fit:cover; }
.archive-event-info { display:flex; flex-direction:column; gap:2px; }
.archive-event-title { font-family:var(--font-serif); font-size:17px; color:var(--text);
                       transition:color var(--transition); }
.archive-event:hover .archive-event-title { color:var(--ci); }
.archive-event-loc { font-size:12px; color:var(--text-light); }

/* PAGINATION */
.pagination { margin:64px 0 32px; }
.pagination .nav-links { display:flex; gap:8px; flex-wrap:wrap; }
.pagination a, .pagination .current { font-size:11px; text-transform:uppercase;
  letter-spacing:2px; padding:7px 13px; border:1px solid var(--border);
  color:var(--text-muted); transition:all var(--transition); }
.pagination a:hover { border-color:var(--ci); color:var(--ci); }
.pagination .current { background:var(--ci); color:#fff; border-color:var(--ci); }

/* STATISCHE SEITEN */
.page-header { margin:72px 0 48px; }
.page-title { font-family:var(--font-serif); font-size:60px; color:var(--ci);
              letter-spacing:-1.5px; font-weight:400; line-height:1.05; }
.page-content { max-width:680px; font-size:18px; line-height:1.9; color:#222; }
.page-content h2 { font-family:var(--font-serif); font-size:26px; color:var(--text);
                   margin-top:56px; margin-bottom:16px; font-weight:400; }
.page-content p { margin-bottom:22px; }
.page-content a { color:var(--ci); border-bottom:1px solid transparent;
                  transition:border-color var(--transition); }
.page-content a:hover { border-bottom-color:var(--ci); }
.legal-content { font-size:15px; line-height:1.8; }
.legal-content h2 { font-size:18px; margin-top:44px; }
.legal-back { margin:72px 0 40px; }

/* SUCHE */
.search-header { margin:72px 0 48px; }
.search-empty { color:var(--text-muted); font-size:17px; padding:48px 0; }
.post-item { padding:36px 0; border-bottom:1px solid var(--border); }
.post-item h2 { font-family:var(--font-serif); font-size:24px; color:var(--text);
                margin-bottom:8px; font-weight:400; }
.post-item h2 a:hover { color:var(--ci); }

/* 404 */
.page-404 { text-align:center; padding:120px 0; }
.page-404-code { font-family:var(--font-serif); font-size:140px; color:#eee;
                 line-height:1; font-weight:700; }
.page-404-title { font-family:var(--font-serif); font-size:32px; color:var(--ci);
                  margin:0 0 16px; font-weight:400; }
.page-404-text { font-size:17px; color:var(--text-muted); max-width:420px;
                 margin:0 auto 44px; line-height:1.7; }
.page-404-btn { display:inline-block; padding:13px 36px; border:1px solid var(--ci);
                color:var(--ci); font-size:11px; text-transform:uppercase;
                letter-spacing:2px; transition:all var(--transition); }
.page-404-btn:hover { background:var(--ci); color:#fff; }

/* FACEBOOK */
.fb-feed-wrap { margin:16px 0; overflow:hidden; }
.fb-notice { color:var(--text-muted); font-style:italic; padding:18px;
             border:1px dashed #ddd; }

/* ARTIST SINGLE */
.artist-single { max-width:860px; padding-top:var(--space-l); }
.artist-single-inner { display:grid; grid-template-columns:300px 1fr; gap:64px;
                        align-items:start; margin-top:48px; }
.artist-single-image img { width:100%; height:auto; }
.artist-single-title { font-family:var(--font-serif); font-size:48px; color:var(--ci);
                       letter-spacing:-1px; font-weight:400; margin:0 0 36px; }
.artist-single-content { font-size:18px; line-height:1.9; color:#222; }
.artist-single-content p { margin-bottom:24px; }

/* ── MOBILE ─────────────────────────────────────────── */
@media (max-width: 768px) {
  .header-inner { padding:14px 20px; }
  .menu-toggle { display:flex; }
  .nav { position:fixed; top:0; right:-100%; width:260px; height:100%;
         background:var(--bg); padding:88px 24px 40px; transition:right 0.28s ease;
         border-left:1px solid var(--border); z-index:1000; }
  body.menu-open .nav { right:0; }
  .menu { flex-direction:column; gap:20px; }
  .menu a { font-size:13px; }

  .e-next-title { font-size:40px; }
  .e-ev { grid-template-columns:32px 1fr auto; gap:12px; padding:12px 0; }
  .e-ev-title { font-size:17px; }
  .e-work { width:120px; }
  .e-work-img { height:150px; }
  .e-artist-name { font-size:18px; }
  .archive-title { font-size:36px; margin:48px 0 28px; }
  .archive-year-title { font-size:32px; }
  .archive-event { grid-template-columns:38px 1fr; }
  .archive-event-thumb { display:none; }
  .event-single-title { font-size:38px; }
  .artist-single-inner { grid-template-columns:1fr; gap:28px; }
  .artist-single-title { font-size:32px; }
  .page-title { font-size:36px; }
  .event-nav { flex-direction:column; gap:12px; }
  .event-nav-next { text-align:left; margin-left:0; }
  .e-footer-inner { flex-direction:column; align-items:flex-start; gap:12px; }
  .anmelde-field { grid-template-columns:1fr; }
  .anmelde-field label { padding:12px 0 4px; }
  .anmelde-field input,
  .anmelde-field textarea { border-left:none; border-top:1px solid var(--border);
                             padding:10px 0; }
  .anmelde-submit { flex-direction:column; align-items:stretch; }
  .anmelde-btn { width:100%; text-align:center; }
}
