.language-picker{display:flex;align-items:stretch;flex:none;margin-left:10px;border:2px solid var(--line);background:var(--paper);box-shadow:3px 3px 0 var(--line)}
.language-picker button{min-width:42px;min-height:42px;padding:8px;border:0;border-right:1px solid var(--line);border-radius:0;background:transparent;color:var(--ink);font:800 12px/1.2 Maven,system-ui,sans-serif;cursor:pointer}
.language-picker button:last-child{border-right:0}
.language-picker button[aria-pressed="true"]{background:var(--line);color:#fff}
.language-picker button:hover:not([aria-pressed="true"]){background:#dcefe7}
.language-picker button:focus-visible{outline:3px solid var(--blue);outline-offset:3px;position:relative;z-index:1}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
html:not([lang="es"]) .tabbar a{overflow-wrap:anywhere;hyphens:auto;text-align:center;line-height:1.15}
html:not([lang="es"]) .header-contact .contact-desktop{white-space:nowrap}
@media(max-width:759px){
 .language-picker{margin-left:2px;box-shadow:none}
 .language-picker button{min-width:32px;min-height:40px;padding:6px;font-size:11px}
 .appbar{gap:6px}
 .appbar .brand small{display:none}
 .appbar .brand strong{font-size:17px}
 .appbar .logo{width:40px;height:40px}
 .header-contact{gap:4px}
 .header-contact .contact-link{width:32px}
 .header-contact .header-book{padding:0 6px}
 html:not([lang="es"]) .tabbar a{font-size:9px}
 .appbar:has(.install-button:not([hidden])) .install-button{font-size:8px;padding:5px;max-width:65px}
}
@media(max-width:400px){
 .appbar{padding-left:8px;padding-right:8px;gap:4px}
 .appbar .brand strong{font-size:15px}
 .language-picker{margin-left:4px}
 .header-contact .contact-link{width:36px}
 .language-picker button{min-width:30px;padding:5px}
}
@media(max-width:440px){.appbar .brand{display:none}}

/* Keep the contact details readable, including on small screens. */
.contact-details{display:flex;align-items:center;gap:7px}
@media(max-width:759px){
 .appbar{height:calc(116px + env(safe-area-inset-top));flex-wrap:wrap;align-content:center;row-gap:8px}
 .header-contact{display:contents}
 .header-contact .header-book{margin-left:auto}
 .contact-details{order:3;flex:0 0 100%;gap:6px}
 .header-contact .contact-details .contact-link{width:auto;min-height:30px;padding:3px 6px;gap:5px;justify-content:center}
 .header-contact .contact-details .contact-link:first-child{flex:0 0 auto}
 .header-contact .contact-details .contact-link:last-child{flex:1;min-width:0}
 .header-contact .contact-details .contact-link span{display:inline;font-size:10px;line-height:1.2;letter-spacing:-.2px}
 .header-contact .contact-details svg{width:19px;height:19px;padding:2px}
 .screen{inset:calc(116px + env(safe-area-inset-top)) 0 calc(82px + env(safe-area-inset-bottom))}
}
@media(max-width:360px){
 .header-contact .contact-details .contact-link{padding:3px 4px;gap:3px}
 .header-contact .contact-details .contact-link span{font-size:9px;letter-spacing:-.35px}
}
/* Compact single-line header, including full contact text. */
@media(max-width:759px){
 .appbar{height:calc(76px + env(safe-area-inset-top));flex-wrap:nowrap;gap:5px;padding-left:8px;padding-right:8px}
 .appbar .brand{display:none}
 .appbar .logo{width:28px;height:32px}
 .header-contact{display:flex;flex:1;min-width:0;gap:4px;margin-left:auto}
 .contact-details{order:0;flex:1;min-width:0;gap:4px}
 .header-contact .contact-details .contact-link{min-height:34px;padding:3px;gap:3px;border-width:1px}
 .header-contact .contact-details .contact-link span{font-family:Maven,system-ui,sans-serif;font-size:9px;font-weight:700;letter-spacing:-.3px}
 .header-contact .contact-details svg{width:13px;height:15px;padding:1px}
 .header-contact .header-book{min-height:34px;padding:3px;gap:2px;font-size:8px;border-width:1px;margin-left:0}
 .header-contact .header-book svg{width:16px;height:18px;padding:2px}
 .language-picker{margin-left:0;border-width:1px}
 .language-picker button{min-width:22px;min-height:32px;padding:3px;font-size:9px}
 .screen{inset:calc(76px + env(safe-area-inset-top)) 0 calc(82px + env(safe-area-inset-bottom))}
}
@media(max-width:400px){
 .appbar{gap:3px;padding-left:5px;padding-right:5px}
 .appbar .logo{width:24px;height:28px}
 .header-contact,.contact-details{gap:3px}
 .header-contact .contact-details .contact-link{padding:2px;gap:2px}
 .header-contact .contact-details .contact-link span{font-size:8px;letter-spacing:-.35px}
 .header-contact .header-book svg{display:none}
 .language-picker button{min-width:20px;padding:2px;font-size:8px}
}
@media(max-width:350px){
 .appbar .logo{width:20px;height:24px}
 .header-contact .contact-details .contact-link span{font-size:7px;letter-spacing:-.4px}
 .header-contact .contact-details svg{width:11px;height:13px}
 .language-picker button{min-width:18px;font-size:7px}
 .header-contact .header-book{font-size:7px}
}
@media(max-width:759px){.header-contact .header-book{box-shadow:none}}
/* Brand at the left; all contact and language controls grouped at the right. */
.header-contact{flex:0 0 auto;margin-left:auto}
@media(max-width:759px){
 .appbar .logo{width:40px;height:40px;flex:none}
 .appbar .brand{display:block;flex:0 0 auto}
 .appbar .brand strong{font-size:13px;letter-spacing:0}
 .appbar .brand small{display:none}
 .header-contact{flex:0 0 auto;margin-left:auto}
 .contact-details{flex:0 0 auto}
 .header-contact .contact-details .contact-link:last-child{flex:0 0 auto}
 .header-contact .contact-details .contact-link span{font-size:8px;letter-spacing:-.35px}
}
@media(max-width:440px){
 .appbar{gap:3px;padding-left:5px;padding-right:5px}
 .appbar .brand strong{font-size:11px}
 .header-contact,.contact-details{gap:2px}
 .header-contact .contact-details .contact-link{padding:2px;gap:1px}
 .header-contact .contact-details .contact-link span{font-size:7px;letter-spacing:-.35px}
 .header-contact .contact-details svg{width:10px;height:12px}
 .header-contact .header-book{font-size:7px;padding:2px}
 .language-picker button{min-width:17px;font-size:7px;padding:2px}
}
@media(max-width:360px){
 .appbar{gap:2px;padding-left:3px;padding-right:3px}
 .appbar .brand strong{font-size:10px}
 .header-contact .contact-details .contact-link span{font-size:6px;letter-spacing:-.35px}
 .header-contact .contact-details svg{width:8px;height:10px}
 .language-picker button{min-width:15px;font-size:6px;padding:1px}
}
/* Header palette follows the blue, mint and warm tones of the app. */
.header-contact .contact-link:first-child{background:#d4e5fa}
.header-contact .contact-link:last-child{background:#f4dfb7}
.header-contact .header-book{background:#91cdb5}
.language-picker{background:#cbd9f1}
.language-picker button[aria-pressed="true"]{background:#345a85;color:#fff}
.header-contact a{font-size:11px}
@media(max-width:759px){
 .header-contact .contact-details .contact-link span{font-size:9px;letter-spacing:-.25px}
 .header-contact .header-book{font-size:9px}
 .language-picker button{font-size:9px}
}
@media(max-width:440px){
 .appbar .brand strong{font-size:11px}
 .header-contact .contact-details .contact-link span{font-size:8px;letter-spacing:-.35px}
 .header-contact .header-book{font-size:8px}
 .language-picker button{font-size:8px;min-width:17px}
}
@media(max-width:360px){
 .header-contact .contact-details .contact-link span{font-size:7px;letter-spacing:-.4px}
 .header-contact .header-book{font-size:7px}
 .language-picker button{font-size:7px;min-width:15px}
}
@media(max-width:360px){
 .appbar .brand strong{font-size:9px}
 .header-contact .contact-details .contact-link span{font-size:6.5px;letter-spacing:-.4px}
 .header-contact .contact-details .contact-link{padding:1px;gap:1px}
 .language-picker button{min-width:13px;padding:1px;font-size:7px}
}
/* Larger contact information; retain the single-line layout. */
.header-contact .contact-details .contact-link span{font-size:13px}
@media(max-width:1100px) and (min-width:760px){.header-contact .contact-details .contact-link span{font-size:11px}}
@media(max-width:759px){
 .header-contact .contact-details .contact-link span{font-size:10px;letter-spacing:-.35px}
 .appbar{overflow-x:auto;scrollbar-width:thin}
 .language-picker{flex-shrink:0}
}
@media(max-width:440px){
 .header-contact .contact-details .contact-link span{font-size:9px;letter-spacing:-.35px}
}
@media(max-width:440px){
 .appbar{gap:2px;padding-left:3px;padding-right:3px}
 .appbar .brand strong{font-size:9px}
}
/* Icon-only contact actions leave room for readable mobile controls. */
.header-contact .contact-details .contact-link span{display:none}
.header-contact .contact-details .contact-link{width:44px;min-height:44px;padding:8px;justify-content:center}
.header-contact .contact-details svg{width:24px;height:24px;padding:3px}
@media(max-width:759px){
 .appbar{gap:7px;padding-left:10px;padding-right:10px;overflow:visible}
 .appbar .logo{width:40px;height:40px}
 .appbar .brand strong{font-size:15px;letter-spacing:0}
 .header-contact,.contact-details{gap:5px}
 .header-contact .contact-details .contact-link{width:36px;min-height:40px;padding:5px;border-width:2px;gap:0}
 .header-contact .contact-details svg{width:23px;height:23px;padding:3px}
 .header-contact .header-book{font-size:11px;min-height:40px;padding:5px;border-width:2px}
 .header-contact .header-book svg{display:none}
 .language-picker{border-width:2px;margin-left:0}
 .language-picker button{font-size:10px;min-width:25px;min-height:36px;padding:4px}
}
@media(max-width:380px){
 .appbar{gap:4px;padding-left:6px;padding-right:6px}
 .appbar .brand strong{font-size:13px}
 .header-contact,.contact-details{gap:3px}
 .header-contact .contact-details .contact-link{width:32px;padding:3px}
 .language-picker button{min-width:22px;padding:3px}
}
@media(max-width:340px){
 .appbar{gap:3px;padding-left:4px;padding-right:4px}
 .appbar .brand strong{font-size:12px}
 .header-contact,.contact-details{gap:2px}
 .header-contact .header-book{padding:3px;font-size:10px}
 .language-picker button{min-width:20px;padding:2px}
}
/* Give the brand more presence without shrinking the header controls. */
.appbar .brand strong{font-size:26px}
@media(max-width:759px){.appbar .brand strong{font-size:21px}}
@media(max-width:380px){.appbar .brand strong{font-size:19px}}
@media(max-width:340px){.appbar .brand strong{font-size:18px}}
/* A coherent header palette, with country-colour cues for languages. */
.appbar .brand small{display:block;font-family:Maven,system-ui,sans-serif;font-size:9px;letter-spacing:.03em}
.header-contact .contact-details .contact-link{background:#cce5e6}
.header-contact .header-book{background:#efc27f;color:#183044}
.header-contact .header-book svg{background:#865722}
.language-picker{background:#d9e5f3}
.language-picker button{position:relative;padding-bottom:10px}
.language-picker button::after{content:'';position:absolute;bottom:3px;left:4px;right:4px;height:5px}
.language-picker button[data-language="es"]::after{background:linear-gradient(#aa2130 0 25%,#f6cd49 25% 75%,#aa2130 75%)}
.language-picker button[data-language="en"]::after{background:linear-gradient(90deg,transparent 40%,#fff 40% 44%,#ce3349 44% 56%,#fff 56% 60%,transparent 60%),linear-gradient(transparent 30%,#fff 30% 38%,#ce3349 38% 62%,#fff 62% 70%,transparent 70%),#244883}
.language-picker button[data-language="de"]::after{background:linear-gradient(#20232a 0 33%,#c7393c 33% 66%,#edc04a 66%)}
.language-picker button[aria-pressed="true"]{background:#244a70;color:white}
@media(max-width:759px){
 .appbar .brand small{display:block;font-size:6px;letter-spacing:-.1px;white-space:nowrap;margin-top:4px}
 .header-contact .header-book .contact-mobile{display:none}
 .header-contact .header-book .contact-desktop{display:inline;white-space:normal;max-width:45px;text-align:center;line-height:1.05}
 .header-contact .header-book{font-size:11px;min-width:48px}
 .language-picker button{padding-bottom:10px}
}
@media(max-width:380px){
 .appbar{gap:3px;padding-left:4px;padding-right:4px}
 .appbar .brand strong{font-size:18px}
 .appbar .brand small{font-size:5.5px}
 .header-contact .contact-details .contact-link{width:28px;padding:2px}
 .header-contact .contact-details svg{width:21px;height:21px}
 .header-contact .header-book{min-width:43px;padding:3px;font-size:10px}
 .language-picker button{min-width:19px;font-size:9px;padding-left:2px;padding-right:2px}
}
@media(max-width:340px){
 .appbar .brand strong{font-size:17px}
 .appbar .brand small{font-size:5px}
 .appbar{gap:2px;padding-left:3px;padding-right:3px}
 .header-contact .header-book{min-width:40px}
 .language-picker button{min-width:18px}
}
@media(min-width:381px) and (max-width:759px){.appbar{gap:5px;padding-left:6px;padding-right:6px}.appbar .brand strong{font-size:20px}.language-picker button{min-width:23px}}
/* Align the two brand lines and keep the booking label on one line. */
.appbar .brand{margin-left:5px;text-align:center}
.appbar .brand strong,.appbar .brand small{text-align:center}
.appbar .brand small{font-size:10px;letter-spacing:0;margin-top:5px}
.header-contact .header-book .contact-desktop{white-space:nowrap;max-width:none}
@media(max-width:759px){
 .appbar .brand{margin-left:4px}
 .appbar .brand small{font-size:7px;letter-spacing:-.1px;margin-top:4px}
 .header-contact .header-book{padding:5px 7px;min-width:0}
 .header-contact .header-book .contact-desktop{white-space:nowrap;max-width:none}
 .header-contact,.contact-details{gap:3px}
 .header-contact .contact-details .contact-link{width:30px;padding:3px}
 .language-picker button{min-width:21px;padding-left:2px;padding-right:2px}
}
@media(max-width:380px){
 .appbar .brand small{font-size:6.2px}
 .header-contact .header-book{padding:4px;font-size:10px}
 .header-contact .contact-details .contact-link{width:27px;padding:2px}
 .language-picker button{min-width:18px}
}
@media(max-width:340px){
 .appbar .brand{margin-left:3px}
 .appbar .brand strong{font-size:16px}
 .appbar .brand small{font-size:5.8px}
 .header-contact,.contact-details{gap:2px}
 .header-contact .header-book{padding:3px;font-size:9px}
 .language-picker button{min-width:16px;font-size:8px}
}
/* Larger tagline and more balanced rectangular header controls. */
.appbar .brand small{font-size:12px;line-height:1.2}
.header-contact .contact-details .contact-link{width:52px;min-height:44px;padding:8px 12px}
.header-contact .header-book{padding-left:15px;padding-right:15px}
.language-picker button{min-width:46px}
@media(max-width:759px){
 .appbar .brand small{font-size:8px;letter-spacing:-.15px}
 .header-contact .contact-details .contact-link{width:34px;min-height:36px;padding:5px}
 .header-contact .contact-details svg{width:20px;height:20px;padding:2px}
 .header-contact .header-book{min-height:36px;padding:5px 8px}
 .language-picker button{min-width:22px;min-height:32px}
 .appbar{gap:3px;padding-left:5px;padding-right:5px}
}
@media(max-width:380px){
 .appbar .brand small{font-size:7px}
 .header-contact .contact-details .contact-link{width:29px;padding:4px}
 .header-contact .contact-details svg{width:17px;height:18px}
 .header-contact .header-book{padding:5px}
 .language-picker button{min-width:18px}
}
@media(max-width:340px){
 .appbar .brand small{font-size:6.5px;letter-spacing:-.2px}
 .appbar{gap:2px;padding-left:3px;padding-right:3px}
 .header-contact .contact-details .contact-link{width:28px}
 .header-contact .header-book{padding:4px}
 .language-picker button{min-width:16px}
}
/* Both brand lines share the same left edge. */
.appbar .brand,.appbar .brand strong,.appbar .brand small{text-align:left}