body:has(.spy-services) { background:#000; }
.spy-services { max-width:1600px; margin:auto; padding:112px clamp(20px,4vw,56px) 48px; color:#fff; font:17px/1.7 Lato,Nunito,Arial,sans-serif; }
.spy-services *, .spy-services *::before { box-sizing:border-box; }
.spy-services h1,.spy-services h2,.spy-services h3 { margin:0 0 20px; color:inherit; font-family:Vera,Lato,Arial,sans-serif; text-indent:0; line-height:1.15; }
.spy-services h1 { font-size:clamp(36px,5vw,64px); letter-spacing:-.025em; }
.spy-services h2 { font-size:clamp(28px,3vw,40px); }
.spy-services p { margin:0 0 22px; }
.spy-services a { color:#fff; text-underline-offset:4px; }
.spy-services a:focus-visible { outline:3px solid #22a7d7; outline-offset:4px; }
.spy-services .spy-services__kicker { font-size:12px; text-transform:uppercase; letter-spacing:.1em; font-weight:800; }
.spy-services__hero { padding:clamp(30px,6vw,76px); margin-bottom:52px; border:1px solid #ffffff33; border-radius:8px; background:linear-gradient(90deg,rgba(10,16,26,.87),rgba(24,36,55,.62)),url('images/services-hero.jpg') center 35%/cover; }
.spy-services__hero>p:not(.spy-services__kicker) { color:#e1e7ef; max-width:700px; font-size:19px; }
.spy-services__actions { display:flex; flex-wrap:wrap; gap:14px; }
.spy-services .spy-services__button,.spy-services .spy-services__outline { display:inline-block; padding:12px 20px; min-height:48px; border:1px solid #a61c0f; border-radius:6px; background:#a61c0f; color:#fff; font-size:16px; font-weight:800; text-decoration:none; }
.spy-services .spy-services__button:hover { background:#7f150b; }
.spy-services .spy-services__outline { border-color:#abb4c2; background:transparent; }
.spy-services__section-heading { max-width:850px; margin-bottom:32px; }
.spy-services__section-heading>p:last-child { color:#c8cdd5; }
.spy-services__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.spy-services__card { min-width:0; display:flex; gap:24px; align-items:flex-start; padding:32px; background:#f5f7fa; color:#172033; border:1px solid #d9e3ec; border-radius:8px; }
.spy-services__card>img { flex:0 0 88px; width:88px; height:88px; object-fit:contain; }
.spy-services__card>div { min-width:0; display:flex; flex-direction:column; height:100%; }
.spy-services__card h3 { font-size:25px; overflow-wrap:anywhere; }
.spy-services__card h3 a { color:#172033; text-decoration:none; }
.spy-services__card h3 a:hover { text-decoration:underline; }
.spy-services__card p { color:#455267; font-size:16px; }
.spy-services .spy-services__read { margin-top:auto; color:#8b2117; font-size:14px; font-weight:800; }
.spy-services .spy-inquiry a { color:#8b2117; }
.spy-services .spy-inquiry a:focus-visible { outline-color:#007d9f; }
.spy-services__sr { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media(max-width:1000px) { .spy-services__card { flex-direction:column; } }
@media(max-width:640px) { .spy-services { padding-top:96px; } .spy-services__grid { grid-template-columns:1fr; } .spy-services__card { padding:26px; } }

/* Hosting leads the page; the remaining services support that relationship. */
.spy-services__hosting { display:grid; grid-template-columns:1.1fr 1fr; gap:60px; padding:clamp(28px,5vw,60px); margin-bottom:56px; border:1px solid #d9e3ec; border-radius:8px; background:#f5f7fa; color:#172033; }
.spy-services__hosting>div>p:not(.spy-services__kicker) { color:#455267; }
.spy-services__hosting-options { margin:0; padding:0; list-style:none; }
.spy-services__hosting-options li { margin:0 0 24px; padding:0 0 24px; border-bottom:1px solid #cbd3df; }
.spy-services__hosting-options li:last-child { border-bottom:0; margin:0; padding:0; }
.spy-services__hosting-options h3 { font-size:23px; margin-bottom:10px; }
.spy-services__hosting-options p { color:#455267; font-size:16px; margin:0; }
.spy-services__grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.spy-services__card { flex-direction:column; }
@media(max-width:1000px) { .spy-services__grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .spy-services__hosting { gap:32px; } }
@media(max-width:760px) { .spy-services__hosting { grid-template-columns:1fr; } }
@media(max-width:640px) { .spy-services__grid { grid-template-columns:1fr; } }