/* ===== SHARED SECTION STYLES =====
   Loaded by every page after base.css, before the page stylesheet. */

/* ===== Common Sections ===== */
.section {
  padding: var(--space-6) var(--gutter);
}

.section-heading {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: var(--space-3);
  align-items: end;
  margin-bottom: var(--space-4);
}

.section-link {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--space-3);
}

/* ===== Cards (flat: solid surface, hairline border, one soft shadow) ===== */
.service-card,
.work-tile,
.contact-panel,
.package-card,
.journal-card,
.proof-card,
.value-card,
.brief-form,
.contact-aside {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  transition:
    transform 300ms cubic-bezier(0.2, 0.8, 0.2, 1),
    box-shadow 300ms ease,
    border-color 300ms ease;
}

.service-card:hover,
.work-tile:hover,
.package-card:hover,
.journal-card:hover,
.proof-card:hover,
.value-card:hover {
  border-color: var(--line);
  box-shadow: var(--shadow-lift);
  transform: translateY(-4px);
}

.service-card {
  display: flex;
  flex-direction: column;
  min-height: 18rem;
  padding: var(--space-3);
}

.service-index {
  width: fit-content;
  margin-bottom: auto;
  color: var(--gold);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.14em;
}

.service-card h3 {
  margin-top: 3rem;
}

.service-card p {
  margin: 0.8rem 0 0;
  font-size: 0.93rem;
}

/* ===== Split Band ===== */
.split-band {
  display: grid;
  grid-template-columns: minmax(18rem, 0.85fr) minmax(0, 1.15fr);
  gap: var(--space-4);
  align-items: center;
  padding: var(--space-6) var(--gutter);
}

.split-copy h2 {
  max-width: 14ch;
}

/* ===== Card Grids ===== */
.journal-grid,
.package-grid,
.values-grid,
.proof-section {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-2);
  padding: var(--space-6) var(--gutter);
}

.journal-card,
.package-card,
.proof-card,
.value-card {
  min-height: 13rem;
  padding: var(--space-3);
}

.journal-card span,
.showcase-item span {
  color: var(--gold);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.journal-card h3,
.package-card h3,
.proof-card strong,
.value-card h3 {
  display: block;
  margin-top: 2.5rem;
  font-family: var(--font-display);
  font-size: clamp(1.25rem, 2vw, 1.6rem);
  line-height: 1.15;
}

/* ===== Responsive Design ===== */
@media (max-width: 980px) {
  .section-heading,
  .split-band,
  .manifesto-section,
  .contact-grid {
    grid-template-columns: 1fr;
  }

  .journal-grid,
  .package-grid,
  .values-grid,
  .proof-section {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .section {
    padding: var(--space-5) 1rem;
  }

  .section-heading {
    gap: var(--space-2);
    margin-bottom: var(--space-3);
  }

  .service-card {
    min-height: 13rem;
  }

  .journal-card,
  .package-card,
  .proof-card,
  .value-card {
    min-height: 0;
  }
}
