.skip { position: absolute; inset-inline-start: var(--space-lg); top: -100px; background: var(--color-primary); color: var(--color-on-primary); padding: var(--space-sm) var(--space-lg); border-radius: var(--radius-sm); z-index: 10; }
.skip:focus { top: var(--space-sm); }

.site-header { border-bottom: var(--border-width) solid var(--color-outline-variant); background: var(--color-background); }
.site-header .wrap { display: flex; align-items: center; justify-content: space-between; gap: var(--space-lg); min-height: 64px; flex-wrap: wrap; }
.brand { display: inline-flex; align-items: center; gap: var(--space-sm); color: var(--color-on-surface); text-decoration: none; font-weight: 700; font-size: var(--title-large-size); }
.brand img { border-radius: 10px; }
.site-nav ul { display: flex; flex-wrap: wrap; gap: var(--space-xs) var(--space-lg); list-style: none; margin: 0; padding: 0; }
.site-nav a { display: inline-flex; align-items: center; min-height: var(--touch-target); color: var(--color-on-surface-variant); text-decoration: none; font-weight: 500; font-size: var(--label-large-size); }
.site-nav a:hover { color: var(--color-primary); }
@media (max-width: 599px) { .site-nav .optional { display: none; } }

.page-head { padding-block: 48px var(--space-xl); display: grid; gap: var(--space-md); }

.site-footer { border-top: var(--border-width) solid var(--color-outline-variant); background: var(--color-surface-container-low); padding-block: 40px; font-size: var(--body-medium-size); }
.site-footer .wrap { display: grid; gap: var(--space-xl); }
.footer-cols { display: grid; gap: var(--space-xl); grid-template-columns: repeat(auto-fit, minmax(min(160px, 100%), 1fr)); }
.footer-cols h2 { font-size: var(--title-small-size); line-height: var(--title-small-line); letter-spacing: 0; margin-bottom: var(--space-sm); }
.footer-cols ul { list-style: none; margin: 0; padding: 0; display: grid; }
.footer-cols a { display: inline-flex; align-items: center; min-height: var(--touch-target); color: var(--color-on-surface-variant); }
.company { color: var(--color-on-surface-variant); }
.lang-switcher { display: flex; flex-wrap: wrap; gap: 0 var(--space-lg); }
.lang-switcher a, .lang-switcher span { display: inline-flex; align-items: center; min-height: var(--touch-target); color: var(--color-on-surface-variant); }
.lang-switcher span { font-weight: 700; color: var(--color-on-surface); }