/**
 * Brochures Section — yc-brochures-*
 * Uses design tokens; no hardcoded colours.
 */

.yc-brochures-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: var(--space-xl, 2rem);
  margin-bottom: var(--space-xl, 2rem);
}

.yc-brochure-card {
  background: var(--surface-card, #fff);
  border: var(--card-border, 1px solid rgba(60,42,20,.06));
  border-radius: var(--card-radius, 0.75rem);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition: box-shadow var(--transition-fast, 150ms), transform var(--transition-fast, 150ms);
}
.yc-brochure-card:hover {
  box-shadow: var(--shadow-hover);
  transform: var(--hover-lift, translateY(-2px));
}

.yc-brochure-thumb {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
}
.yc-brochure-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.yc-brochure-badge {
  position: absolute;
  top: var(--space-sm, .75rem);
  right: var(--space-sm, .75rem);
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  background: var(--color-primary, #1565c0);
  color: var(--ink-inverse, #ffffff);
  font-size: var(--text-xs, .72rem);
  font-weight: 600;
  letter-spacing: .06em;
  padding: .25rem .65rem;
  border-radius: var(--radius-full, 9999px);
}

.yc-brochure-body {
  padding: var(--space-lg, 1.5rem);
}

.yc-brochure-title {
  font-family: var(--font-heading, Montserrat, sans-serif);
  font-size: var(--text-md, 1.1rem);
  font-weight: 700;
  color: var(--ink-primary, #1a1a2e);
  margin: 0 0 var(--space-xs, .5rem);
  line-height: var(--leading-snug, 1.3);
}

.yc-brochure-sub {
  font-size: var(--text-sm, .85rem);
  color: var(--ink-secondary, #4a5568);
  line-height: var(--leading-normal, 1.6);
  margin: 0 0 var(--space-md, 1rem);
}

.yc-brochure-soon {
  display: inline-block;
  font-size: var(--text-xs, .75rem);
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--ink-tertiary, #8a9bb0);
  border: 1px solid currentColor;
  padding: .2rem .65rem;
  border-radius: var(--radius-full, 9999px);
}

.yc-brochures-cta-note {
  text-align: center;
  font-size: var(--text-sm, .875rem);
  color: var(--ink-secondary, #4a5568);
  margin: 0;
}