.single-service-layout { background:#fff; color:#24275f; }
.single-service-layout .breadcrumb-section { background-color:#171936; background-size:cover; }
.single-service-layout .breadcrumb-section h1 { color:#fff; font-size:clamp(34px,4.2vw,70px); }
.single-service-layout h2,.single-service-layout h3,.single-service-layout h4,.single-service-layout h5 { color:#24275f; }
.single-service-layout .service-details-top-content h2 span,.single-service-layout .section-title5 h2 span { color:#f8b331; }
.single-service-layout p { color:#59677b; line-height:1.8; }
.single-service-layout .service-details-top-content .key-features { display:flex; flex-wrap:wrap; gap:14px 24px; padding:0; list-style:none; margin-top:28px; }
.single-service-layout .key-features li { display:flex; align-items:center; gap:10px; color:#24275f; }
.single-service-layout .key-features li span { color:#f8b331; }
.single-service-layout .service-details-top-area img,.single-service-layout .service-details-faq-img img { width:100%; border-radius:20px; object-fit:cover; }
.single-service-layout .accordion-item { background:transparent; border-color:#e0e3ee; }
.single-service-layout .accordion-button { color:#24275f; background:transparent; font-size:18px; line-height:1.5; }
.single-service-layout .accordion-button:not(.collapsed) { color:#24275f; background:#f2f3fa; }
.single-service-layout .accordion-body { color:#59677b; line-height:1.8; }
.single-service-layout .tools-card { border:1px solid #e0e3ee; border-radius:14px; background:#f7f8fc; }
.single-service-layout .tools-icon img { width:54px; height:54px; object-fit:contain; }
.single-service-layout .tools-name span { color:#24275f; }
.single-service-layout .detail-related-links { display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
.single-service-layout .detail-related-links a { padding:12px 18px; background:#f1f2fa; color:#24275f; border-radius:30px; }
.single-service-layout .detail-related-links a:hover { background:#f8b331; }
.single-service-layout .detail-cta { margin-top:60px; padding:40px; border-radius:20px; background:#24275f; }
.single-service-layout .detail-cta h2 { color:#fff; font-size:clamp(25px,3vw,40px); }
.single-service-layout .detail-cta a { display:inline-block; margin-top:15px; padding:13px 24px; border-radius:30px; background:#f8b331; color:#24275f; }
.single-service-layout a:focus-visible,.single-service-layout button:focus-visible { outline:2px solid #f8b331; outline-offset:4px; }
@media(max-width:575px) { .single-service-layout .pt-120 { padding-top:60px; } .single-service-layout .mb-120 { margin-bottom:60px; } .single-service-layout .detail-cta { padding:25px; } }
@media(prefers-reduced-motion:reduce) { .single-service-layout * { animation:none!important; transition:none!important; } }

/* SEM offerings use the supplied Home3 icon-and-description card layout. */
.single-service-layout .sem-service-cards .section-title > span { display:inline-flex; align-items:center; gap:12px; color:#777b9d; }
.single-service-layout .sem-service-cards .section-title h2 span { color:#f8b331; }
.single-service-layout .sem-service-cards .tools-card { display:flex; align-items:flex-start; gap:18px; height:100%; padding:28px 22px; border:1px solid #e0e3ee; background:#f7f8fc; border-radius:16px; transition:border-color .2s,box-shadow .2s; }
.single-service-layout .sem-service-cards .tools-card:hover { border-color:#f8b331; box-shadow:0 10px 28px #24275f0d; }
.single-service-layout .sem-service-cards .tools-card .icon { width:56px; height:56px; flex:0 0 56px; display:grid; place-items:center; border-radius:14px; background:#eeeff8; color:#24275f; margin:0; }
.single-service-layout .sem-service-cards .tools-card .icon svg { fill:none; stroke:currentColor; }
.single-service-layout .sem-service-cards .tools-card h3 { margin:0 0 10px; font-size:19px; line-height:1.35; font-weight:600; }
.single-service-layout .sem-service-cards .tools-card p { margin:0; font-size:14px; line-height:1.75; }
@media(max-width:575px) { .single-service-layout .sem-service-cards .tools-card { padding:22px 18px; } }

/* Local blue background and animated brand-gradient glow for SEM cards. */
.single-service-layout .sem-service-cards {
    padding: clamp(32px, 4vw, 64px) clamp(20px, 3vw, 44px);
    border-radius: 24px;
    background: #111b43 url('../img/bg/home3-countdown-bg.png') center / cover no-repeat;
}
.single-service-layout .sem-service-cards .section-title h2 { color: #fff; }
.single-service-layout .sem-service-cards .section-title > span { color: #f8b331; }
.single-service-layout .sem-service-cards .section-title p { color: #d4dcef; }
.single-service-layout .sem-service-cards .tools-card {
    position: relative;
    isolation: isolate;
    overflow: visible;
    background: #f7f8fc;
    transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.single-service-layout .sem-service-cards .tools-card::before {
    content: '';
    position: absolute;
    inset: -5px;
    z-index: -1;
    border-radius: inherit;
    background: linear-gradient(115deg, #536dff, #24275f, #f8b331, #8c9eff, #536dff);
    background-size: 300% 300%;
    filter: blur(15px);
    opacity: 0;
    pointer-events: none;
    transition: opacity .3s ease;
    animation: sem-gradient-shadow 4s linear infinite;
    animation-play-state: paused;
}
.single-service-layout .sem-service-cards .tools-card:hover {
    transform: translateY(-5px);
    border-color: #f8b331;
    box-shadow: 0 12px 32px #080e3940;
}
.single-service-layout .sem-service-cards .tools-card:hover::before { opacity: .7; animation-play-state: running; }
@keyframes sem-gradient-shadow {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}
@media (max-width: 575px) {
    .single-service-layout .sem-service-cards { border-radius: 16px; padding: 32px 18px; }
}
@media (prefers-reduced-motion: reduce) {
    .single-service-layout .sem-service-cards .tools-card:hover { transform: none; }
    .single-service-layout .sem-service-cards .tools-card::before { animation: none; transition: none; }
}
.single-service-layout .sem-service-cards .tools-card::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    border-radius: inherit;
    background: #f7f8fc;
    pointer-events: none;
}

/* Edge-to-edge image, with continuous blue-and-gold motion around each card. */
@property --sem-border-angle {
    syntax: '<angle>';
    initial-value: 0deg;
    inherits: false;
}
.single-service-layout .sem-service-cards {
    width: 100%;
    border-radius: 0;
    padding: clamp(40px, 5vw, 80px) 0;
}
.single-service-layout .sem-service-cards .tools-card {
    border: 3px solid transparent;
    background: linear-gradient(#f7f8fc, #f7f8fc) padding-box,
        conic-gradient(from var(--sem-border-angle), #3662ff 0deg, #3662ff 60deg, #ffd23f 120deg, #ffd23f 180deg, #ff3b45 240deg, #ff3b45 300deg, #3662ff 360deg) border-box;
    animation: sem-border-orbit 4s linear infinite;
    box-shadow: 0 0 12px #4266ff35, 0 6px 18px #00000025;
}
.single-service-layout .sem-service-cards .tools-card::before,
.single-service-layout .sem-service-cards .tools-card::after { display: none; }
.single-service-layout .sem-service-cards .tools-card::before {
    inset: -2px;
    background: conic-gradient(from var(--sem-border-angle), #3e65ff, #24275f 25%, #f8b331 45%, #ffe08a 50%, #3e65ff 75%, #f8b331 90%, #3e65ff);
    background-size: 100% 100%;
    filter: none;
    opacity: 1;
    animation: sem-border-orbit 5s linear infinite;
    animation-play-state: running;
}
.single-service-layout .sem-service-cards .tools-card:hover { border-color: transparent; box-shadow: -6px 0 26px #3662ff65, 6px 0 26px #ff3b4555, 0 8px 28px #ffd23f45; }
.single-service-layout .sem-service-cards .tools-card:hover::before { opacity: 1; }
@keyframes sem-border-orbit { to { --sem-border-angle: 360deg; } }
@media (prefers-reduced-motion: reduce) {
    .single-service-layout .sem-service-cards .tools-card { animation: none; }
    .single-service-layout .sem-service-cards .tools-card::before { animation: none; }
}

/* Preserve each SVG's individual colors instead of the inherited navy stroke. */
.single-service-layout .sem-service-cards .tools-card .icon {
    background: #fff;
    border: 1px solid #e0e6f0;
    box-shadow: 0 4px 14px #1a73e814;
}
.single-service-layout .sem-service-cards .tools-card .icon svg { stroke: none; }

.single-service-layout .sem-service-cards .tools-card .icon img { display: block; width: 36px; height: 36px; object-fit: contain; }

.single-service-layout .sem-contact { background: url('../img/home4/home4-section-bg.png') center / cover no-repeat, linear-gradient(135deg,#171936,#24275f); }
.single-service-layout .sem-contact .section-title3 h2 { color:#fff; font-size:clamp(32px,3.5vw,54px); }
.single-service-layout .sem-contact .section-title3 h2 span { color:#f8b331; }
.single-service-layout .sem-contact .section-title3 p { color:#d4d9ef; max-width:760px; margin-top:22px; }
.single-service-layout .sem-contact .section-title3 > span { color:#fff; }
.single-service-layout .sem-contact .button-area { color:#fff; border-color:#f8b331; }
.single-service-layout .sem-contact .details-button { color:#fff; }
.single-service-layout .sem-contact .details-button svg { fill:none; stroke:currentColor; }
.single-service-layout .sem-contact-marquee { overflow:hidden; border-top:1px solid #ffffff25; border-bottom:1px solid #ffffff25; padding:22px 0; }
.single-service-layout .sem-contact-track { display:flex; width:max-content; animation:sem-contact-scroll 32s linear infinite; }
.single-service-layout .sem-contact-sequence { flex:none; display:flex; align-items:center; gap:32px; padding-right:32px; }
.single-service-layout .sem-contact-sequence span { white-space:nowrap; font-size:clamp(22px,2.5vw,36px); font-weight:500; color:#fff; }
.single-service-layout .sem-contact-sequence svg { flex:none; color:#f8b331; }
@keyframes sem-contact-scroll { to { transform:translateX(-50%); } }
@media(prefers-reduced-motion:reduce) { .single-service-layout .sem-contact-track { animation:none; } }

.single-service-layout .sem-tools-network .section-title { max-width:900px; margin-inline:auto; }
.single-service-layout .sem-tools-network .section-title h2 span { color:#f8b331; }
.single-service-layout .sem-tools-network .section-title p { margin-top:20px; }
.single-service-layout .sem-network-diagram { position:relative; display:grid; grid-template-columns:minmax(0,1fr) 220px minmax(0,1fr); gap:40px; align-items:center; min-height:400px; }
.single-service-layout .sem-network-lines { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.single-service-layout .sem-network-tools { position:relative; z-index:1; display:grid; grid-template-columns:1fr 1fr; gap:20px; list-style:none; margin:0; padding:0; }
.single-service-layout .sem-network-tool { display:flex; flex-direction:column; align-items:center; text-align:center; gap:14px; padding:24px 12px; background:#fff; border:1px solid #e1e5f2; border-radius:18px; box-shadow:0 6px 24px #24275f08; }
.single-service-layout .sem-network-icon { display:grid; place-items:center; color:var(--tool-color); width:56px; height:56px; background:#f4f6fb; border-radius:14px; }
.single-service-layout .sem-network-icon img { width:36px; height:36px; object-fit:contain; }
.single-service-layout .sem-network-tool h3 { margin:0 0 5px; font-size:16px; line-height:1.4; }
.single-service-layout .sem-network-tool p { margin:0; font-size:12px; }
.single-service-layout .sem-network-brand { position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center; }
.single-service-layout .sem-network-logo { width:136px; height:136px; display:grid; place-items:center; border:1px solid #f8b331; border-radius:32px; background:linear-gradient(135deg,#24275f,#575e96 70%,#f8b331); box-shadow:0 12px 36px #24275f30; }
.single-service-layout .sem-network-logo img { width:90px; height:90px; object-fit:contain; }
.single-service-layout .sem-network-brand strong { font-size:26px; color:#24275f; }
.single-service-layout .sem-network-brand > span { font-size:12px; color:#59677b; }
.single-service-layout .sem-tool-steps { margin-top:55px; border-top:1px solid #e1e5f2; padding-top:35px; }
.single-service-layout .sem-tool-steps > h3 { text-align:center; margin-bottom:30px; font-size:24px; }
.single-service-layout .sem-tool-step { height:100%; padding:25px; background:#f7f8fc; border-radius:14px; }
.single-service-layout .sem-tool-step > span { color:#a56a00; font-size:13px; }
.single-service-layout .sem-tool-step h4 { font-size:20px; margin:12px 0; }
.single-service-layout .sem-tool-step p { font-size:14px; margin:0; }
@media(max-width:1199px) { .single-service-layout .sem-network-diagram { grid-template-columns:minmax(0,1fr) 160px minmax(0,1fr); gap:20px; } }
@media(max-width:767px) { .single-service-layout .sem-network-diagram { grid-template-columns:1fr 1fr; gap:18px; } .single-service-layout .sem-network-brand { grid-column:1 / -1; grid-row:1; padding-bottom:15px; } .single-service-layout .sem-network-tools { grid-template-columns:1fr; gap:14px; } .single-service-layout .sem-network-lines { display:none; } .single-service-layout .sem-network-tool { padding:20px 10px; } }
@media(prefers-reduced-motion:reduce) { .single-service-layout .sem-network-dot { display:none; } }

/* Subtle animated particles sit behind the SEM tool diagram. */
.single-service-layout .sem-tools-network { position:relative; isolation:isolate; padding-block:45px; background:radial-gradient(ellipse at 50% 55%,#f0f3fd 0%,#fff 72%); }
.single-service-layout .sem-tool-particles { position:absolute; inset:0; width:100%; height:100%; z-index:0; pointer-events:none; }
.single-service-layout .sem-tools-network > .container { position:relative; z-index:1; }
.single-service-layout .sem-tool-particle { opacity:.35; animation:sem-tool-particle-float var(--particle-time) ease-in-out var(--particle-delay) infinite alternate; }
@keyframes sem-tool-particle-float { from { transform:translate(0,0); opacity:.2; } to { transform:translate(var(--particle-x),var(--particle-y)); opacity:.65; } }
@media(prefers-reduced-motion:reduce) { .single-service-layout .sem-tool-particle { animation:none; } }

/* Refined SEM introduction with clear hierarchy and brand accents. */
.single-service-layout .service-overview-polished { position:relative; padding:24px 0 10px; }
.single-service-layout .service-overview-polished > .row { --bs-gutter-x:3.5rem; }
.single-service-layout .service-overview-polished .overview-eyebrow { display:inline-flex; gap:10px; align-items:center; padding:8px 14px; margin-bottom:22px; color:#555d83; background:#f1f3fa; border:1px solid #e1e5f1; border-radius:30px; font-size:12px; letter-spacing:.1em; text-transform:uppercase; font-weight:600; }
.single-service-layout .overview-eyebrow > span { width:7px; height:7px; border-radius:50%; background:#f8b331; box-shadow:0 0 0 4px #f8b3311a; }
.single-service-layout .service-overview-polished .service-details-top-content h2 { font-size:clamp(34px,3.3vw,58px); line-height:1.12; letter-spacing:-.04em; margin-bottom:24px; }
.single-service-layout .service-overview-polished .service-details-top-content h2 > span { display:block; margin-top:8px; font-size:.72em; font-weight:500; color:#a96900; }
.single-service-layout .service-overview-polished .service-details-top-content > p { font-size:16px; line-height:1.85; margin-bottom:24px; }
.single-service-layout .service-overview-polished .key-features { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:0 0 28px; }
.single-service-layout .service-overview-polished .key-features li { align-items:flex-start; padding:14px; border:1px solid #e5e8f2; background:linear-gradient(135deg,#f6f7fc,#fff); border-radius:12px; font-size:13px; line-height:1.65; }
.single-service-layout .service-overview-polished .key-features li > span { display:grid; place-items:center; flex:0 0 24px; width:24px; height:24px; border-radius:8px; background:#fff1d6; color:#aa6c00; }
.single-service-layout .overview-consult { display:inline-flex; align-items:center; gap:24px; padding:14px 22px; background:#24275f; color:#fff; border-radius:30px; font-size:14px; font-weight:600; box-shadow:0 8px 20px #24275f20; transition:background .2s; }
.single-service-layout .overview-consult span { color:#f8b331; font-size:21px; }
.single-service-layout .overview-consult:hover { background:#393e81; }
.single-service-layout .service-overview-polished .service-details-img { position:relative; isolation:isolate; padding:12px 12px 30px; border:1px solid #e2e5f0; border-radius:28px; background:linear-gradient(145deg,#eef0fa,#fff5dc); box-shadow:0 22px 50px #24275f12; overflow:visible; }
.single-service-layout .service-overview-polished .service-details-img > img { display:block; height:clamp(360px,34vw,530px); width:100%; object-fit:cover; border-radius:18px; }
.single-service-layout .overview-image-note { position:absolute; left:30px; right:30px; bottom:52px; display:flex; gap:14px; align-items:center; padding:18px; border:1px solid #ffffffa6; border-radius:14px; background:#fffffff2; box-shadow:0 8px 30px #17193616; }
.single-service-layout .overview-note-icon { display:grid; place-items:center; width:42px; height:42px; flex:none; border-radius:12px; background:#24275f; color:#f8b331; font-size:26px; }
.single-service-layout .overview-image-note strong { display:block; color:#24275f; font-size:16px; }
.single-service-layout .overview-image-note div > span { display:block; margin-top:4px; color:#59677b; font-size:12px; }
.single-service-layout .overview-image-label { display:block; padding-top:12px; font-size:10px; letter-spacing:.15em; color:#727895; text-align:center; }
@media(max-width:575px) { .single-service-layout .service-overview-polished .key-features { grid-template-columns:1fr; } .single-service-layout .overview-image-note { left:22px; right:22px; padding:13px; } .single-service-layout .overview-image-note strong { font-size:14px; } }