/* r29 · deck LineApp jako źródło prawdy (Obsidian „LineApp deck - Design system.md”, Lineapp_Deck_EN_source.pdf, 28.10)
   dark #11221C · cream #FDF3E0 · violet #412BCC · orange #EA3A00 · lime #D2E900 (tylko sponsorzy) / #E1F017 (lime na fiolecie)
   Display: Gamay Expanded Bold w decku (komercyjny, brak licencji web) → Archivo 125 % szerokości, zamiennik z design systemu.
   Body: SF Pro Display → systemowy SF na Apple, dalej system-ui. */
:root {
  --dark: #11221C; --dark-1: #172A23; --dark-2: #1E342B; --cream: #FDF3E0; --violet: #412BCC; --violet-rgb: 65,43,204;
  --orange: #EA3A00; --lime-d: #D2E900; --lime-v: #E1F017;
  --ink: var(--dark); --paper: var(--cream); --red: var(--orange);
  --blue: var(--violet); --blue-rgb: var(--violet-rgb);
  --lime: var(--violet); --lime-rgb: var(--violet-rgb); --lime-ink: var(--cream);
  --acc-text: var(--cream);
  --fd: "Archivo", "Gamay Expanded", system-ui, sans-serif; --fd-stretch: 125%; --fd-w: 700; --acc-ink: var(--cream); --love: #C7E635; --love-ink: #0E1108;
  --f: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", system-ui, "Segoe UI", sans-serif;
}
html, body { background: var(--dark); color: var(--cream); }
body { font-family: var(--f); }

/* nagłówki krojem display (poza makietami telefonów: tam UI aplikacji) */
:is(h1, h2, .h2, .claim-h, .di-h, .shout, .ov-h, .kjr__stime b, .bn > b, .cap.stamp, .cta, .sticky-cta, .d29-chip, .x29-pill, .x29-lab):not(.h11-phone *, .di-phone *, .ph *, .phone *) {
  font-family: var(--fd); font-stretch: var(--fd-stretch); font-weight: var(--fd-w); letter-spacing: -.01em;
}
.h2 .l2, .di-h .lime { font-weight: 700; }
.cap.stamp { font-weight: 700; letter-spacing: .08em; }

/* jeden fiolet: wyróżnione słowa w nagłówkach = fioletowa pigułka z kremowym tekstem, jak „festival goers” w decku */
.hl29 { display: inline; background: var(--violet); color: var(--acc-ink); padding: 0 .3em .05em; margin-left: -.06em; border-radius: 999px; -webkit-box-decoration-break: clone; box-decoration-break: clone; line-height: 1.32; }
h1 .lime, .di-h .lime, .h2 .l2.lime { color: inherit; }

/* przyciski: ten sam fiolet, kremowy tekst */
.cta, .sticky-cta, .cta.big { background: var(--violet) !important; color: var(--acc-ink) !important; }
.cta:hover, .sticky-cta:hover { background: #4E39D8 !important; }

/* czerwone ręczne podkreślenia (orange z decka) */
.claim-h .ring { color: var(--orange); }
[data-mark] { --mark-color: var(--orange) !important; }
.claim-h .rot .rw { color: var(--cream); }

/* limonka wyłącznie przy sponsorach */
#sponsors { --acc-text: var(--lime-d); }
#sponsors .cap.stamp { color: var(--lime-d); }

/* ===== The Day: przewijanie w bok, mapa mniejsza, sekcja nie jest przypięta ===== */
.rep { margin-top: 0 !important; }
.day .kjr--static { display: flex; gap: 20px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: var(--gut);
  padding: 8px var(--gut) 24px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.day .kjr--static::-webkit-scrollbar { display: none; }
.day .kjr--static .kjr__step { flex: 0 0 min(720px, 84vw); scroll-snap-align: start; align-content: start; gap: 12px; }
.day .kjr__sframe { border-radius: 24px; background: var(--dark-1); }
.day .kjr__sframe .kjr__alert { top: 12px; right: 12px; width: min(300px, calc(100% - 24px)); font-size: 13px; }
.day .kjr__stime b { font-size: clamp(30px, 3vw, 44px); color: var(--cream); }
.day .kjr__stime span { color: var(--cream); opacity: .72; }
.day .kjr--static figcaption h3 { font-size: clamp(19px, 1.8vw, 24px); }
.day .kjr__counters--static { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; padding: 0; margin: 0; list-style: none; }
.day .kjr__counters--static li { border-radius: 14px; padding: 10px 12px; background: var(--dark-1); font-size: 12px; }
.d29-nav { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 0 var(--gut); margin: 28px auto 16px; max-width: calc(var(--maxw, 1280px) + 2 * var(--gut)); }
.d29-chip { appearance: none; border: 2px solid var(--violet); background: transparent; color: var(--cream); border-radius: 999px; padding: 8px 14px; font-size: 14px; cursor: pointer; }
.d29-chip[aria-current="true"] { background: var(--violet); }
.d29-arrows { margin-left: auto; display: flex; gap: 8px; }
.d29-arr { width: 44px; height: 44px; border-radius: 50%; border: 0; background: var(--cream); color: var(--dark); font-size: 20px; cursor: pointer; display: grid; place-items: center; }
.d29-arr:disabled { opacity: .35; cursor: default; }
@media (max-width: 700px) {
  .day .kjr--static .kjr__step { flex-basis: 86vw; }
  .day .kjr__counters--static { grid-template-columns: 1fr 1fr; }
  .d29-chip { padding: 6px 11px; font-size: 13px; }
  .d29-arrows { display: none; }
  .day .kjr__sframe .kjr__alert { display: none; }
}

/* ===== slajdy z decka, które Grzegorz lubi (28.10) ===== */
.x29 { position: relative; overflow: hidden; }
.x29-star { position: absolute; width: 22px; height: 22px; }
.x29-star path { fill: currentColor; }

/* 1 · Your own app vs Social media (slajd 9) */
.x29-vs { background: linear-gradient(90deg, var(--violet) 50%, var(--cream) 50%); padding: clamp(72px, 9vw, 128px) 0; }
.x29-vs .wrap { position: relative; }
.x29-vs-h { display: grid; grid-template-columns: 1fr 1fr; margin-bottom: clamp(36px, 5vw, 64px); }
.x29-vs-h h2 { margin: 0; font-size: clamp(30px, 4.2vw, 64px); line-height: 1; }
.x29-vs-h h2:first-child { color: var(--cream); padding-right: 6%; }
.x29-vs-h h2:last-child { color: var(--dark); text-align: right; padding-left: 6%; }
.x29-rows { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.x29-row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }
.x29-pill { font-weight: 600 !important; font-size: clamp(13px, 1.15vw, 18px); line-height: 1.2; border-radius: 999px; padding: 9px 22px; white-space: nowrap; }
.x29-row .us { justify-self: end; display: flex; align-items: center; gap: 12px; }
.x29-row .us .x29-pill { background: var(--cream); color: var(--dark); margin-right: -28px; padding-right: 44px; }
.x29-row .them { justify-self: start; display: flex; align-items: center; gap: 12px; }
.x29-row .them .x29-pill { background: var(--cream); color: var(--dark); border: 2px solid var(--violet); margin-left: -28px; padding-left: 44px; }
.x29-lab { position: relative; z-index: 2; background: var(--dark); color: var(--cream); border-radius: 999px; padding: 6px 22px; font-size: clamp(18px, 2vw, 32px); line-height: 1.15; }
.x29-em { font-size: clamp(24px, 2.4vw, 36px); line-height: 1; }
@media (max-width: 760px) {
  .x29-vs { background: linear-gradient(90deg, var(--violet) 50%, var(--cream) 50%); }
  .x29-row { grid-template-columns: 1fr 1fr; row-gap: 6px; }
  .x29-lab { grid-column: 1 / -1; justify-self: center; }
  .x29-row .us, .x29-row .them { justify-self: stretch; }
  .x29-row .us { justify-content: flex-end; padding-right: 6px; }
  .x29-row .them { padding-left: 6px; }
  .x29-row .us .x29-pill, .x29-row .them .x29-pill { margin: 0; padding: 7px 12px; white-space: normal; font-size: 12.5px; }
  .x29-em { display: none; }
}

/* 2 · Sounds good? There's more, much more. (slajd 5): przerywnik przed sponsorami */
.x29-sg { background: var(--dark); text-align: center; padding: clamp(110px, 14vw, 200px) var(--gut); }
.x29-sg h2 { margin: 0 auto; font-size: clamp(36px, 5.2vw, 88px); line-height: 1.16; color: var(--cream); max-width: 15ch; }
.x29-sg .w { position: relative; display: inline-block; color: var(--lime-d); }
.x29-sg .w svg { position: absolute; left: -4%; right: -4%; bottom: -.22em; width: 108%; height: .3em; overflow: visible; color: var(--orange); }

/* 3 · We've got you covered, cheers! (slajd 14, „Win-win feature”) */
.x29-cheers { background: var(--violet); padding: clamp(72px, 9vw, 120px) 0 0; }
.x29-cheers .wrap { display: grid; grid-template-columns: 1.1fr .9fr; align-items: end; gap: 24px; }
.x29-cheers h2 { color: var(--lime-v); font-size: clamp(34px, 4.6vw, 72px); line-height: 1.04; margin: 0 0 18px; }
.x29-cheers p { color: var(--cream); max-width: 46ch; font-size: clamp(16px, 1.25vw, 19px); line-height: 1.5; margin: 0 0 clamp(72px, 9vw, 120px); }
.x29-cheers figure { position: relative; margin: 0; align-self: end; justify-self: center; width: min(440px, 90%); aspect-ratio: 1 / 1.25; }
.x29-cheers figure::before { content: ""; position: absolute; width: 92%; aspect-ratio: 1; right: -18%; bottom: -24%; border-radius: 50%; background: var(--lime-v); }
.x29-cheers img { position: relative; width: 100%; height: 100%; object-fit: contain; object-position: bottom; }
.x29-cheers .doodle { position: absolute; left: 12%; top: -4%; width: 34%; color: var(--lime-v); }
@media (max-width: 760px) {
  .x29-cheers .wrap { grid-template-columns: 1fr; }
  .x29-cheers p { margin-bottom: 8px; }
  .x29-cheers figure { width: 78%; }
}

/* 4 · Features that festival organizers love & need? In place. (slajd 4) */
.x29-feat { background: var(--cream); color: var(--violet); padding: clamp(80px, 9vw, 128px) 0; }
.x29-feat h2 { color: var(--violet); font-size: clamp(30px, 4vw, 64px); line-height: 1.05; margin: 0 0 clamp(36px, 4vw, 56px); max-width: 20ch; }
.x29-feat h2 em { font-style: normal; color: var(--orange); }
.x29-lines { display: grid; gap: 14px; }
.x29-line { display: flex; gap: 14px; width: max-content; animation: x29-slide 60s linear infinite; }
.x29-line:nth-child(even) { animation-direction: reverse; animation-duration: 70s; }
.x29-line span { font-family: var(--fd); font-stretch: var(--fd-stretch); font-weight: 600; font-size: clamp(15px, 1.3vw, 21px); border: 2px solid var(--violet); color: var(--violet); border-radius: 999px; padding: 8px 20px; white-space: nowrap; }
.x29-line span:nth-child(3n) { transform: rotate(-1.2deg); } .x29-line span:nth-child(4n) { transform: rotate(1deg); }
@keyframes x29-slide { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.x29-feat .end { display: flex; justify-content: flex-end; margin-top: clamp(28px, 3vw, 44px); }
.x29-feat .end b { position: relative; font-family: var(--fd); font-stretch: var(--fd-stretch); font-weight: 700; font-size: clamp(18px, 2vw, 32px); background: var(--violet); color: var(--cream); border-radius: 999px; padding: 12px 32px; }
html.rm .x29-line, .rm .x29-line { animation: none; }
@media (prefers-reduced-motion: reduce) { .x29-line { animation: none; } }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
/* szerszy krój = mniejszy rozmiar, żeby linie łamały się jak wcześniej */
.h11-copy h1 { font-size: clamp(38px, 5.1vw, 78px); line-height: 1.04; letter-spacing: -.015em; color: var(--cream); }
.hl29 { white-space: nowrap; }
.h2:not(.h11-phone *, .di-phone *) { letter-spacing: -.012em; }
.x29-cheers figure img { position: relative; z-index: 1; }
.x29-cheers .doodle { z-index: 2; left: 2%; top: -6%; }
@media (max-width: 760px) {
  .x29-row .x29-lab { grid-row: 1; grid-column: 1 / -1; }
  .x29-row .us { grid-row: 2; grid-column: 1; }
  .x29-row .them { grid-row: 2; grid-column: 2; }
  .x29-rows { gap: 18px; }
}

/* ===== poprawki po audycie 1:1 z deckiem (28.10) ===== */
:root { --ink-1: var(--dark-1); --ink-2: var(--dark-2); --kcalc-fg: var(--cream); --kcalc-bg: var(--dark-1); --kcalc-bg-2: var(--dark-2); }
.final, .footer, .bot-c, .rep-vp, .kcalc__thumb { background-color: var(--dark) !important; }
.sp-band { background-color: var(--dark-1) !important; }
.kjr, .korb, .kcalc, .rep-fly { color: var(--cream); }
.kjr--static figcaption p, .rep-fly span { color: rgba(253,243,224,.78); }
#generate input, #generate select { background: var(--dark-1) !important; border-color: rgba(253,243,224,.28) !important; color: var(--cream) !important; }
/* jeden fiolet także przy najechaniu */
.cta:hover, .sticky-cta:hover { background: var(--violet) !important; filter: brightness(1.12); }
/* duże teksty i nagłówki krojem display */
.h17-say, .kjr--static figcaption h3, .calc-intro h3, .mate h3, .rc-h, .thanks h3, .kcalc__total, .bn-l { font-family: var(--fd); font-stretch: var(--fd-stretch); font-weight: var(--fd-w); letter-spacing: -.01em; }
.h17-say { font-size: clamp(34px, 4.2vw, 64px) !important; line-height: 1.06 !important; }
/* slajd 9 */
.x29-vs-h { margin-bottom: clamp(48px, 7vw, 120px); }
.x29-vs-h h2:first-child { position: relative; }
.x29-vs .x29-star { color: var(--cream); }
.x29-pill { font-size: clamp(13px, 1.3vw, 19px); }
.x29-lab { font-size: clamp(18px, 2.3vw, 33px); }
@media (max-width: 760px) { .x29-row .us .x29-pill, .x29-row .them .x29-pill { white-space: normal; overflow: visible; text-align: center; } .x29-row .us, .x29-row .them { min-width: 0; } }
/* slajd 5 */
.x29-sg h2 { font-size: clamp(34px, 4.6vw, 66px); }
/* slajd 14: ręka i limonkowe koło schodzą za prawą i dolną krawędź */
.x29-cheers .stamp::before { background: var(--cream); }
.x29-cheers .wrap { grid-template-columns: 1fr 1fr; }
.x29-cheers figure { justify-self: end; margin-right: calc(-1 * var(--gut) - 4vw); width: min(520px, 46vw); aspect-ratio: 772 / 1002; }
.x29-cheers figure::before { width: 86%; right: -20%; bottom: -30%; }
.x29-cheers img { object-position: right bottom; }
.x29-cheers .doodle { left: 10%; top: 2%; width: 26%; }
@media (max-width: 760px) { .x29-cheers figure { width: 82vw; margin-right: calc(-1 * var(--gut)); } }
/* slajd 4 */
.x29-feat h2 { max-width: 26ch; }
.x29-line span { font-size: clamp(15px, 1.45vw, 21px); }
.x29-feat .end b .x29-star { width: 18px; height: 18px; }