/* Shared internal pages and the local commercial assistant. */
.inner-page { background: #fff; }
.page-hero { background: linear-gradient(135deg, #f7fbff 0%, #fff 66%); min-height: 540px; overflow: hidden; padding: 62px 0 82px; position: relative; }
.page-hero::after { background-image: linear-gradient(rgba(13,110,253,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(13,110,253,.045) 1px, transparent 1px); background-size: 34px 34px; bottom: 0; content: ''; height: 150px; left: 0; mask-image: linear-gradient(to bottom, transparent, #000); opacity: .8; position: absolute; right: 0; }
.breadcrumb { align-items: center; color: #70809a; display: flex; flex-wrap: wrap; font-size: 11px; gap: 9px; margin-bottom: 72px; position: relative; z-index: 1; }
.breadcrumb a { color: var(--blue); font-weight: 700; }
.breadcrumb span { color: #a6b5c8; }
.page-hero-grid { align-items: end; display: grid; gap: 70px; grid-template-columns: 1.1fr .9fr; position: relative; z-index: 1; }
.page-hero-copy { max-width: 720px; }
.page-hero h1 { font-size: clamp(42px, 5.1vw, 70px); max-width: 760px; }
.page-hero-lede { color: var(--muted); font-size: 17px; line-height: 1.75; margin-bottom: 31px; max-width: 570px; }
.page-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.page-hero-actions .button { padding: 14px 18px; }
.button-outline-dark { border: 1px solid #b9cbe0; color: var(--navy); }
.button-outline-dark:hover { background: #eaf7ff; border-color: #8bbde6; }
.page-hero-art { align-items: center; display: flex; justify-content: center; min-height: 270px; position: relative; }
.page-orbit { border: 1px solid rgba(24,199,244,.32); border-radius: 50%; height: 270px; position: absolute; transform: rotate(-18deg); width: 270px; }
.page-orbit::after { border: 1px solid rgba(13,110,253,.18); border-radius: 50%; content: ''; inset: 24px -16px -24px 16px; position: absolute; transform: rotate(34deg); }
.page-art-card { background: rgba(255,255,255,.86); border: 1px solid #cbdced; border-radius: 17px; box-shadow: 0 24px 50px rgba(12,55,117,.14); max-width: 285px; padding: 23px; position: relative; transform: rotate(3deg); width: 100%; }
.page-art-top { align-items: center; display: flex; justify-content: space-between; margin-bottom: 25px; }
.page-art-brand { color: var(--navy); font-size: 12px; font-weight: 800; letter-spacing: -.03em; }
.page-art-brand span { color: var(--cyan); }
.page-art-status { align-items: center; color: #6b7b94; display: flex; font-size: 8px; gap: 6px; text-transform: uppercase; }
.page-art-status::before { background: var(--cyan); border-radius: 50%; box-shadow: 0 0 0 4px rgba(24,199,244,.12); content: ''; height: 6px; width: 6px; }
.page-art-title { color: var(--navy); font-family: Manrope, Inter, sans-serif; font-size: 26px; font-weight: 800; letter-spacing: -.06em; line-height: 1.04; margin-bottom: 19px; }
.page-art-line { background: #a9c0d8; height: 4px; margin: 7px 0; width: 72%; }
.page-art-line.short { width: 44%; }
.page-art-bars { align-items: end; display: flex; gap: 8px; height: 74px; margin-top: 24px; }
.page-art-bars i { background: linear-gradient(to top, var(--blue), var(--cyan)); border-radius: 4px 4px 0 0; display: block; flex: 1; height: 45%; }
.page-art-bars i:nth-child(2) { height: 78%; }
.page-art-bars i:nth-child(3) { height: 60%; }
.page-art-bars i:nth-child(4) { height: 92%; }
.content-section { padding: 94px 0; }
.content-section.section-light { background: var(--pale); }
.section-heading { max-width: 650px; }
.section-heading h2 { margin-bottom: 13px; }
.section-heading > p:last-child { color: var(--muted); line-height: 1.75; }
.audience-grid { display: grid; gap: 15px; grid-template-columns: repeat(3, 1fr); margin-top: 48px; }
.audience-card, .included-card, .problem-card, .related-project { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 25px; }
.audience-card { min-height: 190px; }
.audience-card span, .problem-number { color: var(--blue); font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.audience-card h3, .problem-card h3, .included-card h3 { font-size: 19px; margin: 21px 0 10px; }
.audience-card p, .problem-card p, .included-card p { color: var(--muted); font-size: 13px; line-height: 1.7; margin: 0; }
.problems-grid { display: grid; gap: 15px; grid-template-columns: repeat(3, 1fr); margin-top: 48px; }
.problem-card { background: transparent; border-color: #cedeed; min-height: 185px; }
.included-grid { display: grid; gap: 15px; grid-template-columns: repeat(2, 1fr); margin-top: 48px; }
.included-card { min-height: 170px; }
.included-card h3 { margin-top: 0; }
.included-card ul { color: var(--muted); font-size: 13px; line-height: 1.9; margin: 0; padding-left: 17px; }
.process-panel { background: var(--navy); border-radius: 20px; color: #fff; margin-top: 48px; overflow: hidden; padding: 33px; }
.process-panel-grid { display: grid; gap: 24px; grid-template-columns: repeat(4, 1fr); }
.process-card { border-top: 1px solid rgba(157,196,243,.32); padding-top: 18px; }
.process-card span { color: var(--cyan); font-size: 10px; font-weight: 800; letter-spacing: .14em; }
.process-card h3 { color: #fff; font-size: 17px; margin: 14px 0 8px; }
.process-card p { color: #b8c8e3; font-size: 12px; line-height: 1.7; margin: 0; }
.related-project { align-items: center; display: grid; gap: 38px; grid-template-columns: .85fr 1.15fr; margin-top: 48px; }
.related-project-art { background: linear-gradient(135deg, #dff6ff, #edf4ff); border-radius: 13px; min-height: 185px; overflow: hidden; padding: 22px; position: relative; }
.related-project-art::after { border: 1px solid rgba(13,110,253,.22); border-radius: 50%; content: ''; height: 170px; position: absolute; right: -35px; top: -45px; width: 170px; }
.related-project-art strong { color: var(--navy); font-size: 27px; letter-spacing: -.07em; position: relative; z-index: 1; }
.related-project-art small { bottom: 20px; color: #5c7898; font-size: 10px; left: 22px; position: absolute; }
.related-project-copy h3 { font-size: 25px; margin-bottom: 12px; }
.related-project-copy p { color: var(--muted); line-height: 1.75; margin-bottom: 21px; }
.service-faq { margin-top: 48px; max-width: 790px; }
.service-faq details { border-top: 1px solid #d9e4ef; padding: 21px 0; }
.service-faq details:last-child { border-bottom: 1px solid #d9e4ef; }
.service-faq summary { align-items: center; color: var(--navy); cursor: pointer; display: flex; font-family: Manrope, Inter, sans-serif; font-size: 16px; font-weight: 700; justify-content: space-between; list-style: none; }
.service-faq summary::-webkit-details-marker { display: none; }
.service-faq summary span { color: var(--blue); font-size: 23px; font-weight: 400; transition: transform .2s; }
.service-faq details[open] summary span { transform: rotate(45deg); }
.service-faq details p { color: var(--muted); font-size: 13px; line-height: 1.7; margin: 13px 40px 0 0; }
.page-cta { background: var(--navy); color: #fff; padding: 80px 0; }
.page-cta-inner { align-items: center; display: flex; gap: 40px; justify-content: space-between; }
.page-cta h2 { color: #fff; font-size: clamp(31px, 4vw, 48px); margin-bottom: 12px; max-width: 570px; }
.page-cta p { color: #b8c8e3; line-height: 1.75; margin: 0; max-width: 520px; }
.page-cta .button { flex: 0 0 auto; }
.about-page-hero { min-height: 490px; }
.about-story { display: grid; gap: 90px; grid-template-columns: .9fr 1.1fr; }
.about-story h2 { font-size: clamp(31px, 3.6vw, 48px); }
.about-story p { color: var(--muted); line-height: 1.8; }
.principles-grid { display: grid; gap: 15px; grid-template-columns: repeat(4, 1fr); margin-top: 47px; }
.principle-card { border-top: 2px solid var(--cyan); padding: 20px 0 0; }
.principle-card h3 { font-size: 18px; }
.principle-card p { color: var(--muted); font-size: 13px; line-height: 1.7; }
.about-process { display: grid; gap: 15px; grid-template-columns: repeat(3, 1fr); margin-top: 47px; }
.about-process article { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 25px; }
.about-process span { color: var(--blue); font-size: 10px; font-weight: 800; letter-spacing: .14em; }
.about-process h3 { font-size: 18px; margin: 18px 0 9px; }
.about-process p { color: var(--muted); font-size: 13px; line-height: 1.7; margin: 0; }
.selected-projects { display: grid; gap: 15px; grid-template-columns: repeat(3, 1fr); margin-top: 47px; }
.selected-project { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.selected-project img { aspect-ratio: 16 / 10; display: block; object-fit: cover; width: 100%; }
.selected-project div { padding: 19px 20px 21px; }
.selected-project span { color: var(--blue); font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.selected-project h3 { font-size: 18px; margin: 9px 0 0; }
.route-back { padding-bottom: 52px; padding-top: 28px; }
.sales-assistant { bottom: max(18px, env(safe-area-inset-bottom)); position: fixed; right: 20px; z-index: 80; }
.sales-assistant-toggle { align-items: center; background: var(--navy); border: 1px solid rgba(255,255,255,.16); border-radius: 999px; box-shadow: 0 15px 35px rgba(6,27,79,.28); color: #fff; display: flex; font-size: 13px; font-weight: 800; gap: 9px; padding: 13px 18px; transition: background .2s ease, transform .2s ease; }
.sales-assistant-toggle:hover, .sales-assistant-toggle:focus-visible { background: var(--blue); transform: translateY(-2px); }
.assistant-spark { color: var(--cyan); font-size: 17px; }
.assistant-mobile-mark { display: none; }
.sales-assistant-panel { background: #fff; border: 1px solid #cfdeed; border-radius: 18px; bottom: 62px; box-shadow: 0 24px 70px rgba(6,27,79,.22); max-height: min(610px, calc(100vh - 110px)); overflow: auto; position: absolute; right: 0; width: min(380px, calc(100vw - 32px)); }
.sales-assistant-panel[hidden] { display: none; }
.assistant-header { align-items: flex-start; background: var(--navy); color: #fff; display: flex; justify-content: space-between; padding: 22px 22px 19px; }
.assistant-kicker { color: var(--cyan); font-size: 9px; font-weight: 800; letter-spacing: .15em; margin: 0 0 7px; text-transform: uppercase; }
.assistant-header h2 { color: #fff; font-size: 22px; margin: 0; }
.assistant-close { background: rgba(255,255,255,.1); border-radius: 50%; color: #fff; font-size: 22px; height: 32px; line-height: 1; width: 32px; }
.assistant-close:hover, .assistant-close:focus-visible { background: rgba(255,255,255,.2); }
.assistant-body { padding: 21px; }
.assistant-greeting, .assistant-copy, .assistant-question { color: var(--muted); font-size: 13px; line-height: 1.7; margin: 0 0 17px; }
.assistant-question { color: var(--navy); font-family: Manrope, Inter, sans-serif; font-size: 16px; font-weight: 800; }
.assistant-copy a { color: var(--blue); font-weight: 700; }
.assistant-result-title { color: var(--navy); font-family: Manrope, Inter, sans-serif; font-size: 23px; line-height: 1.1; margin: 3px 0 10px; }
.assistant-options { display: grid; gap: 8px; }
.assistant-option { align-items: center; background: #f6faff; border: 1px solid #d9e7f3; border-radius: 10px; color: var(--navy); display: flex; font-size: 12px; font-weight: 700; justify-content: space-between; padding: 12px 13px; text-align: left; transition: background .2s ease, border-color .2s ease, transform .2s ease; width: 100%; }
.assistant-option:hover, .assistant-option:focus-visible { background: #e9f7ff; border-color: #8bc7ed; transform: translateX(2px); }
.assistant-option span { color: var(--blue); font-size: 16px; font-weight: 400; }
.assistant-option-whatsapp { background: #eefbf7; border-color: #b7ead9; }
.assistant-option-whatsapp span { color: #00a884; }
.assistant-option:focus-visible, .sales-assistant-toggle:focus-visible, .assistant-close:focus-visible { box-shadow: 0 0 0 3px rgba(24,199,244,.38); outline: none; }
.sales-assistant a { text-decoration: none; }
.assistant-internal-nav { border-top: 1px solid #d5e0eb; margin-top: 18px; padding-top: 13px; }
.assistant-internal-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.assistant-nav-button { align-items: center; background: #f1f5f9; border: 1px solid #b9c8d8; border-radius: 9px; color: #061b4f; display: inline-flex; font-size: 12px; font-weight: 700; justify-content: center; min-height: 44px; padding: 9px 12px; transition: background .18s ease, border-color .18s ease; }
.assistant-nav-button:hover:not(:disabled), .assistant-nav-button:focus-visible { background: #e4edf5; border-color: #7189a6; }
.assistant-nav-button:disabled { color: #66758a; cursor: not-allowed; opacity: .78; }
.assistant-restart { background: transparent; border-radius: 8px; color: #53627a; display: block; font-size: 11px; margin: 5px auto 0; min-height: 44px; padding: 8px 12px; text-decoration: underline; text-underline-offset: 2px; }
.assistant-restart:hover, .assistant-restart:focus-visible { background: #f1f5f9; color: #061b4f; }
.assistant-nav-button:focus-visible, .assistant-restart:focus-visible { outline: 3px solid #087f8c; outline-offset: 2px; }
body.assistant-open .back-to-top { opacity: 0; pointer-events: none; transform: translateY(12px); visibility: hidden; }
@media (max-width: 900px) {
  .page-hero-grid, .about-story { gap: 40px; grid-template-columns: 1fr; }
  .page-hero-art { justify-content: flex-start; min-height: 215px; }
  .page-orbit { height: 220px; width: 220px; }
  .process-panel-grid { grid-template-columns: repeat(2, 1fr); }
  .principles-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
  .page-hero { min-height: 0; padding: 40px 0 66px; }
  .breadcrumb { margin-bottom: 54px; }
  .page-hero h1 { font-size: clamp(38px, 10vw, 52px); }
  .page-hero-lede { font-size: 15px; }
  .page-hero-actions, .page-hero-actions .button { width: 100%; }
  .page-hero-art { margin-top: 10px; min-height: 235px; }
  .content-section { padding: 72px 0; }
  .audience-grid, .problems-grid, .included-grid, .about-process, .selected-projects { grid-template-columns: 1fr; }
  .process-panel { padding: 24px; }
  .process-panel-grid { grid-template-columns: 1fr; }
  .related-project { gap: 22px; grid-template-columns: 1fr; }
  .page-cta { padding: 65px 0; }
  .page-cta-inner { align-items: flex-start; display: flex; flex-direction: column; }
  .page-cta .button { width: 100%; }
  .principles-grid { grid-template-columns: 1fr 1fr; }
  .sales-assistant { right: 16px; }
  .sales-assistant-toggle { padding: 12px 15px; }
  .sales-assistant-panel { bottom: 58px; max-height: calc(100vh - 92px); }
}
@media (max-width: 350px) {
  .assistant-internal-actions { display: grid; grid-template-columns: 1fr; }
  .assistant-nav-button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .sales-assistant-toggle, .assistant-option, .assistant-nav-button { transition: none; }
}

/* Keep Onyx available without covering these dense project sections. */
body.route-plans .sales-assistant,
body.route-projects .sales-assistant { bottom:auto; top:16px; }
body.route-plans .assistant-invite,
body.route-projects .assistant-invite { display:none !important; }

/* Onyx conversation and automation service detail. */
.sales-assistant-panel { bottom: calc(max(18px, env(safe-area-inset-bottom)) + 62px); box-sizing: border-box; display: flex; flex-direction: column; height: min(680px, calc(100dvh - 96px)); max-height: min(680px, calc(100dvh - 96px)); min-height: 0; overflow: hidden; position: fixed; right: 20px; width: min(420px, calc(100vw - 24px)); }
.assistant-header { align-items: center; flex: 0 0 auto; min-height: 88px; padding: 16px 18px; }
.assistant-identity { align-items: center; display: flex; gap: 12px; }
.assistant-avatar { align-items: center; background: linear-gradient(145deg, #0d6efd, #12b7d0); border: 1px solid #ffffff45; border-radius: 13px; color: white; display: inline-flex; flex: 0 0 42px; font-size: 19px; font-weight: 800; height: 42px; justify-content: center; }
.assistant-header h2 { font-size: 20px; line-height: 1.15; }
.assistant-kicker { font-size: 9px; letter-spacing: .1em; margin-bottom: 3px; }
.assistant-status { color: #a5f0d4; font-size: 11px; }
.assistant-status::before { background: #63e1b5; border-radius: 50%; content: ''; display: inline-block; height: 6px; margin: 0 6px 1px 0; width: 6px; }
.assistant-automated { color: #c2d0e7; display: inline-block; font-size: 10px; margin-left: 10px; }
.assistant-close { align-items: center; display: inline-flex; flex: 0 0 44px; height: 44px; justify-content: center; min-height: 44px; width: 44px; }
.assistant-body { box-sizing: border-box; flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 18px; scrollbar-gutter: stable; }
.assistant-greeting, .assistant-copy, .assistant-question { font-size: 14px; line-height: 1.58; margin-bottom: 14px; }
.assistant-question { font-size: 16px; font-weight: 750; line-height: 1.4; }
.assistant-helper { color: #62748d; font-size: 13px; line-height: 1.55; margin: -5px 0 18px; }
.assistant-options { gap: 8px; }
.assistant-option { font-size: 13px; line-height: 1.35; min-height: 46px; padding: 11px 13px; }
.assistant-reply-form { display: grid; gap: 9px; margin: 0; }
.assistant-reply-form > label { color: #10264b; font-size: 14px; font-weight: 750; line-height: 1.35; }
.assistant-automation-form textarea, .assistant-reply-form textarea { background: #f1f7ff; border: 1px solid #cbd9e9; border-radius: 12px; color: #142643; display: block; font: inherit; font-size: 16px; line-height: 1.5; min-height: 90px; padding: 12px 13px; resize: vertical; width: 100%; }
.assistant-automation-form textarea { max-height: 150px; min-height: 96px; resize: none; overflow-y: auto; }
.assistant-reply-form textarea:focus-visible { border-color: #05aebc; box-shadow: 0 0 0 3px #15bbc333; outline: none; }
.assistant-field-meta { align-items: center; color: #697b94; display: flex; font-size: 11px; justify-content: space-between; min-height: 18px; }
.assistant-validation { color: #a23737; }
.assistant-counter { margin-left: auto; }
.assistant-analyze, .assistant-request-link { align-items: center; border: 0; border-radius: 10px; display: flex; font-size: 14px; justify-content: center; min-height: 48px; padding: 12px 16px; width: 100%; }
.assistant-privacy { color: #738198; font-size: 11px; line-height: 1.4; margin: 1px 0 0; }
.assistant-thread { display: grid; gap: 10px; margin: 0 0 17px; max-height: 300px; overflow-y: auto; padding: 2px 3px 2px 0; }
.assistant-message { border-radius: 14px; font-size: 13px; line-height: 1.58; margin: 0; max-width: 94%; padding: 11px 13px; white-space: pre-line; }
.assistant-message-onyx { background: #f3f7fc; border: 1px solid #e5ecf5; border-bottom-left-radius: 5px; color: #31435e; justify-self: start; }
.assistant-message-visitor { background: #0d6efd; border-bottom-right-radius: 5px; color: #fff; justify-self: end; }
.assistant-message-note { color: #63758e; font-size: 12px; }
.assistant-processing { align-items: center; display: flex; gap: 9px; }
.assistant-processing::before { animation: onyx-pulse 1s ease-in-out infinite alternate; background: #0cb5be; border-radius: 50%; content: ''; height: 7px; width: 7px; }
@keyframes onyx-pulse { to { opacity: .35; transform: scale(.7); } }
.assistant-current-actions { border-top: 1px solid #e0e8f2; padding-top: 14px; }
.assistant-closing { color: #51637d; font-size: 12px; line-height: 1.5; margin: 0 0 12px; }
.assistant-current-actions .assistant-options { grid-template-columns: 1fr 1fr; }
.assistant-current-actions .assistant-option { justify-content: center; text-align: center; }
.assistant-internal-nav { margin-top: 16px; padding-top: 12px; }
.assistant-internal-actions { display: grid; grid-template-columns: 1fr 1fr; }
.assistant-nav-button { font-size: 12px; min-height: 44px; padding: 9px 7px; width: 100%; }
.assistant-restart { font-size: 12px; margin: 4px auto 0; min-height: 44px; }
.assistant-request-link { margin-top: 12px; }
.automation-offering-grid { display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 31px; }
.automation-offering-grid article { background: #fff; border: 1px solid #dce6f1; border-radius: 14px; padding: 22px; }
.automation-offering-grid article > span { align-items: center; background: #e9f4ff; border-radius: 9px; color: #0d6efd; display: inline-flex; font-size: 12px; font-weight: 800; height: 30px; justify-content: center; width: 30px; }
.automation-offering-grid h3 { color: #10264b; font-size: 17px; line-height: 1.35; margin: 14px 0 11px; }
.automation-offering-grid ul { color: #64748b; font-size: 13px; line-height: 1.55; margin: 0; padding-left: 18px; }
.automation-offering-grid li + li { margin-top: 5px; }
.automation-example-list { display: flex; flex-wrap: wrap; gap: 9px; list-style: none; margin: 28px 0 20px; padding: 0; }
.automation-example-list li { background: #fff; border: 1px solid #dce6f1; border-radius: 999px; color: #264363; font-size: 13px; padding: 9px 13px; }
.automation-scope { background: #edf6ff; border-left: 3px solid #05aebc; border-radius: 0 9px 9px 0; color: #435a74; font-size: 13px; line-height: 1.65; margin: 0; padding: 14px 16px; }
@media (max-width: 768px) {
  .sales-assistant { bottom: max(12px, env(safe-area-inset-bottom)); right: 12px; top: auto; }
  body.route-plans .sales-assistant, body.route-projects .sales-assistant { bottom: max(12px, env(safe-area-inset-bottom)); top: auto; }
  .sales-assistant-toggle { align-items: center; border-radius: 50%; box-sizing: border-box; display: flex; height: 52px; justify-content: center; min-height: 52px; min-width: 52px; padding: 0; position: relative; transition: background-color .18s ease, box-shadow .18s ease; width: 52px; }
  .sales-assistant-toggle:hover, .sales-assistant-toggle:focus-visible { transform: none; }
  .assistant-spark, .assistant-toggle-label { display: none; }
  .assistant-mobile-mark { align-items: center; color: #fff; display: inline-flex; font-size: 21px; font-weight: 850; height: 100%; justify-content: center; line-height: 1; width: 100%; }
  .assistant-mobile-mark::after { background: var(--cyan); clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%); content: ''; height: 8px; position: absolute; right: 8px; top: 7px; width: 8px; }
  body.assistant-open .sales-assistant-toggle { display: none; }
  .sales-assistant-toggle[data-clearance-hidden], .back-to-top[data-clearance-hidden] { opacity: 0; pointer-events: none; visibility: hidden; }
  .assistant-invite[data-clearance-hidden] { visibility: hidden; pointer-events: none; }
  .sales-assistant-panel { bottom: calc(max(12px, env(safe-area-inset-bottom)) + 62px); height: min(680px, calc(100dvh - 88px)); max-height: min(680px, calc(100dvh - 88px)); right: 12px; width: calc(100vw - 24px); }
  .back-to-top { bottom: calc(max(12px, env(safe-area-inset-bottom)) + 76px); right: 12px; }
  .assistant-body { padding: 16px; }
  .assistant-thread { max-height: 220px; }
  .assistant-current-actions .assistant-options { grid-template-columns: 1fr; }
  .automation-offering-grid { grid-template-columns: 1fr; }
  .automation-offering-grid article { padding: 19px; }
}
@media (max-width: 350px) {
  .sales-assistant-toggle { height: 48px; min-height: 48px; min-width: 48px; width: 48px; }
  .assistant-mobile-mark { font-size: 20px; }
  .assistant-mobile-mark::after { right: 7px; top: 6px; }
  .back-to-top { bottom: calc(max(12px, env(safe-area-inset-bottom)) + 72px); }
}
@media (max-width: 350px) {
  .assistant-internal-actions { grid-template-columns: 1fr 1fr; }
  .assistant-nav-button { font-size: 11px; padding-inline: 4px; }
  .assistant-automated { display: block; margin-left: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .assistant-processing::before { animation: none; }
}

/* Service pages share one visual language and use an accent per discipline. */
:root { --service-accent: #0d6efd; --service-soft: #eaf3ff; }
.service-store { --service-accent: #08abc7; --service-soft: #e4fafd; }
.service-software { --service-accent: #304eaa; --service-soft: #edf0ff; }
.service-automation { --service-accent: #00aeca; --service-soft: #e2fbff; }
.service-page .service-context { background: #f4f8fc; border-bottom: 1px solid #e1eaf3; color: #687891; font-size: 12px; }
.service-context .container { align-items: center; display: flex; gap: 10px; min-height: 38px; }
.service-context b { color: var(--service-accent); font-weight: 800; }
.service-context-count { color: #8795a9; font-size: 10px; font-weight: 700; letter-spacing: .08em; margin-left: auto; text-transform: uppercase; }
.service-page .page-hero { background: radial-gradient(ellipse at 82% 45%, var(--service-soft), transparent 43%), linear-gradient(135deg, #fbfdff, #fff 65%); min-height: 0; padding: 0 0 67px; }
.service-page .page-hero::after { opacity: .4; }
.service-page .breadcrumb { margin: 0 0 38px; padding-top: 22px; }
.service-page .breadcrumb a, .service-page .service-index-label { color: var(--service-accent); }
.service-page .page-hero-grid { align-items: center; gap: clamp(28px, 5vw, 72px); grid-template-columns: 1.04fr .96fr; }
.service-page .page-hero-copy { max-width: 660px; }
.service-index-label { align-items: center; display: flex; font-size: 11px; font-weight: 800; gap: 12px; letter-spacing: .14em; margin: 0 0 13px; }
.service-index-label > span { align-items: center; background: var(--service-accent); border-radius: 7px; box-shadow: 0 6px 16px color-mix(in srgb, var(--service-accent) 24%, transparent); color: #fff; display: inline-flex; font-size: 11px; height: 30px; justify-content: center; letter-spacing: .04em; width: 35px; }
.service-index-label i { background: var(--service-accent); height: 1px; opacity: .45; width: 22px; }
.service-headline-icon { align-items: center; background: var(--service-soft); border: 1px solid color-mix(in srgb, var(--service-accent) 22%, white); border-radius: 17px; color: var(--service-accent); display: flex; height: 64px; justify-content: center; margin-bottom: 18px; width: 64px; }
.service-icon-large { height: 36px; width: 36px; }
.service-page .page-hero h1 { font-size: clamp(39px, 4.3vw, 61px); margin-bottom: 20px; }
.service-page .page-hero h1 span { color: var(--service-accent); }
.service-page .page-hero-lede { font-size: 15px; margin-bottom: 23px; }
.service-page .page-hero-actions { gap: 11px; }
.service-page .page-hero-actions .button-primary { background: var(--service-accent); box-shadow: 0 12px 24px color-mix(in srgb, var(--service-accent) 24%, transparent); }
.service-page .button-outline-dark:hover { background: var(--service-soft); border-color: color-mix(in srgb, var(--service-accent) 45%, white); }
.service-back-link { color: #6f7d92; display: inline-flex; font-size: 12px; font-weight: 700; margin-top: 19px; }
.service-back-link:hover { color: var(--service-accent); }
.service-visual { align-items: center; display: flex; justify-content: center; min-height: 385px; position: relative; }
.service-visual::before, .service-visual::after { border: 1px solid color-mix(in srgb, var(--service-accent) 15%, transparent); border-radius: 50%; content: ''; height: 330px; position: absolute; width: 330px; }
.service-visual::after { height: 275px; transform: rotate(35deg) scaleX(1.28); width: 275px; }
.visual-browser, .store-panel, .ops-dashboard, .automation-flow { background: #fff; border: 1px solid #d5e1ee; border-radius: 15px; box-shadow: 0 24px 55px rgba(12,55,117,.15); position: relative; z-index: 1; }
.visual-browser { overflow: hidden; transform: rotate(-2deg); width: min(100%, 400px); }
.visual-browser-bar { align-items: center; background: #f5f8fc; border-bottom: 1px solid #e7edf5; display: flex; gap: 5px; height: 35px; padding: 0 13px; }
.visual-browser-bar > span { background: #c2d0e0; border-radius: 50%; height: 7px; width: 7px; }
.visual-browser-bar > span:first-child { background: var(--service-accent); }
.visual-browser-bar i { background: #e7eef6; border-radius: 5px; color: #9aa9bb; font-size: 8px; font-style: normal; margin-left: 22px; padding: 4px; text-align: center; width: 52%; }
.visual-web-nav { align-items: center; display: flex; gap: 16px; padding: 17px 20px 10px; }
.visual-web-nav b, .visual-web-nav b span { color: var(--navy); font-size: 10px; }
.visual-web-nav b span { color: var(--service-accent); }
.visual-web-nav > i { background: #ccd8e6; height: 3px; width: 23px; }
.visual-web-nav em { background: var(--service-accent); border-radius: 5px; color: #fff; font-size: 7px; font-style: normal; margin-left: auto; padding: 6px 8px; }
.visual-web-content { background: linear-gradient(125deg, #f3f8ff, #edf8ff); display: grid; grid-template-columns: 1.1fr .9fr; min-height: 210px; padding: 20px; }
.visual-web-copy { padding-top: 9px; }
.visual-web-copy small { color: var(--service-accent); display: block; font-size: 6px; font-weight: 800; letter-spacing: .13em; margin-bottom: 11px; }
.visual-web-copy > b { color: var(--navy); display: block; font-size: 21px; letter-spacing: -.06em; line-height: 1.1; }
.visual-web-copy > b span { color: var(--service-accent); }
.visual-web-copy > i { background: #b6c6d8; display: block; height: 4px; margin-top: 10px; width: 85%; }
.visual-web-copy > i + i { margin-top: 5px; width: 63%; }
.visual-web-copy em { background: var(--service-accent); border-radius: 5px; color: #fff; display: inline-block; font-size: 7px; font-style: normal; margin-top: 13px; padding: 7px 9px; }
.visual-web-photo { align-self: stretch; background: linear-gradient(145deg, #bdeeff, #dfeaff 62%, #9ac5ff); border-radius: 9px; margin: 9px 0 14px 10px; overflow: hidden; position: relative; }
.visual-web-photo span { background: #fff9; border-radius: 50%; height: 57px; position: absolute; right: 22px; top: 25px; width: 57px; }
.visual-web-photo i { background: #0e4e8e33; bottom: -20px; height: 100px; left: -9px; position: absolute; transform: rotate(35deg); width: 84px; }
.visual-web-photo i + i { background: #fff8; height: 125px; left: 55px; transform: rotate(-35deg); }
.visual-responsive { align-items: center; background: #fff; border: 1px solid #e0e9f2; border-radius: 30px; bottom: -17px; box-shadow: 0 8px 20px #123c681c; color: #536780; display: flex; font-size: 9px; font-weight: 700; gap: 8px; padding: 8px 12px; position: absolute; right: 16px; }
.visual-responsive span { color: var(--service-accent); font-size: 16px; }
.store-panel { padding: 19px; transform: rotate(2deg); width: min(100%, 365px); }
.store-heading { align-items: center; border-bottom: 1px solid #e7edf5; color: var(--navy); display: flex; font-size: 10px; justify-content: space-between; padding-bottom: 12px; }
.store-heading span { color: #7d8da2; font-size: 13px; }
.store-products { display: grid; gap: 12px; grid-template-columns: 1fr 1fr; padding: 15px 0; }
.store-products article { display: flex; flex-direction: column; position: relative; }
.product-art { align-items: center; border-radius: 9px; display: flex; height: 112px; justify-content: center; margin-bottom: 8px; }
.product-one { background: linear-gradient(140deg, #d8f8fb, #a8e7ed); color: #088da3; font-size: 46px; }
.product-two { background: linear-gradient(140deg, #edf2ff, #cddaff); color: #5875c6; font-size: 51px; }
.store-products article small { background: #fff; border-radius: 20px; color: var(--service-accent); font-size: 7px; left: 7px; padding: 3px 6px; position: absolute; top: 7px; }
.store-products article b { color: var(--navy); font-size: 9px; }
.store-products article > span { color: #687891; font-size: 9px; margin-top: 2px; }
.store-cart { align-items: center; background: #f0fcfd; border: 1px solid #d4f2f5; border-radius: 9px; display: flex; gap: 9px; padding: 10px; }
.store-cart > span { font-size: 17px; }
.store-cart div b, .store-cart div small { display: block; }
.store-cart div b { color: var(--navy); font-size: 9px; }
.store-cart div small { color: #79899c; font-size: 7px; }
.store-cart em { background: var(--service-accent); border-radius: 5px; color: #fff; font-size: 7px; font-style: normal; margin-left: auto; padding: 7px; white-space: nowrap; }
.store-order { color: #148269; font-size: 8px; margin-top: 11px; text-align: right; }
.store-order span { background: #dcf8ed; border-radius: 50%; margin-right: 4px; padding: 2px 4px; }
.software-visual { --service-accent: #5366ce; }
.software-visual::before { border-color: #6575da33; }
.software-visual::after { border-color: #9d7bea2c; }
.ops-dashboard { display: flex; min-height: 265px; overflow: hidden; transform: rotate(-1deg); width: min(100%, 420px); }
.ops-dashboard aside { align-items: center; background: #0b2056; display: flex; flex: 0 0 48px; flex-direction: column; gap: 17px; padding: 18px 0; }
.ops-dashboard aside b { color: #9eb2ff; font-size: 16px; margin-bottom: 6px; }
.ops-dashboard aside i { background: #90a8e4; border-radius: 4px; height: 6px; opacity: .5; width: 17px; }
.ops-dashboard aside i.active { background: #9deaff; box-shadow: 0 0 0 6px #fff2; opacity: 1; }
.ops-main { flex: 1; min-width: 0; padding: 19px 17px; }
.ops-top { align-items: center; display: flex; justify-content: space-between; }
.ops-top b { color: var(--navy); font-size: 11px; }
.ops-top span { color: #169b7a; font-size: 7px; }
.ops-top .ops-status { align-items: center; display: inline-flex; gap: 4px; }
.ops-top .ops-status i { background: #20ae88; border-radius: 50%; display: inline-block; height: 5px; width: 5px; }
.ops-metrics { display: grid; gap: 9px; grid-template-columns: 1fr 1fr; margin-top: 16px; }
.ops-metrics article { background: #f7f9fe; border: 1px solid #edf0f7; border-radius: 8px; padding: 10px; }
.ops-metrics small, .ops-metrics b, .ops-metrics i { display: block; }
.ops-metrics small { color: #8c98ab; font-size: 6px; font-weight: 800; letter-spacing: .08em; }
.ops-metrics b { color: var(--navy); font-size: 19px; line-height: 1.25; }
.ops-metrics i { color: #6c79a8; font-size: 7px; font-style: normal; }
.ops-flow { background: #fafaff; border: 1px solid #e8eafd; border-radius: 8px; margin-top: 11px; padding: 9px; }
.ops-flow > b { color: #455379; display: block; font-size: 8px; margin-bottom: 9px; }
.ops-flow > div { align-items: center; display: flex; gap: 6px; justify-content: space-between; }
.ops-flow > div span { background: #e9edff; border-radius: 4px; color: #4054a4; font-size: 6px; padding: 5px; }
.ops-flow > div i { color: #8873ca; font-size: 8px; font-style: normal; }
.ops-flow > div .flow-done { background: #e1f8f0; color: #168364; }
.ops-table { display: flex; gap: 8px; margin-top: 12px; }
.ops-table i { background: #e8edf5; border-radius: 2px; height: 4px; width: 30%; }
.ops-node { background: #fff; border: 1px solid #e0e5f5; border-radius: 7px; box-shadow: 0 8px 20px #223f7a1b; color: #4d5a92; font-size: 7px; font-weight: 700; padding: 7px 9px; position: absolute; z-index: 2; }
.node-a { left: 3px; top: 54px; }
.node-b { bottom: 46px; right: 0; }
.ai-visual { --service-accent: #04bdd8; }
.ai-visual::before { border-color: #05c6df40; }
.automation-flow { align-items: center; display: flex; flex-direction: column; min-height: 306px; padding: 25px 25px 20px; transform: rotate(1deg); width: min(100%, 360px); }
.flow-pill { background: #edfafe; border: 1px solid #c5eff6; border-radius: 25px; color: #2789a1; font-size: 8px; font-weight: 800; letter-spacing: .08em; padding: 8px 12px; }
.flow-line { background: linear-gradient(var(--service-accent), #7b83fa); height: 21px; position: relative; width: 2px; }
.flow-line::after { border-bottom: 2px solid #7484e6; border-right: 2px solid #7484e6; bottom: 0; content: ''; height: 5px; left: -2px; position: absolute; transform: rotate(45deg); width: 5px; }
.ai-core { align-items: center; background: radial-gradient(circle at 32% 22%, #f5ffff, #dcfbff 55%, #e5eaff); border: 1px solid #b9edf6; border-radius: 15px; box-shadow: 0 9px 25px #05aeca29; color: #078da9; display: flex; flex-direction: column; min-width: 168px; padding: 12px 18px; }
.ai-core span { font-size: 24px; line-height: 1; }
.ai-core b { color: #123c74; font-size: 10px; margin-top: 4px; }
.ai-core small { color: #71869b; font-size: 7px; }
.flow-results { align-items: center; background: #f2fcf8; border: 1px solid #ceefe1; border-radius: 9px; display: flex; gap: 9px; padding: 9px 12px; }
.flow-results > span { align-items: center; background: #27ba8c; border-radius: 50%; color: #fff; display: flex; font-size: 9px; height: 19px; justify-content: center; width: 19px; }
.flow-results b, .flow-results small { display: block; }
.flow-results b { color: #176e59; font-size: 8px; }
.flow-results small { color: #79978d; font-size: 7px; }
.flow-node { background: #fff; border: 1px solid #d6e8f2; border-radius: 7px; box-shadow: 0 8px 20px #114a6917; color: #45627c; font-size: 7px; padding: 7px 9px; position: absolute; top: 132px; }
.flow-node.node-left { left: 4px; }
.flow-node.node-right { right: 2px; }
.service-pagination { align-items: center; display: grid; gap: 15px; grid-template-columns: 1fr auto 1fr; padding-bottom: 55px; padding-top: 15px; }
.service-pagination a { color: var(--navy); display: flex; flex-direction: column; font-size: 11px; }
.service-pagination a span { color: #8492a6; font-size: 10px; }
.service-pagination a b { font-size: 14px; }
.service-pagination .all-services { color: var(--service-accent); display: block; font-size: 12px; font-weight: 800; }
.service-pagination .next-service { align-items: flex-end; text-align: right; }
#app-view.route-transition { animation: route-enter .4s ease both; }
@keyframes route-enter { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Clear, roomier navigation with an accessible secondary menu. */
.brand { width: 236px; flex: 0 0 auto; }
.desktop-nav { gap: clamp(15px, 1.8vw, 24px); margin-right: 22px; }
.desktop-nav > a, .more-menu > summary { color: #43536d; font-size: 14px; font-weight: 650; white-space: nowrap; }
.desktop-nav > a, .more-menu > summary { min-height: 44px; align-items: center; display: inline-flex; position: relative; }
.desktop-nav > a::after, .more-menu > summary::after { background: #13bddb; bottom: 4px; content: ''; height: 2px; left: 0; position: absolute; transform: scaleX(0); transform-origin: left; transition: transform .2s ease; width: 100%; }
.desktop-nav > a:hover, .desktop-nav > a:focus-visible, .more-menu > summary:hover { color: var(--navy); }
.desktop-nav > a[aria-current="page"] { color: var(--navy); }
.desktop-nav > a[aria-current="page"]::after, .more-menu.has-active > summary::after, .desktop-nav > a:hover::after, .more-menu[open] > summary::after { transform: scaleX(1); }
.desktop-nav > a:focus-visible, .more-menu > summary:focus-visible, .mobile-menu a:focus-visible { border-radius: 4px; outline: 3px solid #18c7f477; outline-offset: 4px; }
.more-menu { position: relative; }
.more-menu > summary { cursor: pointer; gap: 5px; list-style: none; }
.more-menu > summary::-webkit-details-marker { display: none; }
.more-menu > summary span { color: #8190a4; font-size: 13px; }
.more-menu-panel { background: #fff; border: 1px solid #dce6f0; border-radius: 10px; box-shadow: 0 16px 35px #0a28561a; display: grid; gap: 2px; min-width: 185px; padding: 7px; position: absolute; right: -22px; top: calc(100% - 1px); z-index: 50; }
.more-menu-panel a { border-radius: 6px; color: #506078; font-size: 13px; padding: 9px 10px; white-space: nowrap; }
.more-menu-panel a:hover, .more-menu-panel a:focus-visible, .more-menu-panel a[aria-current="page"] { background: #eff9fc; color: #087e9c; }
.more-menu-panel a[aria-current="page"] { font-weight: 800; }
.nav-actions .button-small { font-size: 13px; padding: 12px 16px; white-space: nowrap; }
.nav-actions { gap: 9px; }
.mobile-menu { gap: 8px; padding: 12px 24px 24px; }
.mobile-menu a:not(.button) { border-bottom: 1px solid #edf1f6; color: #34445e; font-size: 16px; padding: 11px 0; }
.mobile-menu .mobile-menu-label { color: #8795a9; font-size: 10px; font-weight: 800; letter-spacing: .13em; padding: 3px 0; text-transform: uppercase; }
.mobile-menu .mobile-secondary-label { border-top: 1px solid #dfe7ef; margin-top: 5px; padding-top: 14px; }
.mobile-menu a[aria-current="page"] { color: #087e9c; }
.mobile-menu .button { font-size: 14px; margin-top: 9px; min-height: 48px; }
.menu-toggle { align-items: center; border-radius: 8px; height: 48px; justify-content: center; padding: 8px 12px; width: 48px; }
.menu-toggle:hover, .menu-toggle:focus-visible { background: #eff7fc; outline: 2px solid #18c7f477; }
@media (max-width: 1120px) {
  .nav-wrap { height: 72px; }
  .brand { width: 214px; }
  .desktop-nav, .nav-actions .button-small { display: none; }
  .menu-toggle { display: inline-flex; }
  .mobile-menu.is-open { display: flex; }
}
@media (max-width: 900px) {
  .service-page .page-hero-grid { gap: 22px; grid-template-columns: 1fr; }
  .service-page .page-hero-copy { max-width: 680px; }
  .service-visual { min-height: 345px; }
  .service-page .breadcrumb { margin-bottom: 28px; }
}
@media (max-width: 760px) {
  .brand { width: 190px; }
  .nav-wrap { height: 68px; }
  .service-context .container { min-height: 35px; }
  .service-context-count { font-size: 9px; }
  .service-page .page-hero { padding-bottom: 49px; }
  .service-page .breadcrumb { margin-bottom: 26px; padding-top: 16px; }
  .service-page .page-hero h1 { font-size: clamp(38px, 10vw, 51px); }
  .service-page .page-hero-lede { font-size: 14px; }
  .service-page .page-hero-actions { align-items: stretch; flex-direction: column; }
  .service-page .page-hero-actions .button { min-height: 48px; width: 100%; }
  .service-visual { margin: 0 -8px; min-height: 305px; }
  .service-visual::before { height: 270px; width: 270px; }
  .visual-browser { width: min(100%, 390px); }
  .visual-web-content { min-height: 185px; padding: 15px; }
  .visual-web-copy > b { font-size: 18px; }
  .store-panel { width: min(100%, 355px); }
  .product-art { height: 95px; }
  .ops-dashboard { min-height: 245px; width: min(100%, 400px); }
  .ops-flow > div { gap: 3px; }
  .ops-flow > div span { font-size: 5px; padding: 5px 3px; }
  .node-a { left: 0; }
  .node-b { right: -2px; }
  .automation-flow { min-height: 290px; padding-inline: 14px; width: min(100%, 350px); }
  .flow-node.node-left { left: -2px; }
  .flow-node.node-right { right: -2px; }
  .service-pagination { gap: 9px; grid-template-columns: 1fr 1fr; padding-bottom: 38px; }
  .service-pagination .all-services { grid-column: 1 / -1; grid-row: 1; text-align: center; }
  .service-pagination a b { font-size: 12px; }
  .service-pagination a span { font-size: 9px; }
  .service-pagination .next-service { grid-column: 2; }
  .mobile-menu { max-height: calc(100vh - 68px); overflow-y: auto; }
}
@media (prefers-reduced-motion: reduce) {
  #app-view.route-transition { animation: none; }
  .desktop-nav > a::after, .more-menu > summary::after { transition: none; }
}

/* About page identity, separate from the homepage and service heroes */
.about-hero { background: radial-gradient(ellipse at 82% 35%, #0a55a4 0, transparent 32%), linear-gradient(135deg,#04163f,#08285e 58%,#073b78); color: #fff; min-height: 640px; overflow: hidden; padding: 0 0 76px; position: relative; }
.about-hero .breadcrumb { color: #c2d8f4; margin: 0 0 40px; padding-top: 22px; }
.about-hero .breadcrumb a { color: #65dbff; }
.about-hero-grid { align-items: center; display: grid; gap: 50px; grid-template-columns: 1fr 1fr; min-height: 485px; }
.about-hero-copy { max-width: 610px; position: relative; z-index: 2; }
.about-logo { background: #fff; border-radius: 12px; display: block; height: auto; margin-bottom: 32px; max-width: min(100%,290px); padding: 9px 13px; width: 290px; }
.about-hero h1 { color: #fff; font-size: clamp(42px,5vw,66px); max-width: 630px; }
.about-hero h1 span { color: #64defb; }
.about-hero .page-hero-lede { color: #d1e0f5; font-size: 16px; line-height: 1.75; max-width: 570px; }
.about-hero .button-outline { border-color: #7ca5d5; }
.about-hero-glow { border: 1px solid #54cfff44; border-radius: 50%; height: 630px; position: absolute; right: -190px; top: 50px; width: 630px; }
.about-project-stack { height: 410px; position: relative; }
.about-shot { background: #fff; border: 5px solid #fff; border-radius: 14px; box-shadow: 0 24px 60px #00123080; height: auto; object-fit: cover; position: absolute; }
.about-shot-main { right: 0; top: 34px; transform: rotate(2deg); width: 77%; }
.about-shot-orion { left: 0; top: 119px; transform: rotate(-5deg); width: 45%; }
.about-shot-latino { bottom: 14px; right: 1%; transform: rotate(4deg); width: 48%; }
.about-stack-label { background: #0a3671; border: 1px solid #61dfff66; border-radius: 99px; bottom: 0; color: #d9f8ff; font-size: 10px; font-weight: 800; letter-spacing: .1em; padding: 9px 13px; position: absolute; right: 18%; text-transform: uppercase; }
.about-timeline { border-left: 1px solid #b8d5ec; display: grid; gap: 19px; margin-top: 29px; padding-left: 20px; }
.about-timeline article { display: grid; gap: 12px; grid-template-columns: 30px 1fr; position: relative; }
.about-timeline article > span { align-items: center; background: var(--navy); border: 1px solid #65c7ef; border-radius: 50%; color: #fff; display: flex; font-size: 9px; height: 28px; justify-content: center; margin-left: -35px; width: 28px; }
.about-timeline h3 { font-size: 15px; margin: 0 0 4px; }
.about-timeline p { color: var(--muted); font-size: 12px; margin: 0; }
.presence-grid { display: grid; gap: 15px; grid-template-columns: repeat(3,1fr); margin-top: 35px; }
.presence-grid article { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 22px; }
.presence-grid span { color: #075fa9; font-size: 14px; font-weight: 800; }
.presence-grid p { color: var(--muted); font-size: 12px; margin: 8px 0 0; }
.about-page .about-process { grid-template-columns: repeat(5,minmax(0,1fr)); }
.about-page .about-process article { padding: 20px; }
.plan-detail-hero { background: radial-gradient(ellipse at 82% 45%,var(--plan-soft),transparent 44%),linear-gradient(135deg,#fbfdff,#fff 65%); }
.plan-detail { --plan-accent:#0d6efd; --plan-soft:#eaf4ff; }
.plan-2 { --plan-accent:#00aeca; --plan-soft:#e3fafd; }
.plan-3 { --plan-accent:#5552d9; --plan-soft:#efefff; }
.plan-detail .eyebrow, .plan-detail .plan-detail-price strong { color: var(--plan-accent); }
.plan-detail .button-primary { background: var(--plan-accent); }
.plan-detail .breadcrumb a { color: var(--plan-accent); }
.plan-detail-price { color: #65738a; font-size: 13px; margin: 0 0 20px; }
.plan-detail-price strong { font-size: 27px; margin-left: 7px; }
.plan-visual { align-items: center; background: radial-gradient(circle,var(--plan-soft),transparent 67%); display: flex; justify-content: center; min-height: 340px; position: relative; }
.plan-visual-icon { align-items: center; background: var(--plan-accent); border: 10px solid #ffffffc9; border-radius: 28px; box-shadow: 0 25px 50px color-mix(in srgb,var(--plan-accent) 28%,transparent); color: #fff; display: flex; font-size: 72px; height: 152px; justify-content: center; transform: rotate(-8deg); width: 152px; }
.plan-visual-card { background: #fff; border: 1px solid #dbe6f2; border-radius: 13px; bottom: 31px; box-shadow: 0 19px 45px #102e551a; display: grid; gap: 6px; padding: 16px 19px; position: absolute; right: 5%; width: min(250px,75%); }
.plan-visual-card small { color: #7c8ba0; font-size: 9px; font-weight: 700; text-transform: uppercase; }
.plan-visual-card b { color: var(--navy); font-size: 15px; }
.plan-visual-card span { color: var(--plan-accent); font-size: 10px; }
.plan-pagination { align-items: center; display: grid; gap: 14px; grid-template-columns: 1fr auto 1fr; padding-bottom: 40px; padding-top: 25px; }
.plan-pagination a { color: var(--navy); display: flex; flex-direction: column; font-size: 11px; }
.plan-pagination a span { color: #7d8ba0; font-size: 10px; }
.plan-pagination a:nth-child(2) { color: #075fa9; font-weight: 800; }
.plan-pagination a:last-child { align-items: flex-end; text-align: right; }
@media (max-width: 900px) { .about-hero-grid { grid-template-columns: 1fr; }.about-hero-copy { max-width: 700px; }.about-project-stack { margin: 0 auto; max-width: 580px; width: 100%; }.about-page .about-process { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 760px) { .about-hero { min-height: 0; padding-bottom: 53px; }.about-hero .breadcrumb { margin-bottom: 25px; }.about-hero-grid { gap: 20px; min-height: 0; }.about-logo { margin-bottom: 24px; max-width: 245px; width: 245px; }.about-hero h1 { font-size: clamp(39px,10vw,54px); }.about-hero .page-hero-lede { font-size: 14px; }.about-project-stack { height: 310px; margin-top: 5px; }.about-shot-main { width: 77%; }.about-shot-orion { top: 94px; }.about-shot-latino { bottom: 9px; }.presence-grid { grid-template-columns: 1fr; }.about-page .about-process { grid-template-columns: 1fr; }.plan-visual { min-height: 270px; }.plan-pagination { grid-template-columns: 1fr 1fr; }.plan-pagination a:nth-child(2) { grid-column: 1 / -1; grid-row: 1; text-align: center; } }
@media (prefers-reduced-motion: reduce) { .about-shot { transform: none; } }
.service-automation { --service-accent: #00abc4; --service-soft: #edf0ff; }
.service-automation .ai-core { background: linear-gradient(145deg,#6454e8,#098daf); box-shadow: 0 17px 40px #5343d633; }
.service-automation .flow-node { border-color: #988df2; color: #4844a7; }
.service-software { --service-accent: #5a4bd1; --service-soft: #efefff; }
.maturity-levels { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; margin-top:34px; }
.maturity-level { background:#fff; border:1px solid #dce6f1; border-radius:14px; min-height:112px; padding:18px; }
.maturity-level > span,.implementation-stage > span { color:#0d6efd; font-size:10px; font-weight:800; letter-spacing:.14em; }
.maturity-level h3 { color:#10264b; font-size:15px; line-height:1.35; margin:14px 0 0; }
.maturity-note { background:#edf6ff; border-left:3px solid #05aebc; border-radius:0 9px 9px 0; color:#435a74; font-size:13px; line-height:1.65; margin:16px 0 0; padding:14px 16px; }
.implementation-stages { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; margin-top:40px; }
.implementation-stage { border-top:2px solid #18c7f4; padding:17px 12px 0 0; }
.implementation-stage h3 { color:#10264b; font-size:16px; margin:12px 0 8px; }
.implementation-stage p,.automation-case p:not(.eyebrow) { color:#64748b; font-size:12px; line-height:1.65; margin:0; }
.automation-case-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:38px; }
.automation-case { background:#fff; border:1px solid #dce6f1; border-radius:14px; display:flex; flex-direction:column; padding:20px; }
.automation-case .eyebrow { color:#0d6efd; font-size:9px; margin:0 0 12px; }
.automation-case h3 { color:#10264b; font-size:17px; margin:0 0 9px; }
.automation-case .text-link { align-self:flex-start; background:none; border:0; color:#0d6efd; cursor:pointer; font:inherit; font-size:12px; font-weight:700; margin-top:auto; padding:18px 0 0; }
.automation-roadmap-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.automation-roadmap-actions .button { min-height:46px; }
@media(max-width:900px) {
  .maturity-levels,.implementation-stages { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media(max-width:760px) {
  .maturity-levels,.implementation-stages,.automation-case-grid { grid-template-columns:1fr; }
  .maturity-level { min-height:0; }
  .maturity-level h3 { margin-top:7px; }
  .automation-roadmap-actions { align-items:stretch; flex-direction:column; }
  .automation-roadmap-actions .button { width:100%; }
}
@media (max-width: 350px) {
  .brand { width: 142px; }
  .nav-actions { gap: 7px; }
  .hero { padding-top: 32px; padding-bottom: 48px; }
  .hero .eyebrow { margin-bottom: 14px; }
  .hero h1 { font-size: 28px; line-height: 1.08; margin-bottom: 16px; }
  .hero-lede { font-size: 13px; line-height: 1.5; margin-bottom: 22px; }
  .hero-actions { gap: 12px; margin-bottom: 22px; }
  .hero-actions .button { font-size: 12px; min-height: 48px; padding: 13px 18px; }
}