/* ========================================================================= Rachot — Respect Festival (lineup hero + schedule), "Fanzine" direction. Scoped under .rachot-festival so the rest of the site is untouched. Reuses the Fanzine tokens and the .rl-card / .rl-grid / .rl-filters / .rl-ticker systems from program.css — do NOT redefine .rl-card here. Depends on: rachot-program (cards, filters, grid, ticker) + the Barlow Condensed / Space Mono fonts. This file only adds the festival hero + the schedule. ========================================================================= */ .rachot-festival{ --ink:#14130f; --paper:#e7e3d6; /* festival surfaces wear the sunset-coral accent (Rachot stays indigo); --rachot is remapped so every hero/ticker/accent goes coral at once. */ --rachot:#F2542D; --fest:#F2542D; --fest-deep:#7A1E12; --danger:#c1271c; background:var(--paper); color:var(--ink); font-family:'Space Mono',monospace; position:relative; overflow:hidden; } .rachot-festival *{box-sizing:border-box;border-radius:0} .rachot-festival a{text-decoration:none;color:inherit} .rachot-festival img{display:block;max-width:100%} /* faint SVG grain overlay (matches program.css) */ .rachot-festival::before{ content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.4;mix-blend-mode:multiply; background-image: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='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); } .rachot-festival > *{position:relative;z-index:2} /* ======= festival hero ======= */ .rf-hero{position:relative;overflow:hidden;background:var(--rachot);color:#fff;border-bottom:2.5px solid var(--ink)} .rf-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,#F2542D 0%,#b83c16 58%,#14130f 100%);opacity:.55;mix-blend-mode:luminosity} .rf-hero[style*="--fest-img"]::before{background:var(--fest-img) center/cover;opacity:.35;mix-blend-mode:luminosity} .rf-hero__tag{position:absolute;top:0;left:0;background:#fff;color:var(--ink);font-weight:700;text-transform:uppercase;letter-spacing:.14em;font-size:11px;padding:6px 12px;z-index:3} .rf-hero__inner{position:relative;z-index:2;display:flex;align-items:flex-end;justify-content:space-between;gap:30px;flex-wrap:wrap;padding:62px 30px 30px} .rf-hero__kicker{text-transform:uppercase;letter-spacing:.18em;font-size:12px;opacity:.92;margin:0 0 8px} .rf-hero__title{font-family:var(--rl-font-display);font-weight:var(--rl-font-display-wt);font-size:clamp(52px,12vw,168px);line-height:.78;text-transform:uppercase;margin:0;letter-spacing:-.01em} /* Open Air landing: small "Respect Festival" stacked above a big "OPEN AIR". */ .rf-hero__title--split{display:flex;flex-direction:column;gap:2px} .rf-hero__title-sup{font-size:clamp(18px,3vw,42px);line-height:1;letter-spacing:.02em} .rf-hero__title-main{font-size:clamp(56px,14vw,190px);line-height:.82;letter-spacing:-.01em} .rf-oa-intro{margin:22px 30px 0;max-width:60ch} .rf-hero__date{font-size:clamp(18px,3vw,30px);font-weight:700;margin:14px 0 0;letter-spacing:.03em} .rf-hero__place{font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.14em;opacity:.9;margin:8px 0 0} .rf-hero__aside{display:flex;flex-direction:column;gap:16px;align-items:flex-start} .rf-hero__cta{display:flex;gap:10px;flex-wrap:wrap} .rf-hero .rl-btn-buy{display:inline-block;flex:none;background:#fff;color:var(--ink);border:2px solid var(--ink);padding:12px 22px;font-weight:700;text-transform:uppercase;font-size:13px;letter-spacing:.06em;transition:.12s} .rf-hero .rl-btn-buy:hover{background:var(--ink);color:#fff} .rf-hero .rl-btn-ghost{display:inline-block;border:2px solid #fff;color:#fff;padding:12px 18px;font-weight:700;text-transform:uppercase;font-size:13px;letter-spacing:.04em;transition:.12s} .rf-hero .rl-btn-ghost:hover{background:#fff;color:var(--rachot)} .rf-hero__nav{display:flex;border:2px solid #fff} .rf-hero__nav a{padding:10px 18px;font-weight:700;text-transform:uppercase;font-size:12px;letter-spacing:.06em;border-right:2px solid #fff;color:#fff} .rf-hero__nav a:last-child{border-right:0} .rf-hero__nav a.is-on{background:#fff;color:var(--rachot)} /* illustrative-data note strip */ .rf-note{padding:10px 30px;font-size:11px;letter-spacing:.06em;color:#5a5546;border-bottom:2px dotted var(--ink);text-transform:uppercase} /* ======= schedule day tabs (reuse .rl-seg from program.css) ======= */ .rf-days{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:14px 30px;border-bottom:2px solid var(--ink);position:sticky;top:0;z-index:5;background:var(--paper)} .rf-days .rl-seg button{padding:10px 20px;font-size:13px} .rf-days__meta{margin-left:auto;text-transform:uppercase;letter-spacing:.1em;font-size:12px;color:#5a5546} /* ======= schedule timetable ======= */ .rf-sched{padding:24px 30px 70px} .rf-day{margin-bottom:10px} .rf-day[hidden]{display:none} .rf-day__h{font-family:var(--rl-font-display);font-weight:var(--rl-font-display-wt);font-size:clamp(30px,6vw,56px);text-transform:uppercase;margin:6px 0 18px;line-height:.9} .rf-stage{border:2.5px solid var(--ink);background:var(--paper);margin-bottom:22px;transition:transform .12s,box-shadow .12s} .rf-stage:hover{transform:translate(-3px,-3px);box-shadow:8px 8px 0 var(--rachot)} .rf-stage__h{background:var(--ink);color:var(--paper);font-family:var(--rl-font-display);font-weight:var(--rl-font-display-wt);font-size:22px;text-transform:uppercase;letter-spacing:.02em;padding:9px 14px} .rf-row{display:grid;grid-template-columns:120px 1fr auto;gap:14px;align-items:center;padding:13px 14px;border-bottom:2px dotted var(--ink)} .rf-row:last-child{border-bottom:0} .rf-row__time{font-weight:700;font-size:15px;letter-spacing:.03em} .rf-row__time.tba{color:#5a5546;font-size:12px} .rf-row__name{font-family:var(--rl-font-display);font-weight:var(--rl-font-display-wt);font-size:24px;text-transform:uppercase;line-height:.95;letter-spacing:.005em} .rf-row__name a:hover{color:var(--rachot)} .rf-row__sub{display:block;font-family:'Space Mono',monospace;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--rachot);margin-top:4px} .rf-row__badge{justify-self:end;background:var(--danger);color:#fff;font-weight:700;font-size:10px;text-transform:uppercase;letter-spacing:.06em;padding:4px 9px;transform:rotate(-2deg)} .rf-row__badge.tba{background:var(--ink)} @media(max-width:640px){ .rf-hero__inner{padding:54px 18px 22px} .rf-days{top:0} .rf-row{grid-template-columns:84px 1fr} .rf-row__badge{grid-column:2;justify-self:start;margin-top:4px} } /* ======= view toggle (Lineup / Časový plán), shared by lineup + schedule ======= */ .rf-views{position:static;width:auto;height:auto;overflow:visible;display:flex;flex-wrap:wrap;gap:0;padding:18px 30px 0} .rf-views__item{font-family:var(--rl-font-display);font-weight:var(--rl-font-display-wt);text-transform:uppercase;letter-spacing:.03em;font-size:16px;line-height:1;padding:11px 18px;border:3px solid var(--ink);border-right-width:0;background:var(--paper);color:var(--ink)} .rf-views__item:last-child{border-right-width:3px} .rf-views__item.is-on{background:var(--ink);color:var(--paper)} .rf-views__item:hover{color:var(--rachot)} .rf-views__item.is-on:hover{color:var(--paper)} /* Connect the tabs to the filter/content bar below (was an 18px gap that left them floating). Drop the tabs' own bottom border and the bar's top margin so the tabs sit ON the bar's top border — the active (dark) tab merges into it. */ .rf-views__item{border-bottom-width:0} .rf-views + .rl-filters{margin-top:0} @media(max-width:760px){ .rf-views{padding-left:14px;padding-right:14px} } /* Festival hero countdown (target = festival_banner_datum_iso, existing option). */ .rf-countdown{display:flex;gap:18px;margin:20px 0 6px;flex-wrap:wrap} .rf-countdown[data-done]{display:none} .rf-cd{display:flex;flex-direction:column;align-items:center;min-width:50px} .rf-cd__n{font-family:var(--rl-font-display);font-weight:var(--rl-font-display-wt);font-size:clamp(26px,5vw,44px);line-height:1;color:#fff;font-variant-numeric:tabular-nums} .rf-cd__l{font:700 10px/1 'Space Mono',monospace;text-transform:uppercase;letter-spacing:.14em;color:rgba(255,255,255,.75);margin-top:6px} /* Open Air: festival poster under the intro text */ .rf-oa-poster{margin:22px 30px 10px;max-width:900px} .rf-oa-poster img{width:100%;height:auto;display:block;border:2.5px solid var(--ink)} /* ===== Open Air: Lineup / Časový plán as real in-page tabs ===== */ /* Tab strip sits on a full-width bottom rule; the active (dark) tab merges into it so the "current view" is unambiguous. Client: "just switching tabs, no reload". */ /* width:auto + position:static: the legacy theme styles every