/*
Theme Name: Lied-Hoch Pro (Bootstrap 5 Performance + ACF)
Version: 4.1.0
Description: Bootstrap 5 + ACF Pro, ohne Gutenberg, Core Web Vitals optimiert, barrierearm (WCAG AA).
Author: ChatGPT
Text Domain: lied-hoch
Requires at least: 6.0
Requires PHP: 8.0
*/

:root{
  --brand:#0B2B4B;
  --brand-2:#7A1020;
  --gold:#C9A26A;
  --bg:#ffffff;
  --surface:#F6F1EA;
  --surface-2:#EFE7DE;
  --text:#1E1E1E;
  --muted:#5B5B5B;
  --border:#E6DED5;
  --focus:#1E1E1E;
  --radius:16px;
}

body{color:var(--text);background:var(--bg);}
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{
  outline:2px solid var(--focus); outline-offset:2px;
}
/* Accessibility utility */
.screen-reader-text,.visually-hidden-focusable{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}
.screen-reader-text:focus,.visually-hidden-focusable:focus{
  position:static;width:auto;height:auto;margin:0;clip:auto;overflow:visible;white-space:normal;
}

.skip-link{position:absolute;left:-9999px;top:0;background:#fff;padding:10px 14px;border:1px solid var(--border);z-index:9999}
.skip-link:focus{left:10px;top:10px}

.navbar{border-bottom:1px solid var(--border); background:rgba(255,255,255,.88)!important; backdrop-filter:saturate(180%) blur(10px);}
.hero{position:relative;color:#fff;background:var(--brand);}
.hero-bg-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.45}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg, rgba(11,43,75,.92) 0%, rgba(11,43,75,.72) 55%, rgba(11,43,75,.25) 100%)}
.section{padding:72px 0}
@media (max-width: 1023px){.section{padding:56px 0}}
@media (max-width: 767px){.section{padding:48px 0}}
.surface{background:var(--surface)}
.surface2{background:var(--surface-2)}
.card{border-color:var(--border);border-radius:var(--radius);}
.badge{background:var(--surface-2);color:var(--brand);font-weight:800}
.footer{background:var(--brand);color:#fff}
.footer a{color:#fff;text-decoration:none}
.footer a:hover{text-decoration:underline}

/* Bootstrap color mapping */
:root{ --bs-primary: var(--brand); --bs-warning: var(--gold); }
.btn-primary{ --bs-btn-bg: var(--brand); --bs-btn-border-color: var(--brand); }
.btn-outline-primary{ --bs-btn-color: var(--brand); --bs-btn-border-color: var(--brand); }
.btn-warning{ --bs-btn-bg: var(--gold); --bs-btn-border-color: var(--gold); --bs-btn-color:#1b1b1b; }


/* ============================= */
/* CI Optimized Sticky Header   */
/* ============================= */

.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
}

.navbar {
  background: rgba(11,43,75,0.92) !important;
  backdrop-filter: blur(12px) saturate(160%);
  -webkit-backdrop-filter: blur(12px) saturate(160%);
  transition: all .3s ease;
  padding: .8rem 0;
}

.navbar.scrolled {
  background: rgba(11,43,75,0.98) !important;
  box-shadow: 0 6px 24px rgba(0,0,0,.15);
}

.navbar .navbar-nav .nav-link {
  color: #ffffff !important;
  font-weight: 600;
  letter-spacing: .4px;
  padding: .5rem .9rem;
  border-radius: 10px;
  transition: all .25s ease;
}

.navbar .navbar-nav .nav-link:hover {
  background: rgba(255,255,255,.08);
  color: var(--gold) !important;
}

.navbar-brand img {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
}

.navbar-toggler {
  border-color: rgba(255,255,255,.4);
}

.navbar-toggler-icon {
  filter: invert(1);
}



/* ============================= */
/* CI Footer Design              */
/* ============================= */

.site-footer {
  background: linear-gradient(135deg, rgba(11,43,75,.95), rgba(122,16,32,.92));
  overflow: hidden;
}

.footer-bg {
  position: absolute;
  inset: 0;
  background: url('assets/logo.png') center/400px no-repeat;
  opacity: 0.05;
  pointer-events: none;
}

.footer-links li {
  margin-bottom: .4rem;
}

.footer-links a,
.footer-social a {
  color: #ffffff;
  text-decoration: none;
  transition: all .2s ease;
}

.footer-links a:hover,
.footer-social a:hover {
  color: var(--gold);
}

.site-footer .rounded-circle {
  border: 3px solid rgba(255,255,255,.2);
}



/* ============================= */
/* Pixel-Perfect Design System   */
/* ============================= */

:root{
  --lh-blue:#0B2B4B;
  --lh-blue-2:#0A2440;
  --lh-burgundy:#7A1020;
  --lh-gold:#C9A26A;
  --lh-cream:#F6F1EA;
  --lh-cream-2:#EFE7DE;
  --lh-text:#1E1E1E;
  --lh-muted:#5E5E5E;
  --lh-border:#E6DED5;
  --lh-radius:18px;
  --lh-radius-lg:24px;
  --lh-shadow: 0 18px 44px rgba(0,0,0,.08);
  --lh-shadow-soft: 0 12px 28px rgba(0,0,0,.08);
  --lh-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E");
}

/* Global type tuning (bootstrap-safe) */
body{
  color:var(--lh-text);
  background: linear-gradient(180deg, #ffffff 0%, #fbfaf8 100%);
}
h1,h2,h3,.navbar-brand span{ letter-spacing:.2px; }

.lh-topline{
  height: 3px;
  background: linear-gradient(90deg, var(--lh-gold), rgba(201,162,106,.35));
}

/* Header */
.site-header{ position: sticky; top:0; z-index:1000; }
.navbar.lh-navbar{
  background:
    radial-gradient(1200px 380px at 12% 0%, rgba(255,255,255,.08), transparent 55%),
    linear-gradient(180deg, rgba(11,43,75,.96), rgba(8,28,50,.96)),
    var(--lh-noise);
  background-blend-mode: screen, normal, overlay;
  border-bottom: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(12px) saturate(150%);
  -webkit-backdrop-filter: blur(12px) saturate(150%);
  padding: .85rem 0;
}
.navbar.lh-navbar .navbar-nav .nav-link{
  color:#fff !important;
  font-weight:500;
  font-size:14px;
  padding:.5rem .9rem;
  border-radius: 10px;
  transition: all .2s ease;
}
.navbar.lh-navbar .navbar-nav .nav-link:hover{
  background: rgba(255,255,255,.08);
  color: var(--lh-gold) !important;
}
.navbar.lh-navbar .navbar-brand{ color:#fff !important; }
.navbar.lh-navbar .navbar-brand img{ width:44px; height:44px; border-radius:50%; object-fit:cover; border:2px solid rgba(255,255,255,.18);}
.navbar.lh-navbar .navbar-toggler{ border-color: rgba(255,255,255,.35);}
.navbar.lh-navbar .navbar-toggler-icon{ filter: invert(1); }

/* Buttons (pixel) */
.lh-btn-primary{
  background: var(--lh-gold);
  border: 1px solid rgba(0,0,0,.08);
  color:#1b1b1b;
  border-radius: 12px;
  padding: .62rem 1.05rem;
  font-weight: 600;
  box-shadow: 0 10px 22px rgba(0,0,0,.10);
  transition: all .2s ease;
}
.lh-btn-primary:hover{ transform: translateY(-1px); filter: brightness(1.02); }
.lh-btn-secondary{
  background: rgba(0,0,0,.25);
  border: 1px solid rgba(255,255,255,.25);
  color:#fff;
  border-radius: 12px;
  padding: .62rem 1.05rem;
  font-weight: 600;
  transition: all .2s ease;
}
.lh-btn-secondary:hover{ background: rgba(0,0,0,.35); }

/* Hero */
.lh-hero{
  position: relative;
  min-height: 64vh;
  overflow: hidden;
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.lh-hero .hero-img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  filter: saturate(1.05) contrast(1.02);
}
.lh-hero .hero-overlay{
  position:absolute; inset:0;
  background:
    radial-gradient(700px 380px at 18% 20%, rgba(122,16,32,.35), transparent 60%),
    linear-gradient(90deg, rgba(11,43,75,.88) 0%, rgba(11,43,75,.72) 44%, rgba(11,43,75,.15) 100%);
}
.lh-hero .hero-content{ position:relative; padding: 4.2rem 0; }
.lh-hero h1{ font-size: clamp(2.1rem, 3.6vw, 3.0rem); font-weight: 700; color:#fff; }
.lh-hero .sub{ color: rgba(255,255,255,.88); font-size: 16px; max-width: 44ch; }
.lh-hero .meta{ color: rgba(255,255,255,.80); font-size: 13px; }

/* Sections */
.lh-section{ padding: 3.25rem 0; }
.lh-section-title{ font-weight:700; font-size: 1.15rem; }
.lh-section-head{ display:flex; align-items:end; justify-content:space-between; gap:16px; }
.lh-link-muted{ color: var(--lh-muted); text-decoration:none; font-weight:600; font-size: 13px; }
.lh-link-muted:hover{ color: var(--lh-blue); }

/* Event cards */
.lh-card{
  background:#fff;
  border:1px solid var(--lh-border);
  border-radius: var(--lh-radius);
  box-shadow: var(--lh-shadow-soft);
  overflow:hidden;
  height:100%;
}
.lh-card .imgwrap{ position:relative; }
.lh-card img{ width:100%; height:auto; display:block; }
.lh-datebadge{
  position:absolute; top:10px; left:10px;
  background: rgba(122,16,32,.92);
  color:#fff;
  border-radius: 12px;
  padding: .55rem .6rem;
  line-height: 1.05;
  box-shadow: 0 10px 22px rgba(0,0,0,.18);
  text-align:left;
  min-width: 64px;
}
.lh-datebadge .d{ font-size:20px; font-weight:800; }
.lh-datebadge .m{ font-size:12px; opacity:.95; text-transform:capitalize; }
.lh-card .body{ padding: 14px 14px 12px 14px; }
.lh-card .title{ font-size: 15px; font-weight: 700; margin: 0 0 6px 0; }
.lh-card .loc{ font-size: 12px; color: var(--lh-muted); display:flex; align-items:center; gap:6px; }
.lh-card .more{ margin-top: 10px; font-size: 12px; color: var(--lh-muted); font-weight:700; display:flex; align-items:center; justify-content:space-between; }
.lh-card .more span:last-child{ opacity:.7; }

/* About */
.lh-about-img{ border-radius: var(--lh-radius-lg); overflow:hidden; box-shadow: var(--lh-shadow); border:1px solid var(--lh-border);}
.lh-check li{ display:flex; gap:10px; align-items:flex-start; margin: 6px 0; color: var(--lh-muted); font-size: 13px; }
.lh-check li:before{ content:"✓"; color: var(--lh-gold); font-weight:900; }

/* Impressions + CTA band */
.lh-impressions{ background: linear-gradient(180deg, #fbfaf8 0%, #f6f1ea 100%); }
.lh-mini-card{ border:1px solid var(--lh-border); border-radius: var(--lh-radius); overflow:hidden; background:#fff; box-shadow: var(--lh-shadow-soft); }
.lh-mini-card .p{ padding: 10px 12px 12px 12px; }
.lh-mini-card .t{ font-size: 13px; font-weight: 700; margin:0; }
.lh-mini-card .s{ font-size: 11px; color: var(--lh-muted); margin: 4px 0 10px 0; }
.lh-mini-card .btn{ width: 100%; border-radius: 12px; font-weight:700; }
.lh-cta-band{
  background:
    radial-gradient(900px 320px at 20% 30%, rgba(255,255,255,.12), transparent 55%),
    linear-gradient(90deg, rgba(122,16,32,.95) 0%, rgba(90,12,20,.95) 100%),
    var(--lh-noise);
  background-blend-mode: screen, normal, overlay;
  border-radius: var(--lh-radius-lg);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 18px 44px rgba(0,0,0,.12);
  color:#fff;
  padding: 22px 22px;
  height: 100%;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.lh-cta-band h3{ font-size: 16px; font-weight:800; margin:0 0 10px 0; }
.lh-cta-band .btn{ border-radius: 12px; font-weight: 700; padding: .62rem 1.05rem; }

/* Footer pixel */
.site-footer{
  background:
    linear-gradient(180deg, rgba(11,43,75,.96), rgba(8,28,50,.98)),
    var(--lh-noise);
  background-blend-mode: normal, overlay;
}
.site-footer:before{
  content:"";
  position:absolute; left:0; right:0; top:0;
  height:3px;
  background: linear-gradient(90deg, var(--lh-gold), rgba(201,162,106,.35));
}
.site-footer .footer-bg{ opacity:.06; background-size: 460px; }

/* Responsive tweaks for exact layout */
@media (max-width: 991px){
  .lh-hero .hero-content{ padding: 3.2rem 0; }
}
@media (max-width: 767px){
  .lh-section{ padding: 2.4rem 0; }
  .lh-hero{ min-height: 56vh; }
}


/* ============================= */
/* Click-to-Play Video Section   */
/* ============================= */

.lh-video-wrapper {
  background:#000;
}

.lh-video-play {
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:90px;
  height:90px;
  border-radius:50%;
  background:rgba(255,255,255,.2);
  backdrop-filter:blur(6px);
  border:2px solid rgba(255,255,255,.6);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:all .25s ease;
}

.lh-video-play:hover {
  background:rgba(255,255,255,.3);
  transform:translate(-50%,-50%) scale(1.05);
}

.lh-play-icon {
  width:0;
  height:0;
  border-left:28px solid #fff;
  border-top:18px solid transparent;
  border-bottom:18px solid transparent;
  margin-left:6px;
}

.lh-video-wrapper iframe {
  width:100%;
  height:100%;
}



/* Simple Video Section */
.lh-simple-video iframe {
  width:100%;
  height:300px;
  display:block;
}



/* ============================= */
/* Main Navigation Styling       */
/* ============================= */

.lh-navbar .navbar-nav {
  gap: 8px;
}

.lh-navbar .navbar-nav .nav-link {
  color: #ffffff !important;
  font-size: 14px;
  font-weight: 500;
  padding: 8px 14px;
  border-radius: 12px;
  transition: all .25s ease;
}

.lh-navbar .navbar-nav .nav-link:hover,
.lh-navbar .navbar-nav .nav-link:focus {
  background: rgba(255,255,255,.08);
  color: var(--lh-gold) !important;
}

.lh-navbar .navbar-nav .current-menu-item > .nav-link,
.lh-navbar .navbar-nav .current-menu-ancestor > .nav-link {
  background: rgba(255,255,255,.12);
  color: var(--lh-gold) !important;
  font-weight: 600;
}

/* CTA Button next to menu */
.lh-navbar .lh-btn-primary {
  margin-left: 12px;
}

/* ============================= */
/* Footer Link Styling           */
/* ============================= */

.site-footer a {
  color: rgba(255,255,255,.85);
  text-decoration: none;
  font-weight: 500;
  transition: all .2s ease;
}

.site-footer a:hover {
  color: var(--lh-gold);
}

.site-footer .border-top {
  border-color: rgba(255,255,255,.15) !important;
}

.site-footer .d-flex.gap-3 a {
  padding: 4px 6px;
  border-radius: 6px;
}

.site-footer .d-flex.gap-3 a:hover {
  background: rgba(255,255,255,.08);
}



/* Updated Video Height */
.lh-simple-video iframe {
  width:100%;
  height:500px;
  display:block;
}

/* ============================= */
/* Accessible CF7 Styling        */
/* ============================= */

.lh-contact-form label {
  font-weight:600;
  margin-bottom:6px;
  display:block;
}

.lh-contact-form input,
.lh-contact-form textarea {
  width:100%;
  padding:12px 14px;
  border-radius:10px;
  border:1px solid var(--lh-border);
  font-size:14px;
}

.lh-contact-form input:focus,
.lh-contact-form textarea:focus {
  outline:none;
  border-color:var(--lh-gold);
  box-shadow:0 0 0 3px rgba(201,166,93,.25);
}

.lh-contact-form .wpcf7-submit {
  background:var(--lh-burgundy);
  color:#fff;
  border:none;
  padding:12px 22px;
  border-radius:12px;
  font-weight:600;
  transition:.2s ease;
}

.lh-contact-form .wpcf7-submit:hover {
  background:var(--lh-blue);
}

/* Honeypot hidden field */
.lh-contact-form .lh-honeypot {
  position:absolute;
  left:-9999px;
  opacity:0;
  height:0;
  width:0;
}



/* ============================= */
/* CF7 Advanced Accessibility    */
/* ============================= */

.lh-contact-form .wpcf7-not-valid {
  border-color:#b00020 !important;
  box-shadow:0 0 0 3px rgba(176,0,32,.2);
}

.lh-contact-form .wpcf7-not-valid-tip {
  color:#b00020;
  font-size:13px;
  margin-top:4px;
}

.lh-contact-form .wpcf7-response-output {
  margin-top:20px;
  padding:12px 16px;
  border-radius:10px;
  font-weight:600;
}

.lh-contact-form .wpcf7-validation-errors {
  background:#ffe6e9;
  color:#b00020;
}

.lh-contact-form .wpcf7-mail-sent-ok {
  background:#e6f6ed;
  color:#146c43;
}

/* ARIA live region visually hidden but accessible */
.lh-live-region {
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  overflow:hidden;
}



/* Section Backgrounds */
.bg-white { background:#ffffff; }
.bg-cream { background:#f7f4ef; }
.bg-blue { background:var(--lh-blue); color:#fff; }
.bg-burgundy { background:var(--lh-burgundy); color:#fff; }

/* Spacing Utilities */
.pt-none { padding-top:0; }
.pt-small { padding-top:40px; }
.pt-medium { padding-top:80px; }
.pt-large { padding-top:140px; }

.pb-none { padding-bottom:0; }
.pb-small { padding-bottom:40px; }
.pb-medium { padding-bottom:80px; }
.pb-large { padding-bottom:140px; }