.txf-catalog-page {
    --txf-ink: #10213f;
    --txf-muted: #5d6d86;
    --txf-line: #dce7ee;
    --txf-blue: #087bbd;
    --txf-cyan: #1db8d9;
    --txf-soft: #f2f8fb;
    color: var(--txf-ink);
    background: #fff;
    overflow: hidden;
}

.txf-catalog-page *,
.txf-catalog-page *::before,
.txf-catalog-page *::after { box-sizing: border-box; }

.txf-catalog-page p { overflow-wrap: anywhere; }

.txf-hero {
    position: relative;
    min-height: 570px;
    display: flex;
    align-items: center;
    isolation: isolate;
    overflow: hidden;
    color: #fff;
    background: #0b2346;
}

.txf-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background:
        linear-gradient(90deg, rgba(5, 19, 43, .96) 0%, rgba(8, 31, 64, .84) 50%, rgba(5, 53, 83, .38) 100%),
        var(--txf-hero-image, url('/statics/home/images/catalog/supply-chain-hero.jpg')) center / cover no-repeat;
}

.txf-hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    width: 420px;
    height: 420px;
    right: -165px;
    bottom: -245px;
    border: 78px solid rgba(29, 184, 217, .17);
    border-radius: 50%;
}

.txf-hero--plain::before {
    background:
        radial-gradient(circle at 82% 16%, rgba(29, 184, 217, .3), transparent 25%),
        radial-gradient(circle at 96% 88%, rgba(8, 123, 189, .38), transparent 33%),
        linear-gradient(128deg, #091c38 0%, #102e5b 58%, #07527c 100%);
}

.txf-hero__content { position: relative; z-index: 1; max-width: 790px; padding: 94px 0 88px; }

.txf-eyebrow,
.txf-kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #72dbef;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .15em;
    text-transform: uppercase;
}

.txf-eyebrow { margin-bottom: 22px; }
.txf-kicker { margin-bottom: 13px; color: var(--txf-blue); }
.txf-eyebrow::before,
.txf-kicker::before { content: ""; width: 31px; height: 2px; background: currentColor; }

.txf-hero h1 {
    max-width: 790px;
    margin: 0;
    color: #fff;
    font-size: clamp(40px, 5.2vw, 66px);
    line-height: 1.12;
    letter-spacing: -.035em;
}

.txf-hero__lead {
    max-width: 710px;
    margin: 24px 0 0;
    color: rgba(255, 255, 255, .79);
    font-size: 18px;
    line-height: 1.85;
}

.txf-actions { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 36px; }

.txf-button {
    display: inline-flex;
    min-height: 50px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 11px 25px;
    border: 1px solid transparent;
    border-radius: 6px;
    color: #fff;
    background: linear-gradient(135deg, var(--txf-blue), var(--txf-cyan));
    font-size: 15px;
    font-weight: 800;
    line-height: 1.35;
    text-align: center;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.txf-button:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 13px 30px rgba(0, 112, 177, .23); }
.txf-button:focus-visible,
.txf-card-link:focus-visible,
.txf-news-card:focus-visible { outline: 3px solid #75deef; outline-offset: 3px; }
.txf-button--light { color: #09203b; background: #fff; }
.txf-button--light:hover { color: var(--txf-blue); background: #fff; }
.txf-button--ghost { border-color: rgba(255, 255, 255, .38); background: rgba(255, 255, 255, .07); }
.txf-button--ghost:hover { background: rgba(255, 255, 255, .14); }

.txf-section { padding: 92px 0; }
.txf-section--soft { background: var(--txf-soft); }
.txf-section--dark { color: #fff; background: radial-gradient(circle at 82% 10%, rgba(15, 150, 205, .28), transparent 34%), linear-gradient(135deg, #07172f, #102d5b); }

.txf-section-heading { max-width: 820px; margin-bottom: 40px; }
.txf-section-heading--split { max-width: none; display: grid; grid-template-columns: minmax(0, .8fr) minmax(340px, 1.2fr); gap: 70px; align-items: end; }
.txf-section-heading h2 { margin: 0; font-size: clamp(30px, 3.5vw, 46px); line-height: 1.22; letter-spacing: -.025em; }
.txf-section-heading p { margin: 15px 0 0; color: var(--txf-muted); font-size: 16px; line-height: 1.85; }
.txf-section-heading--split p { margin: 0; }
.txf-section--dark .txf-section-heading p { color: rgba(255, 255, 255, .68); }
.txf-section--dark .txf-kicker { color: #72dbef; }

.txf-category-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.txf-category-card { position: relative; min-height: 490px; display: flex; align-items: flex-end; overflow: hidden; border-radius: 17px; isolation: isolate; background: #0e2a50; box-shadow: 0 18px 48px rgba(14, 45, 77, .14); }
.txf-category-card::before { content: ""; position: absolute; inset: 0; z-index: -2; background: var(--txf-card-image) center / cover no-repeat; transition: transform .55s ease; }
.txf-category-card::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(5, 16, 35, .03) 18%, rgba(5, 20, 42, .92) 100%); }
.txf-category-card:hover::before { transform: scale(1.035); }
.txf-category-card__body { width: 100%; padding: 38px 38px 40px; color: #fff; }
.txf-category-card__body > span { color: #6fdef0; font-size: 12px; font-weight: 800; letter-spacing: .13em; }
.txf-category-card h2 { margin: 11px 0 12px; color: #fff; font-size: 31px; line-height: 1.22; }
.txf-category-card p { max-width: 520px; margin: 0 0 22px; color: rgba(255, 255, 255, .7); font-size: 15px; line-height: 1.75; }
.txf-card-link { display: inline-flex; align-items: center; gap: 9px; color: #fff; font-size: 14px; font-weight: 800; }
.txf-card-link:hover { color: #72dbef; }

.txf-product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.txf-product-card { min-width: 0; overflow: hidden; border: 1px solid var(--txf-line); border-radius: 15px; background: #fff; box-shadow: 0 12px 36px rgba(17, 48, 81, .07); }
.txf-product-card__media { position: relative; height: 315px; overflow: hidden; background: #eaf2f6; }
.txf-product-card__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.txf-product-card:hover .txf-product-card__media img { transform: scale(1.025); }
.txf-product-card__badge { position: absolute; top: 18px; left: 18px; padding: 7px 11px; border-radius: 999px; color: #fff; background: rgba(7, 37, 70, .82); font-size: 11px; font-weight: 800; letter-spacing: .08em; backdrop-filter: blur(6px); }
.txf-product-card__body { padding: 28px 29px 30px; }
.txf-product-card__meta { display: flex; flex-wrap: wrap; gap: 7px 15px; margin-bottom: 13px; color: var(--txf-blue); font-size: 12px; font-weight: 800; letter-spacing: .06em; }
.txf-product-card h3 { margin: 0 0 11px; font-size: 24px; line-height: 1.3; }
.txf-product-card__summary { min-height: 51px; margin: 0; color: var(--txf-muted); font-size: 14px; line-height: 1.75; }
.txf-specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 22px 0 0; padding: 18px 0 0; border-top: 1px solid var(--txf-line); list-style: none; }
.txf-specs li { min-width: 0; color: #40536d; font-size: 12px; line-height: 1.55; overflow-wrap: anywhere; }
.txf-specs strong { color: var(--txf-ink); font-weight: 800; }

.txf-pill-list { display: flex; flex-wrap: wrap; gap: 9px; margin: 0; padding: 0; list-style: none; }
.txf-pill-list li { padding: 9px 14px; border-radius: 999px; color: #35526a; background: #e9f5f9; font-size: 13px; line-height: 1.3; }

.txf-feature-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.txf-feature-card { min-width: 0; min-height: 230px; padding: 29px 25px; border: 1px solid var(--txf-line); border-top: 3px solid var(--txf-cyan); border-radius: 10px; background: #fff; box-shadow: 0 10px 28px rgba(17, 48, 81, .055); }
.txf-feature-card__index { display: block; margin-bottom: 31px; color: var(--txf-blue); font-size: 12px; font-weight: 900; letter-spacing: .12em; }
.txf-feature-card h3 { margin: 0 0 10px; font-size: 19px; line-height: 1.4; }
.txf-feature-card p { margin: 0; color: var(--txf-muted); font-size: 14px; line-height: 1.75; }
.txf-section--dark .txf-feature-card { border-color: rgba(255, 255, 255, .12); border-top-color: #53d2e8; background: rgba(255, 255, 255, .055); box-shadow: none; }
.txf-section--dark .txf-feature-card__index { color: #72dbef; }
.txf-section--dark .txf-feature-card h3 { color: #fff; }
.txf-section--dark .txf-feature-card p { color: rgba(255, 255, 255, .65); }

.txf-process { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin: 0; padding: 0; list-style: none; counter-reset: txf-process; }
.txf-process li { position: relative; min-width: 0; padding: 28px 25px; border: 1px solid var(--txf-line); border-radius: 12px; background: #fff; counter-increment: txf-process; }
.txf-process li::before { content: "0" counter(txf-process); display: block; margin-bottom: 31px; color: var(--txf-blue); font-size: 13px; font-weight: 900; letter-spacing: .12em; }
.txf-process h3 { margin: 0 0 10px; font-size: 19px; }
.txf-process p { margin: 0; color: var(--txf-muted); font-size: 14px; line-height: 1.75; }

.txf-checklist { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.txf-checklist li { position: relative; padding: 19px 20px 19px 50px; border: 1px solid var(--txf-line); border-radius: 10px; background: #fff; color: #354963; font-size: 14px; line-height: 1.65; }
.txf-checklist li::before { content: ""; position: absolute; left: 20px; top: 24px; width: 13px; height: 7px; border-left: 2px solid var(--txf-blue); border-bottom: 2px solid var(--txf-blue); transform: rotate(-45deg); }

.txf-news-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.txf-news-card { position: relative; min-width: 0; min-height: 315px; display: flex; flex-direction: column; padding: 30px 28px; overflow: hidden; border: 1px solid var(--txf-line); border-radius: 14px; color: var(--txf-ink); background: #fff; box-shadow: 0 11px 32px rgba(19, 51, 87, .055); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.txf-news-card::after { content: ""; position: absolute; width: 130px; height: 130px; right: -72px; bottom: -70px; border: 25px solid #e8f6fa; border-radius: 50%; }
.txf-news-card:hover { color: var(--txf-ink); transform: translateY(-4px); border-color: #9ed9ea; box-shadow: 0 17px 40px rgba(19, 77, 118, .105); }
.txf-news-card time { position: relative; z-index: 1; color: var(--txf-blue); font-size: 12px; font-weight: 800; letter-spacing: .09em; }
.txf-news-card h2,
.txf-news-card h3 { position: relative; z-index: 1; margin: 32px 0 13px; font-size: 22px; line-height: 1.45; }
.txf-news-card p { position: relative; z-index: 1; margin: 0; color: var(--txf-muted); font-size: 14px; line-height: 1.8; }
.txf-news-card__more { position: relative; z-index: 1; margin-top: auto; padding-top: 25px; color: var(--txf-blue); font-size: 13px; font-weight: 800; }

.txf-news-empty { padding: 35px; border: 1px dashed #b8cbd7; border-radius: 12px; color: var(--txf-muted); background: #f7fafc; text-align: center; }

.txf-article-wrap { max-width: 900px; margin: 0 auto; }
.txf-article-head { padding-bottom: 33px; border-bottom: 1px solid var(--txf-line); }
.txf-article-head time { color: var(--txf-blue); font-size: 13px; font-weight: 800; letter-spacing: .08em; }
.txf-article-head h1 { margin: 15px 0 16px; font-size: clamp(34px, 4.4vw, 54px); line-height: 1.23; letter-spacing: -.03em; }
.txf-article-head p { margin: 0; color: var(--txf-muted); font-size: 17px; line-height: 1.8; }
.txf-article-body { padding: 39px 0 10px; color: #334861; font-size: 17px; line-height: 2; overflow-wrap: anywhere; }
.txf-article-back { display: inline-flex; align-items: center; gap: 9px; margin-top: 33px; color: var(--txf-blue); font-weight: 800; }
.txf-news-detail .txf-hero .txf-product-card__meta { margin: 24px 0 0; color: #72dbef; }

.txf-note { margin-top: 26px; padding: 20px 22px; border-left: 3px solid var(--txf-cyan); color: var(--txf-muted); background: #eaf6fa; font-size: 13px; line-height: 1.8; }

.txf-cta { padding: 78px 0; color: #fff; background: linear-gradient(125deg, #0d2855 0%, #075f9f 64%, #13a7cb 100%); }
.txf-cta__inner { display: flex; align-items: center; justify-content: space-between; gap: 48px; }
.txf-cta__copy { max-width: 760px; }
.txf-cta h2 { margin: 0 0 13px; color: #fff; font-size: clamp(29px, 3.4vw, 43px); line-height: 1.24; }
.txf-cta p { margin: 0; color: rgba(255, 255, 255, .72); font-size: 16px; line-height: 1.78; }
.txf-cta .txf-actions { flex: 0 0 auto; margin-top: 0; }

@media (max-width: 1024px) {
    .txf-section-heading--split { grid-template-columns: 1fr; gap: 18px; }
    .txf-feature-grid,
    .txf-process { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .txf-news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .txf-hero { min-height: 0; }
    .txf-hero::before { background-position: 62% center; }
    .txf-hero__content { padding: 78px 0 72px; }
    .txf-hero h1 { font-size: 39px; }
    .txf-hero__lead { font-size: 16px; }
    .txf-section { padding: 66px 0; }
    .txf-category-grid,
    .txf-product-grid,
    .txf-feature-grid,
    .txf-process,
    .txf-checklist,
    .txf-news-grid { grid-template-columns: 1fr; }
    .txf-category-card { min-height: 420px; }
    .txf-category-card__body { padding: 31px 27px 33px; }
    .txf-product-card__media { height: 270px; }
    .txf-product-card__body { padding: 25px 23px 27px; }
    .txf-product-card__summary { min-height: 0; }
    .txf-feature-card { min-height: 0; }
    .txf-news-card { min-height: 285px; }
    .txf-cta { padding: 64px 0; }
    .txf-cta__inner { align-items: flex-start; flex-direction: column; gap: 29px; }
    .txf-cta .txf-actions { width: 100%; }
}

@media (max-width: 480px) {
    .txf-hero h1 { font-size: 35px; }
    .txf-actions { flex-direction: column; }
    .txf-actions .txf-button { width: 100%; }
    .txf-category-card { min-height: 390px; }
    .txf-category-card h2 { font-size: 27px; }
    .txf-product-card__media { height: 235px; }
    .txf-specs { grid-template-columns: 1fr; }
    .txf-article-body { font-size: 16px; }
}

@media (prefers-reduced-motion: reduce) {
    .txf-button,
    .txf-category-card::before,
    .txf-product-card__media img,
    .txf-news-card { transition: none; }
}