/* S2-R1: isolated services comparison; no production application. */
#services { padding:64px 0 56px; }
#services .section-heading { margin-bottom:36px; }
#services h2 { max-width:1100px; margin-bottom:20px; }
#services .services-intro { max-width:850px; font-size:18px; line-height:1.65; color:#d4dee5; margin-bottom:0; }
#services .cards { align-items:stretch; }
#services .card { padding-top:4px; padding-bottom:8px; }
#services .card h3 { font-size:22px; line-height:1.28; min-height:2.56em; margin-bottom:18px; }
#services .card p { font-size:16px; line-height:1.65; margin-bottom:22px; }
#services .card .text-link { font-size:14px; line-height:1.5; padding:6px 0; min-height:44px; gap:10px; }
#services .text-link:hover { color:#fff; }
#services .text-link:focus-visible { outline:3px solid #e0a56b; outline-offset:5px; }
#services .services-more { display:flex; gap:40px; align-items:center; border-top:1px solid #365163; margin-top:30px; padding-top:24px; }
#services .services-more p { font-size:15px; line-height:1.65; color:#d4dee5; max-width:940px; margin:0; }
#services .services-more strong { color:#fff; }
#services .services-more .text-link { flex-shrink:0; margin-left:auto; }
@media(max-width:1100px){#services .card h3{min-height:2.56em}#services .services-more{align-items:flex-start;gap:24px}}
@media(max-width:760px){#services{padding:42px 0}#services .services-intro{font-size:17px}#services .services-more{flex-direction:column;gap:12px}#services .services-more .text-link{margin-left:0}}
@media(max-width:480px){#services .section-heading{margin-bottom:28px}#services .card{padding:26px 0}#services .card h3{min-height:0;font-size:22px;margin-bottom:14px}#services .card p{margin-bottom:14px}#services .services-more{margin-top:16px;padding-top:24px}}


/* S2-R2: Jason requested opening-style buttons with the full spectrum on each. */
#services .spectrum-button,#services .spectrum-button:hover {
 width:100%; min-width:0; min-height:62px; padding:12px 28px; margin-top:auto;
 background:#031827; border:1px solid #b3ced5; border-radius:4px;
 color:#fff; font-size:14px; line-height:1.4; text-align:center;
 isolation:isolate; overflow:hidden; transform:none; filter:none;
 box-shadow:inset 0 1px 1px #ffffffb0,inset 0 -1px 2px #0008,0 5px 12px #0006;
}
#services .spectrum-button::before,#services .spectrum-button::after {
 content:"";display:block;position:absolute;top:0;bottom:0;width:55%;height:auto;
 z-index:-1;pointer-events:none;
 background-image:url('/assets/metallic-buttons-approved-p2.png');
 background-repeat:no-repeat;background-size:106.5% 278.5%;
}
#services .spectrum-button::before {left:0;right:auto;background-position:50% 16.8%;}
#services .spectrum-button::after {left:auto;right:0;background-position:50% 85.8%;mask-image:linear-gradient(90deg,transparent 0%,#000 18%,#000 100%);}
#services .spectrum-button .button-label {padding:3px 0;position:relative;color:#fff;background:transparent;text-shadow:none;}
#services .spectrum-button>span[aria-hidden="true"] {right:10px;color:#fff;background:transparent;}
#services .spectrum-button:hover {border-color:#fff;box-shadow:inset 0 0 0 1px #fff,0 0 0 2px #9bdce04d,0 5px 12px #0006;}
#services .spectrum-button:focus-visible {outline:3px solid #fff;outline-offset:4px;}
#services .services-more .spectrum-button {width:205px;flex:0 0 205px;margin:0 0 0 auto;}
@media(max-width:760px){#services .services-more .spectrum-button{margin:0;flex-basis:auto;}}
@media(max-width:480px){#services .card .spectrum-button{margin-top:6px;}#services .services-more .spectrum-button{width:100%;}}
@media(forced-colors:active){#services .spectrum-button::before,#services .spectrum-button::after{display:none;}#services .spectrum-button,#services .spectrum-button:hover{background:ButtonFace;color:ButtonText;}#services .spectrum-button .button-label,#services .spectrum-button>span[aria-hidden="true"]{color:ButtonText;-webkit-text-stroke:0;}}

/* Jason's expanded comparison request: full spectrum on EVERY page button,
   including the approved opening, without changing source image bytes. */
.button,.button:hover,.button.secondary,.button.secondary:hover,.site-header .button:hover {
 background:#031827;border-color:#b3ced5;
}
.button::before,.button::after {
 content:"";display:block;position:absolute;top:0;bottom:0;width:55%;height:auto;
 z-index:-1;pointer-events:none;
 background-image:url('/assets/metallic-buttons-approved-p2.png');
 background-repeat:no-repeat;background-size:106.5% 278.5%;
}
.button::before {left:0;right:auto;background-position:50% 16.8%;}
.button::after {left:auto;right:0;background-position:50% 85.8%;mask-image:linear-gradient(90deg,transparent 0%,#000 18%,#000 100%);}
.button:hover,.button.secondary:hover,.site-header .button:hover {border-color:#fff;}
@media(forced-colors:active){.button::before,.button::after{display:none;}.button,.button:hover,.button.secondary,.button.secondary:hover,.site-header .button:hover{background:ButtonFace;color:ButtonText;border-color:ButtonText;}}

/* Jason's readability refinement: crisp outlined live type, no raster text. */
.button .button-label,#services .spectrum-button .button-label {
 font-size:15px;font-weight:800;line-height:1.35;letter-spacing:.005em;
 color:#fff;-webkit-text-stroke:1.4px #020e1b;paint-order:stroke fill;
 text-shadow:none;background:transparent;
}
.button>span[aria-hidden="true"],#services .spectrum-button>span[aria-hidden="true"] {
 font-size:21px;font-weight:800;line-height:1;color:#fff;
 -webkit-text-stroke:1.4px #020e1b;paint-order:stroke fill;
 text-shadow:none;background:transparent;
}
.nav-row>.button .button-label {font-size:14px;}
@media(forced-colors:active){.button .button-label,#services .spectrum-button .button-label,.button>span[aria-hidden="true"],#services .spectrum-button>span[aria-hidden="true"]{color:ButtonText;-webkit-text-stroke:0;}}

/* S2-R2 final artwork: one full-width reflective curve, single source image. */
.button::before,.button::after,#services .spectrum-button::before,#services .spectrum-button::after {display:none;}
.button,.button:hover,.button.secondary,.button.secondary:hover,.site-header .button:hover,
#services .spectrum-button,#services .spectrum-button:hover {
 background-color:#031827;
 background-image:url('/assets/metallic-button-full-spectrum-single-curve-s2-r2.png');
 background-size:103% 263.3%;background-position:50% 46.4%;background-repeat:no-repeat;
}
#services .card .spectrum-button,#services .card .spectrum-button:hover {min-height:72px;padding:12px 38px;}
@media(forced-colors:active){.button,.button:hover,.button.secondary,.button.secondary:hover,.site-header .button:hover,#services .spectrum-button,#services .spectrum-button:hover{background:ButtonFace;color:ButtonText;}}

/* Jason: improve readability of labels between the distinct decorative flares. */
.hero .eyebrow,.section-heading .eyebrow {
 font-size:14px;font-weight:750;line-height:1.45;letter-spacing:.12em;
}
.hero .eyebrow,.dark .section-heading .eyebrow,.closing .section-heading .eyebrow {color:#c1e9ec;}
@media(max-width:760px){.hero .eyebrow,.section-heading .eyebrow{font-size:12px;line-height:1.45;letter-spacing:.09em;gap:9px;}}
.nav-row>.button,.nav-row>.button:hover {min-width:240px;max-width:240px;}
#services .services-more .spectrum-button {width:225px;flex-basis:225px;}
@media(max-width:760px){#services .services-more .spectrum-button{flex-basis:auto;}}
@media(max-width:480px){#services .services-more .spectrum-button{width:100%;}}
#who-we-help .card .button,#who-we-help .card .button:hover {width:100%;margin-top:auto;min-height:62px;padding:12px 38px;}
#connected-delivery .section-action {display:flex;flex-wrap:wrap;align-items:center;gap:16px;}
.paper .button,#who-we-help .card .button {box-shadow:inset 0 1px 1px #ffffffb0,inset 0 -1px 2px #0006,0 3px 6px #08284526;}
.paper .button:hover,#who-we-help .card .button:hover {box-shadow:inset 0 0 0 1px #fff,0 0 0 2px #07517a66,0 3px 6px #08284526;}
.paper .button:focus-visible,#who-we-help .card .button:focus-visible {outline:3px solid #07517a;outline-offset:4px;}
.menu-toggle {
 background:#031827 url('/assets/metallic-button-full-spectrum-single-curve-s2-r2.png') 50% 46.4% / 103% 263.3% no-repeat;
 color:#fff!important;border:1px solid #b3ced5;border-radius:4px;
 min-width:78px;min-height:48px;padding:10px;font-size:14px;font-weight:800;
 -webkit-text-stroke:1px #020e1b;paint-order:stroke fill;text-shadow:none;
}
.menu-toggle:focus-visible {outline:3px solid #fff;outline-offset:3px;}
@media(max-width:760px){#connected-delivery .section-action .button{width:100%;}}
@media(forced-colors:active){.menu-toggle{background:ButtonFace;color:ButtonText!important;-webkit-text-stroke:0;}}
/* Keep the accepted headline on two balanced lines in the side-by-side hero. */
@media(min-width:1101px){.hero h1{font-size:clamp(2.1rem,3.1vw,2.85rem);}}
