/* Hallmark · redesign: full · scope: site and app · brand: SDH Město Touškov · shape: editorial pages and CMS shell
 * palette: fire-service red, graphite, warm paper · surface: absolute · type: system sans · chrome: shared header and footer · signature: authentic SDH vehicle photograph
 * keeps: official identity, verified content, routes, form wiring and permissions · states: focus, hover, active, disabled, error, empty, full
 * contrast: checked for core palette · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H4 E3 S5 R4 V4 · weakest: E, legacy module rules remain; shared overrides and the viewport sweep contain them */
@import url("./tokens.css");
@import url("./base.css");

:root {
  --sdh-content: 1240px;
  --sdh-reading: 752px;
  --section-space: clamp(3rem, 7vw, 6.5rem);
}

.skip-link {
  position: fixed;
  z-index: var(--z-toast);
  top: .75rem;
  left: .75rem;
  transform: translateY(-160%);
  padding:var(--space-3) var(--space-4);
  border-radius: var(--radius-field);
  color: var(--color-accent-ink);
  background: var(--color-ink);
  font-weight: 700;
}

.skip-link:focus { transform: translateY(0); }

.container,
.page-shell,
.header__container,
.footer__container {
  width: min(calc(100% - 3rem), var(--sdh-content));
  max-width: var(--sdh-content);
  margin-inline:auto;
  padding-inline:0;
}

.site-main { min-height: 60vh; }
.site-main > .container,
.site-main > .page-shell { margin-block:clamp(var(--space-8), 5vw, 4.5rem); }
.page-shell { padding-block:clamp(1.75rem, 4vw, 3.5rem); }

.header {
  position: sticky;
  z-index: var(--z-sticky);
  top: 0;
  padding:0;
  border-bottom: 1px solid var(--color-rule);
  border-top: 3px solid var(--color-accent);
  color: var(--color-ink);
  background: var(--color-surface);
  box-shadow: 0 2px 10px var(--color-header-shadow);
}

.header__container {
  display: flex;
  min-height: 76px;
  align-items: center;
  justify-content: space-between;
  gap:var(--space-5);
}

.header .logo {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap:var(--space-3);
  color: var(--color-ink);
  font-size: 1.05rem;
  font-weight: 750;
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
}

.header .logo img { width: 44px; height: 44px; object-fit: contain; }
.header .logo span { color: inherit; }
.nav { margin-left:auto; }
.nav__list { display: flex; align-items: center; gap:.15rem; margin:0; padding:0; list-style: none; }
.nav__item { position: relative; }
.header .nav__link { color: var(--color-ink-2); }
.header .nav__link:hover,
.header .nav__link.active,
.header .nav__item.active > .nav__link { color: var(--color-accent); background: var(--color-accent-soft); }
.nav__link {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding:.65rem .7rem;
  border-radius: var(--radius-field);
  color: var(--color-ink-2);
  font-size: .91rem;
  font-weight: 600;
  line-height: 1.25;
  text-decoration: none;
  white-space: nowrap;
  transition: color var(--dur-short) var(--ease-out), background-color var(--dur-short) var(--ease-out);
}

.nav__link:hover,
.nav__link.active,
.nav__item.active > .nav__link { color: var(--color-accent); background: var(--color-accent-soft); }
.nav__link--button { border: 0; background: transparent; cursor: pointer; text-align: left; }
.dropdown__toggle { padding-right:1.7rem; }
.dropdown__toggle::after {
  position: absolute;
  right: .7rem;
  width: .4rem;
  height: .4rem;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  content: "";
  transform: translateY(-.12rem) rotate(45deg);
}

.dropdown__menu {
  position: absolute;
  z-index: var(--z-dropdown);
  top: calc(100% + .2rem);
  left: 0;
  display: none;
  min-width: 14rem;
  margin:0;
  padding:.4rem;
  border: 1px solid var(--color-rule);
  border-radius: var(--radius-card);
  background: var(--color-surface);
  box-shadow: var(--sdh-shadow);
  list-style: none;
}

.dropdown:hover > .dropdown__menu,
.dropdown:focus-within > .dropdown__menu,
.dropdown.open > .dropdown__menu { display: block; }
.dropdown__menu a,
.dropdown__menu .nav__link--button {
  display: flex;
  width: 100%;
  min-height: 42px;
  align-items: center;
  padding:.6rem var(--space-3);
  border-radius: 4px;
  color: var(--color-ink-2);
  font-size: .92rem;
  text-decoration: none;
}

.dropdown__menu a:hover,
.dropdown__menu a.active,
.dropdown__menu .nav__link--button:hover { color: var(--color-accent); background: var(--color-accent-soft); }
.dropdown-divider { border: 0; border-top: 1px solid var(--color-rule); }
.hamburger { display: none; }

.beta-notice,
._betaNotice { color: var(--color-ink); background: var(--color-warning-soft); }

.hero {
  position: relative;
  display: grid;
  min-height: min(660px, calc(100svh - 76px));
  align-items: center;
  justify-items: start;
  padding-block:clamp(4rem, 9vw, 7rem);
  color: var(--color-surface);
  text-align: left;
  background-color: var(--color-ink);
  background-position: center 46%;
  background-size: cover;
}

.hero::before {
  position: absolute;
  inset: 0;
  background: var(--color-overlay);
  content: "";
}

.hero__overlay { display: none; }
.hero__content { position: relative; z-index: 1; width: min(calc(100% - 3rem), var(--sdh-content)); margin-inline:auto; }
.hero__title { max-width: 13ch; margin:0 0 var(--space-4); color: var(--color-surface); font-size: clamp(2.6rem, 6vw, 5.25rem); font-weight: 750; letter-spacing: -.045em; line-height: 1.02; overflow-wrap: break-word; }
.hero__subtitle { max-width: 46ch; margin:0 0 1.75rem; color: var(--color-on-dark); font-size: clamp(1.05rem, 1.8vw, 1.3rem); line-height: 1.55; }
.page-Home .hero { min-height: min(660px, calc(100svh - 76px)); }
.page-Home .hero__overlay { display: none; background: none; }
.page-Home .hero__content { width: min(calc(100% - 3rem), var(--sdh-content)); padding-block:0; text-align: left; }
.page-Home .hero__title { max-width: 13ch; margin-inline:0; color: var(--color-surface); text-align: left; text-shadow: none; }
.page-Home .hero__subtitle { margin-inline:0; color: var(--color-on-dark); }

.btn,
.admin-btn,
.gate-submit,
.btn-home {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap:var(--space-2);
  padding:.68rem var(--space-4);
  border: 1px solid transparent;
  border-radius: var(--radius-field);
  color: var(--color-accent-ink);
  background: var(--color-accent);
  font: inherit;
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: color var(--dur-short) var(--ease-out), background-color var(--dur-short) var(--ease-out), border-color var(--dur-short) var(--ease-out), transform var(--dur-micro) var(--ease-out);
}

.btn:hover,
.admin-btn-primary:hover,
.gate-submit:hover,
.btn-home:hover { color: var(--color-surface); background: var(--color-accent-hover); }
.btn:active,
.admin-btn:active { transform: translateY(1px); }
.btn:disabled,
.admin-btn:disabled,
button:disabled { cursor: not-allowed; opacity: .58; }
.btn-outline,
.admin-btn-secondary { border-color: var(--color-rule); color: var(--color-ink); background: var(--color-surface); }
.btn-outline:hover,
.admin-btn-secondary:hover { border-color: var(--color-ink-2); color: var(--color-ink); background: var(--color-paper-2); }
.btn-danger,
.admin-btn-danger { border-color: var(--color-error); color: var(--color-surface); background: var(--color-error); }
.btn-danger:hover,
.admin-btn-danger:hover { background: var(--color-danger-hover); }
.read-more { color: var(--color-accent); font-weight: 700; text-underline-offset: .2em; }

h1, h2, h3, h4, h5, h6 { color: var(--color-ink); font-family: var(--font-display); line-height: 1.2; overflow-wrap: break-word; }
h1 { font-size: clamp(2rem, 4vw, 3.1rem); letter-spacing: -.035em; }
h2 { font-size: clamp(1.55rem, 2.6vw, 2.2rem); letter-spacing: -.025em; }
h3 { font-size: clamp(1.2rem, 1.8vw, 1.45rem); }
.page-header { max-width: var(--sdh-reading); margin:0 auto clamp(var(--space-6), 4vw, var(--space-12)); }
.page-title,
.page-header h1 { margin:0 0 .65rem; color: var(--color-ink); }
.page-subtitle { margin:0; color: var(--color-muted); font-size: 1.075rem; line-height: 1.6; }
.page-kicker { margin:0 0 var(--space-2); color: var(--color-muted); font-size: .9rem; font-weight: 600; }
.section-title { margin:0 0 var(--space-6); }
.section-news,
.section-team,
.section-youth,
.section-social,
.section-interest { padding-block:var(--section-space); }
.section-news { background: var(--color-surface); }
.section-news .container,
.section-team .container,
.section-youth .container,
.section-social .container,
.section-interest .container { width: min(calc(100% - 3rem), var(--sdh-content)); }
.section-news .section-title { padding-bottom:.8rem; border-bottom: 1px solid var(--color-rule); }

.news-grid,
.post-grid,
.albums-grid,
.vehicles-grid,
.interest-grid,
.admin-grid,
.dashboard-grid,
.admin-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:var(--gap-columns);
  align-items: stretch;
}
.news-grid > *,
.post-grid > *,
.albums-grid > *,
.vehicles-grid > *,
.interest-grid > *,
.admin-grid > *,
.dashboard-grid > *,
.admin-dashboard-grid > * { grid-column: auto; min-width: 0; }
.interest-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.news-card,
.post-card,
.album-card,
.vehicle-card,
.interest-card,
.contact-card,
.admin-card,
.dashboard-card,
.registrace-form,
.registrace-list,
.soutez-info,
.social-embed-box {
  min-width: 0;
  border: 1px solid var(--color-rule);
  border-radius: var(--radius-card);
  background: var(--color-surface);
  box-shadow: var(--sdh-shadow-sm);
}

.news-card,
.post-card,
.album-card,
.vehicle-card,
.interest-card { overflow: hidden; }
.news-card__img,
.post-card__img,
.post-image,
.vehicle-card img,
.album-image img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; }
.vehicles-grid { grid-template-columns: minmax(0, 1fr); }
.vehicle-card { grid-column: auto; grid-template-columns: minmax(250px, .6fr) minmax(0, 1.4fr); }
.vehicle-image { min-width: 0; min-height: 250px; height: 100%; overflow: hidden; background: var(--color-paper-2); }
.vehicle-image img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; }
.no-image { display: grid; min-height: 250px; place-items: center; background: var(--color-paper-2); color: var(--color-muted); }
.vehicle-content { min-width: 0; padding:clamp(var(--space-4), 2vw, 1.75rem); }
.vehicle-name { margin:0 0 var(--space-2); }
.vehicle-type { color: var(--color-muted); font-weight: 650; }
.vehicle-description { line-height: 1.65; }
.vehicle-specs h4,
.vehicle-equipment h4 { margin:var(--space-5) 0 var(--space-2); font-size: 1rem; }
.specs-list,
.equipment-items { padding-left:var(--space-5); }
.equipment-list { margin:0; padding:0; list-style: none; }
.news-card__content,
.post-card__content,
.album-content,
.vehicle-card__content { padding:1.2rem; }
.news-card__title { margin:0 0 .6rem; font-size: 1.2rem; }
.news-card__title a,
.post-card__content h4 a { color: inherit; text-decoration: none; }
.news-card__title a:hover,
.post-card__content h4 a:hover { color: var(--color-accent); }
.news-card__meta,
.meta,
.news-card .date,
.news-card .author,
.news-card .reading-time { display: flex; flex-wrap: wrap; gap:.35rem .8rem; color: var(--color-muted); font-size: .875rem; }
.news-card__excerpt { margin:var(--space-3) 0 var(--space-4); color: var(--color-ink-2); }
.section-footer { margin-top:1.75rem; text-align: left; }
.post-card { height: 100%; }
.team-grid,
.youth-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:clamp(var(--space-8), 6vw, 5rem); align-items: center; }
.team-intro,
.youth-intro { max-width: 58ch; }
.team-intro p,
.youth-intro p { margin:0 0 var(--space-5); }
.team-latest > h3,
.youth-latest > h3 { margin-bottom:var(--space-3); }
.interest-card { display: block; padding:var(--space-5); color: var(--color-ink); text-decoration: none; transition: border-color var(--dur-short) var(--ease-out), box-shadow var(--dur-short) var(--ease-out), transform var(--dur-short) var(--ease-out); }
.interest-card:hover { transform: translateY(-2px); border-color: var(--color-accent); box-shadow: var(--sdh-shadow); }
.interest-card > i { margin-bottom:.8rem; color: var(--color-accent); font-size: 1.4rem; }
.interest-card h3 { margin:0 0 .4rem; }
.interest-card p { margin:0; color: var(--color-muted); }

.article-layout,
.article-layout--single { width: min(calc(100% - 3rem), var(--sdh-content)); margin:0 auto; }
.article-layout--single { max-width: 920px; }
.article-main { min-width: 0; }
.article-header { max-width: var(--sdh-reading); margin:0 auto var(--space-6); }
.article-header h1 { margin:0 0 .8rem; }
.article-cover { max-width: 1080px; margin:var(--space-6) auto var(--space-8); }
.article-cover img { width: 100%; max-height: 680px; border-radius: var(--radius-card); object-fit: cover; }
.article-content,
.article-body,
.post-content,
.text-content,
.history-content,
.prevention-content { max-width: var(--sdh-reading); margin-inline:auto; font-size: 1.0625rem; line-height: 1.78; }
.article-content p,
.article-body p,
.post-content p,
.text-content p,
.history-content p,
.prevention-content p { margin:0 0 1.15em; }
.article-content h2,
.article-body h2,
.post-content h2,
.text-content h2 { margin:var(--space-8) 0 var(--space-3); }
.article-sidebar { min-width: 0; }
.social-embed-box { position: sticky; top: 96px; padding:var(--space-4); }
.embed-container { min-width: 0; overflow: hidden; }
.embed-container iframe,
.embed-container > * { max-width: 100%; }
.post-navigation,
.back-link-container { display: flex; max-width: var(--sdh-reading); align-items: center; justify-content: flex-start; gap:var(--space-3); margin:var(--space-8) auto 0; }

.incident-list,
.vyjezdy-grid,
.competitions-grid,
.races-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:var(--gap-columns); }
.incident-card,
.vyjezd-card,
.competition-card,
.race-card { min-width: 0; border: 1px solid var(--color-rule); border-radius: var(--radius-card); background: var(--color-surface); overflow: hidden; }
.incident-card__content,
.vyjezd-card__content,
.competition-card__content,
.race-card__content { padding:var(--space-4) 1.2rem; }
.incident-card h2,
.vyjezd-card h2,
.competition-card h2,
.race-card h2 { margin:0 0 var(--space-2); font-size: 1.25rem; }
.incident-card__date,
.vyjezd-date,
.competition-date,
.race-date { color: var(--color-muted); font-weight: 650; }
.vyjezd-detail { width: min(calc(100% - 3rem), 1000px); margin:var(--space-10) auto; overflow: hidden; border: 1px solid var(--color-rule); border-radius: var(--radius-card); background: var(--color-surface); }
.vyjezd-hero { min-height: clamp(280px, 46vw, 560px); background-color: var(--color-ink-2); background-position: center; background-size: cover; }
.vyjezd-content { padding:clamp(1.2rem, 4vw, var(--space-10)); }
.vyjezd-content > h1 { margin:0 0 var(--space-4); }
.vyjezd-popis-full { max-width: var(--sdh-reading); margin-inline:auto; line-height: 1.75; }
.vyjezd-back { max-width: var(--sdh-reading); margin:var(--space-6) auto 0; padding-top:var(--space-4); border-top: 1px solid var(--color-rule); }

.soutez-detail { width: min(calc(100% - 3rem), 1000px); margin:var(--space-8) auto; padding:clamp(var(--space-4), 3vw, var(--space-8)); border: 1px solid var(--color-rule); border-radius: var(--radius-card); background: var(--color-surface); }
.soutez-detail > .page-title { margin-bottom:var(--space-5); }
.soutez-info { padding:var(--space-4) var(--space-5); box-shadow: none; }
.soutez-meta { display: grid; gap:var(--space-1); margin:var(--space-4) 0; padding:0; list-style: none; }
.soutez-meta li { padding:.65rem 0; border-bottom: 1px solid var(--color-rule); }
.competition-section-divider { height: 1px; margin:var(--space-8) 0; border: 0; background: var(--color-rule); }
.competition-section-heading { display: flex; align-items: flex-start; gap:var(--space-3); margin-bottom:var(--space-4); }
.registrace-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap:var(--space-5); align-items: start; }
.registrace-form,
.registrace-list { padding:clamp(var(--space-4), 2vw, var(--space-6)); }
.registrace-form h3,
.registrace-list h3 { margin:0 0 var(--space-4); }
.registrace-form form { max-width: none; }
.registrace-form form table { width: 100%; border-collapse: collapse; }
.registrace-form form th,
.registrace-form form td { padding:.6rem; border-bottom: 1px solid var(--color-rule); text-align: left; vertical-align: middle; }
.registrace-form form input:not([type="checkbox"]):not([type="submit"]),
.registrace-form form select { width: 100%; min-height: 44px; }
.registrace-form form input[type="checkbox"] { width: 20px; height: 20px; accent-color: var(--color-accent); }

.results-table,
.start-list table,
.public-table { width: 100%; border-collapse: collapse; }
.results-table th,
.results-table td,
.start-list th,
.start-list td,
.public-table th,
.public-table td { padding:.7rem .8rem; border-bottom: 1px solid var(--color-rule); text-align: left; }
.results-table thead,
.start-list thead,
.public-table thead { color: var(--color-ink); background: var(--color-paper-2); }
.results-table-wrapper,
.start-list,
.table-scroll { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.history-timeline { max-width: 900px; margin-inline:auto; }
.history-event { margin-bottom:var(--space-3); border: 1px solid var(--color-rule); border-radius: var(--radius-card); background: var(--color-surface); }
.history-event summary { display: grid; grid-template-columns: 100px minmax(0, 1fr) 36px; align-items: center; gap:.8rem; min-height: 68px; padding:.9rem var(--space-4); cursor: pointer; }
.history-event__year { color: var(--color-accent); font-weight: 700; }
.history-event__content { padding:var(--space-4) var(--space-5); border-top: 1px solid var(--color-rule); }
.history-closing { max-width: 900px; margin:var(--space-8) auto; }

.albums-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.album-card { display: flex; flex-direction: column; height: 100%; }
.album-image { aspect-ratio: 16 / 10; overflow: hidden; background: var(--color-paper-2); }
.album-image img { width: 100%; height: 100%; object-fit: cover; }
.album-content { display: flex; flex: 1; flex-direction: column; align-items: flex-start; padding:1.15rem; }
.album-content h3 { margin:0 0 var(--space-2); }
.album-content .album-desc { margin:var(--space-2) 0 var(--space-4); color: var(--color-muted); }
.album-content .btn { margin-top:auto; }
.gallery-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap:var(--space-3); max-width: 1100px; margin-inline:auto; }
.gallery-item { min-width: 0; overflow: hidden; border-radius: var(--radius-field); background: var(--color-paper-2); }
.gallery-item a { display: block; }
.gallery-item img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.album-description { max-width: var(--sdh-reading); margin:var(--space-4) auto; }
.album-date-detail { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap:var(--space-2); }

.contact-grid,
.contacts-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:var(--gap-columns); }
.contact-card { padding:clamp(var(--space-4), 2.5vw, var(--space-6)); }
.contact-card h2,
.contact-card h3 { margin:0 0 var(--space-3); }
.contact-card p { margin:.35rem 0; }
.contact-social-card { padding:1.2rem; }
.contact-card__heading { display: flex; align-items: center; gap:var(--space-3); margin-bottom:var(--space-4); }
.contact-social-list { display: grid; gap:var(--space-2); }
.contact-social-link { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap:var(--space-3); min-height: 56px; padding:.6rem; border: 1px solid var(--color-rule); border-radius: var(--radius-field); text-decoration: none; }
.contact-social-link:hover { border-color: var(--color-accent); }
.contact-social-link strong,
.contact-social-link small { display: block; }
.contact-social-link small { color: var(--color-muted); }

.admin-body { min-height: 100vh; background: var(--color-paper); }
.admin-header .header__container { min-height: 68px; }
.admin-header .logo { font-size: 1rem; }
.admin-container { width: min(calc(100% - 3rem), var(--sdh-content)); margin:0 auto; padding-block:clamp(var(--space-6), 4vw, 3.5rem); }
.admin-main { min-width: 0; }
.admin-main > .container { width: 100%; max-width: none; margin:0; padding:0; }
.admin-main h1 { margin:0 0 var(--space-5); font-size: clamp(1.75rem, 3vw, 2.4rem); }
.admin-main h2 { margin:var(--space-6) 0 var(--space-3); }
.admin-card,
.dashboard-card,
.admin-grid,
.admin-form { padding:clamp(var(--space-4), 2.5vw, var(--space-6)); border: 1px solid var(--color-rule); border-radius: var(--radius-card); background: var(--color-surface); box-shadow: var(--sdh-shadow-sm); }
.admin-card h2,
.admin-card h3,
.dashboard-card h2,
.dashboard-card h3 { margin-top:0; }
.admin-grid,
.dashboard-grid,
.admin-dashboard-grid { margin-block:var(--space-5); }
.admin-table,
.admin-main table { width: 100%; border-collapse: collapse; }
.admin-table { border: 1px solid var(--color-rule); border-radius: var(--radius-field); background: var(--color-surface); }
.admin-table th,
.admin-table td,
.admin-main table th,
.admin-main table td { padding:var(--space-3) .85rem; border-bottom: 1px solid var(--color-rule); text-align: left; vertical-align: middle; }
.admin-table th,
.admin-main table th { color: var(--color-ink); background: var(--color-paper-2); font-size: .9rem; font-weight: 700; }
.admin-table tr:last-child td,
.admin-main table tr:last-child td { border-bottom: 0; }
.admin-main td form { margin:0; }
.admin-form,
.admin-main form:not(.inline-form):not(.search-form):not(.filters-form) { max-width: 900px; }
.admin-form label,
.admin-main form label { display: block; margin:0 0 .35rem; color: var(--color-ink); font-weight: 650; }
.admin-form .form-group,
.admin-main .form-group,
.admin-main form .form-group { margin-bottom:var(--space-4); }
.admin-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
.admin-form select,
.admin-form textarea,
.admin-main form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
.admin-main form select,
.admin-main form textarea,
.sign-in-form input,
.subscribe-form input,
.manage-form input {
  width: 100%;
  min-height: 44px;
  padding:.65rem var(--space-3);
  border: 1px solid var(--color-muted);
  border-radius: var(--radius-field);
  color: var(--color-ink);
  background: var(--color-surface);
}
.admin-form textarea,
.admin-main form textarea { min-height: 10rem; resize: vertical; }
.admin-main input[type="checkbox"],
.admin-main input[type="radio"] { width: 1.1rem; height: 1.1rem; accent-color: var(--color-accent); }
.admin-main .error,
.admin-main .error-message,
.admin-main [role="alert"],
.form-error { color: var(--color-error); }
.admin-back-link { display: inline-flex; margin-top:var(--space-4); color: var(--color-accent); font-weight: 700; }
.table-responsive,
.admin-table-wrap { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.admin-main .pagination,
.pagination { display: flex; flex-wrap: wrap; gap:.4rem; margin-top:var(--space-5); }
.pagination a,
.pagination span { display: inline-flex; min-width: 40px; min-height: 40px; align-items: center; justify-content: center; padding:.4rem .65rem; border: 1px solid var(--color-rule); border-radius: var(--radius-field); text-decoration: none; }
.pagination .active,
.pagination a:hover { border-color: var(--color-accent); color: var(--color-accent); }

.flash-messages,
.flash-message { border-radius: var(--radius-field); }
.flash-message { margin:0 0 var(--space-3); padding:.85rem var(--space-4); border: 1px solid var(--color-rule); background: var(--color-surface); }
.flash-message.success { border-left: 4px solid var(--color-success); }
.flash-message.error { border-left: 4px solid var(--color-error); }
.flash-message.info { border-left: 4px solid var(--color-focus); }
.notification-container { position: fixed; z-index: var(--z-toast); top: 1rem; right: 1rem; display: grid; gap:var(--space-2); width: min(24rem, calc(100% - 2rem)); box-sizing: border-box; }
.notification { padding:.85rem var(--space-4); border: 1px solid var(--color-rule); border-radius: var(--radius-field); color: var(--color-ink); background: var(--color-surface); box-shadow: var(--sdh-shadow); }
.notification-close { min-width: 40px; min-height: 40px; }
.empty-state { max-width: var(--sdh-reading); margin:var(--space-8) auto; padding:var(--space-6); border: 1px solid var(--color-rule); border-radius: var(--radius-card); background: var(--color-surface); }
.empty-state p { color: var(--color-muted); }

.footer { margin-top:var(--section-space); padding:var(--space-12) 0 var(--space-6); border-top: 3px solid var(--color-accent); color: var(--color-footer-text); background: var(--color-ink); }
.footer__container { display: grid; grid-template-columns: 1.2fr 1fr .8fr; gap:clamp(var(--space-6), 4vw, var(--space-12)); }
.footer__col { min-width: 0; }
.footer__col h4 { margin:0 0 var(--space-4); color: var(--color-surface); font-size: 1.05rem; }
.footer__col p { margin:0 0 .6rem; color: var(--color-footer-text); }
.footer__col p i { width: 1.35rem; margin-right:var(--space-1); color: var(--color-accent-soft-strong); }
footer.footer .footer__col h4 { color: var(--color-surface); }
footer.footer .footer__col p,
footer.footer .footer__col p a { color: var(--color-footer-text); }
footer.footer .footer__col p i { color: var(--color-accent-soft-strong); }
.footer__col ul { margin:0; padding:0; list-style: none; }
.footer__col li { margin:0; padding:0; }
.footer__col a { display: inline-flex; min-height: 40px; align-items: center; padding-block:.3rem; color: var(--color-on-dark); text-decoration: underline; text-decoration-color: transparent; text-underline-offset: .18em; }
.footer__col a:hover { color: var(--color-surface); text-decoration-color: currentColor; }
footer.footer .footer__col a { color: var(--color-footer-text); }
footer.footer .footer__col a:hover { color: var(--color-surface); }
.footer .copyright { grid-column: 1 / -1; margin:var(--space-2) 0 0; padding-top:var(--space-4); border-top: 1px solid var(--color-footer-rule); color: var(--color-footer-text); font-size: .875rem; }
footer.footer .copyright { color: var(--color-footer-text); }
.social-icons { display: flex; flex-wrap: wrap; gap:var(--space-2); }
.social-icons a { width: 44px; min-height: 44px; justify-content: center; border: 1px solid var(--color-footer-muted); border-radius: var(--radius-field); text-decoration: none; }
.social-icons a:hover { border-color: var(--color-surface); background: var(--color-neutral-strong); }

.cookie-overlay { position: fixed; z-index: var(--z-modal); inset: 0; background: var(--color-overlay-strong); }
.cookie-banner { position: fixed; z-index: calc(var(--z-modal) + 1); inset: auto 1rem 1rem; display: none; width: min(100% - 2rem, 680px); max-height: min(88svh, 760px); margin-inline:auto; overflow-y: auto; border: 1px solid var(--color-rule); border-top: 4px solid var(--color-accent); border-radius: var(--radius-card); color: var(--color-ink); background: var(--color-surface); box-shadow: var(--sdh-shadow); }
.cookie-banner.show { display: block; }
.cookie-banner__content { padding:clamp(var(--space-4), 3vw, 1.75rem); }
.cookie-banner__header h3 { margin:0 0 var(--space-2); }
.cookie-banner__header p { margin:0 0 var(--space-4); color: var(--color-ink-2); }
.cookie-options { display: grid; gap:var(--space-2); }
.cookie-option { display: flex; align-items: center; justify-content: space-between; gap:var(--space-4); padding:.8rem 0; border-top: 1px solid var(--color-rule); }
.cookie-option__info { display: grid; gap:.15rem; }
.cookie-option__desc { color: var(--color-muted); font-size: .9rem; }
.cookie-banner__buttons { display: flex; flex-wrap: wrap; gap:var(--space-2); margin-top:var(--space-4); }
.cookie-banner__buttons button { min-height: 44px; }
.cookie-banner__footer { margin-top:var(--space-4); color: var(--color-muted); font-size: .875rem; }

.gate-body { display: grid; min-height: 100svh; place-items: center; padding:var(--space-5); color: var(--color-ink); background: var(--color-paper); }
.gate-shell { display: grid; width: 100%; min-height: auto; place-items: center; padding:0; }
.gate-container { width: min(100%, 460px); padding:clamp(var(--space-6), 5vw, var(--space-10)); border: 1px solid var(--color-rule); border-top: 4px solid var(--color-accent); border-radius: var(--radius-card); background: var(--color-surface); box-shadow: var(--sdh-shadow); }
.gate-logo { width: 56px; height: 56px; margin:0 0 var(--space-5); object-fit: contain; }
.gate-eyebrow { margin:0 0 var(--space-2); color: var(--color-muted); font-size: .9rem; font-weight: 650; }
.gate-container h1 { max-width: 18ch; margin:0 0 var(--space-3); font-size: clamp(1.9rem, 7vw, 2.6rem); }
.gate-description { margin:0 0 var(--space-5); color: var(--color-muted); }
.gate-field { margin-bottom:var(--space-4); }
.gate-field label { display: block; margin-bottom:.35rem; font-weight: 650; }
.gate-field input { width: 100%; min-height: 48px; padding:.7rem; border: 1px solid var(--color-muted); border-radius: var(--radius-field); }
.gate-container input.gate-submit { width: 100%; min-height: 46px; }
.gate-error { margin:var(--space-2) 0; color: var(--color-error); }
.gate-footer { margin-top:var(--space-6); color: var(--color-muted); font-size: .875rem; }

.sign-in-form,
.subscribe-form,
.manage-form { width: min(100%, 760px); margin-inline:auto; padding:clamp(var(--space-5), 4vw, var(--space-8)); border: 1px solid var(--color-rule); border-radius: var(--radius-card); background: var(--color-surface); box-shadow: var(--sdh-shadow-sm); }
.sign-in-form label,
.subscribe-form label,
.manage-form label { display: block; margin-bottom:.4rem; font-weight: 650; }
.sign-in-form button,
.subscribe-form button,
.manage-form button { margin-top:var(--space-4); }

.error-page { display: grid; min-height: 100svh; place-items: center; padding:var(--space-6); }
.error-container { width: min(100%, 760px); text-align: center; }
.error-image { width: min(100%, 420px); max-height: 260px; margin:0 auto var(--space-4); object-fit: contain; }
.error-code { margin:0; color: var(--color-accent); font-size: clamp(4rem, 14vw, 8rem); line-height: .95; }
.error-message { margin:var(--space-2) 0; }
.error-description { max-width: 55ch; margin:var(--space-2) auto var(--space-6); color: var(--color-muted); }

.zavody-table,
.registrations-table { width: 100%; border-collapse: collapse; }
.zavody-table th,
.zavody-table td,
.registrations-table th,
.registrations-table td { padding:.65rem var(--space-3); border-bottom: 1px solid var(--color-rule); text-align: left; }
.admin-main .zavody-table,
.admin-main .registrations-table { display: block; overflow-x: auto; }
.file-list,
.download-list { display: grid; gap:var(--space-2); }
.file-list a,
.download-list a { display: flex; min-height: 48px; align-items: center; gap:var(--space-3); padding:.65rem .8rem; border-bottom: 1px solid var(--color-rule); color: var(--color-ink); }

@media (max-width: 1080px) {
  .header .logo { font-size: .98rem; }
  .nav__link { padding-inline:var(--space-2); font-size: .86rem; }
}

@media (max-width: 900px) {
  .header__container { position: relative; min-height: 68px; flex-wrap: wrap; padding-block:.4rem; }
  .hamburger { display: inline-grid; width: 44px; height: 44px; place-content: center; gap:5px; padding:10px; border: 1px solid var(--color-rule); border-radius: var(--radius-field); color: var(--color-ink); background: var(--color-surface); cursor: pointer; }
  .hamburger span { display: block; width: 20px; height: 2px; border-radius: 2px; background: currentColor; }
  .nav { display: none; width: 100%; margin:0; padding:var(--space-2) 0 var(--space-3); }
  .nav.open { display: block; }
  .nav__list { align-items: stretch; flex-direction: column; gap:.1rem; }
  .nav__item { width: 100%; border-top: 1px solid var(--color-rule); }
  .nav__link { width: 100%; min-height: 46px; justify-content: flex-start; padding:.7rem var(--space-2); white-space: normal; }
  .dropdown__toggle { padding-right:2.25rem; }
  .dropdown__toggle::after { right: 1rem; }
  .dropdown__menu { position: static; min-width: 0; margin:0 0 var(--space-2) var(--space-3); padding:.2rem .4rem; border: 0; border-left: 2px solid var(--color-rule); border-radius: 0; box-shadow: none; background: var(--color-paper); }
  .dropdown__menu a,
  .dropdown__menu .nav__link--button { min-height: 44px; color: var(--color-ink-2); white-space: normal; }
  .news-grid,
  .post-grid,
  .albums-grid,
  .vehicles-grid,
  .interest-grid,
  .admin-grid,
  .dashboard-grid,
  .admin-dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vehicle-card { grid-template-columns: minmax(220px, .65fr) minmax(0, 1.35fr); }
  .gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .footer__container { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .article-layout { grid-template-columns: minmax(0, 1fr); }
  .vehicle-card { grid-template-columns: minmax(0, 1fr); }
  .vehicle-image { min-height: 0; aspect-ratio: 16 / 10; }
  .vehicle-image img { aspect-ratio: 16 / 10; }
  .no-image { min-height: 220px; }
  .specs-list > li,
  .equipment-items > li { min-width: 0; overflow-wrap: anywhere; }
  .social-embed-box { position: static; }
}

@media (max-width: 680px) {
  .container,
  .page-shell,
  .header__container,
  .footer__container,
  .section-news .container,
  .section-team .container,
  .section-youth .container,
  .section-social .container,
  .section-interest .container,
  .article-layout,
  .article-layout--single,
  .admin-container,
  .vyjezd-detail,
  .soutez-detail { width: min(calc(100% - 2rem), var(--sdh-content)); }
  .site-main > .container,
  .site-main > .page-shell { margin-block:var(--space-6); }
  .hero { min-height: min(620px, calc(100svh - 68px)); padding-block:3.5rem; background-position: 56% center; }
  .hero__title { font-size: clamp(2.35rem, 11vw, 4rem); }
  .news-grid,
  .post-grid,
  .albums-grid,
  .vehicles-grid,
  .interest-grid,
  .admin-grid,
  .dashboard-grid,
  .admin-dashboard-grid,
  .incident-list,
  .vyjezdy-grid,
  .competitions-grid,
  .races-grid,
  .team-grid,
  .youth-grid,
  .contact-grid,
  .contacts-grid,
  .registrace-grid { grid-template-columns: minmax(0, 1fr); }
  .vehicle-card { grid-template-columns: minmax(0, 1fr); }
  .vehicle-image { min-height: 0; aspect-ratio: 16 / 10; }
  .vehicle-image img { aspect-ratio: 16 / 10; }
  .no-image { min-height: 220px; }
  .gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap:var(--space-2); }
  .footer__container { grid-template-columns: minmax(0, 1fr); gap:var(--space-6); }
  .footer .copyright { grid-column: auto; }
  .cookie-banner { inset-inline: .5rem; bottom: .5rem; width: calc(100% - 1rem); max-height: 92svh; }
  .cookie-option { align-items: flex-start; }
  .cookie-banner__buttons { display: grid; grid-template-columns: minmax(0, 1fr); }
  .cookie-banner__buttons button { width: 100%; }
  .history-event summary { grid-template-columns: 1fr auto; }
  .history-event__year { grid-column: 1 / -1; }
  .admin-main .admin-table,
  .admin-main table { display: block; max-width: 100%; overflow-x: auto; }
  .admin-main form:not(.inline-form):not(.search-form):not(.filters-form) { width: 100%; }
  .admin-form,
  .admin-main form:not(.inline-form):not(.search-form):not(.filters-form) { padding:var(--space-4); }
  .results-table th,
  .results-table td,
  .start-list th,
  .start-list td,
  .public-table th,
  .public-table td { padding:.55rem; }
  .post-navigation { width: 100%; }
  .post-navigation .btn { width: 100%; }
}

/* F08.1 refinement: keep the notice in normal flow and only the navigation sticky. */
  .site-main { padding-top: 0; }
.site-main > .container,
.site-main > .page-shell { margin-block: clamp(var(--space-6), 4vw, var(--space-12)); }
.page-shell { padding-block: 0; }
.page-header { margin-bottom: clamp(var(--space-6), 3vw, var(--space-8)); }
.page-header::after,
.contact-header::after,
.technika-header::after,
.page-title::after,
.contact-title::after,
.technika-title::after,
.section-title::after { display: none !important; }
.page-title,
.page-header h1 { font-size: clamp(2rem, 3.5vw, 2.8rem); line-height: 1.12; letter-spacing: -.03em; }

.header__container { min-height: 68px; }
.admin-header .header__container { min-height: 68px; }
.header .logo img { width: 42px; height: 42px; }
@media (max-width: 900px) {
  .header__container { min-height: 64px; flex-wrap: nowrap; }
  .header .nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    width: 100%;
    max-height: calc(100dvh - 64px);
    margin: 0;
    padding: var(--space-2) var(--space-4) var(--space-4);
    overflow-y: auto;
    overscroll-behavior: contain;
    border-top: 1px solid var(--color-rule);
    background: var(--color-surface);
    box-shadow: 0 12px 18px var(--color-header-shadow);
  }
  .header .nav__list { padding: 0; }
  .header .nav__item { border-top: 0; }
  .header .dropdown__menu { display: none; }
  .header .dropdown.open > .dropdown__menu { display: block; }
}
@media (max-width: 680px) {
  .site-main > .container,
  .site-main > .page-shell { margin-block: var(--space-6); }
  .page-header { margin-bottom: var(--space-6); }
  .page-title,
  .page-header h1 { font-size: clamp(1.85rem, 8vw, 2.35rem); }
  .beta-notice__content { min-height: 0; padding-block: .35rem !important; font-size: .76rem !important; line-height: 1.4; }
}

/* F08.3: shared page flow, compact content spacing, contacts and calendar. */
body.site-body { display: flex; min-height: 100vh; flex-direction: column; }
body.site-body > .site-main { padding-bottom:var(--space-4); }
body.site-body > .site-main,
body.site-body > .admin-main { flex: 1 0 auto; min-height: 0; }
body.site-body > .footer { margin-top: clamp(var(--space-8), 4vw, var(--space-12)); }
body.page-Kontakty > .site-main { padding-bottom: 0; }
.header .dropdown__menu { width: 14.5rem; min-width: 14.5rem; }
.header .dropdown__menu a {
  display: flex;
  width: 100%;
  min-height: 44px;
  align-items: center;
  justify-content: flex-start;
  padding: .65rem var(--space-3);
  text-align: left;
  font-size: .92rem;
  line-height: 1.3;
  box-shadow: none;
}
.header .dropdown__menu a.active { color: var(--color-accent); background: var(--color-accent-soft); }
.header .dropdown__menu a:hover,
.header .dropdown__menu a:focus-visible { color: var(--color-accent); background: var(--color-accent-soft); }
.site-main > .contact-page.container.page-shell {
  width: min(calc(100% - 3rem), 1280px);
  max-width: 1280px;
  margin: clamp(var(--space-6), 4vw, var(--space-10)) auto var(--space-4);
  padding: 0;
}
.contact-page .contact-header { width: 100%; max-width: none; margin: 0 0 var(--space-6); text-align: left; }
.contact-page .contact-title { margin: 0 0 var(--space-2); font-size: clamp(2rem, 3.5vw, 2.8rem); line-height: 1.12; }
.contact-page .contact-subtitle { margin: 0; color: var(--color-muted); font-size: 1.05rem; }
.contact-layout { display: grid; grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr); gap:var(--space-5); align-items: start; }
.contact-primary { display: grid; gap:var(--space-5); min-width: 0; }
.contact-page .contact-card { min-width: 0; padding: clamp(var(--space-4), 2vw, var(--space-6)); border: 1px solid var(--color-rule); border-radius: var(--radius-card); background: var(--color-surface); box-shadow: var(--sdh-shadow-sm); }
.contact-page .contact-card h2 { margin: 0 0 var(--space-4); padding: 0 0 var(--space-3); border-bottom: 1px solid var(--color-rule); font-size: 1.12rem; }
.contact-page .contact-card h2 i { color: var(--color-accent); }
.contact-address address { margin: 0 0 var(--space-3); font-style: normal; line-height: 1.55; white-space: pre-line; }
.contact-address > p { color: var(--color-muted); font-size: .9rem; }
.contact-details { display: grid; gap:var(--space-2); margin-top:var(--space-4); padding-top:var(--space-4); border-top:1px solid var(--color-rule); }
.contact-details a { display: flex; min-height: 44px; align-items: center; gap:var(--space-3); color: var(--color-ink); text-decoration: none; overflow-wrap: anywhere; }
.contact-details a:hover { color: var(--color-accent); }
.contact-details i { width: 1.1rem; color: var(--color-accent); }
.contact-calendar-card { align-self: stretch; }
.contact-calendar { min-height: 0; }
.contact-page .map-card .marketing-placeholder { min-height: 210px; }
.contact-page .map-card .cookie-placeholder { min-height: 210px; padding:var(--space-4); }
.contact-page .contact-social-card { margin-top:var(--space-6); }
.contact-page .contact-social-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.contact-page .contact-social-link { min-width: 0; }
.contact-page .committee-section { margin-top:var(--space-8); }
.contact-page .committee-title { margin: 0 0 var(--space-1); text-align: left; }
.contact-page .committee-subtitle { margin: 0 0 var(--space-5); text-align: left; }
.contact-page .committee-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap:var(--space-4); }
.contact-page .committee-card { min-width: 0; grid-column: auto !important; padding:var(--space-4); border:1px solid var(--color-rule); border-radius:var(--radius-card); background:var(--color-surface); box-shadow:var(--sdh-shadow-sm); }
.contact-page .committee-name { margin:0 0 var(--space-1); overflow-wrap:anywhere; }
.contact-page .committee-role { margin:0 0 var(--space-3); color:var(--color-accent); font-weight:700; }
.contact-page .committee-contact { display:grid; gap:var(--space-2); }
.contact-page .committee-contact a { min-height:40px; align-items:center; overflow-wrap:anywhere; }
.contact-page .fc { --fc-border-color: var(--color-rule); --fc-button-bg-color: var(--color-ink-2); --fc-button-border-color: var(--color-ink-2); --fc-button-hover-bg-color: var(--color-accent); --fc-button-hover-border-color: var(--color-accent); --fc-button-active-bg-color: var(--color-accent); --fc-button-active-border-color: var(--color-accent); --fc-today-bg-color: var(--color-accent-soft); --fc-list-event-hover-bg-color: var(--color-paper-2); font-size:.9rem; }
.contact-page .fc .fc-toolbar { gap:var(--space-3); }
.contact-page .fc .fc-toolbar-title { font-size:1.15rem; font-weight:700; }
.contact-page .fc .fc-button { min-height:40px; padding:.4rem .65rem; font:inherit; }
.contact-page .fc .fc-daygrid-day-number { padding:.45rem; color:var(--color-ink-2); text-decoration:none; }
.contact-page .fc .fc-day-today .fc-daygrid-day-number { color:var(--color-accent); font-weight:800; }
.contact-page .fc .fc-daygrid-event { border:0; border-radius:4px; padding:var(--space-1); color:var(--color-accent-ink); background:var(--color-accent); }
.contact-page .fc .fc-list-day-cushion { background:var(--color-paper-2); }
.contact-page .fc .fc-list-event:hover td { background:var(--color-paper-2); }
.contact-page .map-note { margin:var(--space-3) 0 0; color:var(--color-muted); font-size:.85rem; }
@media (max-width: 960px) {
  .contact-layout { grid-template-columns: minmax(0, 1fr); }
  .contact-page .committee-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  body.site-body > .site-main { padding-bottom:var(--space-2); }
  body.page-Kontakty > .site-main { padding-bottom:0; }
  body.site-body > .footer { margin-top:var(--space-6); }
  .site-main > .contact-page.container.page-shell { width: min(calc(100% - 2rem), 1280px); margin:var(--space-6) auto var(--space-2); }
  .contact-page .contact-header { margin-bottom:var(--space-5); }
  .contact-layout,
  .contact-primary { gap:var(--space-4); }
  .contact-page .contact-social-list,
  .contact-page .committee-grid { grid-template-columns: minmax(0, 1fr); }
  .contact-page .fc .fc-toolbar { flex-wrap: wrap; justify-content: space-between; }
  .contact-page .fc .fc-toolbar-chunk { display:flex; max-width:100%; justify-content:center; }
  .contact-page .fc .fc-toolbar-title { font-size:1.05rem; }
  .contact-page .fc .fc-list-table { font-size:.9rem; }
}

@media (max-width: 380px) {
  .header .logo { gap:var(--space-2); font-size: .88rem; }
  .header .logo img { width: 38px; height: 38px; }
  .hero__title { font-size: 2.15rem; }
  .admin-main .admin-btn,
  .admin-main .btn { max-width: 100%; white-space: normal; }
}

.switch:focus-within { outline: 3px solid var(--color-focus); outline-offset: 3px; border-radius: var(--radius-field); }

@media (max-width: 680px) {
  .shortener-form form { width: 100%; max-width: 100%; }
  .shortener-form table { width: 100%; table-layout: fixed; }
  .shortener-form td { max-width: 100%; overflow-wrap: anywhere; }
  .shortener-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]) { width: 100%; min-width: 0; box-sizing: border-box; }
}
body.site-body > .skip-link { color: var(--color-surface); background: var(--color-ink); }