/* Akcie a kurzy: page styles. Tokens, tiles, buttons and footer live in base.css. */

main { display: block; }
.motion [data-tpop] { opacity: 0; }
figure { margin: 0; }
section, article { scroll-margin-top: 14px; }
.print img { aspect-ratio: 4 / 3; }
.inline-link { color: inherit; text-underline-offset: 4px; text-decoration-thickness: 2px; text-decoration-color: var(--mustard); }

/* ---------- section scaffolding ---------- */
.sec { overflow-x: clip; }
.sec-head { display: grid; gap: 4px; margin-bottom: clamp(26px, 4vw, 52px); }
.sec-head .note { margin: 0; }
.sec-head--dark { color: var(--cream); }
.sec-head--dark .note { color: var(--mustard); }
.note--cream { color: var(--cream); }
.band-leaf .sec-head--dark .note { color: var(--cream); }
.note--forest { color: var(--forest); }

.band { position: relative; overflow-x: clip; padding-block: clamp(72px, 10vw, 132px); }
.band-soil { padding-bottom: clamp(20px, 3vw, 36px); background: var(--soil) url("../assets/texture/mottle.png"); color: var(--paper); clip-path: polygon(0 1.1%, 100% 0, 100% 98.9%, 0 100%); }
.band-leaf { background: var(--leaf) url("../assets/texture/mottle.png"); color: var(--cream); clip-path: polygon(0 0.9%, 100% 0, 100% 99.2%, 0 100%); }
.band-mustard { background: var(--mustard) url("../assets/texture/mottle.png"); color: var(--forest); clip-path: polygon(0 0, 100% 1%, 100% 100%, 0 99%); }

/* ---------- HERO ---------- */
.hero { position: relative; overflow-x: clip; padding-block: clamp(4px, 2vw, 24px) clamp(48px, 6vw, 88px); }
.hero-grid {
  position: relative; z-index: 2;
  display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr);
  grid-template-areas: "copy art" "idx art";
  grid-template-rows: auto 1fr;
  column-gap: clamp(28px, 5vw, 72px);
  align-items: center; align-content: center;
  min-height: clamp(380px, 54vh, 580px);
}
.hero-copy { grid-area: copy; align-self: end; }
.hero-art { grid-area: art; position: relative; aspect-ratio: 6 / 5; width: 100%; }
.idx { grid-area: idx; align-self: start; }

.hero-note { margin: 0 0 4px; min-height: 1.2em; }
.hero-title { font-size: clamp(3.3rem, 0.6rem + 10.8vw, 8.8rem); margin: 0 0 clamp(14px, 2vw, 22px); }
.hero-title .l1, .hero-title .l2 { display: block; }
.hero-title .l2 { font-size: 0.66em; color: var(--forest); margin: 0.1em 0 0 0.12em; }
.hero-lead { max-width: 40ch; margin: 0 0 20px; text-wrap: pretty; }

.hero-photo { position: absolute; inset: 0; rotate: 1.2deg; }
.hero-photo img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; object-position: 50% 40%; }
.hero-chip { position: absolute; left: -5%; bottom: -7%; width: 22%; aspect-ratio: 1; rotate: -7deg; display: grid; place-items: center; }
.hero-chip img { width: 72%; }
.hero-stamp { position: absolute; right: 4%; bottom: -16px; background: var(--cream); color: var(--clay); padding: 5px 14px; font-size: 0.9rem; rotate: 3deg; }

.idx { margin-top: clamp(14px, 2vw, 26px); }
.idx-label { margin: 0; font-size: 1.35rem; }
.idx ul { display: flex; flex-wrap: wrap; gap: 0 22px; }
.idx-link { min-height: 44px; font-family: var(--font-note); font-size: 1.6rem; font-weight: 700; line-height: 1; }

.hero .s1 { top: 15%; left: 46%; }
.hero .s2 { right: 0.5%; bottom: 5%; }
.hero .s4 { right: 1%; top: 0; }

/* ---------- events (shared) ---------- */
.ev { position: relative; margin-bottom: clamp(52px, 7vw, 100px); }
.ev-card { padding: clamp(26px, 3.6vw, 52px); }
.ev-card h3, .sk-text h3 { font-size: clamp(1.7rem, 1.1rem + 1.9vw, 2.7rem); line-height: 1.04; margin: 12px 0 10px; }
.ev-card p, .sk-text p { max-width: 46ch; }
.ev-tags { margin: 0; }
.ev-tags .stamp { background: var(--cream); color: var(--forest); padding: 4px 14px; }
.ev-media { position: relative; aspect-ratio: 1 / 0.95; }
.em-riso { position: absolute; width: 80%; aspect-ratio: 1.3; }
.em-riso img { width: 100%; height: 100%; object-fit: cover; }
.em-print { position: absolute; width: 62%; }

/* dielnicky: big forest tile left, stacked photos right */
.ev-dielnicky { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(20px, 3vw, 44px); align-items: center; }
.ev-dielnicky .em-riso { left: 0; top: 0; rotate: -2deg; }
.ev-dielnicky .em-print { right: 0; bottom: 0; rotate: 3.5deg; }
.when { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 18px; margin: 12px 0 16px; }
.when-day { font-family: var(--font-note); font-weight: 700; font-size: 1.8rem; line-height: 1; color: var(--mustard); }
.when-time { font-family: var(--font-poster); font-weight: 900; font-size: clamp(2.1rem, 1.2rem + 2.8vw, 3.5rem); line-height: 1; font-variation-settings: "SOFT" 60, "WONK" 1, "opsz" 144; }
.chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 22px; }
.chips li { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 4px 16px 4px 8px; border: 1.5px solid currentColor; border-radius: var(--r-pill); font-weight: 700; font-size: 0.95rem; }
.chips img { width: 28px; height: 28px; object-fit: contain; }

/* tabory: ticket strip, mirrored (photos left, clay tile right) */
.ev-tabory { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(20px, 3vw, 44px); align-items: center; }
.ev-tabory .ev-media { aspect-ratio: 1.25; }
.ev-tabory .em-riso { right: 0; top: 0; width: 76%; rotate: 2deg; }
.ev-tabory .em-print { left: 0; bottom: 0; width: 50%; rotate: -4deg; }
.ev-tabory .ev-card { padding-block: clamp(30px, 4vw, 60px); }
.ev-tabory .ev-card p { font-weight: 700; font-size: 1.12rem; }

/* skoly: wide mustard poster */
.ev-skoly { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); min-height: clamp(420px, 40vw, 540px); margin-bottom: 0; }
.sk-text { padding: clamp(26px, 4vw, 56px); position: relative; z-index: 2; }
.sk-text .stamp { background: var(--forest); color: var(--cream); padding: 4px 14px; }
.sk-list { display: grid; gap: 4px; margin: 18px 0 14px; }
.sk-list li { display: flex; align-items: center; gap: 14px; min-height: 52px; padding-block: 4px; border-bottom: 2px dashed rgba(30, 58, 40, 0.35); font-weight: 700; font-size: 1.1rem; line-height: 1.2; }
.sk-list img { flex: none; width: 40px; height: 40px; object-fit: contain; }
.sk-when { font-family: var(--font-note); font-weight: 700; font-size: 1.55rem; line-height: 1.1; color: var(--clay); margin: 0 0 12px; }
.sk-art { position: relative; min-height: 260px; }
.sk-art > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.price-seal {
  position: absolute; left: clamp(8px, 3%, 28px); bottom: clamp(12px, 5%, 32px); margin: 0;
  width: clamp(112px, 11vw, 150px); aspect-ratio: 1; border-radius: 50%; rotate: -9deg;
  display: grid; place-content: center; text-align: center;
  background: var(--cream); color: var(--forest); outline: 2px dashed var(--clay); outline-offset: -8px;
}
.ps-n { font-family: var(--font-poster); font-weight: 900; font-size: clamp(1.7rem, 1.2rem + 1.2vw, 2.3rem); line-height: 1; font-variation-settings: "SOFT" 60, "WONK" 1, "opsz" 144; }
.ps-u { font-family: var(--font-note); font-weight: 700; font-size: 1.4rem; line-height: 1; color: var(--clay); }

.sec-deti .d1 { right: 2%; top: 7%; }
.sec-deti .d2 { left: 0.5%; top: 52%; }

/* ---------- altanok: soil band ---------- */
.band-soil .link-hand:hover { color: var(--mustard); }
.alt-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 6vw, 88px); align-items: start; }
.alt-b { margin-top: clamp(0px, 6vw, 90px); }
.alt h3 { font-size: clamp(1.6rem, 1.1rem + 1.6vw, 2.4rem); line-height: 1.05; margin: 0 0 10px; color: var(--mustard); }
.alt p { max-width: 44ch; }
.alt-riso { aspect-ratio: 3 / 2; margin-bottom: 26px; rotate: -1.4deg; }
.alt-riso img { width: 100%; height: 100%; object-fit: cover; }
.alt-print { width: min(82%, 480px); rotate: 3deg; margin-bottom: 26px; }
.alt-b .ev-tags .stamp { background: var(--mustard); color: var(--forest); }
.alt-links { display: flex; flex-wrap: wrap; gap: 4px 26px; margin: 0; }
.band-soil .a1 { right: 3%; top: 8%; }
.walk-row { position: relative; height: 92px; margin-top: clamp(36px, 5vw, 64px); overflow: hidden; border-top: 2px dashed rgba(243, 234, 215, 0.25); }
.wk { position: absolute; left: 0; bottom: 4px; width: 72px; height: auto; }
.wk2 { bottom: 6px; width: 78px; }
.wk3 { width: 76px; }

/* ---------- seminar ---------- */
.sem-top { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(28px, 5vw, 80px); align-items: center; }
.sem-text h2 { margin: 12px 0 16px; }
.sem-text p { max-width: 46ch; }
.sem-text .stamp { background: var(--mustard); color: var(--forest); padding: 4px 14px; }
.sem-media { position: relative; aspect-ratio: 1.1; }
.sm-p1 { position: absolute; left: 0; top: 0; width: 74%; rotate: -3deg; }
.sm-p2 { position: absolute; right: 0; bottom: 0; width: 58%; rotate: 4deg; }
.sem-sub { font-size: var(--fs-h2); line-height: 1.08; margin: clamp(40px, 5vw, 72px) 0 20px; }
.sem-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(10px, 1.6vw, 18px); }
.sem-tiles li { aspect-ratio: 1 / 0.95; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; padding: clamp(14px, 1.8vw, 22px); }
.sem-tiles img, .sem-tiles .waves { width: 54%; align-self: center; flex: 1; min-height: 0; object-fit: contain; }
.sem-tiles .waves { height: auto; flex: none; margin-block: auto; }
.sem-tiles span { font-weight: 800; font-size: clamp(1rem, 0.85rem + 0.5vw, 1.25rem); line-height: 1.12; }
.sec-seminar .m1 { right: 1%; top: 6%; }
.sec-seminar .m2 { left: 0.5%; bottom: 1.5%; }

/* ---------- tiny house: leaf band ---------- */
.th-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.92fr); gap: clamp(32px, 5vw, 84px); align-items: start; }
.th-steps { display: grid; gap: 14px; margin-bottom: 22px; }
.th-steps li { display: flex; gap: 16px; align-items: center; font-weight: 700; font-size: 1.15rem; line-height: 1.25; }
.th-steps .n { flex: none; display: grid; place-items: center; width: 46px; height: 46px; border: 2.5px solid var(--cream); border-radius: 50%; font-family: var(--font-poster); font-weight: 900; font-size: 1.4rem; rotate: -5deg; }
.th-who { max-width: 44ch; margin-bottom: 26px; }
.th-media { position: relative; aspect-ratio: 1.45; }
.th-riso { position: absolute; left: 0; top: 0; width: 72%; aspect-ratio: 1.6; rotate: -2deg; }
.th-riso img { width: 100%; height: 100%; object-fit: cover; }
.th-print { position: absolute; right: 0; bottom: 0; width: 54%; rotate: 4deg; }
.th-form-wrap { position: relative; }
.arrow-th { position: absolute; left: -64px; top: -36px; width: 96px; color: var(--mustard); rotate: -8deg; }
.band-leaf .t1 { right: 3%; top: 5%; }

.ticket {
  position: relative; background: var(--cream); color: var(--forest);
  padding: clamp(24px, 3.2vw, 40px); border-radius: var(--r-tile); rotate: 0.8deg;
  clip-path: polygon(0.4% 0.8%, 99.6% 0%, 100% 99.4%, 0% 100%);
}
.ticket::before { content: ""; position: absolute; inset: 9px; border: 2px dashed rgba(30, 58, 40, 0.3); pointer-events: none; }
.ticket-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.ticket-head h3 { font-size: clamp(1.5rem, 1.1rem + 1vw, 2rem); }
.ticket-head .stamp { color: var(--clay); font-size: 0.95rem; }
.ticket-note { font-size: 0.98rem; color: var(--ink-soft); margin-bottom: 20px; }
.ticket .btn { margin-top: 6px; }

/* ---------- online kurz: mustard band ---------- */
.kurz-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.kurz-info h2 { margin: 4px 0 4px; }
.kurz-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 24px 0 18px; }
.kurz-facts li { display: flex; flex-direction: column; justify-content: space-between; gap: 8px; min-height: 118px; padding: 16px 18px 18px; }
.kurz-facts b { font-family: var(--font-poster); font-weight: 900; font-size: clamp(2rem, 1.3rem + 2vw, 3rem); line-height: 1; font-variation-settings: "SOFT" 60, "WONK" 1, "opsz" 144; }
.kurz-facts span { font-weight: 700; line-height: 1.2; }
.kurz-info p { max-width: 38ch; }
.kurz-info .btn { margin-top: 6px; }
.mods { display: grid; }
.mods li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(14px, 2vw, 24px); align-items: center; padding-block: 12px; border-bottom: 2.5px dashed rgba(30, 58, 40, 0.35); }
.mods li:first-child { border-top: 2.5px dashed rgba(30, 58, 40, 0.35); }
.mn {
  display: grid; place-items: center; width: clamp(64px, 7vw, 88px); aspect-ratio: 1; border-radius: var(--r-tile);
  font-family: var(--font-poster); font-weight: 900; font-size: clamp(2.6rem, 1.6rem + 3vw, 4.2rem); line-height: 1;
  font-variation-settings: "SOFT" 60, "WONK" 1, "opsz" 144; color: var(--cream); background: var(--forest);
  clip-path: polygon(1% 1%, 99% 0, 100% 99%, 0 100%);
}
.mods li:nth-child(3n+2) .mn { background: var(--berry); }
.mods li:nth-child(3n) .mn { background: var(--leaf); }
.mods li:nth-child(odd) .mn { rotate: -3deg; }
.mods li:nth-child(even) .mn { rotate: 3deg; }
.mods h3 { font-size: clamp(1.15rem, 1rem + 0.8vw, 1.65rem); line-height: 1.15; }
.band-mustard .k1 { right: 4%; top: 4%; }
.band-mustard .k2 { left: 0.5%; bottom: 6%; }

/* ---------- newsletter ---------- */
.sec-news { padding-bottom: clamp(88px, 11vw, 150px); }
.news-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr); gap: clamp(24px, 5vw, 72px); padding: clamp(28px, 5vw, 68px); align-items: center; }
.news-text h2 { margin: 6px 0 14px; }
.news-text p { max-width: 40ch; font-weight: 700; font-size: 1.2rem; line-height: 1.4; margin: 0; }
.sec-news .n1 { right: 2%; top: 6%; }
.sec-news .n2 { left: 1%; bottom: 8%; }
.news-card .note { color: var(--cream); }
.news-card .err { color: var(--cream); background: var(--forest); padding: 2px 10px; width: fit-content; rotate: -1deg; }

/* ---------- forms ---------- */
.f-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.field { display: grid; gap: 6px; margin: 0 0 14px; }
.field label { font-weight: 700; font-size: 0.95rem; font-variation-settings: "INFM" 60, "BNCE" 0; }
.field input[type="text"], .field input[type="email"], .field input[type="tel"], .field textarea, .field select {
  width: 100%; min-height: 48px; padding: 10px 14px; border: 2px solid var(--forest); border-radius: var(--r-tile);
  background: var(--paper); color: var(--forest); font: inherit; font-size: 1rem;
}
.field input:focus, .field textarea:focus, .field select:focus { outline: 2.5px solid var(--clay); outline-offset: 2px; background: var(--cream); }
.field input[aria-invalid="true"], .field textarea[aria-invalid="true"] { border-color: var(--berry); border-style: dashed; }
.check { display: flex; align-items: flex-start; gap: 12px; min-height: 44px; cursor: pointer; font-size: 0.95rem; line-height: 1.4; font-weight: 600; }
.check input { appearance: none; -webkit-appearance: none; flex: none; display: grid; place-content: center; width: 28px; height: 28px; margin: 0; border: 2px solid currentColor; border-radius: var(--r-tile); background: var(--paper); color: var(--forest); cursor: pointer; }
.check input::after { content: ""; width: 14px; height: 8px; border-left: 3.5px solid var(--cream); border-bottom: 3.5px solid var(--cream); rotate: -45deg; translate: 0 -2px; scale: 0; transition: scale 180ms var(--ease-back); }
.check input:checked { background: var(--clay); border-color: var(--forest); }
.check input:checked::after { scale: 1; }
.check input:focus-visible { outline: 2.5px solid var(--clay); outline-offset: 3px; }
.err { margin: 0; color: var(--berry); font-family: var(--font-note); font-size: 1.35rem; font-weight: 700; line-height: 1.05; }
.err[hidden] { display: none; }
.form-status { margin: 14px 0 0; }
.form-status:not(:empty) {
  padding: 14px 16px 14px 66px; border-radius: var(--r-tile); rotate: -1deg;
  background: var(--mustard) url("../assets/art/sprig-forest.svg") no-repeat 12px 50% / 42px auto;
  color: var(--forest); font-weight: 700; line-height: 1.35;
  animation: status-in 460ms var(--ease-back);
}
@keyframes status-in { from { opacity: 0; scale: 0.8; rotate: -6deg; } to { opacity: 1; scale: 1; rotate: -1deg; } }

/* ---------- tablet (641 to 960): own composition ---------- */
@media (max-width: 960px) and (min-width: 641px) {
  .hero-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr); grid-template-areas: "copy art" "idx idx"; grid-template-rows: auto auto; }
  .hero-grid { min-height: 0; }
  .hero-art { align-self: center; }
  .hero-title { font-size: 9.4vw; }
  .idx ul { gap: 0 24px; }
  .ev-dielnicky { grid-template-columns: minmax(0, 1fr); }
  .ev-dielnicky .ev-media { aspect-ratio: 1.5; }
  .ev-tabory { grid-template-columns: minmax(0, 1fr); }
  .ev-tabory .ev-card { order: -1; }
  .ev-tabory .ev-media { aspect-ratio: 1.6; }
  .ev-skoly { grid-template-columns: minmax(0, 1fr); }
  .sk-art { min-height: 340px; }
  .alt-grid { gap: 28px; }
  .alt-b { margin-top: 40px; }
  .sem-top { grid-template-columns: minmax(0, 1fr); }
  .sem-media { aspect-ratio: 1.6; }
  .sem-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .th-grid { grid-template-columns: minmax(0, 1fr); }
  .th-media { aspect-ratio: 1.8; }
  .arrow-th { display: none; }
  .kurz-grid { grid-template-columns: minmax(0, 1fr); }
  .news-card { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- phone ---------- */
@media (max-width: 640px) {
  .hero-grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "art" "copy" "idx"; grid-template-rows: auto; min-height: 0; row-gap: 0; }
  .hero-art { aspect-ratio: 1.45; margin: 4px 0 26px; }
  .hero-chip { left: -2%; bottom: -10%; width: 24%; }
  .hero-title { font-size: 17.5vw; }
  .hero-title .l2 { font-size: 0.74em; }
  .hero-btn { width: 100%; justify-content: center; }
  .idx { margin-top: 12px; }
  .idx-link { font-size: 1.5rem; }
  .hero .s1 { top: 366px; left: auto; right: 9%; }
  .hero .s2 { top: 424px; right: 3%; bottom: auto; }
  .ev-dielnicky, .ev-tabory, .ev-skoly, .alt-grid, .sem-top, .th-grid, .kurz-grid, .news-card { grid-template-columns: minmax(0, 1fr); }
  .ev-tabory .ev-card { order: -1; }
  .ev-media, .ev-tabory .ev-media { aspect-ratio: 1.15; }
  .ev-tabory .em-print { width: 56%; }
  .sk-art { min-height: 300px; }
  .alt-b { margin-top: 0; }
  .sem-media { aspect-ratio: 1.25; }
  .sem-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .th-media { aspect-ratio: 1.3; }
  .arrow-th { display: none; }
  .f-row { grid-template-columns: 1fr; }
  .kurz-facts li { min-height: 104px; }
  .wk { width: 56px; }
  .wk2 { width: 60px; }
  .wk3 { width: 58px; }
  .band-soil { clip-path: polygon(0 0.6%, 100% 0, 100% 99.4%, 0 100%); }
  .band-leaf { clip-path: polygon(0 0.5%, 100% 0, 100% 99.6%, 0 100%); }
  .band-mustard { clip-path: polygon(0 0, 100% 0.5%, 100% 100%, 0 99.5%); }
  .sec-deti .d1 { top: 2%; }
  .sec-deti .d2 { top: 40%; }
}

@media (min-width: 1100px) {
  .arrow-th { left: -78px; top: -44px; width: 112px; }
}