
:root{
  --purple:#7a3db8;          /* hlavní fialová (lze nahradit přesným odstínem z CI) */
  --purple-600:#6b30a8;
  --purple-200:#e9dbf9;
  --ink:#171717;
  --muted:#5b5b66;
  --bg:#faf8ff;
  --paper:#ffffff;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif; color:var(--ink); background:var(--bg);
}
.site-header,.site-footer{ text-align:center; padding:10px 16px; color:var(--muted); font-size:.95rem }
.site-header{ background:linear-gradient(90deg,var(--purple-200),#fff) }
.brand{ display:flex; gap:12px; align-items:center; justify-content:center; flex-wrap:wrap }
.brand__title{ font-weight:700; color:var(--purple-600) }
.brand__links a{ color:var(--purple-600); text-decoration:none; font-weight:600 }
.brand__links a:hover{ text-decoration:underline }
.brand__links .sep{ opacity:.5; margin:0 6px }

.wrap{ max-width:1000px; margin:24px auto; padding:16px }
.poster{
  position:relative;
  margin:auto;
  background:var(--paper);
  border-radius:16px;
  box-shadow:0 12px 30px rgba(64,0,128,.12);
  padding:28px 24px 24px;
  /* Pomer A5 (148×210) */
  aspect-ratio:148/210;
  min-height:540px; /* aby to fungovalo i bez podpory aspect-ratio */
}
.poster__ribbon{
  position:absolute; inset:auto 0 calc(100% - 52px) auto; /* nahoře překryv */
  width:max-content; margin:auto; left:24px; right:auto;
  background:var(--purple);
  color:#fff; padding:8px 14px; border-radius:999px; font-weight:700;
  box-shadow:0 8px 20px rgba(122,61,184,.3);
}
.poster__title{
  font-weight:700; font-size:clamp(28px,4.4vw,44px); margin:22px 0 4px; color:var(--purple-600); text-transform: uppercase;
}
.poster__subtitle{ margin:0 0 14px; color:var(--muted) }

.grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:18px 0 }
@media (max-width:680px){ .grid{ grid-template-columns:1fr } }
.card{ border:1px solid #eee; border-radius:12px; padding:14px 14px 14px 56px; position:relative; background:linear-gradient(180deg,#fff,#fff 70%,#fcfaff) }
.icon{ position:absolute; left:14px; top:14px; width:32px; height:32px; border-radius:50%; background:var(--purple); color:#fff; display:grid; place-items:center; font-weight:800 }
.card h2{ margin:0 0 6px; font-size:1.05rem; color:var(--purple-600) }
.card p{ margin:0; color:var(--ink) }

.event{ margin:12px 0 6px; border-radius:14px; background:var(--purple-200); padding:14px; border:1px solid #e5d5fb }
.event__date{ font-weight:800; color:var(--purple-600) }
.event__time{ font-weight:700 }
.event__place{ color:var(--muted) }

.message{ margin:12px 0 8px }
.message p{ margin:0 0 8px }
blockquote{ margin:0; padding:8px 14px; color:var(--muted); font-style: normal }

.poster__ribbon{ display:flex; gap:10px; flex-wrap:wrap; margin-top:16px }
.btn{ --c:var(--purple); color:#fff; background:var(--c); border:2px solid var(--c); padding:10px 14px; border-radius:10px; text-decoration:none; font-weight:700; display:inline-block }
.btn:hover{ filter:brightness(1.05) }
.btn--ghost{ background:#fff; color:var(--purple); }

/* Tisk A5: pokud uživatel zvolí Tisk → udrží A5 poměr a barvy */
@media print{
  @page{ size: A5; margin: 10mm }
  body{ background:#fff }
  .wrap{ max-width:none; padding:0; margin:0 }
  .poster{ box-shadow:none; border:1px solid #ccc; border-radius:8px }
  .site-header,.site-footer{ display:none }
}
