/*
Theme Name: Maroniclub
Theme URI: https://maroniclub.de/
Author: Maroniclub
Description: Ein modernes und gemütliches, vollständig bearbeitbares WordPress-Block-Theme für den Maroniclub in Lauingen.
Version: 1.3.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: maroniclub
License: GPL-2.0-or-later
*/

:root {
  --maroni-cream: #f5f1e9;
  --maroni-paper: #fffdf8;
  --maroni-green: #294236;
  --maroni-chestnut: #925c45;
  --maroni-gold: #d2ab77;
  --maroni-muted: #68756b;
}

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; }
.wp-site-blocks { overflow: clip; }
.wp-site-blocks > * { margin-block-start: 0; }
button, a, input { -webkit-tap-highlight-color: transparent; }
img { height: auto; }
.wp-block-heading { text-wrap: balance; }

.maroni-header {
  position: sticky;
  top: 0;
  z-index: 30;
  background: rgba(250,247,240,.96);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid #29423620;
}
.admin-bar .maroni-header { top: 32px; }
.maroni-header .wp-block-group { gap: 14px; }
.maroni-wordmark { font-family: Georgia, 'Times New Roman', serif; letter-spacing: -.065em; }
.maroni-wordmark a { text-decoration: none; }
.maroni-brand-subline { letter-spacing: .21em; text-transform: uppercase; font-size: 10px; font-weight: 700; }
.maroni-header .wp-block-navigation { gap: clamp(12px,2.5vw,34px); }
.maroni-header .wp-block-navigation a { text-decoration: none; font-size: 13px; font-weight: 600; }
.maroni-header .wp-block-navigation a:hover { color: var(--maroni-chestnut); }

.maroni-eyebrow {
  color: var(--maroni-chestnut);
  text-transform: uppercase;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .2em;
}
.maroni-eyebrow::before { content: '—'; margin-right: 9px; }
.maroni-display, .maroni-section-title {
  font-family: Georgia, 'Times New Roman', serif;
  font-weight: 400;
  letter-spacing: -.055em;
}
.maroni-display { font-size: clamp(54px,5.8vw,90px) !important; line-height: 1.02; }
.maroni-display em, .maroni-section-title em { color: var(--maroni-chestnut); }
.maroni-section-title { font-size: clamp(40px,4vw,66px) !important; line-height: 1.08; }
.maroni-intro { color: var(--maroni-muted); font-size: 16px; line-height: 1.85; }

.maroni-hero {
  background: radial-gradient(circle at 20% 85%,#e8e2d5,transparent 45%),var(--maroni-cream);
  padding: clamp(64px,8vw,118px) 24px;
}
.maroni-hero-columns { gap: clamp(38px,6vw,100px); align-items: center !important; }
.maroni-hero .wp-block-buttons { margin-top: 30px; gap: 12px; }
.maroni-hero-image img {
  width: 100%; height: min(590px,58vw); min-height: 380px;
  object-fit: cover; object-position: center;
  border-radius: 190px 190px 12px 12px;
  box-shadow: 0 22px 58px #233d3028;
}
.maroni-hero-image { position: relative; margin: 0; }
.maroni-hero-image::after {
  content: 'Schön, dass du da bist.';
  display: block;
  position: absolute; right: -18px; bottom: 40px;
  background: #fffdf7; padding: 15px 20px;
  max-width: 130px;
  font: italic 20px/1.15 Georgia,serif;
  color: var(--maroni-green);
  box-shadow: 0 12px 22px #203c2a18;
  transform: rotate(4deg);
}
.wp-block-button__link { transition: transform .18s ease,opacity .18s ease; }
.wp-block-button__link:hover { transform: translateY(-2px); }
.maroni-primary .wp-block-button__link { background: var(--maroni-green); color: white; }
.maroni-outline .wp-block-button__link { background: transparent; border: 1px solid #829184; color: var(--maroni-green); }

.maroni-ribbon { background: var(--maroni-green); color: #eee8da; padding: 23px 16px; }
.maroni-ribbon .wp-block-columns { margin-bottom: 0; }
.maroni-ribbon p { text-transform: uppercase; letter-spacing: .15em; font-weight: 700; font-size: 11px; text-align: center; }
.maroni-section { padding: clamp(75px,9vw,125px) 24px; }
.maroni-section-text { max-width: 660px; }
.maroni-duo { gap: 25px; align-items: stretch !important; }
.maroni-duo > .wp-block-column { background: var(--maroni-paper); border: 1px solid #e7e5dc; }
.maroni-duo .wp-block-image { margin: 0; }
.maroni-duo .wp-block-image img { width: 100%; height: clamp(260px,30vw,370px); object-fit: cover; }
.maroni-card-copy { padding: 25px clamp(20px,3vw,35px) 35px; }
.maroni-card-copy h3 { font-family: Georgia,serif; font-weight: 400; font-size: clamp(26px,2.5vw,35px); letter-spacing: -.03em; }
.maroni-card-copy p { color: var(--maroni-muted); line-height: 1.85; font-size: 14px; }

.maroni-events { background: var(--maroni-green); color: #fffaf1; padding: clamp(78px,8vw,118px) 24px; }
.maroni-events .maroni-eyebrow { color: var(--maroni-gold); }
.maroni-events .maroni-section-title { color: #fffaf1; }
.maroni-events .maroni-intro { color: #d3dcd2; }
.maroni-event-card { background: var(--maroni-paper); border-top: 5px solid var(--maroni-gold); color: #263b2e; padding: clamp(26px,3vw,44px); border-radius: 5px; }
.maroni-event-card h3 { font-family: Georgia,serif; font-size: clamp(26px,2.8vw,37px); font-weight: 400; }
.maroni-event-card p { color: #647166; }
.maroni-event-tag { display: inline-block; background: #f0ede3; color: #607064; border-radius: 40px; padding: 7px 14px; font-size: 11px; text-transform: uppercase; letter-spacing: .12em; font-weight: 700; }
.maroni-event-heading { max-width: 850px; margin-bottom: 30px; }
.maroni-event-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.maroni-event-item { background: var(--maroni-paper); border-radius: 6px; border-top: 4px solid var(--maroni-gold); color: var(--maroni-green); padding: 25px; display: flex; flex-direction: column; gap: 12px; min-height: 250px; }
.maroni-event-date { display: flex; align-items: baseline; gap: 9px; }
.maroni-event-day { font: 400 46px/.95 Georgia,serif; letter-spacing: -.07em; }
.maroni-event-month { text-transform: uppercase; letter-spacing: .15em; font: 700 11px/1 sans-serif; }
.maroni-event-item h3 { font: 400 clamp(24px,2.2vw,32px)/1.1 Georgia,serif; letter-spacing: -.04em; margin: 0; }
.maroni-event-meta { color: #65736a; font-size: 13px; line-height: 1.55; }
.maroni-event-link { color: var(--maroni-chestnut) !important; font-size: 13px; font-weight: 700; text-decoration: none; margin-top: auto; }
.maroni-event-link:hover { text-decoration: underline; }
.maroni-event-state { display: inline-block; align-self: flex-start; border-radius: 30px; padding: 4px 10px; font-size: 11px; color: #724f3a; background: #f2e5d5; }
.maroni-event-empty { background: var(--maroni-paper); color: var(--maroni-green); padding: 27px; border-left: 4px solid var(--maroni-gold); border-radius: 5px; }
.maroni-event-empty p { margin-bottom: 0; }
.maroni-events .maroni-outline .wp-block-button__link { border-color: #ddd6c7; color: #fffaf1; }

.maroni-gallery-section { padding: clamp(75px,8vw,120px) 24px; }
.maroni-gallery-grid { gap: 14px !important; }
.maroni-gallery-grid .wp-block-image img { width: 100%; height: clamp(180px,20vw,280px) !important; object-fit: cover; border-radius: 3px; }
.maroni-gallery-grid .wp-block-image { overflow: hidden; }
.maroni-gallery-grid .wp-block-image img { transition: transform .3s ease; }
.maroni-gallery-grid .wp-block-image img:hover { transform: scale(1.025); }

.maroni-quote { background: #e8e1d3; padding: clamp(65px,7vw,110px) 24px; text-align: center; }
.maroni-quote p { max-width: 900px; margin-inline: auto; font: 400 clamp(30px,3.7vw,54px)/1.28 Georgia,serif; letter-spacing: -.035em; }
.maroni-visit { background: var(--maroni-paper); padding: clamp(75px,8vw,115px) 24px 0; }
.maroni-visit .wp-block-columns { align-items: center !important; gap: clamp(35px,8vw,100px); }
.maroni-visit-photo img { width: 100%; height: clamp(340px,40vw,590px); object-fit: cover; border-radius: 185px 185px 0 0; }
.maroni-visit strong { font-weight: 700; }

.maroni-page-wrap { padding: clamp(65px,7vw,110px) 24px; min-height: 65vh; }
.maroni-page-title { font-size: clamp(44px,5vw,76px) !important; margin-bottom: 32px !important; }
.maroni-page-content { font-size: 16px; line-height: 1.85; }
.maroni-page-content > * + * { margin-block-start: 1.2em; }
.maroni-page-content img { border-radius: 4px; }
.maroni-page-content a { color: var(--maroni-chestnut); }
.maroni-page-content .wp-block-embed { max-width: 100%; }

.maroni-footer { background: #1d3329; color: #e8eee4; padding: 58px 24px 26px; }
.maroni-footer .maroni-footer-title { font: 400 clamp(32px,3vw,46px) Georgia,serif; letter-spacing: -.04em; }
.maroni-footer p { color: #b3c3b6; font-size: 13px; }
.maroni-footer a { color: #e8eee4; text-decoration: none; }
.maroni-footer .wp-block-navigation { gap: 19px; }
.maroni-footer .wp-block-navigation a { font-size: 13px; }
.maroni-footer-bottom { border-top: 1px solid #ffffff20; padding-top: 20px; margin-top: 42px; }
.maroni-footer-bottom p { font-size: 11px; }

@media (max-width: 820px) {
  .maroni-header { top: 0; }
  .admin-bar .maroni-header { top: 46px; }
  .maroni-header .wp-block-group.is-content-justification-space-between { gap: 12px; }
  .maroni-hero { padding-top: 54px; padding-bottom: 75px; }
  .maroni-hero-image img { height: 440px; }
  .maroni-hero-image::after { right: 0; bottom: 15px; }
  .maroni-ribbon .wp-block-columns { gap: 5px; }
  .maroni-ribbon p { font-size: 10px; }
  .maroni-duo .wp-block-image img { height: 280px; }
  .maroni-visit-photo img { height: 390px; }
  .maroni-event-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 600px) {
  .maroni-header .wp-block-group { padding-left: 0 !important; padding-right: 0 !important; }
  .maroni-display { font-size: clamp(49px,12vw,68px) !important; }
  .maroni-hero-image img { height: 390px; min-height: 0; border-radius: 150px 150px 10px 10px; }
  .maroni-hero-image::after { font-size: 16px; padding: 11px 15px; }
  .maroni-ribbon .wp-block-column { flex-basis: 100% !important; }
  .maroni-ribbon p { margin: 3px 0; }
  .maroni-gallery-grid { gap: 7px !important; }
  .maroni-gallery-grid .wp-block-image img { height: 150px !important; }
  .maroni-event-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
}