/* ============================================================
   6. SERVICES
   ============================================================ */
.rh-por-svcs { background: #f7f7f7; width: 100%; }
.rh-por-svcs-pad { padding: 80px 0; }

.rh-svcs-header {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0 48px;
  align-items: end; margin: 0 0 40px;
}
.rh-svcs-header h2 { margin-bottom: 0; }
.rh-svcs-header-sub { font-size: 15px; font-weight: 600; color: #808080; line-height: 1.65; margin: 0; padding: 0; padding-bottom: 4px; }

/* Featured service — large, with screenshot */
.rh-svc-featured {
  background: #262626; border-radius: 20px; padding: 40px; margin: 0 0 12px;
  display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center;
  border-left: 3px solid #BFD8B3;
}
.rh-svc-featured-tag { font-size: 10px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: #BFD8B3; display: block; margin: 0 0 10px; }
.rh-svc-featured-title { font-size: 32px; font-weight: 600; color: #ffffff; display: block; line-height: 1.15; margin: 0 0 10px; }
.rh-svc-featured-hook { font-size: 15px; font-weight: 600; color: #99AD8F; display: block; margin: 0 0 16px; }
.rh-svc-featured-text { font-size: 14px; font-weight: 600; color: #585858; line-height: 1.65; display: block; }

.rh-svc-shot {
  border-radius: 14px; overflow: hidden; border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 16px 40px rgba(0,0,0,0.35); background: #1b1b1b; line-height: 0;
}
.rh-svc-shot img { width: 100%; height: auto; display: block; }

/* 3 compact services */
.rh-svcs-compact { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.rh-svc-new {
  background: #ffffff; border-radius: 20px; padding: 32px 30px;
  border-left: 3px solid #BFD8B3; transition: transform 0.2s, box-shadow 0.2s;
}
.rh-svc-new:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,0.07); }
.rh-svc-tag { font-size: 10px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: #BFD8B3; display: block; margin: 0 0 6px; }
.rh-svc-tagline { font-size: 22px; font-weight: 600; color: #262626; display: block; margin: 0 0 6px; }
.rh-svc-hook { font-size: 13px; font-weight: 600; color: #99AD8F; display: block; margin: 0 0 12px; }
.rh-svc-preview { font-size: 13px; font-weight: 600; color: #585858; line-height: 1.65; display: block; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 900px) {
  .rh-svcs-header { grid-template-columns: 1fr; gap: 16px 0; align-items: start; }
  .rh-svc-featured { grid-template-columns: 1fr; padding: 32px 24px; gap: 24px; }
  .rh-svcs-compact { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .rh-por-svcs-pad { padding: 48px 0; }
  .rh-svc-featured { padding: 24px 20px; border-radius: 16px; }
  .rh-svc-featured-title { font-size: 26px; }
  .rh-svc-new { padding: 24px 22px; }
}