/* User-supplied two-line wordmark, recoloured for the existing brand palette. */
header .wordmark{flex-shrink:0;width:280px;max-width:45%;line-height:0}
.wordmark{position:relative;overflow:hidden;aspect-ratio:1470 / 300;mix-blend-mode:normal}
.brand-logo{position:absolute;display:block;width:112.5398%;max-width:none;height:auto;left:-6.3654%;top:-91.076%}
footer .wordmark{width:260px;max-width:100%;line-height:0}
@media(max-width:1100px) and (min-width:761px){header{gap:16px}header .wordmark{width:240px}header nav{gap:12px}header nav a{font-size:13px}}
@media(max-width:760px){header .wordmark{width:205px;max-width:calc(100% - 115px)}header{gap:10px}header .menu-toggle{padding:8px 2px}footer .wordmark{width:250px}}

.brand-logo{content:url("siamphat-logo-transparent.png")}

@media(min-width:1101px) and (max-width:1250px){header{gap:14px}header nav{gap:12px}header nav a{font-size:13px}header .wordmark{width:240px}}
@media(min-width:761px) and (max-width:1100px){header{flex-wrap:wrap;gap:16px}.menu-toggle{display:block;background:none;border:0;padding:8px;margin-left:auto}header nav{display:none;order:4;width:100%;padding-top:15px;border-top:1px solid var(--rule)}header nav.open{display:flex;flex-direction:column;gap:16px}header nav a{font-size:16px}}