/* assets/css/page-where-to-buy.css - копия без комментариев, править исходник */
.where-buy-page { overflow: hidden; background: #FAFAFA; color: #252B2B; } .where-buy-main { height: 990px; background: #FAFAFA; } .where-buy-main__inner { position: relative; width: calc(100% - 64px); max-width: 1398px; height: 100%; padding: 0; } .where-buy-breadcrumbs { position: absolute; top: 46px; left: 50%; display: flex; align-items: center; justify-content: center; gap: 6px; height: 22px; color: #979E9F; font-family: var(--font-sans); font-size: 13px; line-height: 22px; white-space: nowrap; transform: translateX(-50%); } .where-buy-breadcrumbs a { color: #252B2B; line-height: 16px; text-decoration: none; } .where-buy-breadcrumbs a:hover { color: #006C66; } .where-buy-breadcrumbs > span:first-of-type { font-family: "Red Hat Display", var(--font-sans); line-height: 17px; } .where-buy-breadcrumbs > span:last-child { line-height: 22px; } .where-buy-main h1 { position: absolute; top: 86px; left: 50%; width: 588px; margin: 0; color: #252B2B; font-family: var(--font-display); font-size: 48px; font-weight: 500; line-height: 64px; text-align: center; transform: translateX(-50%); } .where-buy-main h1 span { color: #006C66; } .where-buy-intro { position: absolute; top: 190px; left: 50%; width: 575px; margin: 0; color: #555B5C; font-family: var(--font-sans); font-size: 16px; font-weight: 400; line-height: 26px; text-align: center; transform: translateX(-50%); } .where-buy-grid { position: absolute; top: 282px; left: 221px; display: grid; grid-template-columns: repeat(3, 308px); grid-template-rows: repeat(2, 294px); gap: 20px 16px; width: 956px; height: 608px; } .where-buy-card { position: relative; width: 308px; height: 294px; border: 1px solid rgba(0, 0, 0, 0.05); border-radius: 8px; background: #FFFFFF; box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06); box-sizing: border-box; } .where-buy-card__logo { position: absolute; top: 30px; left: 50%; display: block; width: var(--where-buy-logo-width); height: 116px; max-width: none; object-fit: fill; border-radius: 4px; transform: translateX(-50%); } .where-buy-card > p { position: absolute; top: 154px; right: 16px; left: 16px; height: 20px; margin: 0; color: #6B7280; font-family: var(--font-sans); font-size: 14px; font-weight: 400; line-height: 20px; text-align: center; white-space: nowrap; } .where-buy-card > a { position: absolute; top: 212px; left: 50%; display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 20px; border-radius: 4px; background: #006C66; color: #FFFFFF; font-family: var(--font-sans); font-size: 14px; font-weight: 600; line-height: 20px; text-decoration: none; box-sizing: border-box; transform: translateX(-50%); transition: background-color 0.2s ease; } .where-buy-card:first-child > a { top: 211px; } .where-buy-card > a:hover { background: #005550; } .where-buy-card > a img { display: block; width: 13px; height: 13px; } .where-buy-guarantees { height: 356px; background: #006C66; } .where-buy-guarantees__inner { display: grid; grid-template-columns: repeat(4, 339px); gap: 14px; width: calc(100% - 64px); max-width: 1398px; height: 100%; padding: 100px 0 0; box-sizing: border-box; } .where-buy-guarantee { display: flex; flex-direction: column; align-items: center; width: 339px; height: 156px; color: #FFFFFF; text-align: center; } .where-buy-guarantee > img { display: block; width: 46px; height: 46px; } .where-buy-guarantee h2 { margin: 20px 0 0; color: #FFFFFF; font-family: var(--font-sans); font-size: 18px; font-weight: 600; line-height: 26px; } .where-buy-guarantee p { width: 303px; margin: 16px 0 0; color: rgba(255, 255, 255, 0.6); font-family: var(--font-sans); font-size: 14px; font-weight: 400; line-height: 24px; text-align: center; } @media (max-width: 1500px) { .where-buy-main__inner, .where-buy-guarantees__inner { width: calc(100% - 64px); } }