/* The supplied Serma symbols retain their original proportions and colours. */
.header .brand{--brand-symbol:64px;--brand-wordmark:171px;display:flex;align-items:center;gap:9px;width:244px}
.header .brand .brand-symbol{width:var(--brand-symbol);height:auto;flex:none}
/* The original wordmark includes transparent space below the lettering.
   Crop only that empty space in its display box, then align optically to the supplied lockup. */
.header .brand .brand-wordmark{width:var(--brand-wordmark);height:calc(var(--brand-wordmark) * .226);min-width:0;flex:none;object-fit:cover;object-position:center top;transform:translateY(calc(var(--brand-symbol) * .075))}
.hero-photo figcaption{display:flex;align-items:center;gap:22px;padding:22px 26px;background:#172326f5}
.hero-photo .hero-symbol{position:static;width:90px;height:auto;max-width:none;flex:none;object-fit:contain}
.hero-signature{display:flex;flex-direction:column;gap:4px;line-height:1.3}
.hero-signature .three-colours{margin:0 0 8px;width:45px;height:4px}
.hero-signature strong{font-size:19px;letter-spacing:-.015em;font-weight:bold}
.hero-signature>span:last-child{font-size:16px;color:#dce6e2}
.cta{grid-template-columns:120px minmax(0,1fr) auto;gap:35px}
.cta>.cta-symbol{width:120px;height:auto;align-self:center}
.footer .footer-brand{display:flex;align-items:center;gap:16px;width:290px;max-width:100%}
.footer .footer-symbol{width:62px;height:auto;flex:none}
.footer .footer-wordmark{width:212px;height:auto;min-width:0}
@media(max-width:1100px){
 .header .brand{--brand-symbol:54px;--brand-wordmark:145px;width:207px;gap:8px}
 .hero-photo figcaption{gap:16px;padding:19px}
 .hero-photo .hero-symbol{width:73px}
 .hero-signature strong{font-size:17px}
 .hero-signature>span:last-child{font-size:14px}
 .cta{grid-template-columns:90px minmax(0,1fr) auto;gap:25px}
 .cta>.cta-symbol{width:90px}
 .footer .footer-brand{gap:12px;width:242px}
 .footer .footer-symbol{width:50px}
 .footer .footer-wordmark{width:180px}
}
@media(max-width:820px){
 .header .brand{--brand-symbol:50px;--brand-wordmark:133px;width:190px;gap:7px}
 .hero-photo .hero-symbol{width:60px}
 .hero-signature strong{font-size:15px}
 .hero-signature>span:last-child{font-size:13px}
 .cta{grid-template-columns:70px minmax(0,1fr);gap:25px}
 .cta>.cta-symbol{width:70px;align-self:start;margin-top:6px}
 .cta-actions{grid-column:2}
 .footer .footer-brand{width:228px;gap:11px}
 .footer .footer-symbol{width:47px}
 .footer .footer-wordmark{width:170px}
}
@media(max-width:600px){
 .header .brand{--brand-symbol:38px;--brand-wordmark:102px;width:145px;gap:5px}
 .header-inner{min-height:76px;gap:6px}
 .hero-photo figcaption{gap:19px;padding:18px 21px}
 .hero-photo .hero-symbol{width:65px}
 .hero-signature strong{font-size:17px}
 .hero-signature>span:last-child{font-size:14px}
 .cta{grid-template-columns:1fr;gap:22px}
 .cta>.cta-symbol{width:72px;margin:0}
 .cta-actions{grid-column:auto}
 .footer .footer-brand{width:265px;gap:15px}
 .footer .footer-symbol{width:55px}
 .footer .footer-wordmark{width:195px}
}
@media(max-width:360px){
 .header .brand{--brand-symbol:33px;--brand-wordmark:88px;width:125px;gap:4px}
 .hero-photo .hero-symbol{width:57px}
 .hero-photo figcaption{gap:14px;padding:17px}
 .hero-signature strong{font-size:16px}
}
