@font-face {
    font-family: "Roboto";
    src: url("/fonts/roboto/RobotoVariable-Latin.woff2") format("woff2");
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
}

html[lang="en"] body,
html[lang="en"] h1,
html[lang="en"] h2,
html[lang="en"] h3,
html[lang="en"] h4,
html[lang="en"] h5,
html[lang="en"] h6,
html[lang="en"] p,
html[lang="en"] a,
html[lang="en"] span,
html[lang="en"] strong,
html[lang="en"] small,
html[lang="en"] li,
html[lang="en"] dt,
html[lang="en"] dd,
html[lang="en"] th,
html[lang="en"] td,
html[lang="en"] figcaption,
html[lang="en"] button,
html[lang="en"] input,
html[lang="en"] select,
html[lang="en"] textarea {
    font-family: "Roboto", Arial, sans-serif !important;
}

/*
 * English layout normalization
 * Korean source pages use deliberately narrow title columns and authored line
 * breaks. English copy needs wider measures and natural browser wrapping.
 */
html[lang="en"] body {
    font-kerning: normal;
    text-rendering: optimizeLegibility;
}

html[lang="en"] p,
html[lang="en"] li,
html[lang="en"] dd,
html[lang="en"] figcaption {
    letter-spacing: -0.01em !important;
    word-spacing: normal !important;
    overflow-wrap: break-word;
    word-break: normal;
    hyphens: none;
}

html[lang="en"] .about-intro__headline,
html[lang="en"] .about-intro__description,
html[lang="en"] .about-direction__item p,
html[lang="en"] .about-value p,
html[lang="en"] .si-overview__lead,
html[lang="en"] .robot-page-lead,
html[lang="en"] .fabric-product-lead,
html[lang="en"] .stigma-simple-intro__title {
    text-wrap: balance;
}

/* Company overview */
html[lang="en"] .about-shell--intro {
    max-width: 1180px !important;
}

html[lang="en"] .about-intro__headline {
    max-width: 900px !important;
    margin-inline: auto !important;
    font-size: clamp(24px, 1.65vw, 32px) !important;
    line-height: 1.28 !important;
    letter-spacing: -0.025em !important;
}

html[lang="en"] .about-intro__description {
    display: block !important;
    max-width: 880px !important;
    margin-inline: auto !important;
    font-size: clamp(15px, 0.92vw, 18px) !important;
    line-height: 1.68 !important;
    letter-spacing: -0.012em !important;
}

html[lang="en"] .about-pillar figcaption {
    max-width: 360px !important;
    margin-inline: auto !important;
    font-size: clamp(14px, 0.86vw, 16px) !important;
    line-height: 1.45 !important;
    font-weight: 600 !important;
    letter-spacing: -0.018em !important;
    text-wrap: balance;
}

html[lang="en"] .about-direction__grid {
    align-items: start !important;
}

html[lang="en"] .about-direction__item h2,
html[lang="en"] .about-value h2 {
    font-weight: 700 !important;
    letter-spacing: -0.025em !important;
}

html[lang="en"] .about-direction__item p {
    max-width: 520px !important;
    margin-inline: auto !important;
    font-size: clamp(15px, 0.9vw, 17px) !important;
    line-height: 1.55 !important;
    font-weight: 400 !important;
    color: #656a73 !important;
    text-wrap: balance;
}

html[lang="en"] .about-values__grid {
    align-items: start !important;
}

html[lang="en"] .about-value {
    min-width: 0 !important;
}

html[lang="en"] .about-value h2 {
    font-size: clamp(18px, 1.05vw, 21px) !important;
    line-height: 1.3 !important;
    text-wrap: balance;
}

html[lang="en"] .about-value p {
    max-width: 340px !important;
    margin-inline: auto !important;
    font-size: clamp(14px, 0.84vw, 16px) !important;
    line-height: 1.55 !important;
    color: #656a73 !important;
    text-wrap: pretty;
}

html[lang="en"] .about-value__icon + h2 {
    min-height: 2.6em;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Robot SI overview: reserve enough room for English headings. */
html[lang="en"] .si-overview__container {
    width: min(1280px, calc(100% - 64px)) !important;
    max-width: 1280px !important;
}

html[lang="en"] .si-overview__header h1 {
    font-size: clamp(42px, 3vw, 58px) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.04em !important;
}

html[lang="en"] .si-overview__lead {
    max-width: 1080px !important;
    margin-inline: auto !important;
    font-size: clamp(15px, 0.96vw, 18px) !important;
    line-height: 1.65 !important;
}

html[lang="en"] .si-capability-row {
    display: grid !important;
    grid-template-columns: 36px minmax(300px, 390px) minmax(0, 1fr) !important;
    align-items: center !important;
    column-gap: 28px !important;
}

html[lang="en"] .si-capability-row > * {
    min-width: 0 !important;
}

html[lang="en"] .si-capability-row h2 {
    margin: 0 !important;
    font-size: clamp(25px, 1.75vw, 34px) !important;
    line-height: 1.12 !important;
    letter-spacing: -0.035em !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    text-wrap: balance;
}

html[lang="en"] .si-capability-row p {
    position: static !important;
    width: auto !important;
    margin: 0 !important;
    font-size: clamp(14px, 0.88vw, 17px) !important;
    line-height: 1.5 !important;
    text-align: left !important;
}

/* Product hero copy: preserve the intended authored lines on wide screens. */
html[lang="en"] .robot-container--narrow,
html[lang="en"] .fabric-product-container {
    width: min(1400px, calc(100% - 64px)) !important;
    max-width: 1400px !important;
}

html[lang="en"] .robot-page-headline {
    max-width: 1400px !important;
    margin-inline: auto !important;
    font-size: clamp(40px, 2.65vw, 54px) !important;
    line-height: 1.13 !important;
    letter-spacing: -0.045em !important;
}

html[lang="en"] .robot-page-headline > span {
    display: block !important;
    white-space: nowrap;
}

html[lang="en"] .robot-page-lead {
    max-width: 1120px !important;
    margin-inline: auto !important;
    font-size: clamp(15px, 0.92vw, 18px) !important;
    line-height: 1.65 !important;
    text-wrap: pretty;
}

html[lang="en"] .robot-process-item p {
    line-height: 1.52 !important;
}

html[lang="en"] .robot-strength-grid h3,
html[lang="en"] .robot-case-heading h3,
html[lang="en"] .robot-section-title {
    line-height: 1.3 !important;
    letter-spacing: -0.025em !important;
    text-wrap: balance;
}

/* Fabric hero: prevent single-word orphans while keeping the approved 3 lines. */
html[lang="en"] .fabric-product-headline {
    max-width: 1400px !important;
    margin-inline: auto !important;
    font-size: clamp(40px, 2.65vw, 54px) !important;
    line-height: 1.12 !important;
    letter-spacing: -0.045em !important;
}

html[lang="en"] .fabric-headline-set--desktop > span {
    display: block !important;
    white-space: nowrap;
}

html[lang="en"] .fabric-product-lead {
    max-width: 1160px !important;
    margin-inline: auto !important;
    font-size: clamp(15px, 0.92vw, 18px) !important;
    line-height: 1.65 !important;
    text-wrap: pretty;
}

html[lang="en"] .fabric-technology-copy h2,
html[lang="en"] .fabric-inspection-summary h2,
html[lang="en"] .fabric-specifications h2 {
    text-wrap: balance;
}

/* Contact copy should wrap by available width, not at authored Korean breaks. */
html[lang="en"] .stigma-contact-section .font-weight-normal {
    line-height: 1.55 !important;
    text-wrap: pretty;
}

@media (max-width: 1199px) {
    html[lang="en"] .si-capability-row {
        grid-template-columns: 34px minmax(240px, 320px) minmax(0, 1fr) !important;
        column-gap: 20px !important;
    }

    html[lang="en"] .robot-page-headline > span,
    html[lang="en"] .fabric-headline-set--desktop > span {
        white-space: normal;
    }
}

@media (max-width: 767px) {
    html[lang="en"] .about-intro__headline,
    html[lang="en"] .about-intro__description,
    html[lang="en"] .about-pillar figcaption,
    html[lang="en"] .about-direction__item p,
    html[lang="en"] .about-value p,
    html[lang="en"] .si-overview__lead,
    html[lang="en"] .robot-page-lead,
    html[lang="en"] .fabric-product-lead,
    html[lang="en"] .stigma-simple-intro__title {
        text-wrap: pretty;
    }

    html[lang="en"] .about-intro__headline {
        font-size: clamp(22px, 6.3vw, 28px) !important;
        line-height: 1.28 !important;
    }

    html[lang="en"] .about-intro__description,
    html[lang="en"] .about-direction__item p,
    html[lang="en"] .about-value p {
        font-size: 15px !important;
        line-height: 1.62 !important;
    }

    html[lang="en"] .about-value__icon + h2 {
        min-height: 0;
    }

    html[lang="en"] .si-overview__container,
    html[lang="en"] .robot-container--narrow,
    html[lang="en"] .fabric-product-container {
        width: min(calc(100% - 40px), 1400px) !important;
    }

    html[lang="en"] .si-overview__header h1 {
        font-size: clamp(34px, 10vw, 46px) !important;
    }

    html[lang="en"] .si-capability-row {
        grid-template-columns: 34px minmax(0, 1fr) !important;
        column-gap: 14px !important;
        row-gap: 8px !important;
        align-items: start !important;
    }

    html[lang="en"] .si-capability-row h2 {
        grid-column: 2 !important;
        font-size: clamp(24px, 7.3vw, 30px) !important;
    }

    html[lang="en"] .si-capability-row p {
        grid-column: 2 !important;
        font-size: 15px !important;
    }

    html[lang="en"] .robot-page-headline,
    html[lang="en"] .fabric-product-headline {
        font-size: clamp(30px, 8.4vw, 38px) !important;
        line-height: 1.13 !important;
    }

    html[lang="en"] .robot-page-headline > span,
    html[lang="en"] .fabric-headline-set > span {
        white-space: normal !important;
    }

    html[lang="en"] .robot-page-lead,
    html[lang="en"] .fabric-product-lead {
        font-size: 15px !important;
        line-height: 1.62 !important;
    }

    html[lang="en"] .stigma-contact-section .font-weight-normal {
        font-size: 15px !important;
    }
}

/*
 * English PRODUCT hero normalization
 *
 * The fabric page previously inherited a larger client override while the
 * robot pages used a separate scale.  Wide-screen authored lines were also
 * forced to stay on one line, which allowed long English copy to be clipped by
 * the page-level overflow mask.  Keep one type scale for every English PRODUCT
 * hero and let a line wrap only when the available width requires it.
 */
html[lang="en"] body.stigma-sub-page main.robot-product-page h1.robot-page-headline,
html[lang="en"] body.stigma-sub-page main.fabric-product-page h1#fabricProductHeadline {
    --stigma-en-product-headline-size: clamp(42px, 3vw, 54px);
    box-sizing: border-box !important;
    font-family: "Roboto", Arial, sans-serif !important;
    font-size: var(--stigma-en-product-headline-size) !important;
    font-weight: 650 !important;
    letter-spacing: -0.045em !important;
    line-height: 1.15 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: min(1540px, calc(100vw - 96px)) !important;
    overflow: visible !important;
    padding-inline: 0 !important;
    text-wrap: balance;
    width: 100% !important;
}

html[lang="en"] body.stigma-sub-page main.robot-product-page h1.robot-page-headline > span,
html[lang="en"] body.stigma-sub-page main.fabric-product-page h1#fabricProductHeadline .fabric-headline-set,
html[lang="en"] body.stigma-sub-page main.fabric-product-page h1#fabricProductHeadline .fabric-headline-set > span {
    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    letter-spacing: inherit !important;
    line-height: inherit !important;
    max-width: 100% !important;
    overflow-wrap: normal !important;
    text-wrap: balance;
    white-space: normal !important;
    word-break: normal !important;
}

@media (max-width: 767px) {
    html[lang="en"] body.stigma-sub-page main.robot-product-page h1.robot-page-headline,
    html[lang="en"] body.stigma-sub-page main.fabric-product-page h1#fabricProductHeadline {
        --stigma-en-product-headline-size: clamp(30px, 8.4vw, 38px);
        line-height: 1.16 !important;
        max-width: calc(100vw - 40px) !important;
    }
}
