/* Hosting service cards adapted from anayil.com, four categories matching the reference homepage. */
.anayil-hosting-services { padding: 36px 0 72px; }
.anayil-services-heading { max-width: 680px; text-align: center; margin: 0 auto 44px; }
.anayil-services-heading h2 { font-size: clamp(28px, 3.2vw, 36px); font-weight: 700; letter-spacing: -.03em; line-height: 1.2; margin: 0 0 14px; color: #2b2b2b; }
.anayil-services-heading p { font-size: 16px; line-height: 1.65; color: #6b6b6b; margin: 0; }
.anayil-services-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.anayil-service-card { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 40px 24px 32px; border: 1px solid #d9d7d2; border-radius: 20px; background: #fff; box-shadow: 0 2px 16px #1f7a5c12; transition: transform .25s, border-color .25s, box-shadow .25s; }
.anayil-service-card:hover, .anayil-service-card:focus-within { transform: translateY(-4px); border-color: #1f7a5c; box-shadow: 0 12px 30px #1f7a5c16; }
.anayil-service-icon { width: 56px; height: 56px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; background: #eaf3ee; color: #1f7a5c; border-radius: 12px; margin-bottom: 20px; font-size: 28px; transition: background-color .25s, color .25s; }
.anayil-service-card:hover .anayil-service-icon, .anayil-service-card:focus-within .anayil-service-icon { background: #1f7a5c; color: white; }
.anayil-service-card h3 { font-size: 18px; font-weight: 600; line-height: 1.4; letter-spacing: -.015em; margin: 0 0 14px; color: #2b2b2b; }
.anayil-service-card p { font-size: 14px; line-height: 1.75; color: #6b6b6b; margin: 0 0 20px; }
.anayil-service-link { display: inline-flex; align-items: center; justify-content: center; gap: 9px; font-size: 15px; font-weight: 600; color: #1f7a5c; margin-top: auto; padding: 4px 0; }
.anayil-service-link:hover { color: #185f48; text-decoration: underline; }
.anayil-service-link:focus-visible { outline: 2px solid #c9a86a; outline-offset: 5px; border-radius: 3px; }
.anayil-service-link i { font-size: 14px; }
@media (max-width: 575.98px) {
  .anayil-hosting-services { padding: 20px 0 48px; }
  .anayil-services-heading { margin-bottom: 28px; }
  .anayil-services-grid { grid-template-columns: 1fr; gap: 18px; }
  .anayil-service-card { padding: 30px 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .anayil-service-card, .anayil-service-icon { transition: none; }
  .anayil-service-card:hover, .anayil-service-card:focus-within { transform: none; }
}

@media (min-width: 576px) and (max-width: 991.98px) { .anayil-services-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }