/* Visual SEO service story, scoped away from shared navigation. */
.seo-page { background:#fff; }
.seo-page main { color:#193e50; }
.seo-page main .container { width:calc(100% - 64px); max-width:1240px; }
.seo-page main .section { padding:80px 0; }
.seo-page main :is(h1,h2,h3) { color:#193e50; }
.seo-page main h2 { font-size:clamp(30px,3vw,42px); line-height:1.2; letter-spacing:-1px; margin-bottom:22px; }
.seo-page main h3 { font-size:23px; line-height:1.3; }
.seo-page main p { font-size:18px; line-height:1.8; color:#536d7b; }
.seo-page main .eyebrow { font-size:14px; text-transform:uppercase; letter-spacing:1.4px; color:#34796e; margin-bottom:18px; }
.seo-page main .narrow { text-align:left; max-width:1240px; margin-bottom:32px; }
.seo-page main .narrow > :is(h2,p) { max-width:820px; }
.seo-page .service-detail-hero { background:radial-gradient(ellipse at 90% 20%,#d6e9e4,transparent 60%),#f1f6fa; padding:65px 0; }
.seo-page .page-hero-grid { display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:center; }
.seo-page main h1 { font-size:clamp(36px,3.7vw,52px); line-height:1.13; letter-spacing:-1.5px; }
.seo-page .sv-hero-visual { position:relative; padding:18px; border:1px solid #bfd9d1; border-radius:24px; background:#ffffffc9; box-shadow:0 25px 60px #2c5f5120; overflow:visible; }
.sv-hero-visual img { border-radius:15px; width:100%; }
.sv-image-label { display:inline-block; padding:9px 14px; margin-bottom:16px; border:1px solid #cee1d7; border-radius:22px; background:#edf7ef; color:#357665; font-size:14px; font-weight:700; }
.seo-page main .sv-illustration-note { font-size:14px; line-height:1.6; margin:14px 0; }
.seo-page .hero-card-band { display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; background:none; }
.seo-page .hero-card-band span,.sv-hero-tags span { font-size:14px; padding:7px 12px; border:1px solid #ccddd6; border-radius:20px; color:#3d7264; background:#f2f7f3; }
.sv-hero-tags { display:flex; flex-wrap:wrap; gap:8px; margin:22px 0; }
.seo-page main .btn { font-size:16px; border-radius:9px; min-height:48px; }
.seo-page .service-trust-strip { background:#fff; padding:26px 0; border-bottom:1px solid #dce7e4; }
.seo-page .service-trust-strip p { font-size:16px; }
.seo-page .service-trust-strip ul { display:flex; flex-wrap:wrap; gap:10px; list-style:none; padding:0; }
.seo-page .service-trust-strip li { color:#294f48; padding:7px 12px; font-size:14px; border:1px solid #dbe8e1; border-radius:20px; background:#f6f9f6; }
.seo-page .split-grid { display:grid; grid-template-columns:1fr 1fr; gap:55px; align-items:center; }
.seo-page .highlight-stack { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.seo-page .highlight-stack > div { display:flex; flex-direction:column; align-items:flex-start; padding:25px; border:1px solid #d4e5dd; border-radius:18px; background:linear-gradient(140deg,#fff,#eef6f1); }
.seo-page .highlight-stack strong { font-size:20px; line-height:1.3; margin-bottom:12px; }
.seo-page .highlight-stack p { font-size:16px; margin:0; }
.seo-page .highlight-stack .sv-highlight-icon,.sv-process-icon { display:grid; place-items:center; width:50px; height:50px; border:1px solid #c4dbd0; border-radius:15px; background:#e8f3ec; color:#3b7e6d; margin-bottom:18px; }
.sv-highlight-icon svg,.sv-process-icon svg { width:27px; height:27px; }
.seo-page .development-list-section,.seo-page .features-section,.seo-page .industries-section,.seo-page .faq-section { background:#f3f7f4; }
.seo-page .webapp-service-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.seo-page .webapp-service-grid > .sv-service { padding:0; overflow:hidden; border:1px solid #d0e2d8; border-radius:21px; background:#fff; }
.sv-service-art { position:relative; display:grid; place-items:center; height:190px; background:linear-gradient(130deg,#deeee4,#eff6f0); overflow:hidden; }
.sv-tone-1 { background:linear-gradient(130deg,#e2eaf8,#f1f5fc); }
.sv-tone-2 { background:linear-gradient(130deg,#eee5d5,#f9f5ec); }
.sv-art-ring { position:absolute; width:175px; height:175px; border:1px solid #ffffffdd; border-radius:50%; box-shadow:0 0 0 22px #ffffff25,0 0 0 44px #ffffff15; }
.sv-art-icon { display:grid; place-items:center; position:relative; width:74px; height:74px; border:1px solid #fff; border-radius:22px; background:#ffffffb8; color:#3b7f75; box-shadow:0 10px 20px #254d3e14; }
.sv-art-icon svg { width:37px; height:37px; }
.sv-tone-1 .sv-art-icon { color:#607ba6; }
.sv-tone-2 .sv-art-icon { color:#9a7a4a; }
.sv-art-tag { position:absolute; bottom:14px; border-radius:20px; padding:6px 12px; background:#ffffffe6; color:#4f7266; font-size:14px; }
.sv-service-copy { padding:26px; }
.seo-page .sv-service-copy p { font-size:16px; margin-top:14px; }
.seo-page main details:not(.faq-list details) { border-top:1px solid #d7e5dd; padding-top:7px; }
.seo-page main summary { cursor:pointer; min-height:44px; padding:12px 0; font-size:16px; font-weight:700; color:#2f7166; }
.seo-page main details ul { padding-left:20px; font-size:16px; line-height:1.85; color:#557063; }
.seo-page .compact-list-grid,.seo-page .feature-cloud { display:flex; flex-wrap:wrap; gap:10px; }
.seo-page .compact-list-grid > span,.seo-page .feature-cloud > span { font-size:16px; padding:12px 16px; border:1px solid #d8e4e1; border-radius:10px; background:#fff; box-shadow:none; }
.seo-page main .sv-scope { padding:22px 28px; border:1px solid #c9ded1; border-radius:16px; background:#fff; }
.seo-page .sv-scope .feature-cloud { margin-top:18px; }
.seo-page .design-showcase-image { margin:0; padding:18px; border:1px solid #c7dfd2; border-radius:22px; background:linear-gradient(135deg,#e8f2eb,#f7faf6); box-shadow:0 18px 40px #27543f10; overflow:hidden; }
.seo-page .design-showcase-image img { width:100%; border-radius:13px; }
.seo-page .design-showcase-image figcaption { color:#56766a; font-size:14px; margin-top:14px; }
.seo-page .check-list { display:grid; grid-template-columns:1fr 1fr; gap:8px 18px; }
.seo-page .check-list li { font-size:16px; line-height:1.7; }
.seo-page .focus-section { background:radial-gradient(ellipse at 100% 0,#296970,transparent 70%),#193f56; }
.seo-page .focus-section .service-card-grid { grid-template-columns:1fr 1fr; gap:24px; }
.seo-page .focus-section article { background:#ffffff0a; border:1px solid #638b94; border-radius:18px; padding:30px; }
.seo-page .focus-section h2 { color:#fff; font-size:28px; }
.seo-page .focus-section p { color:#d3e5e8; font-size:16px; }
.seo-page .focus-section .eyebrow { color:#b3ddcb; }
.seo-page .focus-section summary,.seo-page .focus-section details ul { color:#c4e6d8; }
.seo-page .technical-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.seo-page .technical-grid article { border:1px solid #d3e5d9; border-radius:18px; padding:28px; background:#f1f7f3; }
.seo-page .technical-grid p { font-size:16px; }
.seo-page .seo-process-section .seo-process-flow { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
.seo-page .seo-process-section article { border:1px solid #d5e3df; border-radius:17px; padding:25px; background:#f4f8f6; }
.seo-page .seo-process-section article::before,.seo-page .seo-process-section article::after { display:none; }
.seo-page .seo-process-section small { font-size:14px; color:#5c8073; }
.seo-page .seo-process-section h3 { font-size:21px; margin:14px 0; }
.seo-page .seo-process-section p { font-size:16px; margin:0; }
.seo-page .faq-list { max-width:900px; margin:25px 0 0; text-align:left; }
.seo-page .faq-list details { border-radius:12px; border:1px solid #d0e2d8; padding:18px 22px; background:#fff; }
.seo-page .faq-list summary { padding-right:30px; }
.seo-page .faq-list p { font-size:16px; }
.seo-page .final-cta { background:radial-gradient(ellipse at 0 100%,#327877,transparent 70%),#173e56; }
.seo-page .final-cta h2 { color:#fff; }
.seo-page .final-cta p { color:#d1e6e8; }
.seo-page .final-cta .eyebrow { color:#b0ddcd; }
.seo-page .final-cta .btn-secondary { color:#193e50; border-color:#fff; background:#fff; }
.seo-page .final-cta .btn-secondary:is(:hover,:focus-visible) { color:#123344; background:#e5f2ed; border-color:#c4e2d5; }
@keyframes sv-drift { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-8px); } }
@media(prefers-reduced-motion:no-preference) { .sv-visible .sv-art-icon { animation:sv-drift 3s ease-in-out 2; } }
@media(hover:hover) and (prefers-reduced-motion:no-preference) {
 .seo-page main article,.seo-page .highlight-stack > div { transition:transform 300ms ease,box-shadow 300ms ease,border-color 300ms ease; }
 .seo-page main article:hover,.seo-page .highlight-stack > div:hover { transform:translateY(-5px); border-color:#80b7a8; box-shadow:0 16px 32px #24554718; }
 .seo-page .design-showcase-image img,.seo-page .sv-hero-visual img { transition:transform 700ms ease; }
 .seo-page .design-showcase-image:hover img,.seo-page .sv-hero-visual:hover img { transform:scale(1.035); }
 .sv-service:hover .sv-art-icon { animation:sv-drift 2s ease-in-out 2; }
}
@media(max-width:1100px) { .seo-page .webapp-service-grid,.seo-page .seo-process-section .seo-process-flow { grid-template-columns:repeat(2,minmax(0,1fr)); } .seo-page .split-grid,.seo-page .page-hero-grid { gap:30px; } }
@media(max-width:800px) { .seo-page main .container { width:calc(100% - 40px); } .seo-page main .section { padding:60px 0; } .seo-page .split-grid,.seo-page .page-hero-grid { grid-template-columns:1fr; } .seo-page .focus-section .service-card-grid,.seo-page .technical-grid { grid-template-columns:1fr; } .seo-page .service-detail-hero { padding:40px 0; } }
@media(max-width:560px) { .seo-page .webapp-service-grid,.seo-page .highlight-stack,.seo-page .seo-process-section .seo-process-flow,.seo-page .check-list { grid-template-columns:1fr; } .seo-page main h1 { font-size:36px; } .seo-page .hero-actions { flex-direction:column; } .seo-page main .sv-scope { padding:18px; } }
@media(prefers-reduced-motion:reduce) { .seo-page main *, .seo-page main *::before,.seo-page main *::after { animation:none !important; transition:none !important; } }

/* Keep foregrounds explicit on contrasting surfaces and preserve illustration proportions. */
.seo-page .focus-section details li { color:#e0eeed; font-size:16px; line-height:1.8; }
.seo-page .focus-section details li::marker { color:#b3ddcb; }
.seo-page .focus-section article details { margin-top:auto; border-color:#71999f; }
.seo-page .final-cta p { opacity:1; }
.seo-page .seo-process-section small { color:#466b5e; }
.seo-page .compact-list-grid > span,.seo-page .feature-cloud > span { color:#263d56; }
.seo-page .sv-hero-visual img,.seo-page .design-showcase-image img { display:block; width:100%; height:auto; aspect-ratio:auto; object-fit:contain; }
.seo-page .sv-hero-visual { overflow:hidden; min-width:0; }
.seo-page .design-showcase-image { width:100%; min-width:0; align-self:start; }
.seo-page .benefits-section .split-grid,.seo-page .audit-section .split-grid { align-items:start; }
.seo-page .design-showcase-image figcaption { line-height:1.6; margin:16px 0 0; color:#405f55; }
.seo-page .audit-section .compact-list-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
.seo-page .audit-section .compact-list-grid > span { display:flex; align-items:center; font-size:16px; line-height:1.55; font-weight:600; }
.seo-page main summary:focus-visible,.seo-page main .btn:focus-visible { outline:3px solid #4a9c86; outline-offset:4px; }
.seo-page .focus-section summary:focus-visible { outline-color:#b3ddcb; }
@media(max-width:800px) { .seo-page .design-showcase-image { max-width:620px; justify-self:center; } .seo-page .audit-section .design-showcase-image { order:2; } }
@media(max-width:560px) { .seo-page .design-showcase-image,.seo-page .sv-hero-visual { padding:12px; } .seo-page .audit-section .compact-list-grid { grid-template-columns:1fr; } }

.seo-page .highlight-stack .sv-highlight-icon { position:static; flex-shrink:0; padding:0; }

/* Grouped solutions and industry cards use the same page alignment. */
.seo-page .sv-solution-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.seo-page .sv-solution-card { position:relative; padding:30px; border:1px solid #d4e4df; border-radius:22px; background:linear-gradient(135deg,#f0f7f3,#fff 65%); overflow:hidden; }
.seo-page .sv-category-tone-1 { --category-accent:#345f91; --category-soft:#e7eff9; }
.seo-page .sv-category-tone-2 { --category-accent:#7c5d2b; --category-soft:#f5ecdd; }
.seo-page .sv-category-icon { display:grid; place-items:center; flex-shrink:0; width:54px; height:54px; border-radius:16px; color:var(--category-accent,#286859); background:var(--category-soft,#e3f1e9); border:1px solid #ffffff; }
.seo-page .sv-category-icon svg { width:28px; height:28px; }
.seo-page .sv-solution-card h3 { margin:22px 0 12px; }
.seo-page .sv-solution-card p { font-size:16px; margin:0 0 22px; }
.seo-page .sv-solution-card ul { display:grid; gap:10px; list-style:none; margin:0; padding:20px 0 0; border-top:1px solid #d5e5de; }
.seo-page .sv-solution-card li { display:flex; align-items:baseline; gap:10px; color:#34594f; font-size:16px; line-height:1.6; }
.seo-page .sv-solution-card li::before { content:'✓'; color:var(--category-accent,#286859); font-weight:700; }
.seo-page .sv-industry-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.seo-page .sv-industry-card { display:flex; align-items:flex-start; gap:16px; padding:24px; border:1px solid #d4e4df; border-radius:18px; background:#fff; }
.seo-page .sv-industry-card > div:last-child { min-width:0; }
.seo-page .sv-industry-card h3 { font-size:19px; line-height:1.4; margin:0 0 7px; }
.seo-page .sv-industry-card p { font-size:15px; line-height:1.6; margin:0; color:#506b64; }
.seo-page .faq-section .container.narrow { max-width:1240px; margin:0 auto; text-align:left; }
.seo-page .faq-section .faq-list { width:100%; max-width:none; margin:28px 0 0; display:grid; gap:14px; }
.seo-page .faq-section .faq-list details { margin:0; padding:8px 24px; box-shadow:none; }
.seo-page .faq-section .faq-list summary { padding:18px 36px 18px 0; line-height:1.6; }
.seo-page .faq-section .faq-list p { max-width:1000px; margin:0 0 20px; }
.seo-page .faq-section .faq-list details[open] { border-color:#7eaf9e; background:#fafffc; }
@media(hover:hover) and (prefers-reduced-motion:no-preference) { .seo-page .sv-category-icon { transition:transform .3s ease,box-shadow .3s ease; } .seo-page :is(.sv-solution-card,.sv-industry-card):hover .sv-category-icon { transform:translateY(-3px) rotate(-5deg); box-shadow:0 8px 16px #24554718; } }
@media(max-width:1100px) { .seo-page .sv-industry-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:650px) { .seo-page .sv-solution-grid,.seo-page .sv-industry-grid { grid-template-columns:1fr; } .seo-page .sv-solution-card { padding:24px; } .seo-page .sv-industry-card { padding:20px; } .seo-page .faq-section .faq-list details { padding:6px 18px; } }

/* A dedicated reporting surface separates measurement from the team story. */
.seo-page .audit-section { background:radial-gradient(ellipse at 0 20%,#d4e8ed,transparent 65%),linear-gradient(130deg,#edf3fb,#e7f2f5); border-block:1px solid #cfdee8; }
.seo-page .audit-section .split-grid { gap:40px; grid-template-columns:.95fr 1.05fr; }
.seo-page .audit-section .eyebrow { color:#285b76; }
.seo-page .audit-section .sv-report-visual { padding:20px; background:#ffffffc9; border:1px solid #fff; box-shadow:0 24px 55px #254e6820; }
.seo-page .sv-report-label { color:#234c64; font-size:16px; font-weight:700; padding:2px 4px 18px; }
.seo-page .sv-report-cycle { display:flex; gap:8px; align-items:center; margin:20px 0 0; }
.seo-page .sv-report-cycle span { flex:1; padding:12px 6px; text-align:center; background:#e5eff6; border:1px solid #ccdce7; border-radius:10px; color:#254f69; font-size:14px; font-weight:700; }
.seo-page .sv-report-cycle span:last-child { background:#e0efe8; color:#245d4e; border-color:#c4dfd1; }
.seo-page .sv-report-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:26px; }
.seo-page .sv-report-card { display:flex; align-items:flex-start; gap:12px; padding:20px 16px; border:1px solid #c9dce6; border-radius:16px; background:#fff; box-shadow:0 6px 18px #294c6808; }
.seo-page .sv-report-card:last-child { grid-column:1/-1; background:#eff8f4; border-color:#b5d9c9; }
.seo-page .sv-report-card > div:last-child { min-width:0; }
.seo-page .sv-report-icon { display:grid; place-items:center; width:38px; height:38px; flex-shrink:0; color:#2b6580; background:#e8f1f8; border-radius:11px; }
.seo-page .sv-report-icon svg { width:23px; height:23px; }
.seo-page .sv-report-card h3 { font-size:18px; line-height:1.4; margin:0 0 10px; color:#193e50; }
.seo-page .sv-report-card ul { list-style:none; padding:0; margin:0; display:grid; gap:7px; }
.seo-page .sv-report-card li { font-size:15px; line-height:1.55; color:#4a6574; }
.seo-page .sv-report-card:last-child ul { grid-template-columns:1fr 1fr; gap:12px 28px; }
@media(hover:hover) and (prefers-reduced-motion:no-preference) { .seo-page .sv-report-icon { transition:transform .3s ease; } .seo-page .sv-report-card:hover .sv-report-icon { transform:rotate(-7deg) scale(1.07); } }
@media(max-width:1100px) { .seo-page .sv-report-grid { grid-template-columns:1fr; } }
@media(max-width:800px) { .seo-page .audit-section .split-grid { grid-template-columns:1fr; } .seo-page .sv-report-grid { grid-template-columns:1fr 1fr; } }
@media(max-width:560px) { .seo-page .sv-report-grid { grid-template-columns:1fr; } .seo-page .sv-report-card:last-child ul { grid-template-columns:1fr; gap:7px; } .seo-page .audit-section .sv-report-visual { padding:14px; } }