/* Liepāja Throwdown 2026 -- design tokens + component styles.
   Values are taken verbatim from README.md / design/Liepaja Throwdown.dc.html. */

:root {
  --ink: #0f1015;
  --surface: #15161d;
  --row-alt: #12131a;
  --band: #1b1c25;
  --gold: #d6ad63;
  --gold-hover: #e7cd9c;
  --gold-deep: #b08c47;
  --text: #e9e9ed;
  --text-secondary: #c9c9d1;
  --text-muted: #8b8b98;
  --text-faint: #6f7080;
  --border: rgba(233, 233, 237, .09);
  --border-control: rgba(233, 233, 237, .16);
  --border-control-strong: rgba(233, 233, 237, .18);
  --live-dot: #e5484d;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  background: var(--ink);
  color: var(--text);
  font-family: Inter, system-ui, sans-serif;
}

img { max-width: 100%; display: block; }

a { color: var(--gold); text-decoration: none; }
a:hover { color: var(--gold-hover); }
::selection { background: rgba(214, 173, 99, .3); }

h1, h2, h3, .cond {
  font-family: "Barlow Condensed", "Inter", sans-serif;
  font-weight: 700;
  letter-spacing: .01em;
  margin: 0;
}

button { font-family: inherit; }

:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

@keyframes ltd-marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

.ltd-scroll { overflow-x: auto; }

/* ---------- Header ---------- */
.ltd-nav {
  position: sticky;
  top: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 14px 32px;
  background: rgba(15, 16, 21, .88);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
}
.ltd-logo { height: 30px; width: auto; cursor: pointer; }
/* Desktop: .ltd-nav-menu generates no box of its own, so its children
   (.ltd-nav-links, .ltd-lang) sit directly in the .ltd-nav flex row, exactly
   as if they hadn't been wrapped. Only the ≤640px media query below turns
   it into an actual dropdown box. */
.ltd-nav-menu { display: contents; }
.ltd-nav-links { display: flex; gap: 4px; margin-left: auto; flex-wrap: wrap; }
.ltd-nav-link {
  background: none; border: none; color: var(--text-muted);
  font: 600 13px Inter, sans-serif; letter-spacing: .08em; text-transform: uppercase;
  padding: 10px 12px; cursor: pointer;
}
.ltd-nav-link:hover { color: #fff; }
.ltd-nav-link.is-active { color: #fff; }
.ltd-live-dot {
  display: inline-flex; align-items: center; gap: 7px;
}
.ltd-live-dot::before {
  content: ""; width: 7px; height: 7px; border-radius: 50%;
  background: var(--live-dot); box-shadow: 0 0 8px var(--live-dot);
}
.ltd-nav-right { display: flex; align-items: center; gap: 14px; }
.ltd-burger {
  display: none; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  width: 34px; height: 34px; padding: 0; background: none; cursor: pointer;
  border: 1px solid var(--border-control-strong); border-radius: 6px; flex: none;
}
.ltd-burger span { display: block; width: 16px; height: 2px; background: var(--text); transition: transform .18s ease, opacity .18s ease; }
.ltd-burger.is-open span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.ltd-burger.is-open span:nth-child(2) { opacity: 0; }
.ltd-burger.is-open span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.ltd-lang {
  display: flex; border: 1px solid var(--border-control); border-radius: 6px; overflow: hidden;
}
.ltd-lang a {
  display: inline-block; background: transparent; color: var(--text-secondary); border: none;
  padding: 7px 10px; font: 600 12px Inter, sans-serif; text-decoration: none; cursor: pointer;
}
.ltd-lang a:hover { color: var(--text-secondary); }
.ltd-lang a.is-active { background: var(--gold); color: var(--surface); }
.ltd-lang a.is-active:hover { color: var(--surface); }

.ltd-btn-outline-gold {
  background: transparent; border: 1px solid var(--gold); color: var(--gold);
  border-radius: 6px; padding: 9px 18px; font: 600 13px Inter, sans-serif;
  letter-spacing: .06em; text-transform: uppercase; cursor: pointer; display: inline-block;
}
.ltd-btn-outline-gold:hover { background: rgba(214, 173, 99, .14); color: var(--gold); }

.ltd-btn-gold {
  background: var(--gold); border: 1px solid var(--gold); color: var(--surface);
  border-radius: 6px; padding: 14px 26px; font: 700 14px Inter, sans-serif;
  letter-spacing: .08em; text-transform: uppercase; cursor: pointer;
}
.ltd-btn-gold:hover { background: var(--gold-hover); }
.ltd-btn-gold:disabled { opacity: .6; cursor: default; }

.ltd-btn-ghost {
  background: none; border: 1px solid var(--border-control-strong); color: var(--text);
  border-radius: 6px; padding: 7px 12px; font: 600 11px Inter, sans-serif;
  letter-spacing: .06em; text-transform: uppercase; cursor: pointer;
}
.ltd-btn-ghost:hover { border-color: var(--gold); color: var(--gold); }

/* ---------- Hero ---------- */
.ltd-hero {
  display: grid; grid-template-columns: 1.15fr .85fr; min-height: 640px;
  border-bottom: 1px solid var(--border);
}
.ltd-hero-media { position: relative; overflow: hidden; background: #000; }
.ltd-hero-media img {
  width: 100%; height: 100%; object-fit: cover; opacity: .62;
  filter: grayscale(.35) contrast(1.05);
}
.ltd-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(15, 16, 21, .86) 0%, rgba(15, 16, 21, .35) 55%, rgba(15, 16, 21, .75) 100%);
}
.ltd-hero-content {
  position: absolute; inset: 0; display: flex; flex-direction: column;
  justify-content: flex-end; gap: 22px; padding: 56px 48px;
}
.ltd-chip-row { display: flex; gap: 10px; flex-wrap: wrap; }
.ltd-chip {
  border: 1px solid var(--gold); color: var(--gold); border-radius: 999px;
  padding: 5px 13px; font: 600 11px Inter, sans-serif; letter-spacing: .12em; text-transform: uppercase;
}
.ltd-chip.is-muted { border-color: rgba(233, 233, 237, .2); color: var(--text-secondary); }
.ltd-h1 {
  font-size: clamp(56px, 7vw, 104px); line-height: .9; text-transform: uppercase; color: #fff;
}
.ltd-h1 span { color: var(--gold); }
.ltd-lead { margin: 0; max-width: 520px; font-size: 17px; line-height: 1.55; color: #b9b9c4; }
.ltd-countdown { display: flex; gap: 34px; flex-wrap: wrap; padding-top: 6px; }
.ltd-countdown-num { font-size: 46px; line-height: 1; color: #fff; }
.ltd-countdown-num.is-gold { color: var(--gold); }
.ltd-countdown-label {
  font: 600 11px Inter, sans-serif; letter-spacing: .14em; text-transform: uppercase;
  color: var(--text-muted); padding-top: 6px;
}

.ltd-hero-side {
  background: var(--surface); padding: 56px 48px; display: flex; flex-direction: column; gap: 22px; justify-content: center;
}
.ltd-info-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 0; border-top: 1px solid var(--border); }
.ltd-info-row:first-child { border-top: none; }
.ltd-info-label { font: 600 11px Inter, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--text-muted); }
.ltd-info-value { font-size: 15px; color: var(--text); text-align: right; }

/* ---------- Marquee ---------- */
.ltd-marquee-section { display: flex; overflow: hidden; background: var(--band); border-bottom: 1px solid var(--border); }
.ltd-marquee-track { display: flex; gap: 56px; padding: 16px 0; white-space: nowrap; animation: ltd-marquee 34s linear infinite; }
.ltd-marquee-item { font-size: 22px; letter-spacing: .14em; text-transform: uppercase; }
.ltd-marquee-item.is-gold { color: var(--gold); }
.ltd-marquee-item.is-dim { color: #41424f; }

/* ---------- Stat band ---------- */
.ltd-stats {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
  background: var(--border); border-bottom: 1px solid var(--border);
}
.ltd-stat { background: var(--ink); padding: 34px 32px; }
.ltd-stat-num { font-size: 44px; line-height: 1; color: #fff; }
.ltd-stat-label { font: 600 11px Inter, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--text-muted); padding-top: 8px; }

/* ---------- Section shell ---------- */
.ltd-section { padding: 80px 48px; border-bottom: 1px solid var(--border); }
.ltd-section-head { display: flex; align-items: baseline; gap: 18px; flex-wrap: wrap; padding-bottom: 34px; }
.ltd-h2 { font-size: 44px; text-transform: uppercase; color: #fff; }
.ltd-section-note { font-size: 14px; color: var(--text-muted); }

/* ---------- Classes grid ---------- */
.ltd-classes-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
.ltd-class-card {
  border: 1px solid var(--border-control); border-radius: 8px; padding: 22px;
  background: var(--surface); display: flex; flex-direction: column; gap: 8px;
}
.ltd-class-card:hover { border-color: var(--gold); }
.ltd-class-kind { font: 600 10px Inter, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.ltd-class-name { font-size: 26px; text-transform: uppercase; color: #fff; }
.ltd-class-note { font-size: 13px; line-height: 1.5; color: var(--text-muted); }
.ltd-class-foot { display: flex; align-items: center; justify-content: space-between; padding-top: 10px; margin-top: auto; }
.ltd-class-spots { font-size: 13px; color: var(--text-secondary); }

/* ---------- Competition day ---------- */
.ltd-2 { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--border); }
.ltd-day-col { padding: 80px 48px; display: flex; flex-direction: column; gap: 28px; }
.ltd-day-media { position: relative; overflow: hidden; background: #000; min-height: 320px; }
.ltd-day-media img { width: 100%; height: 100%; object-fit: cover; }
.ltd-schedule-row { display: grid; grid-template-columns: 96px 1fr; gap: 20px; padding: 18px 0; border-top: 1px solid var(--border); }
.ltd-schedule-time { font-size: 22px; color: var(--gold); }
.ltd-schedule-title { font: 600 15px Inter, sans-serif; color: var(--text); }
.ltd-schedule-note { font-size: 13px; color: var(--text-muted); padding-top: 3px; }

/* ---------- Pricing ---------- */
.ltd-pricing-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; max-width: 900px; }
.ltd-price-card {
  border: 1px solid var(--gold); border-radius: 8px; padding: 30px; background: rgba(214, 173, 99, .06);
  display: flex; flex-direction: column; gap: 10px;
}
.ltd-price-kind { font: 600 10px Inter, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.ltd-price-num { font-size: 56px; line-height: 1; color: #fff; }
.ltd-price-note { font-size: 14px; color: #9a9aa6; }
.ltd-price-foot { margin: 20px 0 0; font-size: 13px; color: var(--text-muted); }

/* ---------- Photo strip ---------- */
.ltd-photostrip {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px;
  background: var(--border); border-bottom: 1px solid var(--border);
}
.ltd-photostrip figure { margin: 0; background: #000; }
.ltd-photostrip img { width: 100%; height: 300px; object-fit: cover; opacity: .7; }

/* ---------- FAQ ---------- */
.ltd-faq-list { max-width: 820px; }
.ltd-faq-item { border-top: 1px solid var(--border); }
.ltd-faq-q {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 20px;
  background: none; border: none; padding: 20px 0; text-align: left; color: var(--text);
  font: 600 16px Inter, sans-serif; cursor: pointer;
}
.ltd-faq-q:hover { color: var(--gold); }
.ltd-faq-sign { font-size: 24px; color: var(--gold); font-family: "Barlow Condensed", sans-serif; font-weight: 700; }
.ltd-faq-a { padding: 0 0 22px; font-size: 15px; line-height: 1.6; color: #9a9aa6; max-width: 640px; }

/* ---------- Sponsors ---------- */
.ltd-sponsors-label { font: 600 11px Inter, sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--text-muted); padding-bottom: 26px; }
.ltd-sponsors-row { display: flex; flex-wrap: wrap; gap: 14px; }
.ltd-sponsor {
  font-family: "Barlow Condensed", sans-serif; font-weight: 700; border: 1px solid var(--border-control);
  border-radius: 8px; padding: 20px 28px; font-size: 20px; letter-spacing: .08em; text-transform: uppercase;
  color: #7f8090; background: var(--surface);
}
.ltd-sponsor:hover { color: var(--gold); border-color: rgba(214, 173, 99, .5); }

/* ---------- Footer ---------- */
.ltd-foot {
  display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 40px; padding: 60px 48px;
  border-top: 1px solid var(--border); background: var(--surface);
}
.ltd-foot-col { display: flex; flex-direction: column; gap: 14px; }
.ltd-foot-col.is-tight { gap: 10px; }
.ltd-foot-logo { height: 34px; width: auto; align-self: flex-start; }
.ltd-foot-address { font-size: 14px; line-height: 1.6; color: var(--text-muted); }
.ltd-foot-org { font-size: 14px; color: var(--text-muted); }
.ltd-foot-label { font: 600 11px Inter, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--text-faint); }
.ltd-foot-col a { font-size: 15px; }
.ltd-foot-date { font-size: 30px; color: #fff; text-transform: uppercase; }

/* ---------- Inner pages: rules / athletes / live shell ---------- */
.ltd-page { padding: 72px 48px; display: flex; flex-direction: column; gap: 28px; }
.ltd-page-title { font-size: 60px; line-height: .95; text-transform: uppercase; color: #fff; margin: 0; }

.ltd-side { display: grid; grid-template-columns: minmax(0, 720px) 1fr; gap: 64px; padding: 72px 48px; }
.ltd-rules-col { display: flex; flex-direction: column; gap: 36px; }
.ltd-rule { border-top: 1px solid var(--border); padding-top: 22px; }
.ltd-rule-h { font: 600 11px Inter, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); padding-bottom: 10px; }
.ltd-rule-b { font-size: 16px; line-height: 1.65; color: #c2c2cc; white-space: pre-line; }
.ltd-side-sticky { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 110px; align-self: start; }
.ltd-side-sticky img { width: 100%; height: 280px; object-fit: cover; border-radius: 8px; opacity: .8; }
.ltd-cup-card { border: 1px solid var(--border-control); border-radius: 8px; padding: 24px; background: var(--surface); display: flex; flex-direction: column; gap: 12px; }
.ltd-cup-title { font-size: 24px; text-transform: uppercase; color: #fff; }
.ltd-cup-body { font-size: 14px; line-height: 1.6; color: #9a9aa6; white-space: pre-line; }

/* ---------- Athletes ---------- */
.ltd-toolbar { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.ltd-input {
  background: var(--surface); border: 1px solid var(--border-control); border-radius: 6px;
  padding: 11px 14px; color: var(--text); font: 400 14px Inter, sans-serif; min-width: 240px;
}
.ltd-input:focus { border-color: var(--gold); outline: none; }
.ltd-chip-filter {
  background: transparent; border: 1px solid var(--border-control-strong); color: #a5a5b2;
  border-radius: 999px; padding: 8px 14px; font: 600 12px Inter, sans-serif; cursor: pointer;
}
.ltd-chip-filter.is-active { background: rgba(214, 173, 99, .16); border-color: var(--gold); color: var(--gold); }

.ltd-athlete-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1px;
  background: var(--border); border: 1px solid var(--border); border-radius: 8px; overflow: hidden;
}
.ltd-athlete-card { background: var(--surface); padding: 18px 20px; display: flex; align-items: center; gap: 14px; }
.ltd-athlete-num {
  width: 36px; height: 36px; flex: none; border-radius: 50%; border: 1px solid rgba(214, 173, 99, .5);
  color: var(--gold); display: flex; align-items: center; justify-content: center; font-size: 15px;
}
.ltd-athlete-name { font: 600 15px Inter, sans-serif; color: var(--text); }
.ltd-athlete-meta { font-size: 12px; color: var(--text-muted); padding-top: 2px; }
.ltd-foot-note { margin: 0; font-size: 13px; color: var(--text-faint); }

/* ---------- Live results ---------- */
.ltd-live-note { display: inline-flex; align-items: center; gap: 8px; font: 600 12px Inter, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: var(--live-dot); }
.ltd-live-note::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--live-dot); box-shadow: 0 0 10px var(--live-dot); }
.ltd-table-wrap { border: 1px solid var(--border); border-radius: 8px; }
.ltd-table {
  display: grid; grid-template-columns: 64px 1fr 1fr repeat(3, 90px) 100px;
}
.ltd-table-head {
  padding: 14px 20px; background: var(--band); font: 600 11px Inter, sans-serif;
  letter-spacing: .12em; text-transform: uppercase; color: var(--text-muted);
}
.ltd-table-row { align-items: center; padding: 15px 20px; border-top: 1px solid rgba(233, 233, 237, .07); font: 400 14px Inter, sans-serif; color: var(--text-secondary); }
.ltd-table-row:nth-child(odd) { background: var(--surface); }
.ltd-table-row:nth-child(even) { background: var(--row-alt); }
.ltd-rank { font-size: 20px; font-family: "Barlow Condensed", sans-serif; font-weight: 700; color: var(--text-muted); }
.ltd-rank.is-leader { color: var(--gold); }
.ltd-table-name { font-weight: 600; color: var(--text); }
.ltd-table-class { color: var(--text-muted); }
.ltd-pts { text-align: right; font-size: 20px; font-family: "Barlow Condensed", sans-serif; font-weight: 700; color: var(--gold); }

/* ---------- Registration modal ---------- */
.ltd-modal-backdrop {
  position: fixed; inset: 0; z-index: 100; background: rgba(9, 10, 14, .78); backdrop-filter: blur(6px);
  display: flex; align-items: flex-start; justify-content: center; padding: 48px 20px; overflow-y: auto;
}
.ltd-modal {
  width: 100%; max-width: 560px; background: var(--surface); border: 1px solid rgba(233, 233, 237, .14);
  border-radius: 10px; box-shadow: 0 24px 60px rgba(0, 0, 0, .6); padding: 34px 34px 30px;
  display: flex; flex-direction: column; gap: 18px;
}
.ltd-modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.ltd-modal-title { font-size: 30px; text-transform: uppercase; color: #fff; }
.ltd-modal-eyebrow { font: 600 11px Inter, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: var(--gold); }
.ltd-modal-close {
  background: none; border: 1px solid var(--border-control-strong); color: #a5a5b2; border-radius: 6px;
  width: 34px; height: 34px; font: 400 18px Inter, sans-serif; line-height: 1; cursor: pointer;
}
.ltd-modal-close:hover { border-color: var(--gold); color: var(--gold); }
.ltd-modal-lead { margin: 0; font-size: 14px; line-height: 1.5; color: #9a9aa6; }

/* #ltd-modal-backdrop / #ltd-modal-thanks / #ltd-modal-form / #ltd-pair-fields
   all set an explicit display (flex/grid) above and below, which otherwise
   beats the browser's default `[hidden]{display:none}` rule (same
   specificity, author styles win) -- so JS toggling .hidden had no visual
   effect. These ID+[hidden] overrides are more specific and force it closed. */
#ltd-modal-backdrop[hidden],
#ltd-modal-thanks[hidden],
#ltd-modal-form[hidden],
#ltd-pair-fields[hidden] {
  display: none;
}

.ltd-form { display: flex; flex-direction: column; gap: 14px; }
.ltd-field { display: flex; flex-direction: column; gap: 6px; }
.ltd-field label { font: 600 11px Inter, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--text-muted); }
.ltd-field input, .ltd-field textarea {
  background: var(--ink); border: 1px solid var(--border-control); border-radius: 6px; padding: 12px 13px;
  color: var(--text); font: 400 15px Inter, sans-serif;
}
.ltd-field input:focus, .ltd-field textarea:focus { border-color: var(--gold); outline: none; }
.ltd-field-error { font-size: 12px; color: #e5787d; }
.ltd-honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.ltd-chip-group { display: flex; flex-wrap: wrap; gap: 8px; }
.ltd-pair-row { border-top: 1px solid var(--border); padding-top: 14px; }

.ltd-consent { display: flex; align-items: flex-start; gap: 10px; }
.ltd-consent input { margin-top: 3px; }
.ltd-consent label { font-size: 13px; line-height: 1.5; color: var(--text-secondary); text-transform: none; letter-spacing: normal; }

.ltd-form-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid var(--border); padding-top: 16px; }
.ltd-form-price { font-size: 30px; color: #fff; line-height: 1; font-family: "Barlow Condensed", sans-serif; font-weight: 700; }
.ltd-form-price-note { font: 400 12px Inter, sans-serif; color: var(--text-muted); padding-top: 4px; }

.ltd-thanks { display: flex; flex-direction: column; gap: 10px; border: 1px solid var(--gold); border-radius: 8px; padding: 24px; background: rgba(214, 173, 99, .08); }
.ltd-thanks-title { font-size: 24px; color: var(--gold); text-transform: uppercase; }
.ltd-thanks-body { font-size: 14px; line-height: 1.55; color: #c9c9d1; }
.ltd-thanks.is-waitlist { border-color: var(--text-muted); background: rgba(233, 233, 237, .05); }
.ltd-thanks.is-waitlist .ltd-thanks-title { color: var(--text); }

.ltd-alert { border: 1px solid rgba(229, 72, 77, .5); background: rgba(229, 72, 77, .08); color: #f2b4b7; border-radius: 6px; padding: 12px 14px; font-size: 13px; }

/* ---------- Grid helper used by ltd-2col contexts ---------- */
.ltd-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ltd-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; }
.ltd-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; }

/* ---------- Responsive ---------- */
@media (max-width: 1000px) {
  .ltd-hero, .ltd-2, .ltd-side, .ltd-foot { grid-template-columns: 1fr !important; }
  .ltd-hero { min-height: 0 !important; }
  .ltd-hero-media { min-height: 480px !important; }
  /* .ltd-hero-content was `position:absolute;inset:0`, pinned to exactly
     .ltd-hero-media's height (480px here). On phones the stacked chips +
     heading + lead + countdown can be taller than that -- with
     .ltd-hero-media's `overflow:hidden`, the overflow (the chips, since
     content is packed to the bottom) was silently clipped off at the top
     edge, which read as "the chip disappeared under the nav". Switching
     to `position:relative` keeps it in normal flow, so the box grows to
     fit its content instead of clipping it; the image/overlay go
     `absolute` to sit behind it as a background layer instead. */
  .ltd-hero-media img { position: absolute; inset: 0; }
  .ltd-hero-content { position: relative; z-index: 1; }
  .ltd-day-media { min-height: 320px !important; }
  .ltd-4 { grid-template-columns: 1fr 1fr !important; }
  .ltd-pad, .ltd-section, .ltd-page, .ltd-side, .ltd-hero-content, .ltd-hero-side, .ltd-day-col, .ltd-foot {
    padding-left: 28px !important; padding-right: 28px !important;
  }
  .ltd-side-sticky img { height: 200px !important; }
  .ltd-side-sticky { position: static !important; }
  .ltd-table { min-width: 720px; }
}

@media (max-width: 640px) {
  .ltd-3, .ltd-2col, .ltd-pricing-grid { grid-template-columns: 1fr !important; }
  .ltd-pad, .ltd-section, .ltd-page, .ltd-side, .ltd-hero-content, .ltd-hero-side, .ltd-day-col, .ltd-foot {
    padding-left: 18px !important; padding-right: 18px !important; padding-top: 44px !important; padding-bottom: 44px !important;
  }
  /* Mobile header: register (left) / logo (center) / hamburger (right).
     The two side columns are equal `1fr` tracks (not `auto`) so they're
     always the same width as each other, whatever their content's actual
     size -- that's what keeps the logo (the `auto` middle column)
     genuinely centered in the row even though "Reģistrēties"/"Register"
     is much wider than the 34px hamburger icon. With `auto 1fr auto`
     instead, the wider register button would push the logo off-center. */
  .ltd-nav {
    display: grid !important; grid-template-columns: 1fr auto 1fr; align-items: center;
    padding: 12px 16px !important; gap: 8px 12px !important;
  }
  .ltd-nav-right { display: contents; } /* unwraps: register + burger become direct grid items */
  /* Every item gets BOTH row and column explicitly (not just column) so
     none of this depends on the auto-placement algorithm's row-search
     order -- that's what caused the earlier bugs in this file, so this
     time nothing is left for the browser to infer. */
  .ltd-nav .ltd-btn-outline-gold { grid-row: 1; grid-column: 1; justify-self: start; }
  .ltd-logo-link { grid-row: 1; grid-column: 2; justify-self: center; }
  .ltd-burger { display: flex; grid-row: 1; grid-column: 3; justify-self: end; }

  /* Hamburger + dropdown instead of the wrapping nav row. The menu is a
     normal in-flow block (not position:absolute) so opening it can only
     ever push the hero section down -- it can never float over or clip
     anything else on the page. */
  .ltd-nav-menu { display: none; }
  .ltd-nav-menu.is-open {
    display: flex; flex-direction: column; align-items: stretch; gap: 4px;
    grid-row: 2; grid-column: 1 / -1; padding-top: 8px;
    border-top: 1px solid var(--border);
  }
  .ltd-nav-menu.is-open .ltd-nav-links { flex-direction: column; gap: 0; margin-left: 0; width: 100%; }
  .ltd-nav-menu.is-open .ltd-nav-link { width: 100%; padding: 12px 4px; border-top: 1px solid var(--border); }
  .ltd-nav-menu.is-open .ltd-nav-links .ltd-nav-link:first-child { border-top: none; }
  .ltd-nav-menu.is-open .ltd-lang { align-self: flex-start; margin-top: 8px; }

  .ltd-h1 { font-size: 44px !important; }
  .ltd-page-title { font-size: 40px !important; }
  .ltd-photostrip img { height: 220px !important; }
}