/* Shared accessibility and reflow rules; loaded after page styles. */
:root { --control-border: #8b7a60; }
[hidden] { display: none !important; }
html { scroll-padding-top: 7rem; }
body { overflow-wrap: break-word; }
main, form, fieldset, label { min-width: 0; }
input, select, textarea { max-width: 100%; }
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]):not([type=submit]):not([type=file]), textarea, select {
    border: 1.5px solid var(--control-border); border-radius: 6px;
    background: var(--surface, var(--card, #fffcf4)); color: var(--text, var(--ink, #2b2117));
    padding: .6rem .75rem; font: inherit; min-height: 44px;
}
input::placeholder, textarea::placeholder { color: #6e6149; opacity: 1; }
button, .btn, .solid-btn, .ghost-btn, summary { min-height: 44px; }
.btn, .solid-btn, .ghost-btn { white-space: normal; text-align: center; }
:focus-visible { outline: 3px solid #7a6339; outline-offset: 3px; }
.footer :focus-visible, .adm-side :focus-visible, .lightbox :focus-visible, .slideshow :focus-visible { outline-color: #e3c58c; }
.skip-link { position: fixed; top: .5rem; left: .5rem; z-index: 1000; padding: .65rem 1rem; background: #2b2117; color: #fff; transform: translateY(-200%); }
.skip-link:focus { transform: none; }
.site-header nav a, .site-header nav button, .footer a, .appointment-footer a { display: inline-flex; align-items: center; min-height: 44px; }
.site-header .brand { white-space: normal; font-size: clamp(1.25rem, 5vw, 1.7rem); }
.table-scroll { max-width: 100%; overflow-x: auto; margin-block: 1rem; }
.table-scroll .data-table { margin: 0; }
.chat-msg, .payment-box { overflow-wrap: anywhere; }
.fav-btn { width: 44px; height: 44px; background: #2b2117; color: #fff; }
.select-photo { position: absolute; inset: 0 0 auto; width: 100%; height: 140px; border: 0; border-radius: 8px; background: transparent; cursor: pointer; }
.select-mark { pointer-events: none; }
.photo-card.favorit .fav-btn { background: #8a5a51; border-color: #8a5a51; }
.portfolio-grid { grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr)); }
@media (max-width: 600px) {
    .site-header { position: static; }
    .chat-form { flex-wrap: wrap; }
    .chat-form textarea { flex-basis: 100%; min-width: 0; }
    .selection-bar { position: static; }
    .client-meta { min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto !important; }
    *, *::before, *::after { animation: none !important; transition: none !important; }
}