/* Podologie Jena · behutsames Feintuning 2026 – Originalfarben und Kacheln bleiben erhalten */
:root { --podo-focus: #666545; }
html { scroll-padding-top: 112px; }
body { overflow-wrap: break-word; }
header { box-shadow: 0 5px 22px rgba(30,30,27,.035); }
header .nav { min-height: 88px; }
header .brand { min-width: 0; }
header .brand-title strong { font-size: clamp(12px,1.2vw,14px); }
header .desktop-links { gap: clamp(6px,1.3vw,16px); }
header .desktop-links a { transition: background-color .2s ease, color .2s ease; }
header .desktop-links a:not(.btn):hover { background:rgba(127,126,85,.10); }
header .btn-menu { cursor:pointer; }
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible { outline:3px solid var(--podo-focus);outline-offset:3px; }
#leistungen .list li, .topic-card, .feature, .card { transition:box-shadow .24s ease,border-color .24s ease,transform .24s ease; }
#leistungen .list li:hover { border-color:rgba(127,126,85,.4); }
.section-title { gap:16px; }
section[id] { scroll-margin-top: 112px; }
img { max-width:100%; }
@media (max-width: 1050px) {
 header .desktop-links { display:none !important; }
 header .nav { min-height:76px; }
}
@media (max-width: 680px) {
 .wrap { width:min(var(--max),calc(100% - 28px)); }
 header .nav { padding:10px 0;gap:8px; }
 header .brand { gap:8px; }
 header .brand .logo, header .brand .logo img { width:50px !important;height:50px !important; }
 header .brand-title span {font-size:11px;}
 header .btn-menu {padding:10px 12px;font-size:12px;}
 .hero {padding-top:20px;}
 .section-title {align-items:flex-start;flex-direction:column;}
}