/**
 * CP · Partner Band — self-contained styles (token-driven, brand-agnostic).
 * Scoped under .cp-partner-band. Ported from the `.recognition*` rules on the
 * approved services hub, which shares the component with the brand pages.
 */
.cp-partner-band {
  --pb-fg: var(--wp--preset--color--text);
  --pb-primary: var(--wp--preset--color--primary);
  --pb-white: var(--wp--preset--color--white);
  --pb-display: var(--wp--preset--font-family--barlow-condensed);
  --pb-body: var(--wp--preset--font-family--roboto);
  --pb-rule: #E5E3DF;
  --pb-title: #0D1B2A;
  --pb-grey: var(--wp--preset--color--on-surface);
  --pb-cream: #FFF9F0;
  background: var(--pb-white);
  border-top: 1px solid var(--pb-rule);
  border-bottom: 1px solid var(--pb-rule);
  padding: 73px clamp(24px, 5vw, 80px);
  text-align: center;
}
.cp-partner-band .recognition__inner { max-width: 940px; margin: 0 auto; }
.cp-partner-band .recognition__eyebrow {
  font-family: var(--pb-body); font-weight: 700; font-size: 11px; line-height: 24px;
  letter-spacing: 2.5px; text-transform: uppercase; color: var(--pb-primary); margin: 0;
}
.cp-partner-band h2 {
  font-family: var(--pb-display); font-weight: 700; font-size: clamp(28px, 3.4vw, 36px);
  line-height: 1.05; color: var(--pb-fg); margin: 10px 0 0;
}
.cp-partner-band h2 em { font-style: normal; color: var(--pb-primary); }
.cp-partner-band .recognition__sub {
  font-family: var(--pb-body); font-size: 15px; line-height: 25.5px; color: var(--pb-fg);
  margin: 12px auto 0; max-width: 760px;
}
.cp-partner-band .recognition__grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;
  max-width: 900px; margin: 32px auto 0;
}
.cp-partner-band .recognition__grid--two { grid-template-columns: repeat(2, 1fr); max-width: 620px; }
.cp-partner-band .recognition__grid--four { grid-template-columns: repeat(4, 1fr); max-width: none; }
.cp-partner-band .recognition__card {
  background: var(--pb-white); border: 1px solid var(--pb-primary); border-top-width: 3px;
  border-radius: 2px; padding: 31px 25px 29px;
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  text-decoration: none; transition: transform 0.15s, box-shadow 0.15s;
}
.cp-partner-band a.recognition__card:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08); }
.cp-partner-band .recognition__logo { width: 100%; height: 84px; object-fit: contain; display: block; }
/* Accreditation cards mark a credential with a glyph where a brand card has a logo. */
.cp-partner-band .recognition__card-icon {
  font-size: 36px; line-height: 1; color: var(--pb-title);
  display: flex; align-items: center; justify-content: center; width: 48px; height: 48px;
}
.cp-partner-band .recognition__card-title {
  font-family: var(--pb-display); font-weight: 700; font-size: 17px; line-height: 20.4px;
  letter-spacing: 0.68px; text-transform: uppercase; color: var(--pb-title); text-align: center;
}
.cp-partner-band .recognition__card-link {
  font-family: var(--pb-body); font-weight: 700; font-size: 12px; letter-spacing: 0.5px;
  text-transform: uppercase; color: var(--pb-primary);
}

@media (max-width: 980px) {
  .cp-partner-band .recognition__grid,
  .cp-partner-band .recognition__grid--four { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .cp-partner-band .recognition__grid,
  .cp-partner-band .recognition__grid--four { grid-template-columns: 1fr; }
}

/* Accreditation-badge variant (the city hub page's recognition band): badge,
   a constrained explanatory paragraph, and a scheduling CTA in place of the
   logo-card grid. */
.cp-partner-band .recognition__badge { display: block; max-width: 260px; height: auto; margin: 24px auto 0; }
.cp-partner-band .recognition__body {
  font-family: var(--pb-body); font-size: 14px; line-height: 24px; color: var(--pb-fg);
  max-width: 760px; margin: 16px auto 0;
}
.cp-partner-band .recognition__cta {
  display: inline-flex; align-items: center; justify-content: center;
  margin-top: 26px; background: var(--pb-primary); color: var(--wp--custom--color--on-primary);
  font-family: var(--pb-body); font-weight: 600; font-size: 15px; line-height: 1;
  border: 0; border-radius: 4px; padding: 13px 18px; text-decoration: none; cursor: pointer;
}
.cp-partner-band .recognition__cta:hover { filter: brightness(1.05); color: var(--wp--custom--color--on-primary); }
/* The Playbook's legacy-layout spokes, Palm Harbor, the Kentucky hubs, Memphis
   and Nashville use the Schedule gradient here, not solid Cardinal. */
.cp-partner-band.is-cta-gradient .recognition__cta {
  background: linear-gradient(to right, var(--schedule-grad-1), var(--schedule-grad-2));
}

/* is-services: the logos open a services section, as on Grästen's Installation
   page (client audit SV3): grey surface, left-aligned head, no rules. The grid
   below it (cp-service-grid is-continued) carries on the same surface. */
.cp-partner-band.is-services { background: var(--pb-grey); border: 0; text-align: left; padding-bottom: 0; }
.cp-partner-band.is-services .recognition__inner { max-width: 1100px; }
.cp-partner-band.is-services .recognition__card { text-align: center; }
.cp-partner-band.is-services .recognition__sub { margin-left: 0; margin-right: 0; max-width: none; }


/* Surfaces (the page's section colour). */
.cp-partner-band.is-surface-white { background: var(--pb-white); }
.cp-partner-band.is-surface-grey { background: var(--pb-grey); }
.cp-partner-band.is-surface-cream { background: var(--pb-cream); }
/* is-section: an ordinary page section, as on GenerX's product and service pages (Playbook
   PR #118): left-aligned head, dark eyebrow, the 44px section heading, no hairline rules;
   the cards stay centred. */
.cp-partner-band.is-section { border: 0; text-align: left; }
.cp-partner-band.is-section .recognition__inner { max-width: 1100px; }
.cp-partner-band.is-section .recognition__eyebrow { color: var(--pb-fg); }
.cp-partner-band.is-section h2 { font-size: clamp(32px, 4vw, 44px); line-height: 1.1; margin-top: 11px; }
.cp-partner-band.is-section .recognition__card { text-align: center; }
/* An optional row of links under the cards, centred, as the Playbook's .acc-more line. */
.cp-partner-band .recognition__links {
  margin: 20px auto 0; text-align: center; font-family: var(--pb-body); font-weight: 700;
  font-size: 13px; letter-spacing: 0.5px; text-transform: uppercase;
}
.cp-partner-band .recognition__links a { color: var(--pb-primary); text-decoration: none; }
.cp-partner-band .recognition__links a:hover { text-decoration: underline; }
.cp-partner-band .recognition__links-sep { color: var(--pb-fg); }
