:root {
--location-page-inline: clamp(0.75rem, 2.1vw, 1.625rem);
--location-content-max: 93.75rem;
--location-section-inline: clamp(0.75rem, 2.2vw, 1.375rem);
--location-section-block: clamp(1.5rem, 4dvh, 2.75rem);
--location-card-gap: clamp(0.4rem, 0.9vw, 0.9rem);
--location-control-height: clamp(2.625rem, 4.4dvh, 3.625rem);
}
html,
body {
min-height: 100%;
}
body {
min-height: 100vh;
min-height: 100dvh;
}
.page-shell {
min-height: 100vh;
min-height: 100dvh;
display: flex;
flex-direction: column;
container-type: inline-size;
container-name: location-page;
}
.placeholder-location-shell {
container-type: inline-size;
container-name: location-page;
}
.header,
.main-content,
.toros-info-section,
.service-section,
.party-section,
.social-section,
.contact-section,
.route-section {
flex: 0 0 auto;
}
.site-footer {
margin-top: auto;
}
.header-top {
width: min(91.25rem, calc(100% - (2 * var(--location-page-inline))));
max-width: none;
margin-inline: auto;
padding: clamp(0.45rem, 1.15dvh, 0.75rem) 0 clamp(0.6rem, 1.4dvh, 0.9rem);
grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
gap: clamp(0.75rem, 2vw, 1.75rem);
}
.logo-wrap {
min-height: clamp(7.5rem, 21dvh, 14.5rem);
}
.logo {
width: clamp(9rem, min(28vw, 25dvh), 21rem);
max-width: none;
max-height: none;
}
.location-switcher {
gap: clamp(0.25rem, 0.7dvh, 0.5625rem);
}
.location-switcher-link {
font-size: clamp(0.78rem, 0.72rem + 0.18vw, 0.94rem);
}
.location-switcher-link.is-current {
font-size: clamp(1.25rem, 1rem + 1.05vw, 2rem);
}
.location-switcher-back {
font-size: clamp(0.68rem, 0.64rem + 0.12vw, 0.75rem);
}
.location-switcher-call {
gap: clamp(0.35rem, 0.7vw, 0.65rem);
}
.location-switcher-phone {
font-size: 0.78em;
}
.header-action-row,
.status-bar {
width: min(91.25rem, calc(100% - (2 * var(--location-page-inline))));
max-width: none;
margin-inline: auto;
}
.header-action-row {
margin-block: clamp(0.5rem, 1.4dvh, 0.9rem) clamp(0.75rem, 2dvh, 1.375rem);
gap: clamp(0.5rem, 1.2vw, 1rem);
}
.header-action-row .header-media-buttons {
width: auto;
margin: 0;
gap: clamp(0.45rem, 0.9vw, 0.75rem);
}
.header-action-row .header-media-button {
min-width: clamp(8rem, 10vw, 9.25rem);
min-height: var(--location-control-height);
padding: 0.35rem 0.65rem 0.35rem 0.45rem;
grid-template-columns: 1.85rem minmax(0, 1fr) 1rem;
column-gap: 0.5rem;
}
.header-action-row .header-media-icon {
width: 1.85rem;
height: 1.85rem;
}
.header-allergen-button {
min-height: var(--location-control-height);
}
.status-bar {
margin-bottom: clamp(0.45rem, 1.3dvh, 0.8rem);
padding: clamp(0.45rem, 1.1dvh, 0.7rem) clamp(0.65rem, 1.4vw, 1.125rem);
gap: clamp(0.45rem, 1vw, 0.9rem);
font-size: clamp(0.76rem, 0.72rem + 0.18vw, 0.86rem);
}
.main-content {
width: min(100%, var(--location-content-max));
padding: clamp(0.9rem, 2.2dvh, 1.6rem) var(--location-page-inline) clamp(2rem, 5dvh, 3rem);
}
.menu-container {
container-type: inline-size;
container-name: menu;
}
.menu-category {
container-type: inline-size;
container-name: menu-category;
margin-bottom: clamp(0.35rem, 0.8dvh, 0.7rem);
}
.category-toggle {
min-height: var(--location-control-height);
padding: clamp(0.45rem, 0.9dvh, 0.65rem) clamp(0.7rem, 1.3vw, 1rem);
gap: clamp(0.45rem, 1vw, 0.95rem);
}
.category-toggle-title {
font-size: clamp(1.05rem, 0.98rem + 0.35vw, 1.35rem);
}
.category-content {
padding: clamp(0.35rem, 0.75vw, 0.6rem);
}
.product-grid {
grid-template-columns: repeat(auto-fit, minmax(min(100%, 21rem), 1fr));
gap: clamp(0.3rem, 0.6vw, 0.55rem);
}
.product {
container-type: inline-size;
container-name: product-card;
}
.product-summary {
min-height: clamp(2.75rem, 4.2dvh, 3.1rem);
height: auto;
padding: clamp(0.35rem, 0.75dvh, 0.5rem) clamp(0.35rem, 0.65vw, 0.55rem);
gap: clamp(0.3rem, 0.55vw, 0.5rem);
}
.product-name {
line-height: 1.2;
white-space: normal;
overflow: visible;
text-overflow: clip;
overflow-wrap: anywhere;
font-size: clamp(0.84rem, 0.78rem + 0.22vw, 0.98rem);
}
.menu-number {
min-width: 1.8rem;
height: 1.8rem;
padding-inline: 0.3rem;
font-size: clamp(0.78rem, 0.73rem + 0.16vw, 0.9rem);
}
.summary-price {
font-size: clamp(0.82rem, 0.78rem + 0.16vw, 0.92rem);
}
@container product-card (max-width: 22rem) {
.product-summary {
grid-template-columns: auto minmax(0, 1fr) auto auto;
gap: 0.35rem;
}
.product-name {
font-size: 0.88rem;
}
.product-details-inner {
padding: 0.7rem;
gap: 0.65rem;
}
.product-details-body {
grid-template-columns: minmax(6rem, 1.05fr) minmax(7rem, 0.95fr);
gap: 0.55rem;
}
.variant-name {
font-size: 0.76rem;
}
.price {
font-size: 0.88rem;
}
.allergens {
font-size: 0.66rem;
}
}
@container product-card (max-width: 17rem) {
.product-details-body {
grid-template-columns: 1fr;
}
.product-image-button {
width: min(100%, 12rem);
max-width: 12rem;
justify-self: center;
}
}
.toros-info-section,
.service-section,
.party-section,
.social-section,
.contact-section,
.route-section {
padding-block: var(--location-section-block);
padding-inline: var(--location-section-inline);
}
.toros-info-grid {
grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
gap: var(--location-card-gap);
}
.service-grid {
grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
gap: var(--location-card-gap);
}
.party-grid {
grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
gap: var(--location-card-gap);
}
.contact-inner {
grid-template-columns: repeat(auto-fit, minmax(min(100%, 24rem), 1fr));
gap: clamp(0.75rem, 2vw, 1.6rem);
}
.info-card,
.party-card,
.contact-box {
padding: clamp(0.85rem, 1.7vw, 1.4rem);
}
.section-heading {
gap: clamp(0.55rem, 1.2vw, 1rem);
margin-bottom: clamp(1rem, 2.5dvh, 1.6rem);
}
.party-intro {
margin-bottom: clamp(1rem, 2.7dvh, 1.75rem);
}
.route-card {
grid-template-columns: auto minmax(0, 1fr) auto;
gap: clamp(0.75rem, 1.6vw, 1.4rem);
}
.dish-hover-preview {
width: min(26.25rem, calc(100vw - 1.5rem));
max-height: calc(100dvh - 1.5rem);
}
.dish-hover-preview img {
max-height: calc(100dvh - 2.25rem);
}
.dish-image-lightbox-frame {
width: min(92vw, 51.25rem);
max-height: 88dvh;
}
.dish-image-lightbox-image {
max-height: calc(88dvh - 0.9rem);
}
.legend-modal {
max-height: min(86dvh, 48rem);
}
@container location-page (max-width: 56.25rem) {
.route-card {
grid-template-columns: auto minmax(0, 1fr);
}
.route-action {
grid-column: 1 / -1;
}
.route-button {
width: 100%;
}
.social-card {
grid-template-columns: auto minmax(0, 1fr);
}
.facebook-button {
grid-column: 1 / -1;
width: 100%;
}
.party-contact {
flex-direction: column;
align-items: flex-start;
}
}
@media (max-width: 43.75em) {
body {
background-attachment: scroll, scroll;
background-size: auto, auto 100dvh;
}
}
@container location-page (max-width: 43.75rem) {
.header-top,
.placeholder-header {
width: calc(100% - 1rem);
grid-template-columns: minmax(0, 1fr) minmax(7.25rem, 9rem);
gap: clamp(0.4rem, 2vw, 0.65rem);
padding: clamp(0.35rem, 1dvh, 0.55rem) 0 clamp(0.4rem, 1.1dvh, 0.6rem);
text-align: left;
}
.header-balance,
.header-info-right.header-balance,
.placeholder-header-phone.header-balance {
display: none;
}
.logo-wrap,
.placeholder-brand {
min-height: clamp(5.35rem, 14dvh, 6.5rem);
justify-self: end;
}
.logo {
width: clamp(7rem, 30vw, 9rem);
}
.location-switcher {
width: 100%;
min-width: 0;
gap: clamp(0.25rem, 0.9dvh, 0.45rem);
}
.location-switcher-link {
font-size: clamp(0.7rem, 2.1vw, 0.78rem);
letter-spacing: 0.015em;
}
.location-switcher-link.is-current {
font-size: clamp(0.95rem, 3vw, 1.05rem);
letter-spacing: 0.015em;
}
.location-switcher-call {
gap: 0.4rem;
}
.location-switcher-phone {
font-size: 0.74em;
letter-spacing: 0;
}
.location-switcher-back {
margin-top: 0.05rem;
font-size: clamp(0.62rem, 1.9vw, 0.7rem);
}
.header-action-row {
width: calc(100% - 1rem);
margin-block: 0.45rem 0.8rem;
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0.38rem;
}
.header-action-row .header-media-buttons {
display: contents;
}
.header-action-row .header-media-button,
.header-action-row .header-allergen-button {
width: 100%;
min-width: 0;
min-height: 2.55rem;
margin: 0;
}
.header-action-row .header-media-button {
display: flex;
align-items: center;
justify-content: center;
gap: 0.34rem;
padding: 0.30rem 0.34rem;
font-size: clamp(0.76rem, 2.35vw, 0.90rem);
text-align: center;
}
.header-action-row .header-media-icon {
width: 1.38rem;
height: 1.38rem;
font-size: 0.76rem;
flex: 0 0 auto;
}
.header-action-row .header-media-label {
white-space: nowrap;
overflow: visible;
text-overflow: clip;
text-align: center;
}
.header-action-row .header-allergen-button {
padding: 0.38rem 0.42rem;
font-size: clamp(0.70rem, 2.15vw, 0.79rem);
white-space: normal;
line-height: 1.15;
}
.status-bar {
width: calc(100% - 1rem);
margin-bottom: 0.45rem;
padding: 0.5rem 0.6rem;
flex-direction: column;
gap: 0.35rem;
font-size: clamp(0.74rem, 2.2vw, 0.8rem);
}
.status-divider {
width: 65%;
height: 1px;
}
.status-item {
justify-content: center;
text-align: center;
}
.main-content {
padding: 0.9rem 0.5rem 2rem;
}
.category-count {
display: none;
}
.section-heading > span {
max-width: 4rem;
}
.section-heading h2 {
font-size: clamp(1rem, 4.5vw, 1.3rem);
}
.party-contact-buttons {
width: 100%;
flex-direction: column;
}
.party-button {
width: 100%;
}
.contact-line {
grid-template-columns: 1fr;
gap: 0.15rem;
margin-bottom: 0.75rem;
}
.opening-row,
.special-hours-row {
gap: 0.65rem;
}
.legend-overlay {
align-items: flex-end;
padding: 0.625rem;
}
.legend-modal {
width: 100%;
max-height: 86dvh;
border-radius: 0.75rem 0.75rem 0.5rem 0.5rem;
}
.legend-modal-header {
padding: 0.85rem 0.85rem 0.7rem;
}
.legend-modal-tabs {
padding: 0.75rem 0.85rem 0;
}
.legend-modal-content {
padding: 0.85rem;
}
.legend-entry {
grid-template-columns: 2.4rem minmax(0, 1fr);
gap: 0.5rem;
padding: 0.55rem;
}
}
@media (max-width: 56.25em) {
body.standort-gelenau,
body.standort-auerbach,
body.standort-trattoria,
body.standort-trattoria.placeholder-location-page {
background-attachment: scroll;
}
}
@container location-page (max-width: 24.375rem) {
.header-top,
.placeholder-header {
width: calc(100% - 0.75rem);
grid-template-columns: minmax(0, 1fr) minmax(6.75rem, 8rem);
gap: 0.35rem;
}
.logo-wrap {
min-height: 5.25rem;
}
.logo {
width: clamp(6.6rem, 33vw, 8rem);
}
.location-switcher-link {
font-size: 0.69rem;
}
.location-switcher-link.is-current {
font-size: 0.94rem;
}
.location-switcher-phone {
font-size: 0.7em;
}
.header-action-row {
width: calc(100% - 0.75rem);
gap: 0.38rem;
}
.header-action-row .header-media-button {
min-height: 2.55rem;
grid-template-columns: 1.6rem minmax(0, 1fr) 0.75rem;
column-gap: 0.3rem;
padding: 0.3rem 0.35rem;
font-size: 0.74rem;
}
.header-action-row .header-media-icon {
width: 1.6rem;
height: 1.6rem;
font-size: 0.8rem;
}
.header-action-row .header-allergen-button {
min-height: 2.55rem;
padding: 0.35rem;
font-size: 0.7rem;
}
.legend-entry {
grid-template-columns: 2rem minmax(0, 1fr);
}
}
@supports not (container-type: inline-size) {
@media (max-width: 40.625em) {
.product-grid {
grid-template-columns: 1fr;
}
}
@media (min-width: 40.6875em) and (max-width: 56.25em) {
.product-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
}
.location-switcher-link,
.location-switcher-back {
min-height: 1.5rem;
display: inline-flex;
align-items: center;
box-sizing: border-box;
}
.location-switcher-call {
min-width: 0;
}
@container location-page (max-width: 43.75rem) {
.header-action-row .header-allergen-button {
grid-column: 1 / -1;
justify-self: stretch;
width: 100%;
}
}
@container location-page (max-width: 43.75rem) {
.header-action-row .header-media-buttons {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.header-action-row .header-media-button--wide {
grid-column: 1 / -1;
}
}
@media (orientation: landscape) and (max-height: 30rem) and (max-width: 64rem) {
.header-top,
.placeholder-header {
width: calc(100% - 0.75rem);
grid-template-columns: minmax(0, 1fr) auto;
gap: 0.45rem;
padding-block: 0.18rem 0.25rem;
}
.header-balance,
.header-info-right.header-balance,
.placeholder-header-phone.header-balance {
display: none;
}
.logo-wrap,
.placeholder-brand {
min-height: 3.75rem;
justify-self: end;
}
.logo,
.placeholder-logo {
width: clamp(4.25rem, 17dvh, 5.75rem);
max-width: none;
max-height: none;
}
.location-switcher {
gap: 0.08rem;
line-height: 1;
}
.location-switcher-link,
.location-switcher-back {
min-height: 1.2rem;
padding-block: 0;
}
.location-switcher-link {
font-size: 0.66rem;
}
.location-switcher-link.is-current {
font-size: 0.82rem;
}
.location-switcher-call {
gap: 0.3rem;
}
.location-switcher-phone {
font-size: 0.68em;
}
.location-switcher-back {
margin-top: 0;
font-size: 0.6rem;
}
.header-action-row {
width: calc(100% - 0.75rem);
margin-block: 0.18rem 0.3rem;
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 0.25rem;
}
.header-action-row .header-media-buttons {
display: contents;
}
.header-action-row .header-media-button,
.header-action-row .header-allergen-button {
grid-column: auto;
width: 100%;
min-width: 0;
min-height: 2rem;
margin: 0;
padding: 0.22rem 0.3rem;
font-size: clamp(0.59rem, 1.65vw, 0.68rem);
line-height: 1.05;
white-space: normal;
text-align: center;
}
.header-action-row .header-media-button {
display: flex;
align-items: center;
justify-content: center;
gap: 0.3rem;
}
.header-action-row .header-media-icon {
display: inline-flex;
width: 1.05rem;
height: 1.05rem;
font-size: 0.64rem;
}
.header-action-row .header-media-arrow {
display: none;
}
.status-bar {
width: calc(100% - 0.75rem);
margin-bottom: 0.2rem;
padding: 0.25rem 0.45rem;
flex-direction: row;
justify-content: center;
gap: 0.45rem;
font-size: clamp(0.62rem, 1.7vw, 0.7rem);
line-height: 1.05;
}
.status-divider {
width: 1px;
height: 1rem;
flex: 0 0 1px;
}
.status-item {
min-width: 0;
justify-content: center;
text-align: center;
}
.main-content {
padding-top: 0.45rem;
}
}
.placeholder-location-shell {
min-height: 100vh;
min-height: 100dvh;
display: flex;
flex-direction: column;
}
.placeholder-location-shell .site-footer {
margin-top: auto;
}
@container location-page (max-width: 23.4375rem) {
.placeholder-main {
width: calc(100% - 1rem);
margin: clamp(1rem, 4dvh, 2rem) auto;
padding: clamp(1rem, 5vw, 1.5rem);
}
.placeholder-main h1 {
font-size: clamp(1.8rem, 10vw, 2.5rem);
}
.placeholder-main p {
line-height: 1.5;
}
.placeholder-nav {
margin: 1.4rem 0;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.45rem;
}
.placeholder-nav div {
min-width: 0;
padding: 0.65rem 0.35rem;
overflow-wrap: anywhere;
font-size: 0.78rem;
}
.placeholder-button {
max-width: 100%;
padding: 0.7rem 1rem;
box-sizing: border-box;
}
}
@container location-page (max-width: 18.75rem) {
.location-switcher-call {
flex-wrap: wrap;
white-space: normal;
row-gap: 0.1rem;
}
.location-switcher-phone {
flex-basis: 100%;
}
}
.header-top {
width: min(91.25rem, calc(100% - (2 * var(--location-page-inline))));
margin-inline: auto;
padding: clamp(0.45rem, 1.15dvh, 0.75rem) 0 clamp(0.35rem, 0.9dvh, 0.55rem);
display: flex;
justify-content: center;
align-items: flex-start;
}
.header-location {
width: auto;
max-width: 100%;
}
.location-switcher {
width: auto;
max-width: 100%;
display: grid;
grid-template-columns: repeat(3, max-content);
align-items: start;
justify-content: center;
column-gap: clamp(1.15rem, 4vw, 3.25rem);
row-gap: 0;
line-height: 1.08;
}
.location-switcher-link {
min-width: 0;
margin: 0;
padding: 0;
text-align: center;
white-space: nowrap;
}
.location-switcher-link.is-current {
margin: 0;
}
.location-switcher-call {
display: inline-flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
gap: 0.22rem;
white-space: nowrap;
}
.location-switcher-phone {
display: block;
flex: 0 0 auto;
font-size: 0.58em;
line-height: 1.1;
white-space: nowrap;
animation: toros-phone-pulse 1.8s ease-in-out infinite;
}
.status-opening-group {
display: inline-flex;
align-items: center;
justify-content: center;
gap: clamp(0.5rem, 1.1vw, 0.8rem);
min-width: 0;
}
.status-logo-link {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
line-height: 0;
border-radius: 50%;
transition: transform 180ms ease, filter 180ms ease;
}
.status-logo-link:hover,
.status-logo-link:focus-visible {
transform: translateY(-1px);
filter: drop-shadow(0 4px 8px rgba(227, 199, 103, 0.22));
}
.status-logo-link:focus-visible {
outline: 2px solid #e3c767;
outline-offset: 2px;
}
.status-logo {
display: block;
width: clamp(2.65rem, 4.4vw, 3.75rem);
height: auto;
object-fit: contain;
filter:
drop-shadow(0 4px 8px rgba(0, 0, 0, 0.7))
drop-shadow(0 0 8px rgba(201, 162, 58, 0.14));
}
.placeholder-header {
grid-template-columns: minmax(0, 1fr) auto;
}
.placeholder-brand {
min-height: auto;
}
.placeholder-logo {
width: clamp(4.5rem, 9vw, 6.5rem);
max-width: none;
max-height: none;
}
@container location-page (max-width: 43.75rem) {
.header-top {
width: calc(100% - 0.75rem);
padding-block: 0.35rem 0.25rem;
}
.location-switcher {
width: 100%;
grid-template-columns: repeat(3, minmax(0, 1fr));
justify-content: stretch;
column-gap: clamp(0.35rem, 2.2vw, 0.8rem);
}
.location-switcher-link {
font-size: clamp(0.92rem, 3.3vw, 1.1rem);
overflow: visible;
}
.location-switcher-link.is-current {
font-size: clamp(1.512rem, 6.048vw, 1.96rem);
line-height: 1.02;
}
.location-switcher-call {
gap: 0.12rem;
}
.location-switcher-phone {
font-size: clamp(1.512rem, 6.048vw, 1.96rem);
line-height: 1.05;
}
.status-bar {
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
}
.status-opening-group {
gap: 0.12rem;
}
.placeholder-header {
width: calc(100% - 0.75rem);
grid-template-columns: minmax(0, 1fr) auto;
align-items: start;
gap: 0.45rem;
}
.placeholder-header-location {
min-width: 0;
}
.placeholder-logo {
width: clamp(3.75rem, 16vw, 5rem);
}
}
@container location-page (max-width: 24.375rem) {
.location-switcher {
column-gap: 0.24rem;
}
.location-switcher-link {
font-size: clamp(0.83rem, 3.6vw, 0.95rem);
letter-spacing: 0;
}
.location-switcher-link.is-current {
font-size: clamp(1.254rem, 5.376vw, 1.478rem);
}
.location-switcher-phone {
font-size: clamp(1.254rem, 5.376vw, 1.478rem);
}
}
@container location-page (max-width: 18.75rem) {
.location-switcher-call {
flex-wrap: nowrap;
white-space: nowrap;
row-gap: 0.1rem;
}
.location-switcher-phone {
flex-basis: auto;
}
}
.location-switcher {
grid-template-columns: 1fr ;
justify-content: center ;
justify-items: center ;
column-gap: 0 ;
}
.location-switcher-link.is-current,
.location-switcher-call.is-current {
justify-self: center ;
text-align: center ;
align-items: center ;
}
.placeholder-header {
grid-template-columns: 1fr ;
justify-items: center ;
}
.location-switcher.location-switcher-arrows {
grid-template-columns: minmax(2.25rem, 1fr) auto minmax(2.25rem, 1fr) ;
justify-items: stretch ;
column-gap: clamp(0.45rem, 2.2vw, 1rem) ;
}
.location-switcher-arrows .location-switcher-call.is-current,
.location-switcher-arrows .location-switcher-link.is-current {
grid-column: 2 ;
justify-self: center ;
}
.location-switcher-arrows .location-switcher-phone {
font-size: 90% ;
}
@container location-page (max-width: 43.75rem) {
.location-switcher.location-switcher-arrows {
width: 100%;
grid-template-columns: minmax(2rem, 1fr) auto minmax(2rem, 1fr) ;
column-gap: clamp(0.3rem, 1.7vw, 0.65rem) ;
}
.location-switcher-arrow {
width: clamp(2rem, 10vw, 2.5rem);
height: clamp(2rem, 10vw, 2.5rem);
font-size: clamp(1.55rem, 7vw, 2rem);
}
}
@container location-page (max-width: 43.75rem) {
.location-switcher-name-gelenau {
max-width: min(100%, 18.5rem);
font-size: 0.88em;
line-height: 1.12;
}
.location-switcher-arrows .location-switcher-call.is-current:has(.location-switcher-name-gelenau) {
max-width: min(100%, 18.5rem);
}
}
@container location-page (max-width: 43.75rem) {
.location-current-brand {
gap: clamp(0.45rem, 2vw, 0.7rem);
}
.location-current-logo {
height: clamp(4.6rem, 18vw, 5.8rem);
}
.location-current-text .location-switcher-title-line {
font-size: 0.9em;
line-height: 1.04;
}
.location-current-text .location-switcher-address-line {
font-size: 0.66em;
line-height: 1.08;
}
.location-current-text .location-switcher-phone {
margin-top: 0.15rem;
}
}
@container location-page (max-width: 24.375rem) {
.location-current-brand {
gap: 0.4rem;
}
.location-current-logo {
height: clamp(4.15rem, 19vw, 4.8rem);
}
}
@container location-page (max-width: 43.75rem) {
.location-current-brand {
gap: clamp(0.8rem, 3.8vw, 1.15rem);
}
.location-current-logo {
height: clamp(5.4rem, 21vw, 6.8rem);
}
}
@container location-page (max-width: 24.375rem) {
.location-current-brand {
gap: 0.72rem;
}
.location-current-logo {
height: clamp(4.9rem, 22vw, 5.7rem);
}
}
@container location-page (max-width: 43.75rem) {
.info-card-combined {
gap: 0.6rem;
padding: 0.9rem 0.85rem;
}
.info-line {
column-gap: 0.55rem;
min-height: 2rem;
}
.info-line-text {
font-size: clamp(0.96rem, 3.35vw, 1.08rem);
}
}
@container location-page (max-width: 24.375rem) {
.info-card-combined {
padding: 0.82rem 0.72rem;
}
.info-line {
column-gap: 0.46rem;
}
.info-card-symbol-inline {
width: 1.85rem;
height: 1.85rem;
}
.info-line-text {
font-size: clamp(0.9rem, 3.6vw, 1rem);
}
}
@container location-page (max-width: 30rem) {
.header-action-row .header-media-button {
font-size: 0.72rem;
padding: 0.28rem 0.24rem;
gap: 0.28rem;
}
.header-action-row .header-media-icon {
width: 1.24rem;
height: 1.24rem;
font-size: 0.70rem;
}
}
@media (max-width: 700px) {
.service-gallery-section {
margin-bottom: 1.6rem;
}
.service-gallery-inner {
padding: 1rem 0.7rem 1.1rem;
}
.catering-slider-viewport {
min-height: 200px;
}
.catering-slider-nav {
width: 2.2rem;
height: 2.2rem;
font-size: 1.45rem;
}
.catering-slide figcaption {
font-size: 0.86rem;
padding: 0.62rem 0.78rem;
}
}
@media (max-width: 700px) {
.service-page-tophead {
gap: 0.7rem;
margin-bottom: 0.8rem;
padding-top: 0.2rem;
}
.service-page-tophead-logo {
width: 4rem;
}
.service-page-tophead-text h1 {
font-size: clamp(1.12rem, 5vw, 1.5rem);
}
}
@media (min-width: 701px) {
.header-action-row {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.header-action-row .header-media-buttons {
display: contents;
}
.header-action-row .header-media-button--wide {
grid-column: 1 / -1;
grid-row: 1;
}
.header-action-row .header-media-button:not(.header-media-button--wide) {
grid-row: 2;
}
.header-action-row .header-allergen-button {
grid-column: 4;
grid-row: 2;
}
}