.services-section {
  position: relative;
  isolation: isolate;
  overflow: clip;
  scroll-margin-top: 104px;
  padding-block: clamp(64px, 6.4vw, 94px) clamp(62px, 5.2vw, 82px);
  background-color: #102633;
  background-image:
    linear-gradient(180deg, rgba(4, 14, 22, .97) 0%, rgba(6, 25, 35, .9) 14%, rgba(8, 30, 40, .8) 30%, rgba(5, 22, 31, .88) 100%),
    linear-gradient(90deg, rgba(5, 21, 30, .84), rgba(9, 35, 44, .64) 32%, rgba(8, 31, 40, .66) 68%, rgba(5, 20, 29, .84)),
    url("../images/services-office-atmosphere-v1.png");
  background-position: center;
  background-size: cover;
}

.services-section::before,
.services-section::after { position: absolute; z-index: -1; content: ""; pointer-events: none; }
.services-section::before { inset: 0; background: radial-gradient(120% 115px at 18% 0%, rgba(31, 79, 94, .24), transparent 68%), linear-gradient(180deg, rgba(3, 13, 21, .82) 0%, rgba(8, 30, 40, .62) 24%, rgba(5, 20, 29, .46) 54%, rgba(2, 12, 20, .52) 100%), radial-gradient(ellipse 52% 45% at 50% 52%, rgba(2, 14, 23, .22), rgba(2, 12, 20, .52) 77%, rgba(2, 10, 16, .62)); }
.services-section::after { inset-inline: 0; bottom: -1px; height: 132px; background: linear-gradient(180deg, transparent, rgba(5, 14, 21, .78) 82%, #050e15); }

.services-section__glow,
.services-section__lines,
.services-section__particles { position: absolute; z-index: -1; pointer-events: none; }
.services-section__glow { top: 2%; inset-inline-start: 50%; width: min(72vw, 1040px); height: 260px; transform: translateX(-50%); background: radial-gradient(ellipse, rgba(28, 76, 98, .16), rgba(13, 39, 53, .03) 52%, transparent 73%); filter: blur(15px); }
.services-section__lines { inset: 0; overflow: hidden; }
.services-section__lines::before { position: absolute; top: -86px; inset-inline-start: -13vw; width: 126vw; height: 144px; border-block-end: 1px solid rgba(223, 174, 100, .17); border-radius: 0 0 52% 45%; background: radial-gradient(80% 96px at 35% 0%, rgba(37, 88, 102, .16), transparent 74%); content: ""; opacity: .62; pointer-events: none; transform: rotate(-1deg); }
.services-section__lines i { position: absolute; display: block; border: 1px solid rgba(226, 180, 109, .1); border-radius: 50%; }
.services-section__lines i:first-child { top: -300px; inset-inline-start: -174px; width: min(50vw, 720px); height: 380px; border-inline-end-color: transparent; border-block-end-color: rgba(237, 190, 118, .2); transform: rotate(-18deg); }
.services-section__lines i:last-child { right: -250px; bottom: -320px; width: min(49vw, 720px); height: 350px; border-inline-start-color: transparent; border-block-start-color: rgba(221, 167, 93, .13); transform: rotate(13deg); }
.services-section__particles { inset: 0; }
.services-section__particles i { position: absolute; width: 3px; height: 3px; border-radius: 50%; background: rgba(241, 193, 117, .65); box-shadow: 0 0 11px rgba(238, 182, 92, .38); animation: services-particle 13s ease-in-out infinite; }
.services-section__particles i:nth-child(1) { top: 22%; inset-inline-start: 12%; }
.services-section__particles i:nth-child(2) { top: 31%; inset-inline-end: 11%; width: 2px; height: 2px; animation-delay: -4s; }
.services-section__particles i:nth-child(3) { bottom: 24%; inset-inline-start: 20%; width: 2px; height: 2px; animation-delay: -8s; }
.services-section__particles i:nth-child(4) { bottom: 15%; inset-inline-end: 27%; animation-delay: -11s; }

.services-section__inner {
  position: relative;
  z-index: 1;
  width: min(1440px, calc(100% - 96px));
  margin-inline: auto;
}
.services-intro { max-width: 790px; margin-inline: auto; text-align: center; }
.services-intro__eyebrow { display: inline-flex; align-items: center; gap: 10px; color: #d8a565; font-size: .82rem; font-weight: 600; }
.services-intro__eyebrow > span:first-child { width: 34px; height: 1px; background: linear-gradient(to left, rgba(232, 180, 105, .85), transparent); }
.services-intro h2 { margin-top: 12px; color: #f7f3ec; font-size: clamp(2rem, 3.05vw, 3rem); font-weight: 600; letter-spacing: -.045em; line-height: 1.3; }
.services-intro h2 em { color: #dea762; font-style: normal; }
.services-intro > p:last-child { max-width: 680px; margin: 12px auto 0; color: rgba(229, 234, 229, .82); font-size: clamp(.92rem, 1.05vw, 1rem); line-height: 1.9; }

.services-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; width: 100%; margin: clamp(30px, 3.2vw, 42px) auto 0; }
.service-card { position: relative; display: grid; grid-template-columns: 48px minmax(0, 1fr); grid-template-rows: auto auto 1fr; gap: 0 16px; min-height: 154px; overflow: hidden; padding: 18px 19px 16px; border: 1px solid rgba(221, 175, 103, .27); border-radius: 12px; background: linear-gradient(125deg, rgba(6, 24, 32, .94), rgba(6, 25, 34, .92) 58%, rgba(7, 27, 36, .9)); box-shadow: inset 0 1px 0 rgba(248, 241, 226, .07), inset 0 -10px 24px rgba(0, 0, 0, .14), 0 13px 28px rgba(0, 0, 0, .16); backdrop-filter: blur(4px); transition: opacity .62s ease, transform .28s cubic-bezier(.22, .61, .36, 1), border-color .28s ease, background .28s ease, box-shadow .28s ease; }
.service-card::before { position: absolute; content: ""; inset: 1px; border-radius: 10px; background: linear-gradient(126deg, rgba(255, 238, 210, .045), transparent 32%, transparent 68%, rgba(226, 170, 93, .025)); pointer-events: none; }
.service-card::after { position: absolute; content: ""; top: 0; inset-inline-end: 16px; width: 33%; height: 1px; background: linear-gradient(to left, rgba(246, 202, 132, .42), transparent); opacity: .56; pointer-events: none; }
.service-card__topline { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; min-height: 15px; color: rgba(234, 184, 108, .72); font-family: var(--font-latin); font-size: .69rem; letter-spacing: .17em; direction: ltr; }
.service-card__topline i { width: 31%; height: 1px; background: linear-gradient(to right, transparent, rgba(223, 174, 99, .22)); }
.service-card__icon { grid-column: 1; grid-row: 2 / span 2; align-self: center; display: grid; width: 48px; height: 48px; place-items: center; border: 1px solid rgba(227, 175, 101, .48); border-radius: 12px; color: #d8a565; background: linear-gradient(145deg, rgba(18, 49, 63, .6), rgba(4, 19, 29, .55)); box-shadow: inset 0 1px 0 rgba(254, 241, 213, .08), 0 0 0 1px rgba(0, 0, 0, .16); transition: color .28s ease, border-color .28s ease, filter .28s ease; }
.service-card__icon svg { width: 27px; height: 27px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.35; }
.service-card h3 { grid-column: 2; align-self: end; margin-top: 9px; color: #f7f2e9; font-size: clamp(1rem, 1.15vw, 1.13rem); font-weight: 600; letter-spacing: -.025em; line-height: 1.4; }
.service-card p { grid-column: 2; align-self: start; max-width: 31ch; margin-top: 5px; color: rgba(238, 241, 240, .76); font-size: .81rem; line-height: 1.8; }
.service-card__arrow { position: absolute; bottom: 15px; inset-inline-start: 18px; display: grid; width: 32px; height: 32px; place-items: center; border: 1px solid rgba(231, 182, 105, .72); border-radius: 50%; color: #f0bd79; font-family: var(--font-latin); font-size: 1.1rem; line-height: 1; background: rgba(4, 20, 29, .4); transition: transform .28s ease, color .28s ease, background .28s ease; }
.service-card:hover { transform: translateY(-3px); border-color: rgba(240, 194, 121, .5); background: linear-gradient(125deg, rgba(8, 31, 41, .95), rgba(5, 24, 34, .93) 58%, rgba(10, 30, 37, .91)); box-shadow: inset 0 1px 0 rgba(255, 243, 218, .1), inset 0 -10px 24px rgba(0, 0, 0, .1), 0 18px 35px rgba(0, 0, 0, .2); }
.service-card:hover .service-card__icon { color: #f1bc72; border-color: rgba(244, 195, 120, .86); filter: drop-shadow(0 0 7px rgba(227, 163, 76, .22)); }
.service-card:hover .service-card__arrow { color: #ffd08b; background: rgba(33, 52, 54, .63); transform: translateX(-3px); }

.motion-ready .services-section__glow { animation: services-ambient-drift 16s ease-in-out infinite alternate; }
.motion-ready .service-card { opacity: 0; transform: translateY(10px); }
.motion-ready .service-card.is-revealed { opacity: 1; transform: translateY(0); }
.motion-ready .service-card:nth-child(2) { transition-delay: .06s; }
.motion-ready .service-card:nth-child(3) { transition-delay: .12s; }
.motion-ready .service-card:nth-child(4) { transition-delay: .18s; }
.motion-ready .service-card:nth-child(5) { transition-delay: .24s; }
.motion-ready .service-card:nth-child(6) { transition-delay: .3s; }
.motion-ready .service-card.is-revealed:hover { transition-delay: 0s; transform: translateY(-3px); }

.services-cta {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 32px;
  margin-top: clamp(32px, 3.4vw, 50px);
  padding: clamp(20px, 2.2vw, 28px) clamp(22px, 2.6vw, 36px);
  border: 1px solid rgba(221, 175, 103, .31);
  border-radius: 16px;
  overflow: hidden;
  background: linear-gradient(112deg, rgba(8, 31, 41, .9), rgba(5, 19, 28, .88) 56%, rgba(14, 27, 30, .84));
  box-shadow: inset 0 1px 0 rgba(249, 240, 222, .08), inset 0 -15px 28px rgba(0, 0, 0, .08);
  backdrop-filter: blur(9px);
}

.services-cta::before,
.services-cta::after { position: absolute; content: ""; pointer-events: none; }
.services-cta::before { top: 0; inset-inline-end: 12%; width: 31%; height: 1px; background: linear-gradient(to left, rgba(244, 195, 121, .65), transparent); }
.services-cta::after { top: -112px; inset-inline-start: -44px; width: 228px; height: 228px; border: 1px solid rgba(226, 174, 100, .14); border-radius: 50%; }
.services-cta__copy { position: relative; z-index: 1; }
.services-cta__copy p { color: #f7f2e9; font-size: clamp(1.08rem, 1.52vw, 1.34rem); font-weight: 600; letter-spacing: -.03em; line-height: 1.4; }
.services-cta__copy span { display: block; margin-top: 6px; color: rgba(224, 231, 227, .72); font-size: .9rem; line-height: 1.75; }
.services-cta__actions { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 10px; }
.services-cta__action { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 45px; padding-inline: 15px; border: 1px solid transparent; border-radius: 9px; color: rgba(248, 244, 236, .96); font-size: .84rem; font-weight: 600; white-space: nowrap; transition: transform .24s ease, border-color .24s ease, background .24s ease, box-shadow .24s ease; }
.services-cta__action svg { width: 19px; height: 19px; flex: none; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.55; }
.services-cta__action--whatsapp { border-color: rgba(174, 222, 208, .48); background: linear-gradient(115deg, rgba(54, 108, 108, .8), rgba(24, 65, 69, .78)); box-shadow: inset 0 1px 0 rgba(239, 255, 249, .2), 0 8px 18px rgba(0, 0, 0, .12); }
.services-cta__action--call { border-color: rgba(235, 224, 207, .32); background: rgba(5, 18, 27, .38); }
.services-cta__action:hover { transform: translateY(-2px); }
.services-cta__action--whatsapp:hover { border-color: rgba(210, 241, 229, .72); box-shadow: inset 0 1px 0 rgba(239, 255, 249, .28), 0 10px 21px rgba(0, 0, 0, .15), 0 0 12px rgba(83, 159, 148, .1); }
.services-cta__action--call:hover { border-color: rgba(235, 186, 112, .62); background: rgba(14, 32, 40, .5); }

:root:dir(ltr) .services-intro__eyebrow > span:first-child { background: linear-gradient(to right, rgba(232, 180, 105, .85), transparent); }
:root:dir(ltr) .service-card__arrow { transform: scaleX(-1); }
:root:dir(ltr) .service-card:hover .service-card__arrow { transform: translateX(3px) scaleX(-1); }
:root:dir(ltr) .services-cta::before { background: linear-gradient(to right, rgba(244, 195, 121, .65), transparent); }
@keyframes services-particle { 0%,100% { opacity: .15; transform: translate3d(0, 0, 0); } 50% { opacity: .72; transform: translate3d(5px, -10px, 0); } }
@keyframes services-ambient-drift { from { transform: translateX(-51%) translateY(-3px); opacity: .76; } to { transform: translateX(-48%) translateY(4px); opacity: 1; } }

@media (max-width: 960px) { .services-section__inner { width: calc(100% - 64px); } .services-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .services-cta { grid-template-columns: 1fr; gap: 19px; } }
@media (max-width: 620px) { .services-section { padding-block: 70px 60px; background-position: 57% center; } .services-section__lines::before { top: -62px; inset-inline-start: -24vw; width: 148vw; height: 104px; opacity: .55; } .services-section__inner { width: calc(100% - 40px); } .services-intro h2 { font-size: clamp(1.8rem, 8.5vw, 2.38rem); } .services-intro > p:last-child { font-size: .9rem; } .services-grid { grid-template-columns: 1fr; gap: 12px; margin-top: 30px; } .service-card { min-height: 148px; padding: 17px; } .services-cta { gap: 18px; margin-top: 28px; padding: 20px; } .services-cta__actions { width: 100%; } .services-cta__action { flex: 1 1 100%; } }
@media (prefers-reduced-motion: reduce) { .services-section__particles i, .services-section__glow { animation: none; } }