/*
 * STIGMA robot product pages
 * Industrial Robot SI / AI-3D Vision Robot
 */

body.stigma-sub-page .robot-product-page {
    --robot-blue: #33449d;
    --robot-purple: #4a294f;
    --robot-red: #8b1f2b;
    --robot-ink: #14161b;
    --robot-body: #777b84;
    --robot-line: #e2e4e9;
    --robot-surface: #f7f7f9;
    background: #fff;
    color: var(--robot-ink);
    overflow: hidden;
}

.robot-product-page .robot-container {
    margin: 0 auto;
    max-width: 1540px;
    padding-left: clamp(24px, 4vw, 68px);
    padding-right: clamp(24px, 4vw, 68px);
    width: 100%;
}

.robot-product-page .robot-container--narrow {
    max-width: 1290px;
}

.robot-product-page .robot-page-intro {
    background: #fbfbfd;
    padding: clamp(54px, 5vw, 82px) 0 clamp(48px, 4.5vw, 74px);
    text-align: center;
}

.robot-product-page .robot-page-kicker {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

body.stigma-sub-page .robot-product-page .robot-page-kicker strong {
    color: var(--robot-ink);
    font-family: "Roboto", sans-serif !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    letter-spacing: -.02em !important;
    line-height: 1.2 !important;
}

body.stigma-sub-page .robot-product-page .robot-page-kicker span {
    background: var(--robot-blue);
    border-radius: 999px;
    color: #fff;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    padding: 8px 19px 9px;
}

body.stigma-sub-page .robot-product-page .robot-page-headline {
    color: var(--robot-blue);
    font-family: "Pretendard", sans-serif !important;
    font-size: clamp(38px, 3vw, 58px) !important;
    font-weight: 560 !important;
    letter-spacing: -.052em !important;
    line-height: 1.3 !important;
    margin: clamp(42px, 4vw, 62px) auto 28px;
    max-width: 1080px;
}

.robot-product-page .robot-page-headline span {
    display: block;
    font: inherit !important;
    letter-spacing: inherit !important;
    line-height: inherit !important;
}

.robot-product-page .robot-page-headline span:nth-child(2) {
    color: var(--robot-purple);
}

.robot-product-page .robot-page-headline span:nth-child(3) {
    color: var(--robot-red);
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
    body.stigma-sub-page .robot-product-page .robot-page-headline {
        background: linear-gradient(180deg, var(--robot-blue) 0%, var(--robot-purple) 55%, var(--robot-red) 100%);
        background-clip: text;
        -webkit-background-clip: text;
        color: transparent;
        -webkit-text-fill-color: transparent;
    }

    .robot-product-page .robot-page-headline span {
        color: transparent !important;
        -webkit-text-fill-color: transparent;
    }
}

body.stigma-sub-page .robot-product-page .robot-page-lead {
    color: #7d818a;
    font-size: clamp(14px, 1.02vw, 16px) !important;
    font-weight: 400 !important;
    letter-spacing: -.025em !important;
    line-height: 1.72 !important;
    margin: 0 auto;
    max-width: 1260px;
}

.robot-product-page .robot-overview {
    background: #fbfbfd;
    padding: 0 0 clamp(60px, 5vw, 90px);
}

.robot-product-page .robot-overview-grid {
    align-items: center;
    display: grid;
    gap: clamp(42px, 6vw, 96px);
    grid-template-columns: minmax(0, 1.45fr) minmax(420px, .85fr);
}

.robot-product-page .robot-overview-media {
    margin: 0;
    min-width: 0;
}

.robot-product-page .robot-overview-media img {
    display: block;
    height: auto;
    margin: 0 auto;
    max-height: 670px;
    object-fit: contain;
    width: 100%;
}

body.stigma-sub-page .robot-product-page .robot-overview-copy h2 {
    color: var(--robot-ink);
    font-size: clamp(28px, 2vw, 36px) !important;
    font-weight: 800 !important;
    letter-spacing: -.045em !important;
    line-height: 1.25 !important;
    margin: 0 0 34px;
}

.robot-product-page .robot-process-list {
    display: grid;
    gap: 22px;
}

.robot-product-page .robot-process-item {
    align-items: start;
    display: grid;
    gap: 16px;
    grid-template-columns: 42px 1fr;
}

.robot-product-page .robot-process-icon {
    align-items: center;
    color: var(--robot-ink);
    display: inline-flex;
    font-size: 29px;
    height: 38px;
    justify-content: center;
    width: 38px;
}

body.stigma-sub-page .robot-product-page .robot-process-item p {
    color: #8a8e96;
    font-size: 15px !important;
    line-height: 1.55 !important;
    margin: 0;
}

body.stigma-sub-page .robot-product-page .robot-process-item strong {
    color: #35383e;
    font-weight: 750 !important;
}

/* Industrial strengths */
.robot-product-page .robot-strengths {
    background: #fff;
    padding: clamp(56px, 4.5vw, 78px) 0;
}

.robot-product-page .robot-strengths-layout {
    align-items: start;
    display: grid;
    gap: clamp(30px, 5vw, 86px);
    grid-template-columns: 220px 1fr;
}

body.stigma-sub-page .robot-product-page .robot-strengths-title {
    color: var(--robot-ink);
    font-size: clamp(24px, 1.7vw, 30px) !important;
    font-weight: 800 !important;
    letter-spacing: -.045em !important;
    line-height: 1.3 !important;
    margin: 8px 0 0;
}

.robot-product-page .robot-strengths-content {
    min-width: 0;
}

.robot-product-page .robot-strength-tabs {
    background: #ececf1;
    border-radius: 999px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding: 4px;
}

.robot-product-page .robot-strength-tab {
    background: transparent;
    border: 0;
    border-radius: 999px;
    color: #32353b;
    cursor: pointer;
    font-family: "Roboto", "Pretendard", sans-serif !important;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
    min-height: 48px;
    padding: 10px 15px;
    transition: background-color .22s ease, color .22s ease, box-shadow .22s ease;
}

.robot-product-page .robot-strength-tab.is-active {
    background: #050505;
    box-shadow: 0 4px 10px rgba(0, 0, 0, .2);
    color: #fff;
}

.robot-product-page .robot-strength-panel {
    animation: robotPanelIn .3s ease both;
    min-height: 132px;
    padding: 34px 24px 0;
}

.robot-product-page .robot-strength-panel[hidden] {
    display: none;
}

body.stigma-sub-page .robot-product-page .robot-strength-panel p {
    color: #686d76;
    font-size: 16px !important;
    line-height: 1.75 !important;
    margin: 0;
    max-width: 1040px;
}

/* Comparison */
.robot-product-page .robot-comparison {
    background: #fff;
    padding: clamp(58px, 5vw, 86px) 0;
}

body.stigma-sub-page .robot-product-page .robot-section-title {
    color: var(--robot-ink);
    font-size: clamp(28px, 2vw, 36px) !important;
    font-weight: 800 !important;
    letter-spacing: -.045em !important;
    line-height: 1.25 !important;
    margin: 0 0 34px;
}

.robot-product-page .robot-comparison-table {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
}

.robot-product-page .robot-comparison-table th,
.robot-product-page .robot-comparison-table td {
    border-bottom: 1px solid var(--robot-line);
    padding: 22px 28px;
    text-align: center;
    vertical-align: middle;
}

.robot-product-page .robot-comparison-table thead th {
    background: #e9e9ee;
    color: #282b31;
    font-size: 15px;
    font-weight: 750;
}

.robot-product-page .robot-comparison-table thead th:last-child {
    background: var(--robot-blue);
    border-radius: 999px;
    color: #fff;
}

.robot-product-page .robot-comparison-table thead th:nth-child(2) {
    border-radius: 999px;
}

.robot-product-page .robot-comparison-table th:first-child {
    background: #fff;
    text-align: left;
    width: 18%;
}

.robot-product-page .robot-comparison-table tbody th {
    color: #3d4148;
    font-size: 15px;
    font-weight: 750;
}

.robot-product-page .robot-comparison-table td {
    color: #777b84;
    font-size: 14px;
    line-height: 1.6;
}

/* Outcomes */
.robot-product-page .robot-outcomes {
    background: #fff;
    padding: 0 0 clamp(70px, 6vw, 96px);
}

.robot-product-page .robot-outcomes-panel {
    background: var(--robot-blue);
    color: #fff;
    display: grid;
    gap: clamp(40px, 6vw, 100px);
    grid-template-columns: .8fr 1.3fr;
    min-height: 280px;
    padding: clamp(46px, 4.5vw, 72px) clamp(42px, 6vw, 100px);
}

body.stigma-sub-page .robot-product-page .robot-outcomes-panel h2 {
    color: #fff;
    font-size: clamp(28px, 2vw, 36px) !important;
    font-weight: 750 !important;
    letter-spacing: -.045em !important;
    line-height: 1.35 !important;
    margin: 0;
}

.robot-product-page .robot-outcomes-panel ul {
    list-style: none;
    margin: 0;
    padding: 2px 0 0;
}

body.stigma-sub-page .robot-product-page .robot-outcomes-panel li {
    color: #fff;
    font-size: 15px !important;
    font-weight: 600;
    line-height: 1.5 !important;
    margin: 0 0 22px;
}

/* Cases */
.robot-product-page .robot-cases {
    background: #fff;
    padding: 0 0 clamp(90px, 7vw, 130px);
}

.robot-product-page .robot-case-list {
    border-top: 1px solid var(--robot-line);
}

.robot-product-page .robot-case-row {
    align-items: center;
    border-bottom: 1px solid var(--robot-line);
    display: grid;
    gap: 26px;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 28px 0;
}

.robot-product-page .robot-case-main {
    min-width: 0;
}

.robot-product-page .robot-case-heading {
    align-items: baseline;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 24px;
    margin-bottom: 8px;
}

body.stigma-sub-page .robot-product-page .robot-case-heading h3 {
    color: var(--robot-ink);
    font-size: clamp(18px, 1.35vw, 22px) !important;
    font-weight: 750 !important;
    letter-spacing: -.035em !important;
    line-height: 1.4 !important;
    margin: 0;
}

.robot-product-page .robot-case-metrics {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 8px 16px;
}

.robot-product-page .robot-case-metrics span {
    color: var(--robot-blue);
    font-size: 13px;
    font-weight: 700;
}

body.stigma-sub-page .robot-product-page .robot-case-main p {
    color: #8a8d94;
    font-size: 14px !important;
    line-height: 1.62 !important;
    margin: 0;
}

.robot-product-page .robot-case-actions {
    align-items: center;
    display: flex;
    gap: 12px;
}

.robot-product-page .robot-view-button {
    align-items: center;
    background: #fff;
    border: 1px solid var(--robot-blue);
    border-radius: 999px;
    color: var(--robot-blue);
    cursor: pointer;
    display: inline-flex;
    font-size: 14px;
    font-weight: 750;
    gap: 8px;
    min-height: 42px;
    padding: 9px 22px;
    transition: background-color .2s ease, color .2s ease, transform .2s ease;
}

.robot-product-page .robot-view-button:hover,
.robot-product-page .robot-view-button:focus {
    background: var(--robot-blue);
    color: #fff;
    transform: translateY(-2px);
}

.robot-product-page .robot-youtube-link {
    align-items: center;
    background: #ff0000;
    border-radius: 11px;
    color: #fff;
    display: inline-flex;
    font-size: 18px;
    height: 42px;
    justify-content: center;
    transition: transform .2s ease;
    width: 54px;
}

.robot-product-page .robot-youtube-link:hover,
.robot-product-page .robot-youtube-link:focus {
    color: #fff;
    transform: translateY(-2px);
}

.robot-product-page .robot-youtube-link i {
    font-family: "FontAwesome" !important;
}

.robot-product-page .robot-case-footnote {
    color: #969aa2;
    font-size: 13px;
    line-height: 1.7;
    margin: 48px auto 0;
    max-width: 1250px;
    text-align: center;
}

/* Motrex interactive layout */
.robot-product-page .robot-hotspot-section {
    margin-top: clamp(44px, 5vw, 76px);
}

.robot-product-page .robot-hotspot-stage {
    margin: 0 auto;
    max-width: 1160px;
    position: relative;
}

.robot-product-page .robot-hotspot-base {
    display: block;
    height: auto;
    width: 100%;
}

.robot-product-page .robot-hotspot {
    align-items: center;
    background: #fff;
    border: 1px solid var(--robot-blue);
    border-radius: 999px;
    color: var(--robot-blue);
    cursor: pointer;
    display: inline-flex;
    font-size: clamp(10px, .8vw, 13px);
    font-weight: 750;
    justify-content: center;
    min-height: 34px;
    padding: 7px 15px;
    position: absolute;
    transform: translate(-50%, -50%);
    white-space: nowrap;
    z-index: 3;
}

.robot-product-page .robot-hotspot::after {
    background: var(--robot-blue);
    border: 3px solid #fff;
    border-radius: 50%;
    bottom: -11px;
    box-shadow: 0 0 0 1px var(--robot-blue);
    content: "";
    height: 11px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    width: 11px;
}

.robot-product-page .robot-hotspot:hover,
.robot-product-page .robot-hotspot:focus,
.robot-product-page .robot-hotspot.is-active {
    background: var(--robot-blue);
    color: #fff;
}

.robot-product-page .robot-hotspot-preview {
    background: rgba(255, 255, 255, .98);
    border: 1px solid rgba(51, 68, 157, .2);
    border-radius: 12px;
    box-shadow: 0 14px 38px rgba(16, 22, 42, .2);
    margin: 0;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    right: 2%;
    top: 2%;
    transform: translateY(8px);
    transition: opacity .2s ease, transform .2s ease;
    visibility: hidden;
    width: min(680px, 60%);
    z-index: 5;
}

.robot-product-page .robot-hotspot-preview.is-visible {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
}

.robot-product-page .robot-hotspot-preview img {
    aspect-ratio: 16 / 10;
    display: block;
    object-fit: cover;
    width: 100%;
}

/* Shared image viewer */
.case-modal[hidden] {
    display: none;
}

.case-modal {
    align-items: center;
    display: flex;
    inset: 0;
    justify-content: center;
    opacity: 0;
    padding: clamp(18px, 3vw, 48px);
    position: fixed;
    transition: opacity .2s ease;
    z-index: 5000;
}

.case-modal.is-open {
    opacity: 1;
}

.case-modal__backdrop {
    background: rgba(4, 6, 12, .82);
    inset: 0;
    position: absolute;
}

.case-modal__dialog {
    align-items: center;
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 36px);
    max-width: 1500px;
    position: relative;
    width: 100%;
    z-index: 1;
}

.case-modal__image-wrap {
    align-items: center;
    display: flex;
    justify-content: center;
    max-height: calc(100vh - 150px);
    min-height: 200px;
    width: 100%;
}

.case-modal__image {
    display: block;
    max-height: calc(100vh - 150px);
    max-width: min(92vw, 1460px);
    object-fit: contain;
}

.case-modal__caption {
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    margin-top: 14px;
    text-align: center;
}

.case-modal__close,
.case-modal__nav {
    align-items: center;
    background: rgba(0, 0, 0, .64);
    border: 1px solid rgba(255, 255, 255, .52);
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: 22px;
    height: 48px;
    justify-content: center;
    position: absolute;
    width: 48px;
    z-index: 2;
}

.case-modal__close {
    right: 0;
    top: 0;
}

.case-modal__nav {
    top: 50%;
    transform: translateY(-50%);
}

.case-modal__nav--prev {
    left: 0;
}

.case-modal__nav--next {
    right: 0;
}

.case-modal__nav[hidden] {
    display: none;
}

body.case-modal-open {
    overflow: hidden;
}

@keyframes robotPanelIn {
    from {
        opacity: 0;
        transform: translateY(9px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 991px) {
    .robot-product-page .robot-overview-grid {
        gap: 38px;
        grid-template-columns: 1fr;
    }

    .robot-product-page .robot-overview-copy {
        margin: 0 auto;
        max-width: 720px;
        width: 100%;
    }

    .robot-product-page .robot-overview-media img {
        max-height: 560px;
    }

    .robot-product-page .robot-strengths-layout {
        grid-template-columns: 1fr;
    }

    body.stigma-sub-page .robot-product-page .robot-strengths-title {
        margin: 0;
    }

    .robot-product-page .robot-comparison-table th,
    .robot-product-page .robot-comparison-table td {
        padding: 18px 16px;
    }
}

@media (max-width: 767px) {
    .robot-product-page .robot-container {
        padding-left: 20px;
        padding-right: 20px;
    }

    .robot-product-page .robot-page-intro {
        padding: 48px 0 42px;
    }

    body.stigma-sub-page .robot-product-page .robot-page-kicker strong {
        font-size: 14px !important;
    }

    body.stigma-sub-page .robot-product-page .robot-page-kicker span {
        font-size: 14px !important;
        padding: 7px 15px 8px;
    }

    body.stigma-sub-page .robot-product-page .robot-page-headline {
        font-size: clamp(29px, 8vw, 38px) !important;
        line-height: 1.34 !important;
        margin: 34px auto 22px;
    }

    body.stigma-sub-page .robot-product-page .robot-page-lead {
        font-size: 14px !important;
    }

    .robot-product-page .robot-desktop-break {
        display: none;
    }

    .robot-product-page .robot-overview {
        padding-bottom: 54px;
    }

    .robot-product-page .robot-overview-grid {
        gap: 24px;
    }

    .robot-product-page .robot-overview-media {
        order: 0;
    }

    .robot-product-page .robot-overview-copy {
        order: 1;
    }

    body.stigma-sub-page .robot-product-page .robot-overview-copy h2,
    body.stigma-sub-page .robot-product-page .robot-section-title {
        font-size: 25px !important;
        margin-bottom: 26px;
    }

    .robot-product-page .robot-process-list {
        gap: 18px;
    }

    .robot-product-page .robot-process-item {
        gap: 12px;
        grid-template-columns: 34px 1fr;
    }

    .robot-product-page .robot-process-icon {
        font-size: 24px;
        height: 32px;
        width: 32px;
    }

    body.stigma-sub-page .robot-product-page .robot-process-item p {
        font-size: 13px !important;
    }

    .robot-product-page .robot-strengths {
        padding: 48px 0;
    }

    .robot-product-page .robot-strength-tabs {
        border-radius: 20px;
        grid-template-columns: repeat(2, 1fr);
        gap: 4px;
    }

    .robot-product-page .robot-strength-tab {
        border-radius: 16px;
        font-size: 12px;
        min-height: 46px;
        padding: 8px 10px;
    }

    .robot-product-page .robot-strength-panel {
        min-height: 0;
        padding: 24px 4px 0;
    }

    body.stigma-sub-page .robot-product-page .robot-strength-panel p {
        font-size: 14px !important;
    }

    .robot-product-page .robot-comparison {
        padding: 50px 0;
    }

    .robot-product-page .robot-comparison-scroll {
        margin-right: -20px;
        overflow-x: auto;
        padding-bottom: 8px;
        padding-right: 20px;
    }

    .robot-product-page .robot-comparison-table {
        min-width: 720px;
    }

    .robot-product-page .robot-outcomes {
        padding-bottom: 60px;
    }

    .robot-product-page .robot-outcomes-panel {
        gap: 28px;
        grid-template-columns: 1fr;
        min-height: 0;
        padding: 38px 28px;
    }

    body.stigma-sub-page .robot-product-page .robot-outcomes-panel h2 {
        font-size: 25px !important;
    }

    body.stigma-sub-page .robot-product-page .robot-outcomes-panel li {
        font-size: 13.5px !important;
        margin-bottom: 14px;
    }

    .robot-product-page .robot-case-row {
        align-items: start;
        grid-template-columns: 1fr;
        padding: 24px 0;
    }

    .robot-product-page .robot-case-actions {
        justify-content: flex-start;
    }

    .robot-product-page .robot-hotspot {
        font-size: 9px;
        min-height: 28px;
        padding: 5px 9px;
    }

    .robot-product-page .robot-hotspot-preview {
        bottom: auto;
        left: auto;
        right: 8px;
        top: 8px;
        width: min(420px, 92%);
    }

    .robot-product-page .robot-hotspot-preview img {
        height: auto;
    }

    .case-modal {
        padding: 14px;
    }

    .case-modal__image-wrap,
    .case-modal__image {
        max-height: calc(100vh - 130px);
    }

    .case-modal__close,
    .case-modal__nav {
        height: 42px;
        width: 42px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .robot-product-page *,
    .case-modal * {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}