.field { display: grid; gap: var(--measure-xs); }
.field label, .field legend, .label { font-size: var(--text-sm); font-weight: var(--weight-semibold); }
.label { letter-spacing: var(--tracking-normal); line-height: var(--leading-snug); }
.field legend { margin-bottom: var(--measure-sm); }
.field__hint { font-size: var(--text-xs); color: var(--color-muted); font-weight: var(--weight-regular); }
.input, .textarea, .select {
  font: inherit; font-size: var(--text-md); color: var(--color-ink); width: 100%;
  background: var(--color-surface); border: 1px solid var(--color-line); border-radius: var(--radius-sm); padding: var(--measure-md);
  transition: border-color 0.2s, box-shadow 0.2s;
}
.input:focus, .textarea:focus, .select:focus, .newsletter-card input[type="email"]:focus {
  outline: 2px solid transparent; border-color: var(--color-primary);
  box-shadow: 0 0 0 1px var(--color-primary), var(--shadow-ring);
}
.textarea { resize: vertical; min-height: 140px; }
.select {
  appearance: none; padding-right: 48px; cursor: pointer;
  background-image:
    linear-gradient(45deg, transparent calc(50% - 1px), var(--color-muted) calc(50% - 1px) calc(50% + 1px), transparent calc(50% + 1px)),
    linear-gradient(-45deg, transparent calc(50% - 1px), var(--color-muted) calc(50% - 1px) calc(50% + 1px), transparent calc(50% + 1px));
  background-position: calc(100% - 26px) 55%, calc(100% - 19px) 55%;
  background-size: 8px 8px; background-repeat: no-repeat;
}
.field--invalid .input, .field--invalid .textarea, .field--invalid .select { border-color: var(--color-danger); }
.field__error { color: var(--color-danger); font-size: var(--text-xs); font-weight: var(--weight-semibold); }
.form-grid { display: grid; gap: var(--measure-lg); }
.form-actions { margin-top: var(--space-form-actions); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--measure-md); align-items: start; }
.form-errors { background: var(--color-danger-soft); color: var(--color-danger); border-radius: var(--radius-sm); padding: var(--measure-md); font-weight: var(--weight-semibold); }
fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.chips { display: flex; flex-wrap: wrap; gap: var(--measure-xs); }
.chip-check { position: relative; }

.form-card { padding: var(--space-panel); }
.dark .inline-form .input::placeholder { color: var(--color-muted); }
.dark .inline-form .input:focus { border-color: var(--color-ink); box-shadow: 0 0 0 1px var(--color-ink), 0 0 0 5px color-mix(in srgb, var(--color-ink) 22%, transparent); }

.inline-form { display: flex; gap: var(--space-form-actions) var(--measure-xs); flex-wrap: wrap; }
.inline-form .input { flex: 1 1 220px; width: auto; }
.inline-form .field__error { flex-basis: 100%; }
.field__error:empty { display: none; }

.success { display: flex; flex-direction: column; align-items: flex-start; gap: var(--measure-md); animation: swap-in 0.5s var(--ease) both; }
.success__badge { width: 64px; height: 64px; border-radius: var(--radius-round); display: grid; place-items: center; background: var(--color-accent); color: var(--color-on-accent); }
.success .lede strong,
.booking-cancel .lede strong { color: var(--color-ink); }
@media (prefers-reduced-motion: no-preference) {
  .success__badge { animation: pop 0.6s var(--ease) both; }
}

.flash-stack { display: grid; gap: var(--measure-sm); margin-block: var(--measure-xl); }
.flash-stack .flash { margin-bottom: 0; }
.flash { border-radius: var(--radius-sm); padding: var(--measure-md) var(--measure-lg); font-weight: var(--weight-semibold); margin-bottom: var(--measure-lg); }
.flash--notice { background: var(--color-tint); color: var(--color-primary-text); }
.flash--alert { background: var(--color-danger-soft); color: var(--color-danger); }

@media (max-width: 600px) {
  .form-row { grid-template-columns: 1fr; }
}

.contact-page { display: grid; grid-template-columns: 1.35fr 1fr; gap: var(--space-layout); align-items: start; padding-block: var(--space-page-top) var(--space-section); }
.contact-page__lede { margin-bottom: var(--measure-3xl); }
.contact-page__aside { position: sticky; top: calc(var(--header-h) + 40px); display: grid; gap: var(--measure-md); margin-top: 150px; }
.contact-page__box { padding: var(--measure-2xl); }
.contact-page__box h2 + p { margin-top: var(--measure-2xs); }
.contact-page__box .btn { margin-top: var(--measure-xl); }
.contact-page__email { container-type: inline-size; display: grid; justify-items: center; text-align: center; gap: var(--measure-xs); padding: var(--measure-xl); border-radius: var(--radius-lg); background: var(--color-surface); border: 1px solid var(--color-line); text-decoration: none; transition: transform 0.35s var(--ease), background 0.3s, color 0.3s; }
.contact-page__email small { color: var(--color-muted); font-size: var(--text-xs); }
.contact-page__email strong { font-size: min(var(--text-lg), 6.4cqi); white-space: nowrap; }
.contact-page > * { min-width: 0; }
.contact-page__email:hover { transform: translateY(-4px); background: var(--color-primary); color: var(--color-on-primary); }
.contact-page__email:hover small { color: var(--color-on-primary-soft); }
.contact-page__email:hover .arrow-dot { transform: rotate(-45deg); background: var(--color-accent); color: var(--color-on-accent); }
.call-split { display: flex; gap: 3px; border-radius: var(--radius-lg); overflow: hidden; margin-top: var(--measure-xl); }
.call-split__part { white-space: nowrap; font-weight: var(--weight-semibold); font-size: var(--text-sm); line-height: 1; text-box: trim-both cap alphabetic; padding: var(--measure-md); color: var(--color-ink); }
.call-split__part--0 { background: var(--color-tint); }
.call-split__part--1 { background: color-mix(in srgb, var(--color-tint) 55%, var(--color-accent)); }
.call-split__part--2 { background: var(--color-accent); }
.call-steps { list-style: none; padding: 0; display: grid; gap: var(--measure-sm); margin-top: var(--measure-lg); }
.call-steps li { display: grid; grid-template-columns: 14px 1fr; gap: var(--measure-sm); align-items: start; }
.call-steps__dot { width: 14px; height: 14px; border-radius: var(--radius-round); margin-top: 5px; padding: 0; }
.call-steps p { margin-top: var(--measure-2xs); font-size: var(--text-sm); }

@media (max-width: 960px) {
  .contact-page { grid-template-columns: 1fr; }
  .contact-page__aside { position: static; margin-top: 0; }
}

@media (max-width: 600px) {
  .chips .chip-check:not(.booking__slot) { flex: 1 1 100%; text-align: center; }
  .contact-page__email { padding: var(--measure-md); }
  .call-split__part { padding: var(--measure-sm); font-size: var(--text-xs); }
}