/* (c) Haxter Corporation Global 2026. | All rights reserved. */
/* Haxter Corporation 7th Anniversary | H27 / HX26 Editorial System */

.hx7_page {
    --hx7-blue: #0067b8;
    --hx7-blue-hover: #005da6;
    --hx7-blue-press: #004f8d;
    --hx7-ink: #0f1720;
    --hx7-text: #1a1a1a;
    --hx7-muted: #5f6368;
    --hx7-border: #e5e5e5;
    --hx7-border-strong: #cfd6dd;
    --hx7-soft: #f5f5f5;
    --hx7-soft-2: #fafafa;
    --hx7-blue-soft: #f3f8fd;
    --hx7-line-blue: #d8e6f2;
    --hx7-white: #ffffff;
    --hx7-width: 1380px;
    --hx7-article-width: 920px;

    min-width: 320px;
    margin: 0;
    background: var(--hx7-white);
    color: var(--hx7-text);
    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        SegoeUI,
        Roboto,
        "Helvetica Neue",
        Helvetica,
        Arial,
        sans-serif;
}

.hx7_page *,
.hx7_page *::before,
.hx7_page *::after {
    box-sizing: border-box;
}

.hx7_page img,
.hx7_page svg {
    max-width: 100%;
}

.hx7_page a {
    color: inherit;
    font-family: inherit;
    font-style: normal;
    line-height: inherit;
    letter-spacing: inherit;
}

.hx7_wrap {
    width: min(var(--hx7-width), calc(100% - 64px));
    margin: 0 auto;
}

.hx7_article_wrap {
    width: min(var(--hx7-article-width), calc(100% - 64px));
    margin: 0 auto;
}

/* -------------------------------------------------------------------------- */
/* News header                                                                */
/* -------------------------------------------------------------------------- */

.hx7_news_header {
    background: var(--hx7-white);
    border-top: 1px solid var(--hx7-border);
    border-bottom: 1px solid var(--hx7-border);
}

.hx7_news_header_inner {
    min-height: 84px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
}

.hx7_news_identity {
    display: inline-flex;
    align-items: baseline;
    gap: 7px;
    color: var(--hx7-ink);
    font-size: 18px;
    line-height: 1;
    font-weight: 400;
    letter-spacing: -0.025em;
    text-decoration: none;
    white-space: nowrap;
}

.hx7_news_identity span,
.hx7_news_identity strong {
    display: inline;
    margin: 0;
    padding: 0;
    color: inherit;
    font-family: inherit;
    line-height: inherit;
}

.hx7_news_identity span {
    font-size: 18px;
    font-weight: 400;
}

.hx7_news_identity strong {
    font-size: 24px;
    font-weight: 500;
    letter-spacing: -0.04em;
}

.hx7_news_identity:hover {
    color: var(--hx7-blue);
}

.hx7_back_link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--hx7-blue);
    font-size: 14px;
    line-height: 1.4;
    font-weight: 600;
    text-decoration: none;
}

.hx7_back_link:hover {
    color: var(--hx7-blue-hover);
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* -------------------------------------------------------------------------- */
/* Hero                                                                       */
/* -------------------------------------------------------------------------- */

.hx7_hero {
    background:
        linear-gradient(
            90deg,
            rgba(0, 103, 184, 0.045) 0,
            rgba(0, 103, 184, 0.045) 1px,
            transparent 1px,
            transparent 44px
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fbfdff 54%,
            #ffffff 100%
        );
    border-bottom: 1px solid var(--hx7-border);
}

.hx7_hero_grid {
    min-height: 680px;
    display: grid;
    grid-template-columns: minmax(0, 1.18fr) minmax(340px, 0.82fr);
    gap: clamp(56px, 7vw, 112px);
    align-items: center;
    padding: 84px 0 92px;
}

.hx7_hero_content {
    min-width: 0;
}

.hx7_meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: var(--hx7-muted);
    font-size: 13px;
    line-height: 1.4;
}

.hx7_meta span {
    color: var(--hx7-blue);
    font-weight: 700;
}

.hx7_meta span::after {
    content: "·";
    display: inline-block;
    margin-left: 8px;
    color: var(--hx7-border-strong);
}

.hx7_eyebrow {
    margin: 42px 0 0;
    color: var(--hx7-blue);
    font-size: 14px;
    line-height: 1.3;
    font-weight: 700;
    letter-spacing: 0.12em;
}

.hx7_hero h1 {
    max-width: 920px;
    margin: 18px 0 0;
    color: var(--hx7-ink);
    font-size: clamp(56px, 6vw, 92px);
    line-height: 0.98;
    letter-spacing: -0.065em;
    font-weight: 650;
    text-wrap: balance;
}

.hx7_hero h1 span {
    display: block;
    color: var(--hx7-blue);
}

.hx7_lead {
    max-width: 760px;
    margin: 30px 0 0;
    color: var(--hx7-muted);
    font-size: clamp(20px, 2vw, 27px);
    line-height: 1.45;
    letter-spacing: -0.025em;
}

.hx7_anniversary_mark {
    min-height: 430px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 24px;
    padding: 40px;
    background:
        linear-gradient(
            135deg,
            rgba(0, 103, 184, 0.08),
            rgba(0, 103, 184, 0.02)
        ),
        var(--hx7-white);
    border: 1px solid var(--hx7-line-blue);
    position: relative;
    overflow: hidden;
}

.hx7_anniversary_mark::before {
    content: "";
    position: absolute;
    inset: 22px;
    border-top: 1px solid rgba(0, 103, 184, 0.18);
    border-right: 1px solid rgba(0, 103, 184, 0.18);
    pointer-events: none;
}

.hx7_anniversary_number {
    color: var(--hx7-blue);
    font-size: clamp(190px, 20vw, 300px);
    line-height: 0.74;
    letter-spacing: -0.1em;
    font-weight: 700;
}

.hx7_anniversary_mark_text {
    display: grid;
    gap: 6px;
    padding-bottom: 22px;
}

.hx7_anniversary_mark_text strong {
    color: var(--hx7-ink);
    font-size: 32px;
    line-height: 1;
    font-weight: 650;
    letter-spacing: -0.045em;
}

.hx7_anniversary_mark_text span {
    color: var(--hx7-muted);
    font-size: 14px;
    line-height: 1.4;
}

/* -------------------------------------------------------------------------- */
/* Shared section elements                                                    */
/* -------------------------------------------------------------------------- */

.hx7_section_label {
    margin: 0;
    color: var(--hx7-blue);
    font-size: 12px;
    line-height: 1.4;
    font-weight: 750;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.hx7_section_header {
    max-width: 900px;
    margin-bottom: 44px;
}

.hx7_section_header h2,
.hx7_intro h2,
.hx7_statement h2,
.hx7_today h2,
.hx7_future h2 {
    margin: 16px 0 0;
    color: var(--hx7-ink);
    font-size: clamp(38px, 4.2vw, 62px);
    line-height: 1.04;
    letter-spacing: -0.052em;
    font-weight: 650;
    text-wrap: balance;
}

.hx7_section_header > p:last-child {
    max-width: 720px;
    margin: 20px 0 0;
    color: var(--hx7-muted);
    font-size: 17px;
    line-height: 1.65;
}

/* -------------------------------------------------------------------------- */
/* Introduction                                                               */
/* -------------------------------------------------------------------------- */

.hx7_intro {
    padding: 90px 0 96px;
    background: var(--hx7-white);
    border-bottom: 1px solid var(--hx7-border);
}

.hx7_intro_columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 52px;
    margin-top: 46px;
    padding-top: 34px;
    border-top: 3px solid var(--hx7-ink);
}

.hx7_intro_columns p {
    margin: 0;
    color: var(--hx7-muted);
    font-size: 18px;
    line-height: 1.72;
}

/* -------------------------------------------------------------------------- */
/* Statement                                                                  */
/* -------------------------------------------------------------------------- */

.hx7_statement {
    padding: 90px 0 96px;
    background: var(--hx7-soft-2);
    border-bottom: 1px solid var(--hx7-border);
}

.hx7_statement_grid {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr);
    gap: 84px;
    align-items: start;
}

.hx7_statement_copy {
    padding-left: 44px;
    border-left: 1px solid var(--hx7-border-strong);
}

.hx7_statement_copy p {
    margin: 0;
    color: var(--hx7-muted);
    font-size: 18px;
    line-height: 1.72;
}

.hx7_statement_copy p + p {
    margin-top: 26px;
}

.hx7_statement_copy p:last-child {
    color: var(--hx7-ink);
    font-size: 23px;
    line-height: 1.5;
    font-weight: 600;
    letter-spacing: -0.025em;
}

/* -------------------------------------------------------------------------- */
/* Timeline                                                                   */
/* -------------------------------------------------------------------------- */

.hx7_timeline {
    padding: 92px 0 100px;
    background: var(--hx7-white);
    border-bottom: 1px solid var(--hx7-border);
}

.hx7_timeline_grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-top: 1px solid var(--hx7-border);
    border-left: 1px solid var(--hx7-border);
}

.hx7_timeline_item {
    min-height: 330px;
    padding: 30px;
    background: var(--hx7-white);
    border-right: 1px solid var(--hx7-border);
    border-bottom: 1px solid var(--hx7-border);
}

.hx7_timeline_year {
    margin: 0;
    color: var(--hx7-blue);
    font-size: 14px;
    line-height: 1.4;
    font-weight: 750;
    letter-spacing: 0.1em;
}

.hx7_timeline_item h3 {
    margin: 22px 0 0;
    color: var(--hx7-ink);
    font-size: 26px;
    line-height: 1.12;
    letter-spacing: -0.038em;
    font-weight: 650;
}

.hx7_timeline_item > p:last-child {
    margin: 18px 0 0;
    color: var(--hx7-muted);
    font-size: 15px;
    line-height: 1.64;
}

/* -------------------------------------------------------------------------- */
/* Today                                                                      */
/* -------------------------------------------------------------------------- */

.hx7_today {
    padding: 92px 0 100px;
    background:
        linear-gradient(
            90deg,
            rgba(0, 103, 184, 0.055),
            rgba(0, 103, 184, 0.01) 42%
        ),
        var(--hx7-blue-soft);
    border-bottom: 1px solid var(--hx7-line-blue);
}

.hx7_today_grid {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(480px, 1.08fr);
    gap: 84px;
    align-items: start;
}

.hx7_today_areas {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-top: 1px solid var(--hx7-line-blue);
    border-left: 1px solid var(--hx7-line-blue);
}

.hx7_today_areas article {
    min-height: 230px;
    padding: 28px;
    background: rgba(255, 255, 255, 0.78);
    border-right: 1px solid var(--hx7-line-blue);
    border-bottom: 1px solid var(--hx7-line-blue);
}

.hx7_today_areas h3 {
    margin: 0;
    color: var(--hx7-ink);
    font-size: 24px;
    line-height: 1.15;
    letter-spacing: -0.035em;
    font-weight: 650;
}

.hx7_today_areas p {
    margin: 16px 0 0;
    color: var(--hx7-muted);
    font-size: 15px;
    line-height: 1.62;
}

/* -------------------------------------------------------------------------- */
/* Future                                                                     */
/* -------------------------------------------------------------------------- */

.hx7_future {
    padding: 100px 0 108px;
    background: var(--hx7-white);
    border-bottom: 1px solid var(--hx7-border);
}

.hx7_future > .hx7_article_wrap {
    position: relative;
}

.hx7_future > .hx7_article_wrap::before {
    content: "";
    display: block;
    width: 90px;
    height: 4px;
    margin-bottom: 34px;
    background: var(--hx7-blue);
}

.hx7_future > .hx7_article_wrap > p:not(.hx7_section_label) {
    margin: 28px 0 0;
    color: var(--hx7-muted);
    font-size: 18px;
    line-height: 1.72;
}

.hx7_future > .hx7_article_wrap > p:last-child {
    color: var(--hx7-ink);
    font-size: 21px;
    font-weight: 500;
}

/* -------------------------------------------------------------------------- */
/* Article footer                                                             */
/* -------------------------------------------------------------------------- */

.hx7_article_footer {
    padding: 78px 0 84px;
    background: var(--hx7-ink);
    color: var(--hx7-white);
}

.hx7_article_footer > .hx7_article_wrap {
    display: grid;
    gap: 30px;
}

.hx7_article_footer_mark {
    display: flex;
    align-items: flex-end;
    gap: 18px;
}

.hx7_article_footer_mark > span {
    color: var(--hx7-white);
    font-size: 112px;
    line-height: 0.78;
    font-weight: 700;
    letter-spacing: -0.08em;
}

.hx7_article_footer_mark strong {
    display: block;
    color: var(--hx7-white);
    font-size: 25px;
    line-height: 1.1;
    font-weight: 600;
    letter-spacing: -0.035em;
}

.hx7_article_footer_mark p {
    margin: 7px 0 0;
    color: rgba(255, 255, 255, 0.64);
    font-size: 14px;
    line-height: 1.4;
    letter-spacing: 0.08em;
}

.hx7_article_footer_message {
    max-width: 720px;
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 22px;
    line-height: 1.5;
    letter-spacing: -0.02em;
}

.hx7_news_return {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #8fd0ff !important;
    font-size: 15px;
    line-height: 1.4;
    font-weight: 600;
    text-decoration: none;
}

.hx7_news_return:hover {
    color: var(--hx7-white) !important;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* -------------------------------------------------------------------------- */
/* Focus                                                                      */
/* -------------------------------------------------------------------------- */

.hx7_page a:focus-visible {
    outline: 2px solid var(--hx7-ink);
    outline-offset: 3px;
}

.hx7_article_footer a:focus-visible {
    outline-color: var(--hx7-white);
}

/* -------------------------------------------------------------------------- */
/* Responsive                                                                 */
/* -------------------------------------------------------------------------- */

@media (max-width: 1180px) {
    .hx7_hero_grid,
    .hx7_statement_grid,
    .hx7_today_grid {
        grid-template-columns: 1fr;
    }

    .hx7_hero_grid {
        min-height: auto;
    }

    .hx7_anniversary_mark {
        min-height: 360px;
        justify-content: flex-start;
    }

    .hx7_statement_copy {
        padding-left: 0;
        padding-top: 38px;
        border-left: 0;
        border-top: 1px solid var(--hx7-border-strong);
    }

    .hx7_timeline_grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hx7_today_areas {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 820px) {
    .hx7_wrap,
    .hx7_article_wrap {
        width: min(100% - 36px, var(--hx7-width));
    }

    .hx7_news_header_inner {
        min-height: auto;
        padding: 20px 0;
    }

    .hx7_hero_grid {
        gap: 48px;
        padding: 58px 0 64px;
    }

    .hx7_hero h1,
    .hx7_section_header h2,
    .hx7_intro h2,
    .hx7_statement h2,
    .hx7_today h2,
    .hx7_future h2,
    .hx7_timeline_item h3,
    .hx7_today_areas h3,
    .hx7_article_footer_mark strong {
        font-family:
            "Segoe UI",
            Roboto,
            "Helvetica Neue",
            Arial,
            sans-serif;
        font-weight: 500;
        letter-spacing: -0.028em;
        text-wrap: balance;
    }

    .hx7_hero h1 {
        font-size: clamp(42px, 11vw, 58px);
        line-height: 1.04;
    }

    .hx7_lead {
        font-size: 19px;
        line-height: 1.6;
    }

    .hx7_anniversary_mark {
        min-height: 300px;
        padding: 30px;
    }

    .hx7_anniversary_number {
        font-size: clamp(150px, 38vw, 220px);
    }

    .hx7_intro,
    .hx7_statement,
    .hx7_timeline,
    .hx7_today,
    .hx7_future {
        padding-top: 68px;
        padding-bottom: 74px;
    }

    .hx7_intro-columns,
    .hx7_intro_columns {
        grid-template-columns: 1fr;
        gap: 26px;
    }

    .hx7_intro_columns p,
    .hx7_statement_copy p,
    .hx7_future > .hx7_article_wrap > p:not(.hx7_section_label) {
        font-size: 17px;
        line-height: 1.68;
    }

    .hx7_timeline_grid,
    .hx7_today_areas {
        grid-template-columns: 1fr;
    }

    .hx7_timeline_item,
    .hx7_today_areas article {
        min-height: auto;
    }
}

@media (max-width: 560px) {
    .hx7_news_header_inner {
        align-items: flex-start;
        flex-direction: column;
        gap: 14px;
    }

    .hx7_news_identity {
        gap: 6px;
    }

    .hx7_news_identity strong {
        font-size: 23px;
    }

    .hx7_eyebrow {
        margin-top: 32px;
    }

    .hx7_anniversary_mark {
        min-height: 250px;
        align-items: flex-end;
        gap: 14px;
        padding: 24px;
    }

    .hx7_anniversary_number {
        font-size: 135px;
    }

    .hx7_anniversary_mark_text {
        padding-bottom: 12px;
    }

    .hx7_anniversary_mark_text strong {
        font-size: 25px;
    }

    .hx7_timeline_item,
    .hx7_today_areas article {
        padding: 24px;
    }

    .hx7_article_footer {
        padding: 62px 0 68px;
    }

    .hx7_article_footer_mark > span {
        font-size: 88px;
    }

    .hx7_article_footer_message {
        font-size: 19px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .hx7_page *,
    .hx7_page *::before,
    .hx7_page *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}