/* Kontaktseite (src/pages/kontakt.html) – ruhiger Kachel-Stil (25.10.2026). Baut auf site.css auf:
   .page-board (23b), .sec-head (23a), .tiles (23d), .steps-row (23k), Formular als Zellen (17).
   Hier nur, was die Bausteine nicht abdecken:
     .kt-board / .kt-ways / .kt-way   Seiten-Brett mit drei Kontakt-Kacheln statt Foto
     .kt-open                         Öffnungsstatus (Text von site.js, Punkt über data-open="ja|nein")
     .kt-prefill                      Hinweis bei Vorbelegung (site.js)
     .kt-form                         Formular-Zellen auf weißem Grund: Felder, Fokus, Fehler, Hinweise
     .kt-anfrage / .kt-tip / .kt-hours  Formular + Seitenspalte
     .kt-addr / .kt-link / .kt-rv     Adresse, Instagram, Google-Bewertungen */

/* Seiten-Brett: Hauptkachel links, rechts drei Kontakt-Kacheln übereinander */
.kt-board .page-board__grid{height:clamp(560px,calc(100svh - var(--hdr) - var(--m)),760px);}
.kt-sub{display:block;margin-top:.28em;font-size:clamp(24px,.46em,46px);line-height:1.05;letter-spacing:-.02em;}
.kt-ways{grid-column:8 / 13;grid-row:1 / 3;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:var(--j);}
.kt-ways > li{display:flex;min-width:0;min-height:0;}
.kt-way{flex:1 1 auto;display:flex;flex-direction:column;gap:8px;min-width:0;}
.kt-way__name{display:flex;align-items:center;gap:10px;font-weight:600;}
.kt-way__name svg{flex:none;width:22px;height:22px;}
.kt-way__val{margin-top:auto;font:600 var(--fs-say)/1.1 var(--serif);letter-spacing:-.02em;}
.kt-way__val--mail{font-size:clamp(20px,1.75vw,28px);overflow-wrap:anywhere;}
.kt-way__hint{max-width:52ch;font-size:var(--fs-small);font-weight:500;line-height:1.45;}
.kt-way.t--accent:focus-visible{outline-color:var(--ink);}
@media (hover:hover) and (pointer:fine){a.kt-way.t--graphite:hover{background:var(--graphite-2);}}

/* Öffnungsstatus: eckiger Punkt, grün während der Öffnungszeit */
.kt-open{display:inline-flex;align-items:center;gap:10px;font-size:var(--fs-small);font-weight:600;line-height:1.4;}
.kt-open::before{content:"";flex:none;width:9px;height:9px;background:var(--soft);}
.kt-open[data-open="ja"]::before{background:var(--ok);}

/* Hinweis nach Vorbelegung per Link */
.kt-prefill{display:flex;align-items:flex-start;gap:10px;max-width:56ch;padding:12px 16px;background:var(--bg);font-size:var(--fs-small);font-weight:600;line-height:1.45;}
.kt-prefill svg{flex:none;width:18px;height:18px;margin-top:1px;color:var(--ok);}

/* Anfrage: Formular (Spalten 1–8) + Seitenspalte (9–12) */
.kt-anfrage{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--j);align-items:start;}
.kt-anfrage__form{grid-column:1 / 9;min-width:0;}
.kt-anfrage__side{grid-column:9 / 13;display:grid;gap:var(--j);}

.kt-form .form__head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 24px;align-items:end;margin-bottom:16px;}
.kt-form .form__title{grid-column:1;font:600 var(--fs-lead)/1.2 var(--serif);letter-spacing:-.01em;}
.kt-form .form__intro{grid-column:1;color:var(--soft);}
.kt-form .form__legend{grid-column:2;grid-row:2;font-size:var(--fs-small);color:var(--soft);}
.form.is-sent .form__legend{display:none;}

/* Felder: Zellen in Steinton auf weißem Grund; Fokus = weiße Zelle mit Tintenrahmen, Fehler = roter Rahmen + Meldung */
.kt-form .cell{justify-content:flex-start;gap:8px;min-height:0;padding:16px 18px 18px;background:var(--tile-2);}
.kt-form .cell:not(.cell--submit) :is(input,select,textarea){min-height:50px;padding:12px 14px;background:var(--bg);color:var(--ink);}
.kt-form .cell:not(.cell--submit) textarea{min-height:150px;line-height:1.5;}
.kt-form .cell select option{background:var(--bg);color:var(--ink);}
.kt-form .cell ::placeholder{color:var(--soft);opacity:1;}
@media (hover:hover) and (pointer:fine){.kt-form .cell:not(:focus-within):not(.cell--submit):hover{background:var(--tile-3);}}
.kt-form .cell:not(.cell--submit):focus-within{background:var(--paper);color:var(--ink);outline:0;}
.kt-form .cell :is(input,select,textarea):focus{box-shadow:inset 0 0 0 2px var(--ink);}
.kt-form .cell:not(.cell--submit):has([aria-invalid="true"]){background:#FBE4DF;outline:3px solid var(--error);outline-offset:-3px;}
.kt-form .cell :is(input,select,textarea)[aria-invalid="true"]{box-shadow:inset 0 0 0 2px var(--error);}
.kt-form .cell :is(input,select,textarea)[aria-invalid="true"]:focus{box-shadow:inset 0 0 0 3px var(--error);}
.field__select{position:relative;}
.kt-form .field__select select{padding-right:44px;}
.field__select svg{position:absolute;right:14px;top:50%;width:18px;height:18px;margin-top:-9px;pointer-events:none;}
.field__error{display:flex;align-items:flex-start;gap:8px;margin-top:6px;color:var(--error);font-size:var(--fs-small);font-weight:600;line-height:1.4;}
.field__error::before{content:"!";flex:none;display:grid;place-items:center;width:18px;height:18px;margin-top:1px;background:var(--error);color:#FFFFFF;font-size:12px;font-weight:700;line-height:1;}

.form__hint{grid-column:1 / -1;padding:2px 18px 8px;font-size:var(--fs-small);line-height:1.45;color:var(--soft);}
.form__hint--reach{grid-column:2 / -1;}
.form__privacy{grid-column:1 / 3;display:flex;align-items:center;padding:16px 18px;background:var(--tile);font-size:var(--fs-small);line-height:1.5;}
.form__privacy a{font-weight:600;text-decoration-thickness:2px;text-underline-offset:.2em;}
.kt-form .cell--submit{justify-content:center;min-height:96px;background:var(--accent);color:var(--on-accent);}
.kt-form .cell--submit:focus-visible{outline:2px solid var(--ink);outline-offset:2px;}
@media (hover:hover) and (pointer:fine){.kt-form .cell--submit:hover{background:var(--accent-hover);}}

/* Seitenspalte */
.kt-tip,.kt-hours{display:flex;flex-direction:column;gap:12px;}
.kt-tip__label{font-size:var(--fs-small);font-weight:600;color:var(--on-paper-soft);}
.kt-tip__title,.kt-hours__title{font:600 var(--fs-lead)/1.2 var(--serif);letter-spacing:-.01em;}
.kt-tip a{font-weight:600;text-decoration-thickness:2px;text-underline-offset:.2em;overflow-wrap:anywhere;}
.kt-hours__list{display:grid;gap:4px;}
.kt-hours__list > div{display:flex;justify-content:space-between;gap:12px;padding:10px 14px;background:var(--tone-on);}
.kt-hours__list dd{margin:0;font-variant-numeric:tabular-nums;}
.kt-hours__list > .is-today{background:var(--paper);font-weight:600;}
.kt-hours__note{font-size:var(--fs-small);line-height:1.45;color:var(--soft);}

/* Adresse + Instagram */
.kt-addr{justify-content:space-between;gap:28px;}
.kt-addr__text{display:flex;flex-direction:column;font-size:var(--fs-lead);line-height:1.35;}
.kt-addr__name{margin-bottom:8px;font:600 var(--fs-say)/1.12 var(--serif);letter-spacing:-.02em;}
.kt-link{justify-content:space-between;}
.kt-link__icon{width:32px;height:32px;}
.kt-link__text{font:600 var(--fs-lead)/1.25 var(--serif);letter-spacing:-.01em;}
.kt-link__arrow,.kt-rv__arrow{width:32px;height:32px;align-self:flex-end;transition:transform var(--t-ui) var(--ease-out);}

/* Bewertungen: eine Link-Fläche aus zwei Kacheln (Wertung · Profil) */
.kt-rv{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--j);color:var(--ink);text-decoration:none;transition:transform var(--t-press) var(--ease-out);}
.kt-rv:active{transform:scale(.99);}
.kt-rv:focus-visible{outline-offset:4px;}
.kt-rv__score{grid-column:1 / 5;display:flex;flex-direction:column;gap:12px;min-height:240px;}
.kt-rv__n{font:600 var(--fs-figure)/.9 var(--serif);letter-spacing:-.03em;}
.kt-rv .stars{display:flex;gap:4px;}
.kt-rv .stars svg{width:22px;height:22px;color:var(--accent);}
.kt-rv__count{margin-top:auto;font-weight:600;}
.kt-rv__body{grid-column:5 / 13;display:flex;flex-direction:column;gap:12px;transition:background-color var(--t-hover) ease;}
.kt-rv__label{font-size:var(--fs-small);font-weight:600;color:var(--soft);}
.kt-rv__title{font:600 var(--fs-head)/1.05 var(--serif);letter-spacing:-.025em;}
.kt-rv__text{max-width:52ch;}
.kt-rv__arrow{margin-top:auto;}
@media (hover:hover) and (pointer:fine){
  .kt-link:hover .kt-link__arrow,.kt-rv:hover .kt-rv__arrow{transform:translateX(6px);}
  .kt-rv:hover .kt-rv__body{background:var(--tile-2);}
  .kt-rv:hover .kt-rv__title{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.18em;}
}

/* Tablet (≤ 1099 px) */
@media (max-width:1099px){
  .kt-board .page-board__grid{height:auto;}
  .kt-ways{grid-column:1 / -1;grid-row:auto;grid-template-rows:none;grid-template-columns:repeat(2,minmax(0,1fr));}
  .kt-ways > li:first-child{grid-column:1 / -1;}
  .kt-way{min-height:180px;}
  .kt-anfrage__form,.kt-anfrage__side{grid-column:1 / -1;}
  .kt-anfrage__side{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;}
  .kt-link{grid-column:1 / -1;min-height:150px;}
  .kt-rv__score{grid-column:1 / 6;}
  .kt-rv__body{grid-column:6 / 13;}
}

/* Handy (≤ 599 px) */
@media (max-width:599px){
  .kt-ways{grid-template-columns:1fr;}
  .kt-way{min-height:0;padding:18px;gap:6px;}
  .kt-way__val{margin-top:10px;}
  .page-board__actions .kt-open{flex-basis:100%;}
  .kt-anfrage__side{grid-template-columns:1fr;}
  .kt-form .form__head{grid-template-columns:1fr;}
  .kt-form .form__legend{grid-column:1;grid-row:auto;}
  .form__hint,.form__hint--reach,.form__privacy{grid-column:1 / -1;}
  .form__hint{padding:0 2px 6px;}
  .kt-form .cell--submit{min-height:64px;}
  .kt-rv{display:flex;flex-direction:column;}
  .kt-rv__score{min-height:0;}
}
