/**
 * Greenfield canonical: Cards
 * v3.18.48
 */

.ssla-section.ssla-g-cards {
  background: var(--g-cards-bg);
  color: var(--g-cards-fg);
  padding: var(--g-cards-section-padding);
}
.ssla-g-cards-inner {
  max-width: var(--g-cards-content-max-width);
  margin: 0 auto;
  padding: 64px 24px;
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.ssla-g-cards-head {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 720px;
}
.ssla-g-cards-eyebrow {
  font: 600 12px/1.2 var(--shell-bf, system-ui);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--g-cards-eyebrow);
}
.ssla-g-cards-heading {
  font: 700 var(--g-cards-heading-size, clamp(26px, 3.5vw, 40px))/1.2 var(--g-cards-heading-family, var(--shell-hf, system-ui));
  color: var(--g-cards-heading);
  margin: 0;
}
.ssla-g-cards-intro {
  font: 400 var(--g-cards-body-size, 18px)/1.55 var(--g-cards-body-family, var(--shell-bf, system-ui));
  color: var(--g-cards-body);
  margin: 0;
}
.ssla-g-cards-grid {
  display: grid;
  gap: var(--g-cards-gap, 24px);
}
.ssla-g-cards-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: var(--g-cards-card-padding, 24px);
  background: var(--g-cards-card-bg, transparent);
  border: 1px solid var(--g-cards-card-border, transparent);
}
.ssla-g-cards-card-eyebrow {
  font: 600 11px/1.2 var(--shell-bf, system-ui);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--g-cards-eyebrow);
}
.ssla-g-cards-card-heading {
  font: 600 20px/1.3 var(--g-cards-heading-family, var(--shell-hf, system-ui));
  color: var(--g-cards-heading);
  margin: 0;
}
.ssla-g-cards-card-body {
  font: 400 15px/1.55 var(--g-cards-body-family, var(--shell-bf, system-ui));
  color: var(--g-cards-body);
  margin: 0;
}
.ssla-g-cards-card-cta {
  margin-top: auto;
  padding-top: 8px;
  font: 600 14px/1 var(--shell-bf, system-ui);
  color: var(--g-cards-heading);
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  align-self: flex-start;
}

/* Count */
.ssla-g-cards--count-two .ssla-g-cards-grid   { grid-template-columns: repeat(2, 1fr); }
.ssla-g-cards--count-three .ssla-g-cards-grid { grid-template-columns: repeat(3, 1fr); }
.ssla-g-cards--count-four .ssla-g-cards-grid  { grid-template-columns: repeat(4, 1fr); }

/* Card style */
.ssla-g-cards--card-style-plain    { --g-cards-card-bg: transparent; --g-cards-card-border: transparent; }
.ssla-g-cards--card-style-bordered { --g-cards-card-bg: transparent; --g-cards-card-border: rgba(0,0,0,0.12); }
.ssla-g-cards--card-style-filled   { --g-cards-card-bg: rgba(0,0,0,0.04); --g-cards-card-border: transparent; }

/* Density */
.ssla-g-cards--density-minimal .ssla-g-cards-head { display: none; }
.ssla-g-cards--density-standard .ssla-g-cards-eyebrow,
.ssla-g-cards--density-standard .ssla-g-cards-intro { display: none; }
/* density-rich: all visible */

/* Skeleton */
.ssla-g-cards {
  --g-cards-bg:                 transparent;
  --g-cards-fg:                 var(--brand-fg);
  --g-cards-eyebrow:            var(--brand-accent);
  --g-cards-heading:            var(--brand-fg);
  --g-cards-body:               var(--brand-fg);
  --g-cards-card-bg:            transparent;
  --g-cards-card-border:        transparent;
  --g-cards-heading-family:     var(--shell-hf, system-ui);
  --g-cards-heading-size:       clamp(26px, 3.5vw, 40px);
  --g-cards-body-family:        var(--shell-bf, system-ui);
  --g-cards-body-size:          18px;
  --g-cards-section-padding:    0;
  --g-cards-content-max-width:  1200px;
  --g-cards-gap:                24px;
  --g-cards-card-padding:       24px;
}

/* Tone */
.ssla-g-cards--tone-light {
  --g-cards-bg:      #ffffff;
  --g-cards-fg:      #1a1a1a;
  --g-cards-heading: #1a1a1a;
  --g-cards-body:    #4a4a4a;
}
.ssla-g-cards--tone-dark {
  --g-cards-bg:           #1a1a1a;
  --g-cards-fg:           #f5f5f5;
  --g-cards-heading:      #ffffff;
  --g-cards-body:         #d0d0d0;
  --g-cards-card-border:  rgba(255,255,255,0.12);
}
.ssla-g-cards--tone-dark.ssla-g-cards--card-style-bordered { --g-cards-card-border: rgba(255,255,255,0.18); }
.ssla-g-cards--tone-dark.ssla-g-cards--card-style-filled   { --g-cards-card-bg: rgba(255,255,255,0.06); }
.ssla-g-cards--tone-accent {
  --g-cards-bg:      var(--preset-accent-bg, #f5f3ef);
  --g-cards-fg:      var(--preset-accent-fg, #1a1a1a);
  --g-cards-heading: var(--preset-accent-fg, #1a1a1a);
  --g-cards-body:    var(--preset-accent-fg, #1a1a1a);
}

@media (max-width: 768px) {
  .ssla-g-cards-inner { padding: 40px 16px; gap: 28px; }
  .ssla-g-cards-grid { grid-template-columns: 1fr !important; }
  .ssla-g-cards-heading { font-size: clamp(22px, 5vw, 30px); }
}