/* ===============  SERVICES PAGE (standalone)  =============== */
:root{
  --brand-orange:#f4a936;
  --text:#222;
}

/* ---------- Main copy block ---------- */
.services{
  max-width: 900px;
  margin: 2rem auto;
  padding: 0 1.25rem;
  font-family: Georgia, serif;
  font-size: 17px;                /* as approved */
  line-height: 1.7;
  color: var(--text);
  text-align: justify;
}
.services h1{
  font-family: Georgia, serif;
  font-size: 46px;                /* as approved */
  font-weight: 400;
  margin: 0 0 1rem 0;
  color: #000;
}
.service-title{
  font-family: Georgia, serif;
  font-weight: 400;               /* NOT bold */
  font-size: 20px;
  margin: 1.25rem 0 .5rem 0;
}

/* ---------- Full-width orange divider (shows across viewport) ---------- */
.svc-divider{
  width: 100vw;
  height: 3px;
  background: var(--brand-orange);
  margin: 24px 0;                 /* space around line */
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}

/* ---------- Collaborators heading & logo row ---------- */
.collaborators-title{
  max-width: 900px;
  margin: 0 auto 14px auto;
  padding: 0 1.25rem;
  font-family: Georgia, serif;
  font-size: 25px;
  color: #555;
  text-align: left;               /* keep on the left */
}
.collabs{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2.25rem;                   /* spacing between logos */
  flex-wrap: wrap;
  margin: 6px 0 16px 0;
}
.collabs img{
  max-height: 62px;
  height: auto;
  width: auto;
}

/* ---------- Full-bleed quote section ---------- */
/* Utility to escape page side padding and span the viewport */
.edge-full{
  position: relative;
  width: 100vw;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}

/* Image + overlay */
.svc-quote-section{
  position: relative;
  width: 100%;
  overflow: hidden;
}
.svc-quote-img{
  display: block;
  width: 100%;
  height: auto;
  filter: brightness(62%);        /* darken for contrast */
}

/* Center overlay relative to the viewport */
.svc-quote-overlay{
  position: absolute;
  inset: 0;                       /* top/right/bottom/left: 0 */
  display: grid;
  place-items: center;            /* vertical + horizontal center */
  text-align: center;
  pointer-events: none;
}
.svc-quote-box{
  max-width: min(1100px, 88vw);
  padding: 0 3vw;
  margin: 0 auto;
}

/* Exactly 3 lines on desktop */
.svc-quote-text{
  margin: 0;
  line-height: 1.18;
}
.svc-quote-text .q-line{
  display: block;
  white-space: nowrap;            /* each span stays one line */
  font-family: Georgia, serif;
  font-size: clamp(26px, 3vw, 44px);
  color: #fff;
}

/* Author centered under the quote (not overlaying it) */
.svc-quote-author{
  margin-top: 14px;
  font-family: Georgia, serif;
  font-size: clamp(14px, 1.2vw, 20px);
  color: #fff;
  letter-spacing: .06em;
}

/* Bottom orange divider under the image (optional; keep if you use it) */
.svc-divider--below{
  margin-top: 18px;
}

/* ---------- Responsiveness ---------- */
@media (max-width: 900px){
  .services{ padding: 0 1rem; font-size: 16px; }
  .svc-quote-text .q-line{ white-space: normal; } /* allow wrapping on mobile */
  .collabs{ gap: 1.25rem; }
  .collabs img{ max-height: 54px; }
}
/* === Services typography tweak (final) === */
.services p{
  font-family: Georgia, serif !important;
  font-size: 17px !important;
  line-height: 1.7 !important;
  color: #333 !important;
  text-align: justify !important;
}

/* Covers both class names you've used for the headings */
.service-title,
.svc-sec{
  font-family: Georgia, serif !important;
  font-weight: 400 !important;   /* not bold */
  font-size: 20px !important;
  margin: 1.25rem 0 .5rem 0 !important;
}

/* Keep the page H1 as approved */
.services h1{
  font-family: Georgia, serif !important;
  font-weight: 400 !important;
  font-size: 46px !important;
  margin: 0 0 1rem 0 !important;
  color: #000 !important;
}
/* Collaborators heading: Georgia 25px, grey, same margins as main text */
.collaborators{
  font-family: Georgia, serif !important;
  font-weight: 400 !important;
  font-size: 25px !important;
  color: #555 !important;

  /* match .services block margins */
  max-width: 900px !important;
  margin: 0 auto .8rem auto !important;
  padding: 0 1.25rem !important;
  text-align: left !important;
}
/* or go a bit roomier */
.collaborators{ margin: 0 auto 2rem auto !important; }
/* Extra space before the "Collaborators" heading */
.collaborators{
  margin-top: 1.25rem !important;  /* tweak this up/down if needed */
}