/* Tierschutz Saarland – „Tier gefunden“: Fragenkatalog */
.tg-main{background:var(--mist);padding:clamp(28px,4vw,56px) 0 clamp(80px,8vw,110px)}
.tg-wrap{max-width:1080px}

/* Fortschritt */
.tg-steps{list-style:none;margin:0 0 clamp(1.4rem,3vw,2.2rem);padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;counter-reset:s}
.tg-steps li{display:flex;align-items:center;gap:.55rem;padding:.55rem .7rem;border-radius:999px;background:#fff;box-shadow:0 0 0 1px var(--line) inset;
  font:800 .86rem/1.15 "Outfit",system-ui,sans-serif;color:var(--muted);transition:background-color .3s,color .3s,box-shadow .3s}
.tg-steps li span{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--mist);color:var(--ink-2);font-size:.85rem}
.tg-steps li.is-done{color:var(--ink-2)}
.tg-steps li.is-done span{background:var(--forest);color:#fff}
.tg-steps li.is-now{background:var(--ink);color:#fff;box-shadow:0 10px 24px -12px rgba(13,27,49,.7)}
.tg-steps li.is-now span{background:var(--sun);color:var(--ink)}
.tg-steps li.is-skip{opacity:.45}
@media (max-width:640px){.tg-steps li{justify-content:center;padding:.45rem}.tg-steps li{font-size:0;gap:0}.tg-steps li span{font-size:.85rem}}

/* Ansichten */
section.tg-view{padding:0}
.js .tg-view{display:none}
.js .tg-view.is-on{display:block;animation:tg-in .45s cubic-bezier(.22,1,.36,1)}
html:not(.js) .tg-view+.tg-view{margin-top:3rem}
@keyframes tg-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.tg-q{font-weight:800;font-size:clamp(1.7rem,3.6vw,2.6rem);line-height:1.08;margin:0 0 .6rem;outline:none}
.tg-sub{font-size:1.08rem;color:var(--ink-2);max-width:62ch;margin:0 0 1.4rem}

/* Kacheln */
.tg-grid{display:grid;gap:clamp(.7rem,1.6vw,1.1rem)}
.tg-grid--6{grid-template-columns:repeat(3,1fr)}
.tg-grid--4{grid-template-columns:repeat(4,1fr)}
.tg-grid--2{grid-template-columns:repeat(2,1fr)}
@media (max-width:991.98px){.tg-grid--4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:767.98px){.tg-grid--6{grid-template-columns:repeat(2,1fr)}.tg-grid--2{grid-template-columns:1fr}}
.tg-tile{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:.35rem;padding:1.3rem 1rem 1.1rem;border-radius:var(--r-l);
  background:#fff;color:var(--ink);text-decoration:none;box-shadow:0 0 0 2px var(--line) inset,var(--shadow);
  transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .2s,background-color .2s}
.tg-tile:hover,.tg-tile:focus-visible{transform:translateY(-4px);background:var(--cs);color:var(--ink);box-shadow:0 0 0 3px var(--c) inset,0 22px 40px -18px rgba(13,27,49,.45)}
.tg-tile:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.tg-ico{width:clamp(78px,10vw,108px);aspect-ratio:1;border-radius:50%;background:var(--cs);display:grid;place-items:center;box-shadow:0 0 0 4px #fff,0 0 0 6px var(--c);margin-bottom:.5rem;transition:transform .4s cubic-bezier(.34,1.56,.64,1)}
.tg-tile:hover .tg-ico{transform:rotate(-6deg) scale(1.06)}
.tg-ico svg{width:68%;height:68%;filter:drop-shadow(0 3px 3px rgba(13,27,49,.15))}
.tg-tile b{font:800 clamp(1.1rem,1.8vw,1.35rem)/1.15 "Outfit",system-ui,sans-serif}
.tg-tile small{color:var(--ink-2);font-size:.9rem;line-height:1.35}
.tg-go{margin-top:auto;padding-top:.5rem;display:inline-flex;align-items:center;gap:.3rem;font-weight:800;font-size:.85rem;color:var(--c)}
.tg-tile.is-wild::after{content:"extern";position:absolute;top:.8rem;right:.9rem;font:800 .66rem/1 "Outfit",system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;
  padding:.3rem .5rem;border-radius:999px;background:var(--cs);color:var(--c)}
.tg-tile.is-pet{box-shadow:0 0 0 3px var(--c) inset,var(--shadow)}

.tg-note{display:flex;gap:.6rem;align-items:flex-start;margin:1.6rem 0 0;padding:.9rem 1.1rem;border-radius:var(--r-m);background:#fff;box-shadow:0 0 0 1px var(--line) inset;color:var(--ink-2)}
.tg-note .tr-icon{color:var(--slate);margin-top:.15em}
.tg-back{display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;margin:1.6rem 0 0}
.tg-back a{display:inline-flex;align-items:center;gap:.4rem;font-weight:800;color:var(--ink-2);text-decoration:none}
.tg-back a:hover{color:var(--ink);text-decoration:underline}

/* Schritt 3 */
.tg-signs{list-style:none;margin:0 0 1.5rem;padding:1rem 1.2rem;border-radius:var(--r-m);background:#fff;box-shadow:0 0 0 1px var(--line) inset;
  display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem 1.4rem}
.tg-signs li{position:relative;padding-left:1.5rem;line-height:1.4}
.tg-signs li::before{content:"";position:absolute;left:0;top:.42em;width:.7rem;height:.7rem;border-radius:50%;background:var(--alarm);box-shadow:0 0 0 3px var(--alarm-soft)}
@media (max-width:640px){.tg-signs{grid-template-columns:1fr}}
.tg-choice{display:flex;align-items:center;gap:1rem;padding:1.3rem 1.3rem;border-radius:var(--r-l);text-decoration:none;color:#fff;
  transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .2s,filter .2s}
.tg-choice:hover,.tg-choice:focus-visible{transform:translateY(-4px);color:#fff;filter:brightness(1.05)}
.tg-choice:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.tg-choice.is-hurt{background:linear-gradient(135deg,#ff5a52,var(--alarm) 45%,var(--alarm-deep));box-shadow:0 20px 40px -18px rgba(220,47,43,.85)}
.tg-choice.is-ok{background:linear-gradient(135deg,#2f9e5f,var(--forest) 50%,var(--forest-deep));box-shadow:0 20px 40px -18px rgba(35,122,75,.8)}
.tg-choice-ico{flex:none;width:58px;height:58px;border-radius:18px;background:#fff;display:grid;place-items:center}
.tg-choice.is-hurt .tg-choice-ico{color:var(--alarm)}
.tg-choice.is-ok .tg-choice-ico{color:var(--forest)}
.tg-choice-ico .tr-icon{width:30px;height:30px}
.tg-choice.is-hurt .tg-choice-ico .tr-icon{fill:currentColor;stroke:none}
.tg-choice b{display:block;font:800 clamp(1.2rem,2vw,1.5rem)/1.15 "Outfit",system-ui,sans-serif}
.tg-choice small{display:block;margin-top:.2rem;font-size:.92rem;opacity:.92;line-height:1.35}
.tg-arrow{margin-left:auto;width:1.6em;height:1.6em;flex:none}

/* Ergebnisse */
.tg-result{border-radius:var(--r-l);overflow:hidden;background:#fff;box-shadow:0 30px 70px -30px rgba(13,27,49,.55)}
.tg-result>header{display:flex;gap:1rem;align-items:center;padding:clamp(1.2rem,3vw,1.8rem);color:#fff}
.tg-result.is-hurt>header{background:radial-gradient(120% 140% at 0 0,#ff5a52 0,var(--alarm) 45%,#a81c1a 100%)}
.tg-result.is-ok>header{background:radial-gradient(120% 140% at 0 0,#3b4f72 0,var(--ink) 60%)}
.tg-result-ico{position:relative;flex:none;width:72px;height:72px;border-radius:22px;background:#fff;display:grid;place-items:center;box-shadow:0 10px 24px -10px rgba(0,0,0,.55)}
.tg-result.is-hurt .tg-result-ico{color:var(--alarm)}
.tg-result.is-hurt .tg-result-ico .tr-icon{fill:currentColor;stroke:none}
.tg-result.is-hurt .tg-result-ico::after{content:"";position:absolute;inset:-6px;border-radius:26px;border:2px solid rgba(255,255,255,.7);animation:tg-ring 2s ease-out infinite}
@keyframes tg-ring{0%{opacity:.85;transform:scale(1)}100%{opacity:0;transform:scale(1.3)}}
.tg-result.is-ok .tg-result-ico{color:var(--sun-deep)}
.tg-result-ico .tr-icon{width:40px;height:40px}
.tg-kick{margin:0 0 .3rem;display:flex;align-items:center;gap:.45rem;font:800 .8rem/1 "Outfit",system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;opacity:.9}
.tg-kick .tr-dot{background:#fff}
.tg-result h2{margin:0;font-weight:800;font-size:clamp(1.6rem,3.4vw,2.5rem);line-height:1.06;color:#fff;outline:none}
.tg-result-body{padding:clamp(1.2rem,3vw,1.8rem)}
.tg-lead{font-size:1.1rem;color:var(--ink-2);margin:0 0 1.2rem;max-width:62ch}
.tg-lead b{color:var(--alarm-deep)}

.tg-nd{border-radius:var(--r-m);background:var(--alarm-soft);padding:.9rem;margin-bottom:1rem}
.tg-nd-h{margin:0 0 .6rem;padding:0 .3rem;font-size:.95rem;color:var(--ink-2)}
.tg-nd-h b{font:800 1.15rem "Outfit",system-ui,sans-serif;color:var(--alarm-deep);margin-right:.4rem}
.tg-nd-list{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
.tg-nd-list li{display:flex;align-items:center;gap:.8rem;padding:.7rem .8rem;border-radius:var(--r-s);background:#fff;border-left:5px solid var(--alarm)}
.tg-nd-list .txt{flex:1;min-width:0;line-height:1.25}
.tg-nd-list .txt b{display:block;font:800 1.05rem/1.2 "Outfit",system-ui,sans-serif;overflow-wrap:anywhere}
.tg-nd-list .txt small{color:var(--muted);font-size:.85rem}
.tg-nd-list .act{display:flex;gap:.35rem;flex:none}
.tg-nd-list .act a{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;height:44px;padding:0 1rem;border-radius:999px;text-decoration:none;font-weight:800;white-space:nowrap}
.tg-nd-list .act .call{background:var(--alarm);color:#fff}
.tg-nd-list .act .call:hover{background:var(--alarm-deep)}
.tg-nd-list .act .route{width:44px;padding:0;background:#fff;color:var(--ink);box-shadow:0 0 0 1px var(--line) inset}
.tg-nd-list li.tg-nd-empty{display:block;border-left-color:var(--sun);color:var(--ink-2)}
.tg-nd-list li.tg-nd-empty b{display:block;color:var(--ink)}
@media (max-width:480px){.tg-nd-list .act .call span{display:none}.tg-nd-list .act .call{width:44px;padding:0}}

.tg-calls{display:grid;grid-template-columns:1.2fr 1fr;gap:.6rem}
@media (max-width:640px){.tg-calls{grid-template-columns:1fr}}
.tg-call{display:flex;align-items:center;gap:.8rem;padding:.9rem 1.1rem;border-radius:var(--r-m);text-decoration:none;color:var(--ink);background:#fff;box-shadow:0 0 0 2px var(--alarm-soft) inset;
  font:800 1.3rem/1.15 "Outfit",system-ui,sans-serif}
.tg-call:hover{background:var(--alarm-soft);color:var(--ink)}
.tg-call .tr-icon{width:1.3em;height:1.3em;color:var(--alarm)}
.tg-call small{display:block;font:700 .78rem/1.2 "Manrope",system-ui,sans-serif;color:var(--muted)}
.tg-call.is-main{background:var(--alarm);color:#fff;box-shadow:0 14px 30px -12px rgba(220,47,43,.9);font-size:1.55rem}
.tg-call.is-main:hover{background:var(--alarm-deep);color:#fff}
.tg-call.is-main .tr-icon{color:#fff}
.tg-call.is-main small{color:#ffe1dd}

.tg-tips{margin-top:1.6rem;padding:1.2rem 1.3rem;border-radius:var(--r-m);background:var(--mist)}
.tg-tips h3{font-weight:800;font-size:1.25rem;margin:0 0 .8rem}
.tg-tips ul{list-style:none;margin:0;padding:0;display:grid;gap:.6rem;counter-reset:t}
.tg-tips li{position:relative;padding-left:2.4rem;line-height:1.45;counter-increment:t}
.tg-tips li::before{content:counter(t);position:absolute;left:0;top:-.05em;width:1.7rem;height:1.7rem;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font:800 .82rem "Outfit",system-ui,sans-serif}
.tg-result.is-hurt .tg-tips li::before{background:var(--alarm)}
.tg-alt{margin:1.3rem 0 0;color:var(--ink-2)}
.tg-alt a{font-weight:800}
.tg-verm{display:flex;align-items:center;gap:.9rem;margin-top:1rem;padding:1rem 1.1rem;border-radius:var(--r-m);background:var(--river-soft);color:var(--ink);text-decoration:none;line-height:1.35}
.tg-verm:hover{background:#d4e9f7;color:var(--ink)}
.tg-verm>.tr-icon{width:1.5em;height:1.5em;color:var(--river);flex:none}
.tg-verm span{flex:1}
.tg-verm b{display:block;font:800 1.08rem "Outfit",system-ui,sans-serif}

/* Weiterleitung */
.tg-redirect{position:fixed;inset:0;z-index:1300;display:grid;place-items:center;padding:16px;background:rgba(13,27,49,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.tg-redirect[hidden]{display:none}
.tg-redirect-box{max-width:26rem;text-align:center;background:#fff;border-radius:var(--r-l);padding:1.8rem 1.5rem;box-shadow:0 30px 70px -20px rgba(0,0,0,.6);border-top:8px solid var(--forest)}
.tg-redirect-box p{font-size:1.1rem;margin:.9rem 0 .7rem}
.tg-redirect-box a{font-weight:800}
.tg-spin{display:inline-block;width:46px;height:46px;border-radius:50%;border:5px solid var(--forest-soft);border-top-color:var(--forest);animation:tg-spin .8s linear infinite}
@keyframes tg-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.js .tg-view.is-on,.tg-spin,.tg-result.is-hurt .tg-result-ico::after{animation:none}.tg-tile,.tg-choice{transition:none}}