/* O strojoch a ľuďoch: a structural letter, not a product page.
   Composition (letterhead / salutation / body / signoff / P.S.) carries
   the identity, not branding chrome, so there are no cards, no boxes,
   no header nameplate, and no fake paper texture. */

* { box-sizing: border-box; }

body {
  font-family: 'Newsreader', Georgia, 'Times New Roman', serif;
  font-size: 1.15em;
  line-height: 1.7;
  color: #2f2f34;
  margin: 0;
  padding: 0;
  background-color: #fff;
}

.container {
  margin: 0 auto;
  width: 100%;
  max-width: 640px;
  padding: 48px 20px 64px;
}

.letterhead {
  font-size: 1em;
  font-weight: 400;
  color: #55555c;
  letter-spacing: 0.01em;
  text-align: right;
  margin: 0 0 40px;
}

.letterhead a {
  color: inherit;
  text-decoration: none;
}

.letterhead a:hover {
  text-decoration: underline;
}

.salutation {
  margin: 0 0 24px;
}

p { margin: 0 0 20px; }

.headline {
  font-size: 1.5em;
  font-weight: 600;
  line-height: 1.4;
  margin: 0 0 32px;
}

h2 {
  font-size: 1.1em;
  font-weight: 600;
  margin: 32px 0 12px;
}

.signoff {
  font-style: italic;
  font-size: 1.2em;
  margin: 36px 0 4px;
}

.ps {
  font-size: 0.9em;
  color: #55555c;
  margin-top: 24px;
}

.error {
  color: #b3261e;
  font-weight: 600;
}

form { display: flex; flex-direction: column; gap: 14px; margin: 24px 0; }

label { font-weight: 600; color: #2f2f34; font-size: 0.9em; }

input[type="text"], input[type="email"], input[type="number"], select {
  padding: 14px 12px;
  font-size: 1em;
  font-family: inherit;
  border: 1px solid #ddd;
  border-radius: 3px;
}

fieldset {
  border: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

legend {
  font-weight: 600;
  color: #2f2f34;
  font-size: 0.9em;
  padding: 0;
  margin: 0 0 4px;
}

.radio-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 400;
  font-size: 1em;
  cursor: pointer;
}

.radio-label input[type="radio"] {
  flex-shrink: 0;
}

.checkbox-label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-weight: 400;
  font-size: 0.8em;
}

.checkbox-label input[type="checkbox"] {
  margin-top: 4px;
  flex-shrink: 0;
}

.checkbox-label span {
  flex: 1;
  min-width: 0;
}

button, input[type="submit"] {
  background-color: #007AA3;
  color: #fff;
  padding: 12px 28px;
  border-radius: 6px;
  border: none;
  font-size: 0.95em;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-weight: 600;
  cursor: pointer;
  align-self: flex-start;
}

button:hover, input[type="submit"]:hover { background-color: #005f7d; }

/* A tick darker than the button's own #007AA3 (reusing its hover
   shade): the two are the same hue, but a flat underlined link and a
   solid filled button read as different brightness at the same hex,
   so the link gets the darker value to feel tonally matched instead
   of competing with the button for "brightest blue on the page". */
a { color: #005f7d; text-decoration: underline; }