.brands { background: var(--cream); padding: 120px 4.8vw; }
.brands-intro { display: grid; grid-template-columns: 1fr 1.2fr 1fr; gap: 24px; align-items: end; margin-bottom: 58px; }
.brands h2 { font-size: clamp(44px, 5.8vw, 86px); line-height: .9; letter-spacing: -.08em; margin: 0; }
.brands h2 em { font-family: Georgia, serif; font-weight: 400; }
.brands-intro > p:last-child { font-size: 13px; line-height: 1.65; margin: 0 0 4px; max-width: 250px; }
.brand-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.brand-card { min-height: 255px; padding: 22px; background: #fff; border: 1px solid #d9d6ce; display: flex; flex-direction: column; justify-content: space-between; transition: transform .25s ease, box-shadow .25s ease; }
.brand-card:hover { transform: translateY(-5px); box-shadow: 7px 7px 0 var(--navy); }
.brand-logo { font-weight: 800; font-size: 29px; letter-spacing: -.08em; line-height: 1; color: var(--navy); }
.brand-logo img { display: block; width: 100%; height: 95px; object-fit: contain; object-position: left center; mix-blend-mode: multiply; }
.brand-logo b { display: block; margin-top: 7px; font: 8px var(--mono); letter-spacing: .03em; }
.brand-card > p { font: 10px var(--mono); margin: 20px 0 auto; text-transform: uppercase; }
.brand-actions { display: flex; border-top: 1px solid var(--navy); padding-top: 12px; gap: 13px; }
.brand-actions a { color: var(--navy); font-size: 11px; font-weight: 800; text-decoration: none; }
.brand-actions i { font-style: normal; margin-left: 2px; }
.elisa { background: #f2e0d2; }.elisa .brand-logo { letter-spacing: .06em; font-family: Georgia, serif; }
.lister { background: #e9eed9; }.lister .brand-logo { color: #48712d; }
.panasonic { background: #13214e; color: #fff; }.panasonic .brand-logo, .panasonic .brand-actions a { color: #fff; }.panasonic .brand-card > p { color: #fff; }.panasonic .brand-actions { border-color: #fff; }
.pressfit { background: #f9df30; }.pressfit .brand-logo span { color: var(--orange); }
.singer { background: #c53936; color: #fff; }.singer .brand-logo, .singer .brand-actions a { color: #fff; font-family: Georgia, serif; letter-spacing: .03em; }.singer .brand-card > p { color: #fff; }.singer .brand-actions { border-color: #fff; }
.download-note { font-size: 13px; margin: 34px 0 0; }.download-note a { color: var(--navy); font-weight: 800; }
@media(max-width:700px) { .brands { padding: 74px 22px; }.brands-intro { display: block; margin-bottom: 38px; }.brands h2 { font-size: 47px; margin: 35px 0 22px; }.brands-intro > p:last-child { font-size: 12px; }.brand-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }.brand-card { min-height: 205px; padding: 15px; }.brand-logo { font-size: 22px; }.brand-logo img { height: 70px; }.brand-actions { display: block; padding-top: 9px; }.brand-actions a { display: block; margin-top: 5px; font-size: 10px; }.download-note { line-height: 1.55; font-size: 12px; } }
