/*
 * Separee am Stadtplatz – Kundenseite (Shortcode [koeck_separee], 0.13.0; vorher im Theme als „Extra Raum“).
 * Handy: Text, dann das Formular im grünen Kasten; ab 1400 px nebeneinander (1000–1399 einspaltig, Text höchstens ca. 70 Zeichen breit), Rand bündig mit dem Footer.
 * Felder wie im Kontaktformular, Knopf schwarz. Schriften der Website (Adobe), Ersatzschriften wie im Theme.
 */
.sep { --sep-g: var(--jh-accent, #b0c7a6); --sep-l: var(--jh-accent-strong, #7d9c71); --sep-serif: new-spirit-condensed, "Instrument Serif", Georgia, serif; --sep-sans: acumin-pro-condensed, "Roboto Condensed", system-ui, sans-serif;
	box-sizing: border-box; max-width: 1440px; margin: 0 auto; padding: 32px 24px 72px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; color: #000; font-family: var(--sep-sans); }
.sep *, .sep *::before, .sep *::after { box-sizing: border-box; }
.sep-h { margin: 0; max-width: 11em; font: 300 clamp(36px, 10vw, 76px)/1 var(--sep-serif); letter-spacing: -.02em; text-wrap: balance; hyphens: manual; }
.sep-unter { margin: 16px 0 0; font: 600 15px/1.3 var(--sep-sans); }
.sep-lead { margin: 24px 0 0; max-width: 26em; font-size: 18px; line-height: 1.5; }
.sep-fakten-h { margin: 28px 0 8px; font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.sep-fakten-h + .sep-fakten { margin-top: 0; }
.sep-fakten { margin: 24px 0 0; padding: 0; list-style: none; max-width: 468px; font-size: inherit; border-top: 1px solid var(--sep-l); }
.sep-fakten li { padding: 12px 0; border-bottom: 1px solid var(--sep-l); font-size: 17px; line-height: 1.35; }
.sep-fakten b { font-weight: 600; }
.sep-zeiten dl { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 2px 16px; margin: 8px 0 0; }
.sep-zeiten dt, .sep-zeiten dd { margin: 0; }
.sep-zeiten dd { font-variant-numeric: tabular-nums; }
.sep-box { background: var(--sep-g); padding: 28px 20px 24px; align-self: start; }
.sep-box-h { margin: 0; font: 300 clamp(30px, 8vw, 40px)/1.05 var(--sep-serif); letter-spacing: -.01em; text-transform: none; }
.sep-box-sub { margin: 8px 0 20px; font-size: 16px; line-height: 1.4; }
.sep-form { margin: 0; }
.sep-reihe { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 12px; }
.sep-feld { margin: 0 0 16px; }
.sep-feld label { display: block; margin: 0 0 6px; font-weight: 600; font-size: 15px; }
.sep-feld label span { font-weight: 400; }
.sep-feld input, .sep-feld select, .sep-feld textarea { display: block; width: 100%; min-height: 48px; margin: 0; padding: 10px 12px; border: 1px solid #000; border-radius: 0; background: #fff; color: #000; font: 400 16px/1.3 var(--sep-sans); -webkit-appearance: none; appearance: none; }
.sep-feld select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 36px; }
.sep-feld select:disabled { color: #666; background-color: #f4f4f1; }
.sep-feld textarea { min-height: 96px; resize: vertical; }
.sep-feld input:focus-visible, .sep-feld select:focus-visible, .sep-feld textarea:focus-visible { outline: 3px solid #000; outline-offset: 1px; }
.sep-feld [aria-invalid="true"] { border-width: 2px; border-color: #a3222f; }
.sep-fehler { margin: 6px 0 0; color: #8a1c27; font-size: 15px; font-weight: 600; line-height: 1.35; }
.sep-fehler-allg:focus { outline: none; }
.sep-fehler-allg { margin: 0 0 16px; padding: 10px 12px; background: #fff; border-left: 4px solid #a3222f; }
.sep-stepper { display: inline-flex; align-items: stretch; vertical-align: middle; }
.sep-stepper input { width: 72px; text-align: center; font-size: 20px; -moz-appearance: textfield; }
.sep-stepper input::-webkit-outer-spin-button, .sep-stepper input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.sep-stepper button { width: 48px; min-height: 48px; border: 1px solid #000; background: #fff; color: #000; font: 400 24px/1 system-ui, sans-serif; cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.sep-stepper button:first-child { border-right: 0; }
.sep-stepper button:last-child { border-left: 0; }
.sep-stepper button:active { background: #eee; }
.sep-tipp { display: inline-block; margin-left: 12px; font-size: 15px; vertical-align: middle; }
.sep-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.sep-senden { margin: 8px 0 0; }
.sep-knopf { width: 100%; min-height: 56px; border: 0; background: #000; color: #fff; font: 600 17px/1 var(--sep-sans); letter-spacing: 1.3px; text-transform: uppercase; cursor: pointer; transition: transform .12s ease, background-color .2s ease; -webkit-tap-highlight-color: transparent; }
.sep-knopf:active { transform: scale(.98); }
.sep-knopf:disabled { opacity: .7; cursor: default; }
@media (hover: hover) and (pointer: fine) { .sep-knopf:hover { background: #222; } .sep-stepper button:hover { background: #f2f2f2; } }
.sep-knopf:focus-visible, .sep-stepper button:focus-visible { outline: 3px solid #000; outline-offset: 3px; }
.sep-laenger { margin: -6px 0 18px; font-size: 15px; line-height: 1.4; }
.sep-laenger a { color: inherit; white-space: nowrap; }
.sep-laenger .kvf-nw, .sep .kvf-nw { white-space: nowrap; }
.sep-box-sub, .sep-laenger, .sep-klein, .sep-fakten li, .sep-unter, .sep-lead { text-wrap: pretty; }
.sep-klein { margin: 14px 0 0; font-size: 13px; line-height: 1.4; }
.sep-klein a { color: inherit; }
.sep-danke h2 { text-wrap: balance; margin: 0 0 12px; font: 300 clamp(30px, 8vw, 40px)/1.05 var(--sep-serif); text-transform: none; }
.sep-danke p { margin: 0 0 10px; font-size: 17px; line-height: 1.45; }
@media (max-width: 299px) { .sep-danke p { font-size: 15px; } }
.sep-danke .sep-klein { font-size: 14px; }
.sep-danke:focus { outline: none; }
.sep-hinweis { margin: 0; font-size: 17px; }
@media (min-width: 600px) { .sep { padding: 48px 48px 96px; } .sep-box { padding: 36px 32px 32px; } }
@media (min-width: 1000px) and (max-width: 1399.98px) { .sep { max-width: 760px; margin-inline: auto; } }
@media (min-width: 1400px) {
	.sep { grid-template-columns: minmax(0, 1fr) minmax(0, 480px); column-gap: clamp(48px, 6vw, 120px); padding: 96px min(210px, (100vw - var(--scrollbar-width, 0px)) / 48 * 7) 140px; }
	.sep-text { padding-top: 8px; }
}
@media (max-width: 299px) { .sep-fakten .sep-lang { white-space: normal; } .sep-lead { font-size: 16px; } .sep-laenger { font-size: 14px; } }
.sep-zeiten dd { white-space: nowrap; }
.sep-box-sub { text-wrap: balance; }
@media (max-width: 399px) { .sep-reihe { grid-template-columns: minmax(0, 1fr); } .sep-tipp { display: block; margin: 6px 0 0; } }
@media (max-width: 259px) {
	.sep-fakten li { font-size: 15px; }
	.sep-zeiten dl { grid-template-columns: minmax(0, 1fr); gap: 0; }
	.sep-zeiten dd { margin-bottom: 4px; }
	.sep { padding-inline: 14px; }
	.sep-h { font-size: 28px; overflow-wrap: normal; }
	.sep-box { padding-inline: 12px; }
	.sep-reihe { grid-template-columns: minmax(0, 1fr); }
	.sep-stepper button { width: 38px; } .sep-stepper input { width: 52px; }
	.sep-tipp { display: block; margin: 6px 0 0; }
}