/* =========================================================
   Alliance Products Listing — Bundled Stylesheet
   Self-contained; does not depend on theme styles.
   ========================================================= */

.alliance-products { font-family: 'Inter', system-ui, -apple-system, sans-serif; color: #1B2B4A; }

.alliance-products * { box-sizing: border-box; }

.alliance-products a { text-decoration: none; color: inherit; }

/* ── Layout ── */
.alliance-products .products-page-layout {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 56px;
  align-items: start;
}

/* ── Sidebar ── */
.alliance-products .sidebar { position: sticky; top: 80px; }

.alliance-products .sidebar-lbl {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: #363636;
  letter-spacing: 0;
  text-transform: none;
  padding: 0;
  border: none;
  margin: 0 0 14px;
  line-height: 1.3;
}

.alliance-products .sidebar-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.alliance-products .sidebar-item {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: #4A4843;
  padding: 8px 12px;
  border-radius: 4px;
  cursor: pointer;
  display: block;
  text-decoration: none;
  transition: background .15s ease, color .15s ease;
}

.alliance-products .sidebar-item:hover,
.alliance-products .sidebar-item.active {
  background: #F9F7F4;
  color: #1B2B4A;
  font-weight: 500;
}

/* ── Section titles ── */
.alliance-products .prod-section {
  margin-bottom: 56px;
  scroll-margin-top: 88px;
}
.alliance-products .prod-section:last-child { margin-bottom: 0; }

.alliance-products .prod-section-title {
  font-family: 'Familjen Grotesk', 'Inter', system-ui, -apple-system, sans-serif;
  font-size: 28px;
  font-weight: 600;
  color: #363636;
  letter-spacing: -.4px;
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid #DDD9D2;
}

/* ── Product grid (rows of three) ── */
.alliance-products .full-prod-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

/* ── Product card ── */
.alliance-products .full-prod-card {
  background: #FFFFFF;
  border: 1px solid #DDD9D2;
  border-radius: 8px;
  overflow: hidden;
  cursor: pointer;
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  transition: box-shadow .18s ease, border-color .18s ease, transform .18s ease;
}

.alliance-products .full-prod-card:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
  border-color: #C0BBB3;
  transform: translateY(-3px);
}

/* ── Card image ── */
.alliance-products .full-prod-vis {
  aspect-ratio: 4 / 3;
  background: #EDE9E3;
  border-bottom: 1px solid #DDD9D2;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #8C8880;
  font-size: 12px;
  overflow: hidden;
  position: relative;
}

.alliance-products .full-prod-vis .full-prod-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.alliance-products .full-prod-no-img {
  font-size: 12px;
  color: #8C8880;
}

/* ── Card body ── */
.alliance-products .full-prod-body {
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}

.alliance-products .full-prod-name {
  font-family: 'Familjen Grotesk', 'Inter', system-ui, -apple-system, sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: #1B2B4A;
  letter-spacing: -.1px;
  line-height: 1.3;
}

.alliance-products .full-prod-desc {
  font-size: 13px;
  color: #4A4843;
  line-height: 1.6;
  flex: 1;
}

.alliance-products .full-prod-link {
  font-size: 13px;
  font-weight: 500;
  color: #1B2B4A;
  margin-top: 12px;
  padding-top: 14px;
  border-top: 1px solid #ECEAE5;
  transition: letter-spacing .15s ease;
}

.alliance-products .full-prod-card:hover .full-prod-link {
  letter-spacing: .3px;
}

/* ── Smooth anchor scroll for sidebar links ── */
html { scroll-behavior: smooth; }

/* ── Empty state ── */
.alliance-products .alliance-empty {
  padding: 40px;
  text-align: center;
  color: #8C8880;
  background: #F9F7F4;
  border: 1px dashed #DDD9D2;
  border-radius: 8px;
}

/* ── Responsive ── */
@media (max-width: 900px) {
  .alliance-products .products-page-layout {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .alliance-products .sidebar { position: static; }
  .alliance-products .sidebar-list { flex-direction: row; flex-wrap: wrap; gap: 6px; }
  .alliance-products .full-prod-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 600px) {
  .alliance-products .full-prod-grid { grid-template-columns: 1fr; }
}

/* =========================================================
   CTA Band (matches the homepage / PDP CTA pattern)
   ========================================================= */
.alliance-products .pdp-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  padding: 11px 22px;
  border-radius: 6px;
  border: 1px solid transparent;
  cursor: pointer;
  white-space: nowrap;
  text-decoration: none;
  transition: all .15s ease;
}
.alliance-products .pdp-btn-lg { font-size: 15px; padding: 13px 28px; }
.alliance-products .pdp-btn-primary {
  background: #BF9C58;
  color: #FFFFFF;
  border-color: #BF9C58;
}
.alliance-products .pdp-btn-primary:hover {
  background: #A78645;
  border-color: #A78645;
  color: #FFFFFF;
}
.alliance-products .pdp-btn-ghost {
  background: transparent;
  color: rgba(255,255,255,.85);
  border-color: rgba(255,255,255,.22);
}
.alliance-products .pdp-btn-ghost:hover {
  border-color: rgba(255,255,255,.5);
  color: #FFFFFF;
}

.alliance-products .pdp-cta-band {
  background: #363636;
  color: #FFFFFF;
  padding: 72px 0;
  position: relative;
  overflow: hidden;
  margin-top: 72px;
}
.alliance-products .pdp-cta-band::before {
  content: '';
  position: absolute; inset: 0; pointer-events: none;
  background-image: radial-gradient(circle, rgba(255,255,255,.18) 1px, transparent 1px);
  background-size: 20px 20px;
  -webkit-mask-image: radial-gradient(ellipse at 100% 50%, black 10%, transparent 65%);
          mask-image: radial-gradient(ellipse at 100% 50%, black 10%, transparent 65%);
}
.alliance-products .pdp-cta-band .pdp-container {
  position: relative;
  z-index: 1;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 48px;
  flex-wrap: wrap;
}
.alliance-products .pdp-cta-headline {
  font-family: 'Familjen Grotesk', sans-serif;
  font-size: 30px;
  font-weight: 500;
  color: #FFFFFF;
  letter-spacing: -.4px;
  margin: 0 0 8px;
  line-height: 1.2;
}
.alliance-products .pdp-cta-sub {
  font-size: 15px;
  color: rgba(255,255,255,.55);
  margin: 0;
  max-width: 540px;
  line-height: 1.6;
}
.alliance-products .pdp-cta-contact {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: rgba(255,255,255,.7);
  margin: 14px 0 0;
  letter-spacing: .2px;
}
.alliance-products .pdp-cta-contact a {
  color: #BF9C58;
  text-decoration: none;
  border-bottom: 1px solid rgba(191,156,88,.45);
  transition: color .15s ease, border-color .15s ease;
}
.alliance-products .pdp-cta-contact a:hover {
  color: #FFFFFF;
  border-bottom-color: rgba(255,255,255,.5);
}
.alliance-products .pdp-cta-actions {
  display: flex;
  gap: 12px;
  flex-shrink: 0;
  flex-wrap: wrap;
}
.alliance-products .pdp-cta-band .c-mark {
  position: absolute;
  pointer-events: none;
  z-index: 2;
  width: 18px;
  height: 18px;
}
.alliance-products .pdp-cta-band .c-tl { top: 20px;    left: 20px;  border-top: 1.5px solid; border-left: 1.5px solid; }
.alliance-products .pdp-cta-band .c-tr { top: 20px;    right: 20px; border-top: 1.5px solid; border-right: 1.5px solid; }
.alliance-products .pdp-cta-band .c-bl { bottom: 20px; left: 20px;  border-bottom: 1.5px solid; border-left: 1.5px solid; }
.alliance-products .pdp-cta-band .c-br { bottom: 20px; right: 20px; border-bottom: 1.5px solid; border-right: 1.5px solid; }
.alliance-products .pdp-cta-band .c-lt  { border-color: rgba(255,255,255,.22); }
.alliance-products .pdp-cta-band .c-acc { border-color: rgba(191,156,88,.7); }

@media (max-width: 720px) {
  .alliance-products .pdp-cta-band .pdp-container { flex-direction: column; align-items: flex-start; padding: 0 24px; }
  .alliance-products .pdp-cta-headline { font-size: 26px; }
}
