/* Brand-coloured service posters arranged as a horizontal product catalog. */
.homepage .service-catalog { background: #181818; color: #f6f6f6; padding: clamp(54px,6vw,96px) 0 clamp(46px,5vw,80px); border: 0; }
.homepage .catalog-container { --catalog-gutter: max(clamp(18px,5vw,120px),calc((100vw - 1920px)/2)); width: calc(100% - var(--catalog-gutter)*2); max-width: 1920px; margin-inline: auto; }
.homepage .catalog-repair-link {
  display: inline-flex;
  align-items: center;
  justify-self: start;
  gap: 12px;
  min-height: 44px;
  margin-bottom: 20px;
  padding: 9px 14px;
  border: 1px solid #ed56616b;
  border-radius: 10px;
  background: #c42d3a35;
  color: #ffd4d8;
  font-size: 14px;
  font-weight: 600;
}
.homepage .catalog-repair-link:hover { background: #c42d3a55; border-color: #ed5661; }
.homepage .catalog-repair-link:focus-visible { outline-color: #ff9197; outline-offset: 3px; }
.homepage .service-catalog .catalog-heading h2 { margin: 0; text-align: left; font: 600 clamp(30px,3vw,48px)/1.14 Arial,Helvetica,sans-serif; letter-spacing: -.045em; }
.homepage .catalog-heading p { margin: 16px 0 0; color: #aaa; font-size: 16px; line-height: 1.5; }
.homepage .catalog-track { display: flex; align-items: stretch; gap: 20px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: var(--catalog-gutter); scroll-behavior: smooth; scrollbar-width: none; margin: 38px calc(var(--catalog-gutter)*-1) 0; padding: 2px var(--catalog-gutter) 8px; }
.homepage .catalog-track::-webkit-scrollbar { display: none; }
.homepage .catalog-card { --catalog-accent: #0cc982; --catalog-rgb: 12,201,130; flex: 0 0 clamp(310px,24vw,420px); display: flex; flex-direction: column; min-width: 0; min-height: 394px; padding: 24px; border: 1px solid rgba(var(--catalog-rgb),.5); border-radius: 26px; background: rgba(var(--catalog-rgb),.045); color: #f5f5f5; scroll-snap-align: start; transition: border-color .2s,background .2s; }
.homepage .catalog-card[data-kind=exchange] { --catalog-accent: #eb424c; --catalog-rgb: 235,66,76; }
.homepage .catalog-card[data-kind=setup] { --catalog-accent: #f0f0f0; --catalog-rgb: 240,240,240; }
.homepage .catalog-card:hover { border-color: var(--catalog-accent); }
.homepage .catalog-card-header { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: start; gap: 14px; min-height: 38px; font-size: 12px; line-height: 1.4; font-weight: 700; }
.homepage .catalog-card-header>span { color: var(--catalog-accent); }
.homepage .catalog-card-header>strong { color: #bbb; text-align: right; font-size: 12px; font-weight: 500; }
.homepage .catalog-card-body { display: grid; grid-template-columns: minmax(76px,.64fr) minmax(0,1fr); align-items: center; gap: 18px; flex: 1; padding: 22px 0 28px; }
.homepage .catalog-icon { width: 100%; height: 190px; object-fit: contain; object-position: center; filter: brightness(0) invert(1); opacity: .87; }
.homepage .catalog-card-body h3 { margin: 0 0 18px; font: 800 clamp(21px,1.5vw,27px)/1.08 Arial,Helvetica,sans-serif; letter-spacing: -.035em; }
.homepage .catalog-card-body p { margin: 0; font-size: 14px; font-weight: 400; line-height: 1.55; color: #bcbcbc; }
.homepage .catalog-card-button { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: auto; min-height: 46px; padding: 12px 16px; border: 1px solid rgba(var(--catalog-rgb),.4); border-radius: 11px; background: rgba(var(--catalog-rgb),.08); color: #fff; font-size: 14px; font-weight: 600; line-height: 1.3; text-align: left; transition: background .2s,border-color .2s; }
.homepage .catalog-card-button:hover { background: rgba(var(--catalog-rgb),.18); border-color: var(--catalog-accent); }
.homepage .catalog-card-button>span { font-size: 19px; font-weight: 400; }
.homepage .catalog-card-button:focus-visible { outline-color: #ac1830; }
.homepage .catalog-controls { display: flex; align-items: center; width: min(804px,100%); gap: clamp(18px,2.8vw,48px); margin: 48px auto 0; }
.homepage .catalog-progress { position: relative; flex: 1; min-width: 0; height: 3px; background: #ffffff20; border-radius: 2px; overflow: hidden; }
.homepage .catalog-progress>span { position: absolute; inset: 0 auto 0 0; min-width: 24px; width: 30%; background: #eee; border-radius: 2px; transition: width .15s; }
.homepage .catalog-arrows { display: flex; flex: none; gap: 16px; }
.homepage .catalog-arrows button { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; padding: 8px 11px; border: 1px solid #ffffff32; border-radius: 8px; background: transparent; color: #eee; font-size: 12px; line-height: 1; transition: background .2s,opacity .2s; }
.homepage .catalog-arrows button:hover:not(:disabled) { background: #ffffff08; }
.homepage .catalog-arrows button:disabled { opacity: .3; cursor: default; background: transparent; }
@media(min-width:1800px) {
  .homepage .catalog-card { min-height: 426px; padding: 28px; border-radius: 28px; }
  .homepage .catalog-card-header,.homepage .catalog-card-header>strong { font-size: 14px; }
  .homepage .catalog-card-body { gap: 22px; padding-block: 26px 32px; }
  .homepage .catalog-card-body p { font-size: 15px; }
  .homepage .catalog-card-button { min-height: 50px; font-size: 16px; }
}
@media(max-width:900px) {
  .homepage .catalog-card { padding: 22px; }
  .homepage .catalog-card-body { gap: 16px; }
  .homepage .catalog-icon { height: 172px; }
  .homepage .catalog-card-body h3 { font-size: 22px; }
  .homepage .catalog-card-body p { font-size: 13px; }
}
@media(max-width:650px) {
  .homepage .catalog-container { --catalog-gutter: 18px; }
  .homepage .catalog-track { gap: 14px; margin-top: 28px; }
  .homepage .catalog-card { flex-basis: min(340px,calc(100% - 18px)); min-height: 366px; padding: 20px; border-radius: 23px; }
  .homepage .catalog-card-header,.homepage .catalog-card-header>strong { font-size: 11px; }
  .homepage .catalog-card-body { grid-template-columns: minmax(70px,.6fr) minmax(0,1fr); gap: 14px; padding-block: 18px 24px; }
  .homepage .catalog-icon { height: 170px; }
  .homepage .catalog-card-body h3 { font-size: 23px; margin-bottom: 14px; }
  .homepage .catalog-card-body p { font-size: 13px; }
  .homepage .catalog-card-button { min-height: 44px; font-size: 13px; }
  .homepage .catalog-heading p { font-size: 14px; }
  .homepage .catalog-controls { margin-top: 32px; gap: 18px; }
  .homepage .catalog-arrows { gap: 12px; }
}
@media(max-width:350px) {
  .homepage .catalog-card { padding: 17px; }
  .homepage .catalog-card-body { grid-template-columns: 52px minmax(0,1fr); gap: 10px; }
  .homepage .catalog-card-body h3 { font-size: 18px; overflow-wrap: anywhere; }
  .homepage .catalog-card-body p { font-size: 12px; }
  .homepage .catalog-card-header { gap: 10px; }
}
@media(prefers-reduced-motion:reduce) { .homepage .catalog-track { scroll-behavior: auto; } }

.homepage .catalog-results { min-width: 0; }
.homepage .catalog-card[hidden] { display: none; }
.homepage { --catalog-edge: #0b0c0c; }
.homepage .service-catalog[data-layout=picker] {
  padding-block: clamp(66px,7vw,114px) clamp(62px,6vw,100px);
  background: radial-gradient(ellipse at 82% 12%, #111916 0%, transparent 58%), linear-gradient(#070707, var(--catalog-edge));
  color-scheme: dark;
}
.homepage .service-catalog[data-layout=picker] .catalog-container {
  display: grid;
  grid-template-columns: minmax(230px, .75fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(24px, 4vw, 56px);
  max-width: 1120px;
}
.homepage .service-catalog[data-layout=picker] .catalog-repair-link { grid-column: 1 / -1; margin-bottom: 0; }
.homepage .service-catalog[data-layout=picker] .catalog-filters {
  display: grid;
  gap: 8px;
  margin-top: 24px;
}
.homepage .catalog-sidebar {
  padding: clamp(18px,2.5vw,32px);
  border: 1px solid #ffffff18;
  border-radius: 20px;
  background: #151717b5;
}
.homepage .catalog-filters button {
  min-height: 48px;
  padding: 10px 15px;
  border: 1px solid #ffffff26;
  border-radius: 10px;
  background: #ffffff08;
  color: #eee;
  text-align: left;
  font-size: 14px;
  font-weight: 600;
}
.homepage .catalog-filters button:hover,
.homepage .catalog-filters button[aria-pressed=true] {
  border-color: #0cc98288;
  background: #0cc98217;
}
.homepage .catalog-filters button[aria-pressed=true] { color: #73e5b4; }
.homepage .catalog-filters button:focus-visible { outline: 2px solid #73e5b4; outline-offset: 3px; }
.homepage .service-catalog[data-layout=picker] .catalog-all-services {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  margin-top: 18px;
  padding: 9px 14px;
  border: 1px solid #ffffff30;
  border-radius: 10px;
  color: #eee;
  background: #ffffff08;
  font-size: 14px;
}
.homepage .catalog-all-services:hover { border-color: #73e5b4; }
.homepage .catalog-all-services:focus-visible { outline: 2px solid #73e5b4; outline-offset: 3px; }
.homepage .service-catalog[data-layout=picker] .catalog-track {
  margin: 0;
  padding: 4px 4px 8px;
  scroll-padding-inline: 4px;
}
.homepage .service-catalog[data-layout=picker] .catalog-card {
  flex-basis: 100%;
  min-height: 420px;
  background: linear-gradient(145deg,rgba(var(--catalog-rgb),.085),transparent 65%), #171919;
}
.homepage .catalog-card-header > span { justify-self: start; padding: 5px 8px; border-radius: 5px; background: rgba(var(--catalog-rgb),.1); }
.homepage .catalog-card-header > strong { align-self: center; }
.homepage .catalog-card-body .catalog-icon {
  padding: 12px;
  border-radius: 14px;
  background: #0000000d;
}
.homepage .catalog-card-button { justify-content: center; text-align: center; }
.homepage .service-catalog[data-layout=picker] .catalog-controls { margin-top: 14px; }
@media (max-width: 760px) {
  .homepage .service-catalog[data-layout=picker] .catalog-container { grid-template-columns: minmax(0,1fr); gap: 20px; }
  .homepage .service-catalog[data-layout=picker] .catalog-filters { grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 16px; }
  .homepage .catalog-filters button { padding-inline: 10px; font-size: 13px; }
  .homepage .service-catalog[data-layout=picker] .catalog-card { min-height: 375px; }
}
