/* Shared commercial pages, native navigation and contact. */
body { overflow-wrap: break-word; }
:root { --muted: #b9b7c1; }
.header { position: relative; z-index: 20; }
.header nav a { min-height: 44px; display: inline-flex; align-items: center; }
.header nav a[aria-current] { color: #d3bfff; }
.mobile-menu { display: none; }
.inner-page main { padding-top: 38px; }
.breadcrumbs { color: #b8afc6; font-size: .74rem; margin-bottom: 35px; }
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 8px 14px; list-style: none; padding: 0; margin: 0; }
.breadcrumbs li+li:before { content: '/'; color: #887698; margin-right: 14px; }
.breadcrumbs a { text-decoration: none; }
.page-intro { padding: 25px 0 45px; max-width: 800px; }
.page-intro .eyebrow { color: #c0a7ef; font-size: .65rem; }
.page-intro h1 { font-size: clamp(2.2rem, 4.8vw, 3.4rem); line-height: 1.12; margin: 22px 0; }
.page-intro .lead { font-size: 1.1rem; line-height: 1.85; max-width: 720px; margin: 25px 0; }
.page-intro .button { margin-top: 8px; }
.hero-location { font-size: .72rem; color: #b5a8c9; margin: 18px 0 0; }
.content-section { margin: 65px 0; }
.content-section>h2 { max-width: 700px; font-size: clamp(1.45rem, 3vw, 1.8rem); }
.content-section>p { max-width: 720px; }
.reading-width { max-width: 720px; }
.commercial-services { text-align: left; margin: 60px 0; gap: 45px; }
.commercial-services article { border-top: 1px solid #50435f; padding-top: 22px; }
.commercial-services article:last-child { grid-column: 1 / -1; max-width: 550px; }
.commercial-services h3 { max-width: none; margin: 15px 0; font-size: 1.6rem; }
.commercial-services h3 a { text-decoration: none; }
.commercial-services p { font-size: .94rem; line-height: 1.8; }
.commercial-services .eyebrow { font-size: .62rem; color: #b9a1d6; }
.text-link { display: inline-flex; gap: 8px; align-items: center; min-height: 44px; font-size: .8rem; color: #cbb5ff; }
.benefits { list-style: none; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; margin: 0 0 65px; padding: 0; }
.benefits li { padding: 20px; border: 1px solid #4a3c5c; border-radius: 12px; background: #2b243622; font-size: .86rem; color: #d4c9e0; }
.service-content { max-width: 750px; }
.steps { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 25px 40px; padding-left: 23px; margin: 30px 0; }
.steps li { padding-left: 6px; }
.steps li::marker { color: #c6a7f5; }
.steps h3 { font-size: 1rem; margin: 10px 0; }
.steps p { font-size: .88rem; line-height: 1.8; margin-top: 0; }
.related-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 35px 24px; }
.related-card { min-width: 0; }
.related-card a { display: block; text-decoration: none; }
.related-card img { display: block; width: 100%; height: 185px; object-fit: contain; object-position: center; background: #211c29; border: 1px solid #42364f; border-radius: 8px; }
.related-card h3 { font-size: 1.1rem; margin: 10px 0; }
.related-card h3 span { color: #bea1f2; }
.related-card a>p { font-size: .7rem; margin-bottom: 0; color: #b5a4c9; }
.related-context { font-size: .7rem; line-height: 1.75; margin: 0; color: #b8a9c9; }
.cta-panel { margin: 75px 0; padding: 42px; border: 1px solid #51415f; border-radius: 24px; background: #2a233322; }
.cta-panel h2 { margin-top: 0; max-width: 650px; }
.cta-panel p { max-width: 650px; margin-bottom: 25px; }
.faq { border-top: 1px solid #4a3b59; padding-top: 15px; }
.faq details { border-bottom: 1px solid #403447; padding: 0 2px; }
.faq summary { padding: 18px 0; cursor: pointer; font-weight: 600; font-size: .95rem; }
.faq p { margin: 0 0 24px; max-width: 700px; font-size: .92rem; }
summary:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline: 3px solid #c4afff; outline-offset: 4px; }
.other-services { margin: 70px 0; }
.other-services h2 { font-size: 1.2rem; }
.other-services a,.case-service-links a { display: inline-flex; align-items: center; min-height: 44px; margin-right: 22px; color: #c7b1f2; font-size: .86rem; }
.portfolio-more { border-top: 1px solid #4b3e58; }
.portfolio-more>summary { min-height: 60px; display: flex; align-items: center; justify-content: space-between; padding: 18px 4px; list-style: none; cursor: pointer; color: #d0bbef; font-size: .9rem; }
.portfolio-more>summary::-webkit-details-marker { display: none; }
.portfolio-index-link { padding: 18px 4px; font-size: .83rem; }
.case-permalink { margin: 25px 0 0; font-size: .85rem; }
.case-permalink a { color: #d0b7fa; display: inline-flex; min-height: 44px; align-items: center; }
.standalone-case { margin: 0 0 60px; }
.standalone-case h2 { font-size: 1.3rem; line-height: 1.4; margin: 32px 0 16px; }
.standalone-case .project-stack h2 { font-size: .85rem; }
.standalone-case .case-results h2 { font-size: 1rem; margin-top: 0; }
.standalone-case .case-primary .case-image { max-height: 550px; }
.blog-grid { display: grid; grid-template-columns: 1fr; }
.blog-card { max-width: 760px; border-top: 1px solid #544064; padding: 30px 0; }
.blog-card a { text-decoration: none; }
.blog-card img { width: 100%; height: 300px; object-fit: contain; background: #24202c; border-radius: 12px; }
.blog-card h2 { font-size: 1.8rem; }
.blog-card span { display: inline-block; min-height: 44px; color: #c7a6f2; }
.article-byline { font-size: .8rem; color: #c5b6d6; margin: -15px 0 25px; }
.article-cover { margin: 0 0 50px; }
.article-cover img { width: 100%; max-height: 480px; object-fit: contain; background: #211c29; border-radius: 12px; display: block; }
.article-cover figcaption { font-size: .72rem; color: #b8a8c8; margin-top: 12px; }
.article-layout { display: grid; grid-template-columns: 220px minmax(0,1fr); gap: 40px; align-items: start; }
.article-toc { position: sticky; top: 30px; padding: 18px; border: 1px solid #41334c; border-radius: 10px; }
.article-toc h2 { font-size: .9rem; margin: 0 0 14px; }
.article-toc ol { padding-left: 18px; margin: 0; font-size: .72rem; }
.article-toc li { margin-bottom: 10px; color: #b8a9c9; }
.article-toc a { text-decoration: none; }
.article-body section { margin-bottom: 42px; }
.article-body h2 { font-size: 1.5rem; line-height: 1.35; margin-top: 0; }
.article-body p { color: #c5bfce; font-size: 1rem; line-height: 1.9; }
.article-body .article-source { font-size: .75rem; border-left: 2px solid #6d5284; padding-left: 13px; }
.article-checklist { padding-left: 22px; color: #d1c6df; }
.article-checklist li { margin-bottom: 12px; }
.table-scroll { overflow-x: auto; border: 1px solid #4d3b5d; border-radius: 8px; }
table { border-collapse: collapse; width: 100%; font-size: .82rem; }
caption { text-align: left; padding: 14px; font-weight: 600; }
th,td { text-align: left; vertical-align: top; padding: 14px; border-top: 1px solid #493651; min-width: 140px; }
th { background: #2a2333; color: #e6dcf3; }
td { color: #c1b6ce; }
.contact-options { display: grid; grid-template-columns: 1fr; gap: 16px; max-width: 700px; }
.contact-options a { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; padding: 20px 24px; border: 1px solid #514063; border-radius: 10px; text-decoration: none; }
.contact-options span { color: #b6a1d1; font-size: .85rem; }
.contact-options strong { font-size: 1rem; font-weight: 500; overflow-wrap: anywhere; }
.contact-form { max-width: 720px; margin: 55px 0; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.form-field { display: flex; flex-direction: column; gap: 7px; margin: 0 0 22px; }
.form-field label { font-size: .9rem; font-weight: 600; }
.form-field input,.form-field select,.form-field textarea { width: 100%; padding: 13px 14px; border: 1px solid #766281; border-radius: 8px; background: #211c2a; color: #f2eaf9; font: inherit; }
.form-field textarea { min-height: 160px; resize: vertical; }
.form-note { color: #b4a4c6; font-size: .8rem; }
.form-check { display: flex; gap: 12px; align-items: start; font-size: .85rem; margin: 20px 0; }
.form-check input { width: 20px; height: 20px; flex-shrink: 0; }
.form-status { min-height: 30px; margin: 20px 0; color: #e3d6f2; }
button { cursor: pointer; font: inherit; }
button[disabled] { opacity: .6; cursor: wait; }
.honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.site-footer { width: min(1200px,calc(100% - 64px)); display: grid; grid-template-columns: 1.2fr 1fr 1.4fr; gap: 35px; margin: 90px auto 0; padding: 35px 0 110px; border-top: 1px solid #4a3a58; text-align: left; }
.site-footer a { display: block; margin: 0 0 8px; min-height: 36px; font-size: .85rem; }
.site-footer>div:first-child>a { font-size: 1.15rem; font-weight: 700; text-decoration: none; }
.site-footer p { font-size: .8rem; color: #b9acc9; }
.site-footer .footer-bottom { grid-column: 1 / -1; margin: 0; }
@media(max-width:760px) {
 .header .desktop-nav { display: none; }
 .header .mobile-menu { display: block; }
 .mobile-menu>summary { min-height: 44px; display: flex; align-items: center; gap: 10px; list-style: none; cursor: pointer; font-size: .85rem; }
 .mobile-menu>summary::-webkit-details-marker { display: none; }
 .header .mobile-menu nav { position: absolute; right: 0; top: 72px; z-index: 30; width: min(300px,calc(100vw - 40px)); padding: 18px; display: flex; flex-direction: column; gap: 2px; background: #26202f; border: 1px solid #705583; border-radius: 12px; box-shadow: 0 16px 30px #0005; }
 .header .mobile-menu nav a { display: flex; min-height: 44px; font-size: .95rem; }
 .header .mobile-menu nav a:nth-child(3) { display: flex; }
 .inner-page main { padding-top: 28px; }
 .page-intro { padding-top: 5px; }
 .page-intro h1 { font-size: 2.2rem; }
 .page-intro .lead { font-size: 1rem; }
 .commercial-services { grid-template-columns: 1fr; gap: 35px; }
 .commercial-services article:last-child { grid-column: auto; }
 .commercial-services h3 { font-size: 1.45rem; }
 .benefits { grid-template-columns: 1fr; gap: 14px; }
 .steps { grid-template-columns: 1fr; gap: 15px; }
 .cta-panel { padding: 28px 23px; margin: 55px 0; }
 .cta-panel h2 { font-size: 1.6rem; }
 .related-grid { grid-template-columns: 1fr; }
 .article-layout { grid-template-columns: 1fr; gap: 35px; }
 .article-toc { position: static; }
 .article-cover { margin-bottom: 35px; }
 .article-body h2 { font-size: 1.4rem; }
 .article-body p { font-size: .96rem; }
 .article-source a { overflow-wrap: anywhere; }
 .form-grid { grid-template-columns: 1fr; gap: 0; }
 .site-footer { width: calc(100% - 40px); grid-template-columns: 1fr; gap: 22px; }
 .site-footer a { min-height: 44px; }
 .blog-card img { height: auto; }
}
.article-body { min-width: 0; }
@media(max-width:760px) { .article-layout { grid-template-columns: minmax(0,1fr); } }
/* Only rendered when an actual GA4 ID and reviewed consent configuration are enabled. */
.consent-banner { position: fixed; z-index: 110; left: 20px; bottom: 20px; width: min(640px,calc(100vw - 110px)); padding: 24px; border: 1px solid #8c72a5; border-radius: 14px; background: #261f30; box-shadow: 0 10px 40px #0006; }
.consent-banner[hidden] { display: none; }
.consent-banner h2 { margin: 0 0 12px; font-size: 1.15rem; }
.consent-banner p { font-size: .86rem; line-height: 1.75; color: #d5c8e4; }
.consent-banner>div { display: flex; flex-wrap: wrap; gap: 12px; }
.consent-banner button { padding: 12px 16px; min-height: 44px; color: #ede3f8; background: #393044; border: 1px solid #9279ad; border-radius: 8px; font-size: .83rem; }
.consent-preferences { justify-self: start; color: #d3c1e6; padding: 8px 0; background: transparent; border: 0; text-decoration: underline; min-height: 44px; }
@media(max-width:450px) { .consent-banner { width: calc(100vw - 40px); bottom: 88px; padding: 20px; } .consent-banner>div { flex-direction: column; } }