/* Responsive layouts from Figma Home 131:6137 / 19:33904,
   DeepPlatform 748:12546 / 748:13674, and the shared mobile navigation. */
.mobile-nav-actions, .platform-mobile-art { display: none; }
.home-product-art, .home-value-art { display: none; }

@media (max-width: 1280px) {
  .home-page main h2 { word-break: keep-all; overflow-wrap: break-word; text-wrap: balance; }
  .home-page .home-reason-row > div:not([aria-hidden]) { min-width: 0; }
  .home-page .home-product-card h3 { overflow-wrap: anywhere; }
  .home-page .home-footer > .page-container > div:first-child { flex-wrap: wrap; }
  .home-page .home-footer nav { min-width: 0; flex-wrap: wrap; gap: 40px; }
  .home-page .home-value-card .font-display { font-size: clamp(26px, 3vw, 36px); }
  .home-page .home-value-card { min-width: 0; }
}
@media (min-width: 1024px) and (max-width: 1280px) {
  .home-page .home-product-card-dark h3 { font-size: 36px; }
  .home-page .home-reason-row > div:not([aria-hidden]) { padding: 26px; }
}

/* Intermediate tablet sizes need more room than a scaled desktop row. */
@media (min-width: 768px) and (max-width: 1023px) {
  .home-page .page-container { padding-inline: 32px; }
  .home-page .home-services { padding-block: 100px; }
  .home-page .home-services > .page-container { gap: 120px; }
  .home-page main h2 { font-size: 36px; }
  .home-page .home-reasons, .home-page .home-values { padding-block: 100px; }
  .home-page .home-reason-row { flex-direction: column; }
  .home-page .home-reason-row > img { width: 100%; height: 320px; order: 0; }
  .home-page .home-reason-row > div:not([aria-hidden]) { width: 100%; order: 1; padding: 26px; }
  .home-page .home-value-grid { flex-direction: column; }
  .home-page .home-value-card { min-height: 400px; justify-content: flex-start; }
  .home-page .home-value-card + .home-value-card { border-top: 1px solid #444; }
  .home-page .home-values [aria-hidden] > .border-l { display: none; }
  .home-page .home-values [aria-hidden] > [class~="left-1/3"],
  .home-page .home-values [aria-hidden] > [class~="left-2/3"] { display: none; }
  .home-page .home-services [data-home-carousel] { margin-right: -32px; }
  .home-page .home-product-card h3 { font-size: 24px; }
}

@media (max-width: 980px) {
  .site-header { height: 70px; }
  .site-header .nav-inner, .home-page .site-header .nav-inner {
    width: 100%; height: 69px; padding-inline: 20px; gap: 16px;
  }
  .site-header .brand img, .home-page .site-header .brand img { width: 117.5px; height: auto; }
  .site-header .nav-actions > .button-green { display: none; }
  .site-header .menu-toggle { width: 20px; height: 20px; }
  .site-header .menu-toggle:not([aria-expanded="true"]) {
    background: radial-gradient(circle, #fff 1px, transparent 1.5px) center / 7px 7px;
  }
  .site-header .menu-toggle span { visibility: hidden; }
  .site-header .desktop-nav, .home-page .site-header .desktop-nav {
    top: 69px; height: calc(100dvh - 69px); max-height: calc(100dvh - 69px);
    padding: 24px 20px; border-bottom: 0; box-shadow: none;
  }
  .site-header[data-mobile-open] .desktop-nav { display: flex; flex-direction: column; align-items: stretch; gap: 12px; }
  .site-header .nav-item { flex: none; border: 0; }
  .site-header .nav-trigger { height: 44px; font-size: 16px; font-weight: 400; }
  .site-header .nav-chevron { margin-right: 6px; }
  .mobile-nav-actions { display: flex; flex: none; flex-direction: column; gap: 12px; padding-top: 64px; margin-top: auto; }
  .site-header .mobile-contact-link, .site-header .mobile-demo-link {
    display: flex; justify-content: center; align-items: center;
    width: 100%; min-height: 34px; padding: 8px 12px; margin: 0;
    font: 400 14px/1.2 var(--english); border: 1px solid #444; border-radius: 2px; color: #fff;
  }
  .site-header .mobile-contact-link { background: var(--green); color: #000; border-color: var(--green); }
  .home-page { --header-h: 70px; }
}

@media (max-width: 767px) {
  .home-page .page-container { padding-inline: 16px; }
  .home-page .home-hero { height: auto; min-height: 432px; padding-block: 70px; }
  .home-page .home-hero > .page-container { padding-block: 0; }
  .home-page .home-hero h1 { font-size: clamp(34px, 10.26vw, 40px); }
  .home-page .home-search { width: 100%; min-height: 70px; }
  .home-page .home-product-card { padding: 24px; height: 200px; }
  .home-page .home-product-card-dark { height: 210px; }
  .home-page .home-product-card h3 { font-size: clamp(19px, 5.64vw, 22px); }
  .home-page .home-product-card .gap-2 { gap: 6px; }
  .home-page .home-product-card span.inline-flex { font-size: 12px; gap: 6px; }
  .home-page .home-services [data-home-carousel] { margin-right: -16px; }
  .home-page .home-case-card { flex-basis: min(300px, calc(100vw - 48px)); min-width: 0; }
  .home-page .home-reason-row + .home-reason-row { margin-top: 50px; }
  .home-page .home-reason-row > img { height: 226px; }
  .home-page .home-reason-row > div:not([aria-hidden]) { padding: 18px; }
  .home-page .home-brochures { padding-inline: 24px; }
  .home-page .home-brochures h3 { word-break: keep-all; }
  .home-page .home-brochure-link { height: auto; min-height: 55px; gap: 12px; padding: 12px 16px; }
  .home-page .home-brochure-link > span { min-width: 0; gap: 10px; }
  .home-page .home-brochure-link > span > span { font-size: 14px; }
  .home-page .home-brochure-link > span > span:not(:last-child) { flex-shrink: 0; }
  .home-page .home-brochure-link > span > span:last-child { line-height: 1.4; word-break: keep-all; }
  .home-page .home-cta { padding-inline: 4px; }
  .home-page .home-footer .page-container { padding-inline: 20px; }
  .home-page .home-footer nav { flex-direction: column; gap: 40px; }
  .home-page .home-footer > .page-container > div:first-child { gap: 60px; }
  .home-page .home-value-card .font-display { font-size: 30px; }
  .home-page .home-value-card { padding: 36px; }
  .home-page .home-value-card + .home-value-card { border-top: 1px solid #444; }
}

/* Use the uncropped Figma image inside its device-specific crop window.
   The original desktop exports already contain a crop and must not be cropped again. */
@media (max-width: 1280px) {
  .home-page .home-product-card:not(.home-product-card-dark) > img { display: none; }
  .home-product-art { display: block; position: absolute; right: 0; bottom: 0; overflow: hidden; pointer-events: none; mix-blend-mode: darken; }
  .home-product-art > img { position: absolute; max-width: none; object-fit: fill; }
}
@media (min-width: 768px) and (max-width: 1280px) {
  .home-page .home-product-card:not(.home-product-card-dark) h3 { font-size: clamp(22px, 2.03125vw, 26px); }
  .home-product-art--deepdocurator { width: min(60.913%, 307px); aspect-ratio: 307 / 258; }
  .home-product-art--deepdocurator > img { width: 106.23%; height: 135.42%; left: 1.43%; top: -11.57%; }
  .home-product-art--deepconnector { width: min(69.444%, 350px); aspect-ratio: 350 / 250; }
  .home-product-art--deepconnector > img { width: 94.25%; height: 141.37%; left: 5.75%; top: -15.68%; }
  .home-product-art--deepagentbuilder { width: min(58.333%, 294px); aspect-ratio: 294 / 250; }
  .home-product-art--deepagentbuilder > img { width: 97.63%; height: 123.01%; left: 3.87%; top: -6.04%; }
  .home-product-art--deepflow { width: min(63.69%, 321px); aspect-ratio: 321 / 250; }
  .home-product-art--deepflow > img { width: 103.13%; height: 141.87%; left: 0; top: -9.04%; }
}
@media (min-width: 768px) and (max-width: 1100px) {
  .home-product-art--deepconnector { width: 63.49%; }
}
@media (max-width: 767px) {
  .home-product-art { height: 200px; top: 0; bottom: auto; right: auto; }
  .home-product-art--deepdocurator { width: 177.885px; left: max(180.11px, calc(100% - 177.885px)); }
  .home-product-art--deepdocurator > img { width: 137.62%; height: 131.13%; left: 1.53%; top: -11.8%; }
  .home-product-art--deepconnector { width: 170.614px; left: max(187.39px, calc(100% - 170.614px)); }
  .home-product-art--deepconnector > img { width: 144.02%; height: 131.63%; left: 0; top: -12.17%; }
  .home-product-art--deepagentbuilder { width: 157.998px; left: max(200px, calc(100% - 157.998px)); }
  .home-product-art--deepagentbuilder > img { width: 151.79%; height: 128.47%; left: 0; top: -11%; }
  .home-product-art--deepflow { width: 191.581px; left: max(166.42px, calc(100% - 191.581px)); }
  .home-product-art--deepflow > img { width: 124.02%; height: 127.27%; left: 8.44%; top: -7.57%; }
}

/* Keep mobile copy in the layout, above the illustration, even when it wraps. */
@media (max-width: 1023px) {
  .home-page .home-value-card { min-height: 400px; padding: 36px 36px 0; gap: 12px; justify-content: flex-start; }
  .home-page .home-value-card > p { position: relative; z-index: 1; flex-shrink: 0; }
  .home-page .home-value-card > p:nth-child(2) { line-height: 1.6; }
  .home-page .home-value-card > img { display: none; }
  .home-value-art { display: block; position: relative; align-self: center; flex-shrink: 0; max-width: calc(100% + 72px); margin-inline: -36px; overflow: hidden; pointer-events: none; }
  .home-value-art > img { position: absolute; max-width: none; }
  .home-value-art--think-deeper { width: 350px; aspect-ratio: 350 / 293.842; margin-top: -15.44px; }
  .home-value-art--think-deeper > img { width: 97.54%; height: 102.59%; left: 1.49%; top: -2.59%; }
  .home-value-art--build-closer { width: 325.723px; aspect-ratio: 325.723 / 302.865; margin-top: -21.1px; }
  .home-value-art--build-closer > img, .home-value-art--work-better > img { width: 100%; height: 100%; inset: 0; object-fit: cover; }
  .home-value-art--work-better { width: 299.666px; aspect-ratio: 299.666 / 285.488; margin-top: -11.6px; }
}

/* Shared mobile footer uses the single-column structure in Figma 19:38465. */
@media (max-width: 760px) {
  .site-footer { padding: 60px 0; }
  .site-footer .container { width: calc(100% - 40px); }
  .footer-top { flex-direction: column; gap: 60px; margin-bottom: 75px; }
  .footer-columns { display: flex; flex-direction: column; gap: 40px; }
  .footer-bottom { flex-wrap: wrap; gap: 18px; }
  .doc-settings-panel { min-width: 0; width: min(280px, 100%); }
  .doc-settings-demo { min-width: 0; }
  .company-brochure-button { white-space: normal; }
}

/* DeepPlatform mobile art is its own Figma composition, not a desktop crop. */
@media (max-width: 767px) {
  .platform-page { --gutter: 16px; }
  .platform-page .hero { height: auto; min-height: 452px; padding: 138px 16px 68px; }
  .platform-page .hero h1 { font-size: clamp(32px, 10.26vw, 40px); letter-spacing: -.04em; }
  .platform-page .hero p { font-size: 14px; margin: 24px auto 32px; word-break: normal; }
  .platform-page .hero p br { display: none; }
  .platform-page .hero .button { background: var(--green); border-color: var(--green); color: #000; }
  .platform-page .customer-frame { padding: 48px 20px; }
  .platform-page .customer-frame h2 { margin-bottom: 50px; font-size: 24px; line-height: 1.4; }
  .platform-page .customer-grid { grid-template-columns: 1fr; gap: 36px; }
  .platform-page .customer p { font-size: 16px; white-space: normal; min-height: 0; }
  .platform-page .adoption-badge { font-size: 14px; padding: 6px 10px; }
  .platform-page .customers { padding-bottom: 48px; }
  .platform-page .customers::after { bottom: 48px; }
  .platform-page .challenges, .platform-page .product-details, .platform-page .deployment { padding-block: 68px; }
  .platform-page .section-title, .platform-page .product-heading h2 { font-size: 24px; line-height: 1.4; letter-spacing: -.04em; }
  .platform-page .challenge-grid { margin-top: 50px; gap: 16px; }
  .platform-page .challenge-card { padding: 18px; }
  .platform-page .challenge-card h3 { font-size: 21px; }
  .platform-page .challenge-card p { color: #666; word-break: normal; }
  .platform-page .platform { padding-top: 68px; }
  .platform-page .platform-scene { margin-top: 30px; padding: 0; }
  .platform-page .platform-art { display: none; }
  .platform-page .platform-mobile-art { display: block; position: relative; width: calc(100% - 16px); max-width: 520px; aspect-ratio: 375.326 / 399.623; margin-inline: auto; overflow: hidden; }
  .platform-page .platform-mobile-art img { position: absolute; top: 0; left: 2.78%; width: 126.74%; max-width: none; height: 100%; }
  .platform-page .platform-steps { position: relative; display: block; width: calc(100% - 32px); height: 254px; padding: 0; border-top: 1px solid #333; }
  .platform-page .platform-step { position: absolute; inset: 30px 0 auto; width: 100%; text-align: center; border: 0; padding: 0; }
  .platform-page .platform-step::before { display: none; }
  .platform-page .platform-step h3 { justify-content: center; font-size: clamp(22px, 6.15vw, 24px); gap: 8px; white-space: normal; }
  .platform-page .step-number { font-size: 12px; }
  .platform-page .step-tags { justify-content: center; margin-top: 10px; gap: 8px; }
  .platform-page .step-tags span { font-size: 14px; padding: 4px 8px; }
  .platform-page .step-extra { width: max-content; max-width: 100%; min-width: 196px; margin: 20px auto 0; padding: 12px; gap: 6px; }
  .platform-page .step-extra > span, .platform-page .step-extra strong { justify-content: center; }
  .platform-page .step-extra strong { font-size: 18px; }
  .platform-page .product-heading { margin-bottom: 50px; }
  .platform-page .product-heading p { font-size: 16px; line-height: 1.6; }
  .platform-page .product-heading p br { display: none; }
  .platform-page .product-section + .product-section { margin-top: 96px; }
  .platform-page .product-name { font-size: 24px; overflow-wrap: anywhere; }
  .platform-page .product-content > h3 { margin-bottom: 30px; }
  .platform-page .feature-list li { font-size: 16px; }
  .platform-page .contact-section { padding-block: 80px; }
  .platform-page .contact-section h2 { font-size: 28px; }

  /* Figma 748:18885 / 19085 / 19117 / 19149 share a 6030.581ms timeline. */
  .platform-page .step-1 { animation: mobile-platform-1 6.030581s linear infinite; }
  .platform-page .step-2 { animation: mobile-platform-2 6.030581s linear infinite; }
  .platform-page .step-3 { animation: mobile-platform-3 6.030581s linear infinite; }
  .platform-page .step-4 { animation: mobile-platform-4 6.030581s linear infinite; }
  @keyframes mobile-platform-1 {
    0% { animation-timing-function: cubic-bezier(.5,0,.5,1); opacity: 1; visibility: visible; }
    5.754%,74.781% { opacity: 0; visibility: hidden; }
    74.782% { animation-timing-function: cubic-bezier(.5,0,.5,1); opacity: 0; visibility: visible; }
    89.001%,100% { opacity: 1; visibility: visible; }
  }
  @keyframes mobile-platform-2 {
    0% { animation-timing-function: cubic-bezier(.5,0,.5,1); opacity: 0; visibility: visible; }
    15.49% { opacity: 1; }
    24.907% { animation-timing-function: cubic-bezier(.5,0,.5,1); opacity: 1; }
    31.125%,100% { opacity: 0; visibility: hidden; }
  }
  @keyframes mobile-platform-3 {
    0% { opacity: 0; visibility: hidden; }
    24.907% { animation-timing-function: cubic-bezier(.5,0,.5,1); opacity: 0; visibility: visible; }
    41.734% { opacity: 1; }
    49.945% { animation-timing-function: cubic-bezier(.5,0,.5,1); opacity: 1; }
    55.517%,100% { opacity: 0; visibility: hidden; }
  }
  @keyframes mobile-platform-4 {
    0% { opacity: 0; visibility: hidden; }
    49.945% { animation-timing-function: cubic-bezier(.5,0,.5,1); opacity: 0; visibility: visible; }
    65.434% { opacity: 1; }
    74.781% { animation-timing-function: cubic-bezier(.5,0,.5,1); opacity: 1; }
    79.893%,100% { opacity: 0; visibility: hidden; }
  }
  .platform-page .platform-steps:focus-within { display: grid; height: auto; gap: 32px; padding-bottom: 40px; }
  .platform-page .platform-steps:focus-within .platform-step { position: static; opacity: 1; visibility: visible; animation: none; }
}
@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  .platform-page .platform-steps { display: grid; height: auto; gap: 32px; padding-block: 30px 40px; }
  .platform-page .platform-step { position: static; opacity: 1; visibility: visible; animation: none; }
}