@font-face{font-family:"METTO Clients Roboto";src:url(assets/roboto-0.ttf);font-weight:400;font-display:swap}
@font-face{font-family:"METTO Clients Roboto";src:url(assets/roboto-1.ttf);font-weight:500;font-display:swap}
@font-face{font-family:"METTO Clients Roboto";src:url(assets/roboto-2.ttf);font-weight:700;font-display:swap}
.metto-clients-page{--green:#087344;--orange:#f77f00;--ink:#20231f;--muted:#606060;--gutter:24px;background:#fff;color:var(--ink);font:400 16px/1.4 "METTO Clients Roboto",Arial,sans-serif}
.metto-clients-page *{box-sizing:border-box}
.metto-clients-page .wrap{width:calc(100% - 2*var(--gutter));max-width:1366px;margin-inline:auto}
.metto-clients-page main{padding-top:24px}
.metto-clients-page .creator-hero{display:block;padding:16px 0 18px}
.metto-clients-page .hero-copy{display:block}
.metto-clients-page .hero-copy h1{margin:0 0 16px;color:var(--green);font-size:clamp(36px,3.4vw,48px);font-weight:700;line-height:1.08;letter-spacing:-.045em}
.metto-clients-page .hero-promise{margin:0 0 6px;color:var(--ink);font-size:24px;font-weight:700;line-height:1.5}
.metto-clients-page .catalog-body{display:block;padding:20px 0 64px}
.metto-clients-page .filter-controls{margin-bottom:36px}
.metto-clients-page .filter-buttons{display:flex;flex-wrap:wrap;gap:8px}
.metto-clients-page .filter-buttons a{display:inline-flex;align-items:center;justify-content:center;gap:6px;max-width:100%;min-height:48px;padding:12px 14px;background:var(--green);border:1px solid var(--green);color:#fff;font:400 16px/1.4 "METTO Clients Roboto",Arial,sans-serif;text-decoration:none;text-transform:uppercase}
.metto-clients-page .filter-buttons span{font-size:12px;opacity:.8}
.metto-clients-page .filter-buttons a:hover{background:#055c36;border-color:#055c36}
.metto-clients-page .filter-buttons a[aria-current=page]{background:var(--orange);border-color:var(--orange);box-shadow:none}
.metto-clients-page a:focus-visible{outline:3px solid var(--orange);outline-offset:4px}
.metto-clients-page .clients-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px 28px;align-items:stretch}
.metto-clients-page .clients-highlights{padding-top:8px;margin-bottom:16px}
.metto-clients-page .client-card{min-width:0;margin:0;padding:16px 12px 10px;background:#fff;display:flex;flex-direction:column;align-items:stretch}
.metto-clients-page .client-logo{height:140px;padding:0;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:4px}
.metto-clients-page .client-logo img{display:block;flex:0 1 auto;width:var(--logo-width);height:var(--logo-height);max-width:100%;max-height:136px;object-fit:contain}
.metto-clients-page .client-card figcaption{margin-top:16px;color:#50594f;font-size:15px;line-height:1.5;font-weight:500;text-align:center;overflow-wrap:break-word}
.metto-clients-page .footer-band{background:#f2f2f2}
.metto-clients-page .offer-footer{display:flex;align-items:flex-start;gap:100px;padding:28px 0 40px;color:var(--ink)}
.metto-clients-page .footer-company{flex:0 0 180px}
.metto-clients-page .offer-footer img{display:block;width:180px;height:auto}
.metto-clients-page .offer-footer address{margin-top:16px;font-size:16px;line-height:1.65;font-style:normal}
.metto-clients-page .offer-footer>div>strong{font-size:20px}
.metto-clients-page .offer-footer p{margin:8px 0;font-size:16px;line-height:1.55}
.metto-clients-page .offer-footer a{color:var(--green);text-decoration:none}
@media(max-width:980px){.metto-clients-page .clients-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.metto-clients-page .hero-copy h1{font-size:38px}.metto-clients-page .hero-promise{font-size:20px}}
@media(max-width:780px){.metto-clients-page{--gutter:20px}.metto-clients-page .clients-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 16px}.metto-clients-page .client-logo{height:132px;padding:0}.metto-clients-page .client-card{padding:8px 4px}.metto-clients-page .client-card figcaption{margin-top:12px;font-size:14px}}
@media(max-width:600px){.metto-clients-page main{padding-top:16px}.metto-clients-page .creator-hero{padding-block:16px}.metto-clients-page .hero-copy h1{font-size:36px}.metto-clients-page .catalog-body{padding-top:18px;padding-bottom:40px}.metto-clients-page .filter-buttons a{font-size:13px;padding:10px 11px;text-align:center}.metto-clients-page .filter-controls{margin-bottom:28px}.metto-clients-page .client-logo{height:112px;padding:0 4px}.metto-clients-page .client-logo img{max-height:106px}.metto-clients-page .offer-footer{display:block;padding-block:24px 32px}.metto-clients-page .offer-footer>div+div{margin-top:26px}.metto-clients-page .offer-footer address,.metto-clients-page .offer-footer p{font-size:14px}.metto-clients-page .offer-footer img{width:160px}}
@media(max-width:360px){.metto-clients-page{--gutter:16px}.metto-clients-page .clients-grid{gap:24px 12px}.metto-clients-page .client-card figcaption{font-size:13px}}

/* Requested staging introduction only. */
.metto-clients-page .hero-intro{margin:0 0 16px;font-size:18px;line-height:1.6;font-weight:400}
.metto-clients-page .hero-intro:last-child{margin-bottom:6px}
@media(max-width:600px){.metto-clients-page .hero-intro{font-size:16px;line-height:1.6}}

/* MKS Muszynianka: proportionally display the complete original transparent canvas. */
.metto-clients-page .client-logo img[src$="/client-247-historical-2011.png"]{max-height:none;height:auto}

/* Owner-approved plain-text identification for Warsaw and Warmian-Masurian office only. */
.metto-clients-page .client-text-name{max-width:100%;color:var(--green);font:500 28px/1.2 "METTO Clients Roboto",Arial,sans-serif;text-align:center;overflow-wrap:normal}
@media(max-width:600px){.metto-clients-page .client-text-name{font-size:22px}.metto-clients-page .client-card-wide-mobile{grid-column:1/-1}}

/* DEFMAR: keep the whole official JPEG canvas and its white clear space. */
.metto-clients-page .client-logo img[src$="/client-344-official-batch24.jpg"]{max-height:none;height:auto}

/* CSiR Swiecie: proportionally display its whole official PNG and clear space. */
.metto-clients-page .client-logo img[src$="/client-353-official-batch30.png"]{max-height:none;height:auto}

/* Two whole official dance originals: preserve native clear space and canvas. */
.metto-clients-page .client-logo img:is([src$="/client-360-official-batch34.jpg"],[src$="/client-361-official-batch34.jpg"]){max-height:none;height:auto}
.metto-clients-page .client-card:has(img:is([src$="/client-360-official-batch34.jpg"],[src$="/client-361-official-batch34.jpg"])) figcaption{margin-top:24px}
@media(max-width:600px){.metto-clients-page .client-card:has(img:is([src$="/client-360-official-batch34.jpg"],[src$="/client-361-official-batch34.jpg"])) .client-logo{height:170px}}
