/* ==========================================================================
   digital.css – Digital services grid and how-we-work steps
   Part of the Devraj Pathak theme. Breakpoints are in responsive.css.
   ========================================================================== */

.dp-digital { overflow: hidden; }
.dp-digital::before {
	content: ""; position: absolute; right: -200px; top: -200px; width: 600px; height: 600px; border-radius: 50%;
	background: radial-gradient(circle, rgba(195, 154, 78, .18), transparent 70%);
	pointer-events: none;
}
.dp-digital__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; margin-bottom: 56px; }
.dp-digital__head .dp-section__head { max-width: 640px; }
.dp-digital__actions { display: flex; flex-wrap: wrap; gap: 12px; flex-shrink: 0; }

.dp-service-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; position: relative; }
.dp-service {
	display: flex; flex-direction: column;
	padding: 30px 26px; border-radius: var(--dp-radius);
	background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .1);
	transition: background .3s, transform .3s var(--dp-ease), border-color .3s;
}
.dp-service:hover { background: rgba(255, 255, 255, .08); border-color: rgba(227, 198, 139, .4); transform: translateY(-4px); }
.dp-service__icon { background: rgba(227, 198, 139, .14); color: var(--dp-gold-2); }
.dp-service__icon .dp-icon { width: 26px; height: 26px; }
.dp-service h3 { font-size: 24px; }
.dp-service p { font-size: 14.5px; margin-bottom: 18px; }
.dp-service a:not(.dp-btn) { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 14px; color: var(--dp-gold-2); }
.dp-service a:not(.dp-btn):hover { color: var(--dp-white); }
.dp-service a .dp-icon { width: 16px; height: 16px; }
.dp-service--cta { background: var(--dp-gold); border-color: var(--dp-gold); color: var(--dp-ink); justify-content: center; }
.dp-service--cta:hover { background: var(--dp-gold-2); }
.dp-service--cta h3 { color: var(--dp-ink); }
.dp-service--cta .dp-btn { align-self: flex-start; background: var(--dp-forest); color: var(--dp-white); }
.dp-service--cta .dp-btn:hover { background: var(--dp-ink); color: var(--dp-white); }

/* Process steps (Digital page) */
.dp-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
.dp-steps .dp-pillar { position: relative; }
.dp-steps__num { position: absolute; top: 26px; right: 26px; font-family: var(--dp-font-head); font-size: 40px; font-weight: 700; color: var(--dp-sand); line-height: 1; }