/* Technische Modernisierung 2026: Inhalte und URLs unverändert */
:root{
  --page:#ffffff;
  --ink:#20242a;
  --muted:#5c6673;
  --line:#d9dee5;
  --nav:#eef2f6;
  --nav-hover:#dfe7f0;
  --accent:#244f86;
  --shadow:0 8px 28px rgba(20,35,55,.10);
}
html{font-size:16px;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  max-width:1120px;
  margin:0 auto !important;
  padding:clamp(10px,2vw,24px) !important;
  color:var(--ink);
  background-color:var(--page);
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.55;
  overflow-wrap:anywhere;
}
body>header,body>main,body>footer{width:100%}
main{font-size:clamp(1rem,.96rem + .2vw,1.12rem)}
h1,h2,h3,h4,h5,h6{line-height:1.25;text-wrap:balance}
h1{font-size:clamp(1.45rem,1.18rem + 1.35vw,2.25rem)}
h2{font-size:clamp(1.25rem,1.08rem + .85vw,1.8rem)}
h3{font-size:clamp(1.1rem,1rem + .5vw,1.45rem)}
p,li{max-width:78ch}
a{color:var(--accent);text-decoration-thickness:.08em;text-underline-offset:.15em}
a:hover{text-decoration-thickness:.14em}
a:focus-visible,button:focus-visible{outline:3px solid #8ab4f8;outline-offset:3px}
img{max-width:100%;height:auto}
iframe,video,embed,object{max-width:100%}
table{max-width:100%;border-collapse:collapse}
pre{white-space:pre-wrap}
hr{border:0;border-top:1px solid var(--line)}

/* Bestehende Hauptnavigation, nur lesbarer und fingerfreundlicher */
.topnav{
  display:flex;
  flex-wrap:wrap;
  align-items:stretch;
  gap:2px;
  overflow:visible !important;
  background:var(--nav) !important;
  border:1px solid var(--line);
  border-radius:10px;
  box-shadow:var(--shadow);
}
.topnav a,.topnav button,.dropbtn,.dropbtn1{
  min-height:44px;
  padding:10px 12px !important;
  border:0;
  border-radius:7px;
  color:#18212b !important;
  background:transparent;
  font:inherit;
  font-weight:700;
  line-height:1.25;
  cursor:pointer;
}
.topnav a:hover,.topnav button:hover,.dropdown:hover .dropbtn{background:var(--nav-hover) !important;color:#111 !important}
.dropdown{position:relative;overflow:visible !important}
.dropdown-content{
  min-width:min(330px,92vw) !important;
  max-height:min(70vh,620px);
  overflow:auto;
  padding:6px;
  background:#fff !important;
  border:1px solid var(--line);
  border-radius:9px;
  box-shadow:var(--shadow);
}
.dropdown-content a{min-height:40px;padding:9px 11px !important;border-radius:6px}
.topnav .icon{margin-left:auto;min-width:44px;display:none}

/* Der Ruhestandshinweis bleibt bewusst klein und zurückhaltend. */
.archive-notice,.retirement-notice,[data-archive-notice]{
  margin:.35rem auto .75rem !important;
  padding:0 !important;
  color:#244f86 !important;
  background:#fff !important;
  border:0 !important;
  font-size:.86rem !important;
  font-style:italic !important;
  font-weight:400 !important;
  text-align:center !important;
}

@media (max-width:760px){
  body{padding:10px !important;background-image:none !important}
  header,main,footer{max-width:100%}
  .topnav{display:block;border-radius:8px}
  .topnav>a:first-child{display:inline-flex !important;align-items:center}
  .topnav a:not(:first-child),.topnav .dropdown,.topnav .dropbtn{display:none}
  .topnav .icon{float:right;display:inline-flex !important;align-items:center;justify-content:center}
  .topnav.responsive{position:relative;display:block}
  .topnav.responsive .icon{position:absolute;right:4px;top:4px}
  .topnav.responsive a,.topnav.responsive .dropdown,.topnav.responsive .dropdown .dropbtn{display:block;width:100%;float:none;text-align:left}
  .topnav.responsive .dropdown-content{position:static;min-width:0 !important;width:100%;max-height:none;box-shadow:none;margin:0 0 4px}
  .dropdown:hover .dropdown-content,.dropdown:focus-within .dropdown-content{display:block}
  table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  td,th{min-width:0}
  [width]{max-width:100%}
  .box2{max-width:100% !important}
  .wrapper1,.wrapper2{width:100% !important;max-width:100% !important}
  .responsive-video iframe{left:0 !important;right:0 !important;width:100% !important}
  footer{font-size:.95rem !important;margin-left:0 !important}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}
@media print{body{max-width:none;padding:0 !important;background:none !important}.topnav{display:none !important}}


/* Feinschliff Version 5.3 */
@media (min-width:761px){
  body{max-width:1120px !important;margin-left:auto !important;margin-right:auto !important;}
  body > center, body > table, body > div, main, .wrapper1, .wrapper2{
    margin-left:auto !important;
    margin-right:auto !important;
  }
  table[align="center"]{margin-left:auto !important;margin-right:auto !important;}
}
.perfekte{
  display:block !important;
  width:100% !important;
  max-width:none !important;
  margin:.15rem auto .8rem !important;
  text-align:center !important;
  font-size:1rem !important;
  line-height:1.35 !important;
  color:#333 !important;
}
h1,h2,h3,.ueberschrift,.ueberschrift1{white-space:normal !important;overflow-wrap:normal !important;word-break:normal !important;text-align:center;}
iframe[src*="youtube"]{display:block;margin:1rem auto;max-width:100%;aspect-ratio:16/9;height:auto;border:0;}
.legal-responsibility{max-width:760px;margin:1rem auto 1.5rem;padding:1rem 1.2rem;border:1px solid #d9dee5;border-radius:8px;background:#fff;text-align:left;line-height:1.55;}
.legal-responsibility h1{font-size:1.45rem;margin:.1rem 0 .7rem;text-align:left;}

/* Startseite: Motto und aktuelle Zahnärzte */
header .start-motto{
  display:block !important;
  width:100% !important;
  margin:.55rem auto .2rem !important;
  text-align:center !important;
  font-size:2rem !important;
  line-height:1.2 !important;
  font-weight:700 !important;
  color:#222 !important;
}
header .start-dentists{
  display:block !important;
  width:100% !important;
  margin:.15rem auto .8rem !important;
  text-align:center !important;
  font-size:1.05rem !important;
  line-height:1.35 !important;
}
header .start-dentists a{font-weight:600;}
@media (max-width:760px){
  header .start-motto{font-size:1.65rem !important;}
}

/* Version 5.05: Bildkaesten auf Desktop sauber ausrichten */
@media (min-width:761px){
  .wrapper1{
    display:flex !important;
    flex-wrap:wrap !important;
    justify-content:center !important;
    align-items:flex-start !important;
    gap:14px !important;
    width:100% !important;
    max-width:1080px !important;
    margin:.65rem auto !important;
    text-align:center !important;
  }
  .wrapper1 > .box1,
  .wrapper1 > .Klicke_die_bilder{
    box-sizing:border-box !important;
    flex:0 1 250px !important;
    width:250px !important;
    min-width:0 !important;
    max-width:250px !important;
    margin:0 !important;
    text-align:center !important;
    vertical-align:top !important;
  }
  .wrapper1 > .box1 > a,
  .wrapper1 > .box1 > p,
  .wrapper1 > .Klicke_die_bilder > a,
  .wrapper1 > .Klicke_die_bilder > p{
    display:block !important;
    width:100% !important;
    margin:.25rem auto !important;
    text-align:center !important;
  }
  .wrapper1 > .box1 img{
    display:block !important;
    margin:0 auto .35rem !important;
  }
  .wrapper1 .clear{display:none !important;}
}

/* Version 5.06: einheitliche Zentrierung aller Inhaltsseiten */
body{
  text-align:center !important;
}
body > center,
body > main,
body > header,
body > footer,
body > section,
body > article,
body > div,
body > table{
  margin-left:auto !important;
  margin-right:auto !important;
}
main, article, section, .content, .inhalt, .seite, .container{
  width:100% !important;
  max-width:1000px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  text-align:center !important;
}
p, ul, ol, blockquote{
  margin-left:auto !important;
  margin-right:auto !important;
}
img, iframe, video, embed, object{
  display:block;
  margin-left:auto !important;
  margin-right:auto !important;
}
a > img{
  display:block;
  margin-left:auto !important;
  margin-right:auto !important;
}
center, td, th{
  text-align:center !important;
}
.wrapper1, .wrapper2,
.box1, .box2, .Klicke_die_bilder,
[class*="wrapper"], [class*="bilder"], [class*="bilderbox"]{
  box-sizing:border-box;
  margin-left:auto !important;
  margin-right:auto !important;
  text-align:center !important;
}
.wrapper1 > *, .wrapper2 > *{
  text-align:center !important;
}
.wrapper1 a, .wrapper2 a,
.box1 a, .box2 a, .Klicke_die_bilder a{
  text-align:center !important;
}

@media (min-width:761px){
  body{max-width:1180px !important;padding-left:28px !important;padding-right:28px !important;}
  p{max-width:900px !important;}
  table{margin-left:auto !important;margin-right:auto !important;}
  .wrapper1,.wrapper2{
    display:flex !important;
    flex-wrap:wrap !important;
    justify-content:center !important;
    align-items:flex-start !important;
    gap:18px !important;
    width:100% !important;
    max-width:1100px !important;
  }
  .wrapper1 > *, .wrapper2 > *{
    float:none !important;
    position:relative !important;
    left:auto !important;
    right:auto !important;
  }
}

@media (max-width:760px){
  body{width:auto !important;max-width:100% !important;padding:8px !important;}
  main,article,section,.content,.inhalt,.seite,.container{max-width:100% !important;}
  p,ul,ol,blockquote{max-width:100% !important;}
  .wrapper1,.wrapper2{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
  }
  .wrapper1 > *, .wrapper2 > *, .box1, .box2, .Klicke_die_bilder{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    margin:.8rem auto !important;
  }
  img{max-width:100% !important;height:auto !important;}
}

/* Version 5.07: gemeinsamer Ästhetikmodus für wiederkehrende Bildserien */
.gallery-row,
.wrapper2{
  width:100% !important;
  max-width:1000px !important;
  margin:1rem auto 1.25rem !important;
  text-align:center !important;
}

/* Viele historische Seiten enthalten alle Galeriebilder in einem einzigen Absatz. */
.wrapper2 > p,
.gallery-row > p{
  display:grid !important;
  grid-template-columns:repeat(auto-fit, minmax(165px, 190px)) !important;
  justify-content:center !important;
  align-items:start !important;
  gap:18px !important;
  width:100% !important;
  max-width:1000px !important;
  margin:0 auto !important;
  padding:0 !important;
  text-align:center !important;
}
.wrapper2 > p > a,
.gallery-row > p > a{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:center !important;
  width:100% !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  text-align:center !important;
}
.wrapper2 img.box2,
.wrapper2 > p > a > img,
.gallery-row img{
  display:block !important;
  width:auto !important;
  min-width:150px !important;
  max-width:190px !important;
  height:auto !important;
  max-height:none !important;
  margin:0 auto !important;
  object-fit:contain !important;
}

/* Zahn-Symbol im Hinweis bleibt neben beziehungsweise unter der Überschrift sinnvoll groß. */
h3 img.perfekte-zaehne{
  display:inline-block !important;
  width:54px !important;
  min-width:54px !important;
  height:auto !important;
  margin:.25rem .35rem -.8rem !important;
  vertical-align:middle !important;
}

/* Einzelne alte Bildleisten: Bild und Beschriftung als optische Karte behandeln. */
.wrapper1 > .box1,
.wrapper1 > .Klicke_die_bilder{
  padding:.35rem !important;
  border-radius:8px !important;
}
.wrapper1 > .box1 img,
.wrapper1 > .Klicke_die_bilder img{
  max-height:260px !important;
  object-fit:contain !important;
}

@media (min-width:761px){
  .wrapper2{
    display:block !important;
  }
  .wrapper2 > p{
    grid-template-columns:repeat(auto-fit, minmax(165px, 190px)) !important;
  }
}

@media (max-width:760px){
  .wrapper2{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
  }
  .wrapper2 > p,
  .gallery-row > p{
    display:grid !important;
    grid-template-columns:repeat(auto-fit, minmax(135px, 165px)) !important;
    gap:12px !important;
    width:100% !important;
    max-width:100% !important;
  }
  .wrapper2 > p > a,
  .gallery-row > p > a{
    width:100% !important;
    max-width:165px !important;
    margin:0 auto !important;
  }
  .wrapper2 img.box2,
  .wrapper2 > p > a > img,
  .gallery-row img{
    width:100% !important;
    min-width:0 !important;
    max-width:165px !important;
    height:auto !important;
  }
  h3 img.perfekte-zaehne{
    display:block !important;
    margin:.35rem auto 0 !important;
  }
}

@media (max-width:360px){
  .wrapper2 > p,
  .gallery-row > p{
    grid-template-columns:1fr !important;
  }
}


/* Version 5.08: kompakter Archivhinweis auf kleinen Displays */
.archive-notice{
  box-sizing:border-box !important;
  display:block !important;
  width:100% !important;
  max-width:1180px !important;
  margin:0 auto !important;
  padding:5px 12px !important;
  background:#fff !important;
  color:#315f8a !important;
  font:italic 12px/1.35 Arial,Helvetica,sans-serif !important;
  text-align:center !important;
  white-space:normal !important;
  overflow-wrap:normal !important;
  word-break:normal !important;
}
.archive-notice a{
  display:inline !important;
  width:auto !important;
  margin:0 !important;
  padding:0 !important;
  color:#315f8a !important;
  font:inherit !important;
  text-decoration:underline !important;
  white-space:nowrap !important;
}
.archive-notice-mobile{display:none !important;}
.archive-notice-desktop{display:inline !important;}

@media (max-width:760px){
  .archive-notice{
    width:100% !important;
    max-width:100% !important;
    min-height:0 !important;
    margin:0 auto 4px !important;
    padding:4px 6px 5px !important;
    font-size:11px !important;
    line-height:1.3 !important;
    letter-spacing:0 !important;
  }
  .archive-notice-desktop{display:none !important;}
  .archive-notice-mobile{
    display:block !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    text-align:center !important;
  }
  .archive-notice-mobile br{display:block !important;}
}


/* Version 5.09: ArcaNuova-Schnecke im Archivhinweis */
.archive-notice .arcanuova-snail-link{
  display:inline-flex !important;
  align-items:center !important;
  gap:5px !important;
  vertical-align:middle !important;
}
.archive-notice .arcanuova-snail{
  display:inline-block !important;
  width:28px !important;
  height:28px !important;
  max-width:none !important;
  margin:0 !important;
  border:0 !important;
  vertical-align:middle !important;
  animation:arcanuova-snail-spin 16s linear infinite;
}
@keyframes arcanuova-snail-spin{to{transform:rotate(360deg)}}
@media (max-width:760px){
  .archive-notice .arcanuova-snail-link{gap:3px !important;}
  .archive-notice .arcanuova-snail{width:24px !important;height:24px !important;}
}

/* Version 5.10: groessere ArcaNuova-Schnecke und kompaktere mobile Uebersichten */
.archive-notice .arcanuova-snail{
  width:56px !important;
  height:56px !important;
}

@media (max-width:760px){
  .archive-notice .arcanuova-snail{
    width:48px !important;
    height:48px !important;
  }

  /* Wiederkehrende Uebersichts-Bildkaesten auf Handys als kompaktes Raster. */
  .wrapper1{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    justify-content:center !important;
    align-items:start !important;
    gap:12px !important;
    width:100% !important;
    max-width:620px !important;
    margin:.65rem auto 1rem !important;
  }
  .wrapper1 > .box1,
  .wrapper1 > .Klicke_die_bilder,
  .wrapper1 > *{
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-start !important;
    align-items:center !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    margin:0 !important;
    padding:6px !important;
    box-sizing:border-box !important;
  }
  .wrapper1 > .box1 > a,
  .wrapper1 > .box1 > p,
  .wrapper1 > .Klicke_die_bilder > a,
  .wrapper1 > .Klicke_die_bilder > p{
    width:100% !important;
    max-width:100% !important;
    margin:.2rem auto !important;
    text-align:center !important;
  }
  .wrapper1 > .box1 img,
  .wrapper1 > .Klicke_die_bilder img{
    display:block !important;
    width:100% !important;
    max-width:220px !important;
    min-width:0 !important;
    height:auto !important;
    max-height:210px !important;
    margin:0 auto .3rem !important;
    object-fit:contain !important;
  }
  .wrapper1 .clear{display:none !important;}

  /* Alte Uebersichtsseiten enthalten teils grosse Leerabstaende in Absatzen. */
  .wrapper1 br:only-child,
  .wrapper2 br:only-child{display:none !important;}
}

@media (max-width:420px){
  .wrapper1{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:8px !important;
  }
  .wrapper1 > .box1,
  .wrapper1 > .Klicke_die_bilder,
  .wrapper1 > *{padding:4px !important;}
  .wrapper1 > .box1 img,
  .wrapper1 > .Klicke_die_bilder img{
    max-width:175px !important;
    max-height:175px !important;
  }
}

/* Version 5.12: stabile Mobilansicht ohne Ueberlagerungen; historische .htm-URLs bleiben erhalten */
@media (max-width:760px){
  /* Alte float-/position-Regeln duerfen auf kleinen Displays keinen Text ueberlagern. */
  body img:not(.arcanuova-snail),
  body a > img:not(.arcanuova-snail),
  body p img:not(.arcanuova-snail),
  body div img:not(.arcanuova-snail),
  body td img:not(.arcanuova-snail){
    float:none !important;
    position:static !important;
    inset:auto !important;
    left:auto !important;
    right:auto !important;
    top:auto !important;
    bottom:auto !important;
    transform:none !important;
    display:block !important;
    max-width:100% !important;
    height:auto !important;
    margin:.45rem auto !important;
  }

  /* Bildlinks bilden eine eigene Zeile, damit nachfolgender Text nicht daneben hochrutscht. */
  body a:has(> img){
    display:block !important;
    float:none !important;
    position:static !important;
    width:100% !important;
    max-width:100% !important;
    margin:.25rem auto !important;
    text-align:center !important;
    clear:both !important;
  }

  /* Historische Kontakt- und Informationsbereiche sauber untereinander. */
  body p,
  body div,
  body center,
  body section,
  body article,
  body address,
  body h1,
  body h2,
  body h3,
  body h4{
    float:none !important;
    position:static !important;
    left:auto !important;
    right:auto !important;
    clear:both !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }

  /* Einzelbilder ausserhalb echter Galerien bleiben lesbar gross. */
  body p > a:only-child > img,
  body center > a > img{
    width:auto !important;
    max-width:min(92vw,360px) !important;
  }

  /* Telefonnummern, Mailadressen und lange Links duerfen umbrechen, aber nicht herausragen. */
  body a{
    overflow-wrap:anywhere !important;
    word-break:normal !important;
  }
}


/* Version 5.13: kompakter Cookie-Hinweis auf Mobilgeraeten */
@media (max-width:760px){
  .cc-window.cc-floating,
  .cc-window.cc-banner,
  .cc-window.cc-bottom,
  .cc-window.cc-left,
  .cc-window.cc-right{
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    top:auto !important;
    width:100% !important;
    max-width:none !important;
    min-height:0 !important;
    padding:10px 12px !important;
    margin:0 !important;
    box-sizing:border-box !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:center !important;
    gap:10px !important;
    overflow:visible !important;
  }
  .cc-window .cc-message,
  .cc-window.cc-floating .cc-message,
  .cc-window.cc-banner .cc-message{
    flex:1 1 auto !important;
    margin:0 !important;
    padding:0 !important;
    font-size:14px !important;
    line-height:1.35 !important;
    text-align:center !important;
  }
  .cc-window .cc-link{
    display:inline !important;
    margin:0 0 0 6px !important;
    padding:0 !important;
    white-space:nowrap !important;
  }
  .cc-window .cc-compliance{
    flex:0 0 auto !important;
    display:flex !important;
    align-items:center !important;
    margin:0 !important;
  }
  .cc-window .cc-btn,
  .cc-window.cc-floating .cc-btn,
  .cc-window.cc-banner .cc-btn{
    display:block !important;
    width:auto !important;
    min-width:138px !important;
    max-width:none !important;
    padding:10px 14px !important;
    margin:0 !important;
    line-height:1.2 !important;
    white-space:nowrap !important;
    word-break:normal !important;
    overflow-wrap:normal !important;
  }
}

@media (max-width:390px){
  .cc-window.cc-floating,
  .cc-window.cc-banner{
    flex-direction:column !important;
    gap:8px !important;
  }
  .cc-window .cc-btn{
    min-width:160px !important;
  }
}

/* Version 5.14: zuverlässiges mobiles Hauptmenü */
@media (max-width:760px){
  .topnav .icon{
    position:relative;
    z-index:20;
    cursor:pointer;
    touch-action:manipulation;
  }
  .topnav.responsive{
    overflow:visible !important;
    min-height:52px;
    padding-top:52px;
  }
  .topnav.responsive .icon{
    display:inline-flex !important;
    position:absolute !important;
    top:4px;
    right:4px;
  }
  .topnav.responsive > .dropdown{
    display:block !important;
    width:100% !important;
    clear:both;
  }
  .topnav.responsive > .dropdown > .dropbtn,
  .topnav.responsive > .dropdown > .dropbtn1{
    display:block !important;
    width:100% !important;
    min-height:44px;
    text-align:left !important;
  }
}

/* Version 5.15: sichtbarer Home-Link im mobilen Hauptmenü */
.topnav > .home-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
}
@media (max-width:760px){
  .topnav{
    min-height:52px;
  }
  .topnav > .home-link{
    display:inline-flex !important;
    float:left;
    width:auto !important;
    min-height:44px;
    padding:10px 14px !important;
    text-align:left !important;
  }
  .topnav:not(.responsive) > a:not(.home-link){
    display:none !important;
  }
  .topnav.responsive > .home-link{
    display:flex !important;
    width:calc(100% - 56px) !important;
  }
}

/* Version 5.16: ArcaNuova-Schnecke dreht auch auf Mobilgeraeten */
@media (max-width: 768px) {
  .archive-notice-mobile .arcanuova-snail {
    display:inline-block !important;
    animation:arcanuova-snail-spin 16s linear infinite !important;
    -webkit-animation:arcanuova-snail-spin 16s linear infinite !important;
    transform-origin:50% 50% !important;
    will-change:transform;
  }
}
@media (max-width: 768px) and (prefers-reduced-motion: reduce) {
  .archive-notice-mobile .arcanuova-snail {
    animation:arcanuova-snail-spin 16s linear infinite !important;
    -webkit-animation:arcanuova-snail-spin 16s linear infinite !important;
  }
}


/* Version 5.17: sichtbar schnellere Schneckenanimation, besonders mobil */
@-webkit-keyframes arcanuova-snail-spin-fast {
  from { -webkit-transform:rotate(0deg) translateZ(0); transform:rotate(0deg) translateZ(0); }
  to   { -webkit-transform:rotate(360deg) translateZ(0); transform:rotate(360deg) translateZ(0); }
}
@keyframes arcanuova-snail-spin-fast {
  from { -webkit-transform:rotate(0deg) translateZ(0); transform:rotate(0deg) translateZ(0); }
  to   { -webkit-transform:rotate(360deg) translateZ(0); transform:rotate(360deg) translateZ(0); }
}
.archive-notice .arcanuova-snail {
  -webkit-animation:arcanuova-snail-spin-fast 4s linear infinite !important;
  animation:arcanuova-snail-spin-fast 4s linear infinite !important;
  -webkit-transform-origin:50% 50% !important;
  transform-origin:50% 50% !important;
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
}
@media (max-width:768px) {
  .archive-notice-mobile .arcanuova-snail {
    -webkit-animation:arcanuova-snail-spin-fast 4s linear infinite !important;
    animation:arcanuova-snail-spin-fast 4s linear infinite !important;
  }
}


/* Version 5.18: echte mobile Schneckenrotation; Desktop 25 Prozent langsamer */
.archive-notice-desktop .arcanuova-snail {
  -webkit-animation:arcanuova-snail-spin-fast 5s linear infinite !important;
  animation:arcanuova-snail-spin-fast 5s linear infinite !important;
}
@media (max-width:768px) {
  .archive-notice-mobile .arcanuova-snail {
    position:relative !important;
    display:inline-block !important;
    -webkit-animation-name:arcanuova-snail-spin-fast !important;
    animation-name:arcanuova-snail-spin-fast !important;
    -webkit-animation-duration:4s !important;
    animation-duration:4s !important;
    -webkit-animation-timing-function:linear !important;
    animation-timing-function:linear !important;
    -webkit-animation-iteration-count:infinite !important;
    animation-iteration-count:infinite !important;
    -webkit-transform-origin:50% 50% !important;
    transform-origin:50% 50% !important;
    will-change:transform !important;
  }
}
@media (max-width:768px) and (prefers-reduced-motion:reduce) {
  .archive-notice-mobile .arcanuova-snail {
    -webkit-animation-duration:4s !important;
    animation-duration:4s !important;
    -webkit-animation-iteration-count:infinite !important;
    animation-iteration-count:infinite !important;
  }
}


/* Version 5.19: Facebook erst nach bewusstem Klick; kein SDK beim Seitenstart */
.facebook-click-link {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:8px 14px;
  margin:8px auto;
  border:1px solid #315b9a;
  border-radius:6px;
  background:#fff;
  color:#244f8f !important;
  font-weight:700;
  text-decoration:none !important;
}
.facebook-click-link:hover, .facebook-click-link:focus {
  background:#eef4fb;
  text-decoration:underline !important;
}
@media (max-width:768px) {
  .facebook-click-link { min-height:44px; padding:10px 16px; }
}