/* ==========================================================================
   wohnmobilankaufschweiz.ch — "ABGEHAKT: die Liste des Verkäufers"
   One hand-written stylesheet. Mobile-first; min-width steps at
   600 / 768 / 900 / 1200. Flat paper: structure comes from 2px Petrol
   borders, dashed separators, Teal-Tint grounds and the check square —
   never from shadows, gradients or rails.
   ========================================================================== */

/* ---- Fonts ---------------------------------------------------------------- */
@font-face{font-family:"Atkinson Hyperlegible Next";src:url("/assets/font/ahn-latin.woff2") format("woff2");font-weight:400 700;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Atkinson Hyperlegible Next";src:url("/assets/font/ahn-latin-ext.woff2") format("woff2");font-weight:400 700;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* Metric-matched Arial stand-in: the page keeps its measure while the woff2 loads. */
@font-face{font-family:"AHN Fallback";src:local("Arial"),local("Helvetica");size-adjust:106%;ascent-override:92%;descent-override:24%;line-gap-override:0%}

/* ---- Tokens --------------------------------------------------------------- */
:root{
  --wa-papier:#FBF7F0;
  --wa-weiss:#FFFFFF;
  --wa-petrol:#0F4C5C;
  --wa-teal:#167C86;
  --wa-teal-hell:#D7EBEC;
  --wa-orange:#EA6A1F;
  --wa-orange-hover:#F07A2E;
  --wa-orange-hell:#FCE6D6;
  --wa-tinte:#14232A;
  --wa-grau:#5B6B70;
  --wa-linie:#9FB7BB;
  --wa-sand:#E8E0D3;
  --wa-fehler:#B3261E;
  --wa-font:"Atkinson Hyperlegible Next","AHN Fallback",Arial,Helvetica,sans-serif;
  --wa-camper:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 128 64'%3E%3Cpath d='M8 46V24h58l12-10h36v32' fill='none' stroke='%230F4C5C' stroke-width='2' stroke-linejoin='round'/%3E%3Ccircle cx='32' cy='48' r='6' fill='%23D7EBEC' stroke='%230F4C5C' stroke-width='2'/%3E%3Ccircle cx='96' cy='48' r='6' fill='%23D7EBEC' stroke='%230F4C5C' stroke-width='2'/%3E%3C/svg%3E");
  --wa-haken:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpolyline points='7,17 13,23 25,9' fill='none' stroke='%2314232A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --wa-pfeil:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 6l5 5 5-5' fill='none' stroke='%230F4C5C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --wa-ausruf:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='1' y='1' width='14' height='14' rx='3' fill='%23B3261E'/%3E%3Cpath d='M8 4v5M8 11v1.5' stroke='%23FFF' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
  color-scheme:light;
}

/* ---- Base ----------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{color-scheme:light;-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:72px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--wa-papier);color:var(--wa-tinte);font-family:var(--wa-font);font-size:17px;line-height:1.55;padding-bottom:72px;overflow-wrap:break-word}
body.wa-no-daumen{padding-bottom:0}
img,svg{display:block;max-width:100%}
h1,h2,h3,h4{margin:0 0 16px;color:var(--wa-petrol);font-weight:700;line-height:1.15}
h1,.wa-h1{font-size:34px;line-height:1.12}
h2,.wa-h2{font-size:26px}
h3{font-size:19px}
p{margin:0 0 16px}
p:last-child{margin-bottom:0}
strong,b{font-weight:700}
a{color:var(--wa-petrol);text-decoration:underline;text-decoration-color:var(--wa-teal);text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{text-decoration-color:var(--wa-orange)}
:focus-visible{outline:3px solid var(--wa-orange);outline-offset:2px}
ul,ol{margin:0;padding:0;list-style:none}
figure{margin:0}
fieldset{margin:0;padding:0;border:0;min-width:0}
legend{padding:0}
button,input,select,textarea{font:inherit;color:inherit;margin:0}
button{background:none;border:0;padding:0;cursor:pointer}
details summary{cursor:pointer}
.wa-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.wa-skip{position:absolute;left:12px;top:-120px;z-index:100;padding:12px 16px;background:var(--wa-weiss);border:2px solid var(--wa-petrol);border-radius:6px;font-weight:700}
.wa-skip:focus{top:12px}
.wa-hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.wa-link{background:none;border:0;padding:0;font:inherit;color:var(--wa-petrol);text-decoration:underline;text-decoration-color:var(--wa-teal);text-decoration-thickness:2px;text-underline-offset:3px;cursor:pointer}
.wa-link:hover{text-decoration-color:var(--wa-orange)}

/* ---- Layout --------------------------------------------------------------- */
.wa-container{width:100%;max-width:1120px;margin:0 auto;padding:0 20px}
.wa-section{padding:0 0 48px;overflow-x:clip}
.wa-section>.wa-container{border-top:2px dashed var(--wa-linie);padding-top:32px}
.wa-section--first>.wa-container,.wa-section--intro>.wa-container{border-top:0;padding-top:24px}
.wa-section--form{background:var(--wa-teal-hell);padding:48px 0;margin:0 0 48px}
.wa-section--form>.wa-container{border-top:0;padding-top:0}
.wa-section--form.wa-section--first{padding-top:24px}
.wa-split{display:grid;grid-template-columns:minmax(0,1fr);gap:32px}
.wa-prose{max-width:640px}
.wa-prose h2,.wa-prose h3{margin-top:32px}
.wa-prose ul,.wa-prose ol{margin:0 0 16px;padding-left:24px;list-style:disc}
.wa-prose ol{list-style:decimal}
.wa-prose li{margin-bottom:6px}
.wa-prose img{border-radius:3px}
.wa-prose table{width:100%;border-collapse:collapse;margin:0 0 16px;font-size:15px}
.wa-prose th,.wa-prose td{border:2px solid var(--wa-linie);padding:8px 10px;text-align:left;vertical-align:top}
.wa-prose blockquote{margin:0 0 16px;padding:12px 16px;border-left:2px solid var(--wa-teal);background:var(--wa-weiss)}
.wa-lead{font-size:19px;line-height:1.45;max-width:640px;margin:0 0 20px}
.wa-meta{font-size:14px;color:var(--wa-grau);margin:0 0 16px}
.wa-article{margin-top:24px}
.wa-note-line{max-width:640px;margin-top:24px}
.wa-form-col{max-width:760px}
.wa-btnrow{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.wa-btnrow>.wa-btn{flex:1 1 100%}
.wa-tag{display:inline-block;background:var(--wa-teal-hell);border:2px solid var(--wa-petrol);border-radius:4px;padding:4px 10px;margin:0 0 20px;font-size:12px;line-height:1.3;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--wa-petrol)}

/* ---- Check square ----------------------------------------------------------- */
.wa-tick{flex:none;width:32px;height:32px;--wa-tick-fill:#FFF;--wa-tick-mark:#FFF;--wa-tick-show:0}
.wa-tick--28{width:28px;height:28px}
.wa-tick--24{width:24px;height:24px}
.wa-tick.is-done{--wa-tick-fill:var(--wa-teal);--wa-tick-show:1}
.wa-tick.is-you{--wa-tick-fill:var(--wa-orange);--wa-tick-mark:var(--wa-tinte);--wa-tick-show:1}
.wa-h2{display:flex;align-items:flex-start;gap:12px;margin:0 0 24px}
.wa-h2>.wa-tick{margin-top:-1px}
.wa-h2>span{min-width:0}
h1.wa-h2{font-size:34px}

/* ---- Checklist rows --------------------------------------------------------- */
.wa-liste{display:grid;gap:12px}
.wa-liste-row{display:grid;grid-template-columns:28px minmax(0,1fr);column-gap:12px;align-items:start;min-height:48px}
.wa-liste-label{display:block;padding-top:2px;font-size:17px;font-weight:700;line-height:1.35;color:var(--wa-petrol)}
.wa-liste-label a{display:inline-block;min-height:28px}
.wa-liste-detail{display:block;margin-top:2px;font-size:14px;line-height:1.45;color:var(--wa-grau)}
.wa-liste-detail .wa-tel{font-size:17px;min-height:0}

/* ---- Etikett (label card) ----------------------------------------------------- */
.wa-etikett{background:var(--wa-weiss);border:2px solid var(--wa-petrol);border-radius:6px;margin:0 0 24px}
.wa-etikett-body{padding:16px}
.wa-etikett-band{display:block;background:var(--wa-teal-hell);border-bottom:2px solid var(--wa-petrol);border-radius:4px 4px 0 0;padding:6px 12px;font-size:12px;line-height:1;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--wa-petrol)}
.wa-figure-big{font-size:40px;font-weight:700;line-height:1;color:var(--wa-petrol)}
.wa-standort .wa-liste{margin-top:12px}
.wa-adresse{margin:0 0 12px;line-height:1.45}
.wa-offer-etikett .wa-h2{margin-bottom:12px}
.wa-offer-etikett .wa-btnrow{margin-top:16px}

/* ---- Buttons -------------------------------------------------------------- */
.wa-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 20px;border:2px solid var(--wa-petrol);border-radius:6px;background:transparent;color:var(--wa-petrol);font-size:17px;font-weight:700;line-height:1.2;text-decoration:none;cursor:pointer}
.wa-btn:active{transform:translateY(1px)}
.wa-btn--orange{background:var(--wa-orange);color:var(--wa-tinte)}
.wa-btn--orange:hover{background:var(--wa-orange-hover)}
.wa-btn--orange:focus-visible{outline-color:var(--wa-petrol)}
.wa-btn--outline{border-color:var(--wa-teal)}
.wa-btn--outline:hover{background:var(--wa-teal-hell)}
.wa-btn--text{border-color:transparent;padding:0 8px;text-decoration:underline;text-decoration-color:var(--wa-teal);text-decoration-thickness:2px;text-underline-offset:3px}
.wa-btn--text:hover{text-decoration-color:var(--wa-orange)}
.wa-btn--block{display:flex;width:100%}
.wa-btn--big{min-height:52px}
.wa-btn--icon{width:48px;min-width:48px;padding:0;flex:none}
.wa-btn-icon{width:24px;height:24px;flex:none;color:var(--wa-teal)}
.wa-btn--orange .wa-btn-icon{color:var(--wa-tinte)}
.wa-btn:disabled,.wa-btn[aria-disabled="true"]{background:var(--wa-sand);color:var(--wa-grau);border-color:var(--wa-linie);cursor:not-allowed;transform:none}

/* ---- Etikett-Foto ------------------------------------------------------------- */
.wa-photo-fig{margin:0 0 16px}
.wa-photo{display:grid;aspect-ratio:4/3;padding:8px;background:var(--wa-weiss);border:2px solid var(--wa-petrol);border-radius:6px;overflow:hidden}
.wa-photo--hero{aspect-ratio:16/10}
.wa-photo>picture{display:block;width:100%;height:100%;min-height:0}
.wa-photo>img,.wa-photo>picture>img,.wa-photo>div{display:block;width:100%;height:100%;min-height:0;object-fit:cover;border-radius:3px;color:transparent;font-size:0;background:var(--wa-teal-hell) var(--wa-camper) center/44% no-repeat}
.wa-photo>.wa-photo-inner{display:grid;place-items:center;align-content:center;gap:12px;background-image:none;font-size:12px;color:var(--wa-petrol)}
.wa-photo-inner svg{width:50%;max-width:160px;height:auto}
.wa-photo-inner .wa-etikett-band{border:2px solid var(--wa-petrol);border-radius:4px}
.wa-photo-caption{margin-top:8px;font-size:14px;line-height:1.45;color:var(--wa-grau)}

/* ---- Aufbau tiles ----------------------------------------------------------- */
.wa-typ-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.wa-typ-grid>:nth-child(5){grid-column:1/-1}
.wa-typ{position:relative;display:grid;grid-template-rows:48px auto auto;gap:6px;align-content:start;min-height:96px;padding:16px;background:var(--wa-weiss);border:2px solid var(--wa-petrol);border-radius:6px;color:var(--wa-petrol);text-decoration:none;hyphens:auto;cursor:pointer}
.wa-typ:hover,.wa-typ:focus-within{border-color:var(--wa-teal)}
.wa-typ:has(.wa-sr:focus-visible){outline:3px solid var(--wa-orange);outline-offset:2px}
.wa-typ-icon{width:96px;height:48px}
.wa-typ-name{font-size:17px;font-weight:700;line-height:1.3}
.wa-typ-note{font-size:14px;line-height:1.4;color:var(--wa-grau)}
.wa-typ.is-selected,.wa-typ:has(:checked){border-color:var(--wa-orange);box-shadow:inset 0 0 0 1px var(--wa-orange)}
.wa-typ.is-selected::after,.wa-typ:has(:checked)::after{content:"";position:absolute;top:8px;right:8px;width:24px;height:24px;border:2px solid var(--wa-petrol);border-radius:4px;background:var(--wa-orange) var(--wa-haken) center/100% no-repeat}

/* ---- Choice chips ------------------------------------------------------------- */
.wa-choices{display:flex;flex-wrap:wrap;gap:8px}
.wa-choice{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:0 16px;background:var(--wa-weiss);border:2px solid var(--wa-petrol);border-radius:6px;color:var(--wa-petrol);font-size:17px;cursor:pointer}
.wa-choice:hover{background:var(--wa-papier)}
.wa-choice:focus-within{outline:3px solid var(--wa-orange);outline-offset:2px}
.wa-choice.is-selected,.wa-choice:has(:checked){background:var(--wa-teal-hell);border-color:var(--wa-orange);box-shadow:inset 0 0 0 1px var(--wa-orange);font-weight:700}

/* ---- Real checkbox ------------------------------------------------------------ */
.wa-check{display:flex;align-items:flex-start;gap:12px;min-height:48px;padding:8px 0;font-size:16px;line-height:1.45;cursor:pointer}
.wa-checkbox{appearance:none;-webkit-appearance:none;flex:none;width:24px;height:24px;margin:1px 0 0;border:2px solid var(--wa-petrol);border-radius:4px;background:var(--wa-weiss);cursor:pointer}
.wa-checkbox:checked{background:var(--wa-orange) var(--wa-haken) center/100% no-repeat}
.wa-checkbox:focus-visible{outline:3px solid var(--wa-orange);outline-offset:2px}
.wa-consent{margin-top:8px}

/* ---- Form fields ----------------------------------------------------------- */
.wa-field{margin:0 0 20px;min-width:0}
.wa-field--choices>legend{margin-bottom:8px}
.wa-label{display:block;margin-bottom:6px;font-size:16px;font-weight:700;color:var(--wa-petrol)}
.wa-input,.wa-select,.wa-textarea{display:block;width:100%;min-height:52px;padding:0 14px;background:var(--wa-weiss);border:2px solid var(--wa-petrol);border-radius:6px;font-size:18px;color:var(--wa-tinte)}
.wa-textarea{min-height:120px;padding:12px 14px;resize:vertical}
.wa-select{appearance:none;-webkit-appearance:none;padding-right:44px;background:var(--wa-weiss) var(--wa-pfeil) right 14px center/16px no-repeat}
.wa-input:focus,.wa-select:focus,.wa-textarea:focus{outline:0;border-color:var(--wa-teal);box-shadow:0 0 0 3px var(--wa-teal-hell)}
.wa-input:disabled,.wa-select:disabled{background-color:var(--wa-sand);color:var(--wa-grau)}
.wa-input[data-invalid],.wa-select[data-invalid]{border-color:var(--wa-fehler)}
.wa-input::placeholder,.wa-textarea::placeholder{color:var(--wa-grau);opacity:1}
.wa-hint{margin:6px 0 0;font-size:14px;line-height:1.45;color:var(--wa-grau)}
.wa-error{display:flex;align-items:flex-start;gap:8px;margin:0 0 16px;padding:12px 16px;background:var(--wa-weiss);border:2px solid var(--wa-fehler);border-radius:6px;font-size:14px;font-weight:700;color:var(--wa-fehler)}
.wa-error::before{content:"";flex:none;width:16px;height:16px;margin-top:2px;background:var(--wa-ausruf) center/100% no-repeat}
.wa-error[hidden]{display:none}
.wa-affix{display:flex}
.wa-affix>.wa-input{flex:1;min-width:0;border-radius:6px 0 0 6px}
.wa-affix-unit{display:flex;align-items:center;flex:none;min-width:56px;padding:0 14px;background:var(--wa-teal-hell);border:2px solid var(--wa-petrol);border-left:0;border-radius:0 6px 6px 0;font-size:16px;font-weight:700;color:var(--wa-petrol)}
.wa-affix--pre>.wa-affix-unit{border-left:2px solid var(--wa-petrol);border-right:0;border-radius:6px 0 0 6px}
.wa-affix--pre>.wa-input{border-radius:0 6px 6px 0}
.wa-hinweis{margin:12px 0 0;padding:12px 16px;background:var(--wa-orange-hell);border-left:2px solid var(--wa-orange);border-radius:0 6px 6px 0;font-size:15px;color:var(--wa-tinte)}
.wa-hinweis--cta{margin:32px 0 0;padding:16px}
.wa-hinweis--cta p{margin-bottom:12px}

/* ---- Offerte form: stepper, accumulated rows, footer, upload, summary ----------- */
.wa-form-etikett{padding:16px;margin:0}
.wa-form{position:relative}
.wa-fieldset{margin:0 0 8px}
.wa-fieldset[hidden]{display:none}
.wa-legend{margin:0 0 16px;font-size:22px;font-weight:700;color:var(--wa-petrol)}
.wa-stepper{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 20px}
.wa-stepper-item{display:flex;align-items:center;gap:8px;min-height:40px;padding:6px 10px 6px 6px;border-radius:6px;font-size:14px;color:var(--wa-grau)}
.wa-stepper-label{white-space:nowrap}
.wa-stepper-item.is-done{color:var(--wa-petrol)}
.wa-stepper-item.is-current{background:var(--wa-orange-hell);color:var(--wa-petrol);font-weight:700}
.wa-done-rows{margin:0 0 20px;padding:8px 12px;border:2px dashed var(--wa-linie);border-radius:6px}
.wa-done-rows[hidden]{display:none}
.wa-done-rows>summary{display:flex;align-items:center;gap:6px;min-height:40px;list-style:none;font-weight:700;color:var(--wa-petrol)}
.wa-done-rows>summary::-webkit-details-marker{display:none}
.wa-done-rows>summary .wa-link{margin-left:4px;font-weight:400}
.wa-done-rows .wa-liste{padding:8px 0 4px}
.wa-summary{margin:20px 0;border:2px solid var(--wa-petrol);border-radius:6px;overflow:hidden}
.wa-summary[hidden]{display:none}
.wa-summary .wa-liste{padding:16px}
.wa-form-footer{position:sticky;bottom:0;z-index:2;display:flex;flex-direction:column-reverse;gap:8px;margin-top:8px;padding:12px 0 8px;background:var(--wa-weiss);border-top:2px dashed var(--wa-linie)}
.wa-form-footer[hidden]{display:none}
.wa-form-footer .wa-btn--orange{width:100%}
.wa-upload{position:relative}
.wa-upload-input{padding:12px 14px;font-size:16px}
.wa-upload[data-enhanced] .wa-upload-input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;pointer-events:none}
.wa-upload[data-enhanced] .wa-upload-input:focus-visible~.wa-upload-slots{outline:3px solid var(--wa-orange);outline-offset:4px;border-radius:6px}
.wa-upload-slots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.wa-upload-slots[hidden]{display:none}
.wa-upload-slot{position:relative;display:grid;place-items:center;aspect-ratio:4/3;min-height:48px;overflow:hidden;background:var(--wa-weiss);border:2px dashed var(--wa-linie);border-radius:6px;font-size:14px;font-weight:700;color:var(--wa-grau);cursor:pointer}
.wa-upload-slot:hover{border-color:var(--wa-teal)}
.wa-upload-slot--more{grid-column:1/-1;aspect-ratio:auto;min-height:56px}
.wa-upload-slot>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:3px}
.wa-upload-slot[data-filled]{border-style:solid;border-color:var(--wa-petrol)}
.wa-upload-slot[data-filled] .wa-upload-slot-label{position:absolute;left:6px;bottom:6px;padding:2px 8px;background:var(--wa-weiss);border-radius:3px;font-size:12px;color:var(--wa-petrol)}
.wa-upload-slot[data-count]::after{content:"+" attr(data-count);position:absolute;right:6px;top:6px;padding:2px 8px;background:var(--wa-orange);border-radius:3px;font-size:14px;color:var(--wa-tinte)}

/* ---- Swiss map + Kontrollschild tiles ------------------------------------------ */
.wa-map-wrap{width:100%}
.wa-map{display:block;width:100%;height:auto}
.wa-map path,.wa-map-kanton{fill:var(--wa-teal-hell);stroke:var(--wa-papier);stroke-width:2;stroke-linejoin:round}
.wa-map a:hover path,.wa-map a:focus-visible path,.wa-map .is-current path,.wa-map path.is-current,.wa-map a.is-current .wa-map-kanton{fill:var(--wa-orange)}
.wa-map a:focus-visible{outline:0}
.wa-map-elgg circle{fill:var(--wa-orange);stroke:var(--wa-petrol);stroke-width:2}
.wa-map-elgg text{font-family:var(--wa-font);font-size:14px;font-weight:700;fill:var(--wa-petrol)}
.wa-map a{pointer-events:none}
.wa-kanton-form{margin:24px 0}
.wa-kanton-row{display:flex;gap:8px}
.wa-kanton-select,.wa-kanton-row .wa-select{flex:1;min-width:0}
.wa-kanton-row .wa-btn{min-height:52px}
.wa-schild-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.wa-schild{display:flex;align-items:center;gap:10px;height:48px;min-width:0;padding:0 12px;background:var(--wa-weiss);border:2px solid var(--wa-petrol);border-radius:6px;color:var(--wa-petrol);text-decoration:none}
.wa-schild:hover,.wa-schild:focus-visible{border-color:var(--wa-orange);box-shadow:inset 0 0 0 1px var(--wa-orange)}
.wa-schild.is-current{background:var(--wa-teal-hell)}
.wa-schild-code{flex:none;font-size:20px;font-weight:700;letter-spacing:.04em}
.wa-schild-name{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:13px;line-height:1.15;color:var(--wa-grau);hyphens:auto}
@media(max-width:359px){.wa-schild-name{display:none}}

/* ---- FAQ rows --------------------------------------------------------------- */
.wa-fragen{max-width:760px}
.wa-frage{border-top:2px dashed var(--wa-linie)}
.wa-frage:last-child{border-bottom:2px dashed var(--wa-linie)}
.wa-frage-summary{display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px;align-items:start;min-height:48px;padding:16px 0;list-style:none;font-size:19px;font-weight:700;line-height:1.3;color:var(--wa-petrol);cursor:pointer}
.wa-frage-summary::-webkit-details-marker{display:none}
.wa-frage-summary>span{padding-top:2px}
.wa-frage-summary:hover{color:var(--wa-teal)}
.wa-frage-summary:focus-visible{outline:3px solid var(--wa-orange);outline-offset:2px}
.wa-frage[open] .wa-tick{--wa-tick-fill:var(--wa-teal);--wa-tick-show:1}
.wa-frage-body{max-width:640px;padding:0 0 20px 40px;font-size:17px}
.wa-faq-group{margin-top:32px}
.wa-faq-group:first-of-type{margin-top:8px}

/* ---- Kontakt cards ------------------------------------------------------------ */
.wa-kontakt{display:grid;gap:16px}
.wa-kontakt-card{margin:0}
.wa-kontakt-row{margin:0 0 12px}
.wa-tel{display:inline-flex;align-items:center;min-height:48px;font-size:22px;font-weight:700;color:var(--wa-petrol)}
.wa-mail{display:inline-flex;align-items:center;min-height:48px;font-weight:700;overflow-wrap:anywhere}

/* ---- Blog note cards ----------------------------------------------------------- */
.wa-note-grid{display:grid;gap:16px}
.wa-note{display:flex;flex-direction:column;overflow:hidden;background:var(--wa-weiss);border:2px solid var(--wa-petrol);border-radius:6px}
.wa-note:hover{border-color:var(--wa-teal)}
.wa-note:focus-within{outline:3px solid var(--wa-orange);outline-offset:2px}
.wa-note-media{display:block;aspect-ratio:16/9;background:var(--wa-teal-hell) var(--wa-camper) center/44% no-repeat;border-bottom:2px solid var(--wa-petrol)}
.wa-note-media img{width:100%;height:100%;object-fit:cover;color:transparent;font-size:0}
.wa-note-body{display:flex;flex:1;flex-direction:column;gap:10px;padding:16px}
.wa-note-body .wa-etikett-band{align-self:flex-start;border:2px solid var(--wa-petrol);border-radius:4px}
.wa-note-title{margin:0;font-size:19px}
.wa-note-title a{text-decoration:none}
.wa-note-title a:hover{text-decoration:underline}
.wa-note-excerpt{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;margin:0;font-size:15px;color:var(--wa-grau)}
.wa-note-link{display:inline-flex;align-items:center;min-height:48px;margin-top:auto;font-weight:700}

/* ---- Topbar ---------------------------------------------------------------- */
.wa-topbar{position:sticky;top:0;z-index:40;background:var(--wa-papier);border-bottom:2px solid var(--wa-petrol)}
.wa-topbar-in{display:flex;align-items:center;gap:8px;height:56px}
.wa-logo{display:inline-flex;align-items:center;gap:8px;min-height:48px;margin-right:auto;text-decoration:none}
.wa-logo-mark{flex:none;width:32px;height:32px}
.wa-logo-word{font-size:12px;line-height:1.2;font-weight:700;letter-spacing:.01em;color:var(--wa-orange);white-space:nowrap}
.wa-nav{display:none}
.wa-nav ul{display:flex;gap:2px}
.wa-nav a{display:inline-flex;align-items:center;min-height:48px;padding:0 10px;border-radius:6px;font-size:16px;font-weight:700;color:var(--wa-petrol);text-decoration:none;white-space:nowrap}
.wa-nav a:hover{background:var(--wa-teal-hell)}
.wa-nav a[aria-current="page"]{text-decoration:underline;text-decoration-color:var(--wa-orange);text-decoration-thickness:2px;text-underline-offset:6px}
.wa-topbar-tools{display:flex;align-items:center;gap:8px}
.wa-topbar-phone,.wa-topbar-cta{display:none}
.wa-lang{display:flex;align-items:center;font-size:15px;font-weight:700}
.wa-lang a{display:inline-flex;align-items:center;justify-content:center;min-width:32px;min-height:48px;padding:0 4px;color:var(--wa-petrol);text-decoration:none}
.wa-lang a[aria-current]{text-decoration:underline;text-decoration-color:var(--wa-orange);text-decoration-thickness:2px;text-underline-offset:4px}
.wa-lang>span{color:var(--wa-linie)}
.wa-nav-drawer{position:relative}
.wa-nav-drawer>summary{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border:2px solid var(--wa-teal);border-radius:6px;list-style:none;color:var(--wa-petrol)}
.wa-nav-drawer>summary::-webkit-details-marker{display:none}
.wa-nav-drawer[open]>summary{background:var(--wa-teal-hell)}
.wa-burger{position:relative;display:block;width:22px;height:2px;background:currentColor}
.wa-burger::before,.wa-burger::after{content:"";position:absolute;left:0;width:22px;height:2px;background:currentColor}
.wa-burger::before{top:-7px}
.wa-burger::after{top:7px}
.wa-nav-drawer>ul{position:absolute;right:0;top:calc(100% + 8px);z-index:60;width:min(320px,calc(100vw - 40px));padding:8px;background:var(--wa-weiss);border:2px solid var(--wa-petrol);border-radius:6px}
.wa-nav-drawer li+li{border-top:2px dashed var(--wa-linie)}
.wa-nav-drawer li a{display:flex;align-items:center;min-height:48px;padding:0 12px;border-radius:6px;font-weight:700;color:var(--wa-petrol);text-decoration:none}
.wa-nav-drawer li a:hover{background:var(--wa-teal-hell)}

/* ---- Intro (hero) ------------------------------------------------------------- */
.wa-intro{display:grid;gap:32px}
.wa-intro .wa-liste{margin-bottom:8px}
.wa-intro .wa-btnrow{margin-top:20px}

/* ---- Ablauf ---------------------------------------------------------------- */
.wa-ablauf{display:grid;gap:16px}
.wa-schritt{display:grid;grid-template-columns:32px minmax(0,1fr);column-gap:12px;align-items:start;min-height:48px}
.wa-schritt-title{display:block;padding-top:4px;font-size:17px;font-weight:700;line-height:1.3;color:var(--wa-petrol)}
.wa-schritt-detail{display:block;margin-top:4px;font-size:14px;line-height:1.45;color:var(--wa-grau)}
.wa-schritt-photo{display:none}

/* ---- Thanks ---------------------------------------------------------------- */
.wa-thanks-h1{display:flex;align-items:center;justify-content:center;gap:12px;text-align:center}
.wa-thanks .wa-lead{margin-left:auto;margin-right:auto}
.wa-thanks-next{margin:24px 0}

/* ---- Footer ----------------------------------------------------------------- */
.wa-footer{padding:48px 0 96px;background:var(--wa-petrol);color:var(--wa-papier)}
.wa-footer a{color:var(--wa-papier);text-decoration-color:var(--wa-teal-hell)}
.wa-footer a:hover{text-decoration-color:var(--wa-orange)}
.wa-footer .wa-logo{--wa-mark:#D7EBEC;--wa-mark-win:#0F4C5C;margin:0 0 16px}
.wa-footer .wa-logo-mark{width:40px;height:40px}
.wa-footer .wa-logo-word{font-size:15px}
.wa-footer-grid{display:grid;gap:32px}
.wa-footer-h{margin:0 0 8px;font-size:15px;font-weight:700;letter-spacing:.06em;color:var(--wa-teal-hell)}
.wa-footer-adresse,.wa-footer-tagline{margin:0 0 12px;font-size:15px;line-height:1.5}
.wa-footer li>a{display:inline-flex;align-items:center;min-height:48px}
.wa-footer-kantone{display:flex;flex-wrap:wrap;gap:8px}
.wa-footer-kantone li>a{justify-content:center;min-width:48px;padding:0 10px;border:2px solid var(--wa-teal-hell);border-radius:6px;font-weight:700;text-decoration:none}
.wa-footer-kantone li>a:hover{border-color:var(--wa-orange)}
.wa-footer-kantone .wa-schild-code{font-size:16px;letter-spacing:.04em}
.wa-footer-kantone .wa-schild-name{display:none}
.wa-footer .wa-lang{margin-top:16px}
.wa-footer .wa-lang a{color:var(--wa-papier)}
.wa-footer-legal{margin:32px 0 0;padding-top:16px;border-top:2px dashed var(--wa-teal);font-size:14px;color:var(--wa-teal-hell)}

/* ---- Sticky thumb bar (mobile) ------------------------------------------------- */
.wa-daumen{position:fixed;inset:auto 0 0 0;z-index:50;display:grid;grid-template-columns:2fr 1fr;gap:8px;height:calc(60px + env(safe-area-inset-bottom));padding:8px 12px env(safe-area-inset-bottom);background:var(--wa-weiss);border-top:2px solid var(--wa-petrol)}
.wa-daumen[hidden]{display:none}
.wa-daumen .wa-btn{min-height:52px;height:52px}
.wa-daumen .wa-btn--icon{width:auto;min-width:48px}

/* ==========================================================================
   ≥ 600px
   ========================================================================== */
@media(min-width:600px){
  .wa-container{padding:0 32px}
  .wa-btnrow>.wa-btn{flex:0 1 auto}
  .wa-typ-grid{gap:24px}
  .wa-schild-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .wa-upload-slots{grid-template-columns:repeat(5,minmax(0,1fr))}
  .wa-upload-slot--more{grid-column:auto;aspect-ratio:4/3;min-height:48px}
  .wa-form-footer{flex-direction:row;justify-content:space-between;align-items:center}
  .wa-form-footer .wa-btn--orange{width:auto;min-width:200px}
}

/* ==========================================================================
   ≥ 768px
   ========================================================================== */
@media(min-width:768px){
  body{padding-bottom:0}
  html{scroll-padding-top:88px}
  .wa-section{padding-bottom:96px}
  .wa-section--form{padding:96px 0;margin-bottom:96px}
  .wa-section--form.wa-section--first{padding-top:48px}
  .wa-section--first>.wa-container,.wa-section--intro>.wa-container{padding-top:48px}
  h1,.wa-h1,h1.wa-h2{font-size:44px}
  h2,.wa-h2{font-size:32px}
  .wa-h2>.wa-tick{margin-top:2px}
  .wa-lead{font-size:20px}
  .wa-etikett-body{padding:24px}
  .wa-etikett-band{font-size:13px}
  .wa-form-etikett{padding:24px}
  .wa-figure-big{font-size:56px}
  .wa-input,.wa-select,.wa-textarea{font-size:17px}
  .wa-split{grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;align-items:start}
  .wa-split--7-5>:first-child{grid-column:span 7}
  .wa-split--7-5>:last-child{grid-column:span 5}
  .wa-split--5-7>:first-child{grid-column:span 5}
  .wa-split--5-7>:last-child{grid-column:span 7}
  .wa-liste--2col{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 32px}
  .wa-intro{grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;align-items:center}
  .wa-intro-text{grid-column:span 7}
  .wa-intro-photo{grid-column:span 5}
  .wa-ablauf{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
  .wa-schritt{align-content:start}
  .wa-schritt-photo{display:block;grid-column:1/-1;margin-top:16px}
  .wa-field-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px}
  .wa-stepper{gap:24px}
  .wa-done-rows>summary{display:none}
  .wa-done-rows .wa-liste{padding:4px 0}
  .wa-kontakt{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
  .wa-note-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
  .wa-map a{pointer-events:auto}
  .wa-kanton-form{max-width:520px}
  .wa-topbar-in{height:72px;gap:12px}
  .wa-logo-mark{width:40px;height:40px}
  .wa-logo-word{font-size:14px}
  .wa-topbar-cta{display:block}
  .wa-footer{padding-bottom:48px}
  .wa-footer-grid{grid-template-columns:5fr 3fr 5fr 3fr;gap:24px}
  .wa-footer li>a{min-height:40px}
  .wa-footer-kantone{display:block;columns:2;column-gap:24px}
  .wa-footer-kantone li{break-inside:avoid}
  .wa-footer-kantone li>a{display:flex;justify-content:flex-start;gap:8px;min-width:0;padding:0;border:0;font-weight:400}
  .wa-footer-kantone .wa-schild-code{min-width:30px;font-size:15px}
  .wa-footer-kantone .wa-schild-name{display:inline;font-size:15px;color:var(--wa-papier)}
  .wa-daumen{display:none}
}

/* Touch devices: the map is a picture; the select and the Schild tiles are the controls. */
@media(hover:none){.wa-map a{pointer-events:none}}

/* ==========================================================================
   ≥ 900px
   ========================================================================== */
@media(min-width:900px){
  .wa-typ-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
  .wa-typ-grid>:nth-child(5){grid-column:auto}
  .wa-schild-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .wa-form-footer{padding:16px 0 8px}
}

/* ==========================================================================
   ≥ 1200px
   ========================================================================== */
@media(min-width:1200px){
  .wa-nav{display:block;margin:0 auto;min-width:0}
  .wa-nav-drawer{display:none}
  /* 1200–1359: inline nav + phone ICON; the full number needs the wider bar */
  .wa-topbar-phone,.wa-topbar-cta,.wa-topbar-tools{flex:none;white-space:nowrap}
  .wa-nav a{padding:0 8px;font-size:15px}
  .wa-topbar-in{gap:12px}
  .wa-logo-word{font-size:15px}
}
/* The container caps at its max width, so the full number never fits beside six
   nav items: the desktop bar keeps the phone icon; the number is in the intro,
   the Kontakt section, the footer and the mobile thumb bar. */
@media(min-width:1360px){
  .wa-nav a{padding:0 10px;font-size:16px}
  .wa-topbar-in{gap:16px}
}

/* ---- Print --------------------------------------------------------------- */
@media print{
  .wa-topbar,.wa-daumen,.wa-form-footer,.wa-nav-drawer{display:none}
  body{padding:0;background:#FFF}
}