/*
 * EIT.KG
 * Главная страница.
 */


/* =========================================================
   1. Уточнение Hero
   ========================================================= */

.eit-hero {
    min-height: clamp(700px, 88vh, 860px);
    padding-top: 132px;
    padding-bottom: 38px;
}

.eit-hero__title {
    font-size: clamp(54px, 5.1vw, 80px);
}

.eit-hero__lead {
    max-width: 760px;
}

.eit-system-visual {
    max-width: 520px;
}

.eit-hero-stats {
    margin-top: 45px;
}

.eit-hero-stat {
    min-height: 96px;
    padding-top: 20px;
    padding-bottom: 20px;
}


/* =========================================================
   2. Общие секции
   ========================================================= */

.home-section {
    position: relative;

    padding: 104px 0;

    background: var(--eit-background);
}

.home-section-heading {
    display: grid;
    grid-template-columns:
        minmax(0, 1.35fr)
        minmax(320px, 0.65fr);
    align-items: end;
    gap: 60px;

    margin-bottom: 56px;
}

.home-section-heading__eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;

    margin-bottom: 17px;

    color: var(--eit-teal-600);

    font-size: 12px;
    font-weight: 850;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

.home-section-heading__eyebrow::before {
    content: "";

    width: 31px;
    height: 2px;

    background: var(--eit-gradient-brand);
    border-radius: var(--eit-radius-pill);
}

.home-section-heading h2 {
    max-width: 850px;
    margin: 0;

    color: var(--eit-text);

    font-size: clamp(38px, 4vw, 60px);
    font-weight: 840;
    line-height: 1.06;
    letter-spacing: -2.3px;
}

.home-section-heading > p {
    margin: 0;

    color: var(--eit-text-muted);

    font-size: 17px;
    line-height: 1.78;
}

.home-section-heading--center {
    display: block;

    max-width: 920px;
    margin-right: auto;
    margin-left: auto;

    text-align: center;
}

.home-section-heading--center .home-section-heading__eyebrow {
    justify-content: center;
}

.home-section-heading--center > p {
    max-width: 770px;
    margin: 22px auto 0;
}

.home-section-heading--light h2 {
    color: var(--eit-white);
}

.home-section-heading--light > p {
    color: rgba(255, 255, 255, 0.58);
}


/* =========================================================
   3. Отрасли
   ========================================================= */

.home-industries {
    background:
        radial-gradient(
            circle at 8% 15%,
            rgba(0, 216, 199, 0.075),
            transparent 29%
        ),
        var(--eit-background);
}

.home-industries__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.home-industry-card {
    position: relative;

    min-height: 305px;
    padding: 30px;

    overflow: hidden;

    background: var(--eit-surface);
    border: 1px solid var(--eit-border);
    border-radius: var(--eit-radius-md);

    box-shadow: var(--eit-shadow-sm);

    transition:
        transform var(--eit-transition),
        border-color var(--eit-transition),
        box-shadow var(--eit-transition);
}

.home-industry-card::after {
    content: "";

    position: absolute;
    right: -70px;
    bottom: -80px;

    width: 180px;
    height: 180px;

    border: 28px solid rgba(0, 184, 176, 0.055);
    border-radius: 50%;

    transition:
        border-color var(--eit-transition),
        transform var(--eit-transition);
}

.home-industry-card:hover {
    border-color: rgba(0, 184, 176, 0.3);
    box-shadow: var(--eit-shadow-md);

    transform: translateY(-7px);
}

.home-industry-card:hover::after {
    border-color: rgba(0, 184, 176, 0.1);

    transform: scale(1.08);
}

.home-industry-card__top {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: space-between;
}

.home-industry-card__code {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 58px;
    height: 38px;
    padding: 0 12px;

    color: var(--eit-white);

    background: var(--eit-gradient-brand);
    border-radius: 12px;

    font-size: 11px;
    font-weight: 850;
    letter-spacing: 1px;

    box-shadow: 0 12px 25px rgba(0, 184, 176, 0.2);
}

.home-industry-card__arrow {
    color: var(--eit-teal-600);

    font-size: 23px;

    transition: transform var(--eit-transition);
}

.home-industry-card:hover .home-industry-card__arrow {
    transform: translate(3px, -3px);
}

.home-industry-card h3 {
    position: relative;
    z-index: 2;

    margin: 58px 0 15px;

    color: var(--eit-text);

    font-size: 26px;
    font-weight: 820;
    line-height: 1.15;
    letter-spacing: -0.8px;
}

.home-industry-card p {
    position: relative;
    z-index: 2;

    margin: 0;

    color: var(--eit-text-muted);

    font-size: 15px;
    line-height: 1.72;
}


/* =========================================================
   4. Три основы EIT.KG
   ========================================================= */

.home-pillars {
    overflow: hidden;

    color: var(--eit-white);

    background:
        radial-gradient(
            circle at 50% 44%,
            rgba(0, 216, 199, 0.15),
            transparent 31%
        ),
        linear-gradient(
            140deg,
            var(--eit-navy-950),
            var(--eit-navy-800) 54%,
            var(--eit-navy-950)
        );
}

.home-pillars__grid-background {
    position: absolute;
    inset: 0;

    opacity: 0.1;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, 0.08) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.08) 1px,
            transparent 1px
        );

    background-size: 72px 72px;

    mask-image:
        radial-gradient(
            circle at center,
            black,
            transparent 75%
        );
}

.home-pillars__stage {
    display: grid;
    grid-template-areas:
        "services emblem information"
        ". technology .";
    grid-template-columns:
        minmax(300px, 1fr)
        minmax(250px, 0.72fr)
        minmax(300px, 1fr);
    align-items: center;
    gap: 28px;

    max-width: 1240px;
    margin: 0 auto;
}

.home-pillar-card {
    position: relative;

    display: grid;
    grid-template-columns: auto auto 1fr;
    align-items: start;
    gap: 14px;

    width: 100%;
    min-height: 175px;
    padding: 22px;

    color: rgba(255, 255, 255, 0.65);
    text-align: left;

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.07),
            rgba(255, 255, 255, 0.025)
        );

    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--eit-radius-md);

    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2);

    cursor: pointer;

    backdrop-filter: blur(14px);

    transition:
        color var(--eit-transition),
        background var(--eit-transition),
        border-color var(--eit-transition),
        transform var(--eit-transition),
        box-shadow var(--eit-transition);
}

.home-pillar-card[data-pillar="services"] {
    grid-area: services;
}

.home-pillar-card[data-pillar="information"] {
    grid-area: information;
}

.home-pillar-card[data-pillar="technology"] {
    grid-area: technology;

    max-width: 500px;
    margin: 0 auto;
}

.home-pillar-card:hover,
.home-pillar-card:focus-visible,
.home-pillar-card.is-active {
    color: var(--eit-white);

    background:
        linear-gradient(
            145deg,
            rgba(0, 216, 199, 0.14),
            rgba(7, 90, 150, 0.08)
        );

    border-color: rgba(0, 216, 199, 0.4);

    box-shadow:
        0 24px 60px rgba(0, 0, 0, 0.25),
        0 0 35px rgba(0, 216, 199, 0.07);

    transform: translateY(-5px);
}

.home-pillar-card:focus-visible {
    outline: 3px solid rgba(0, 216, 199, 0.25);
    outline-offset: 4px;
}

.home-pillar-card__number {
    align-self: start;

    color: rgba(255, 255, 255, 0.28);

    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
}

.home-pillar-card__letter {
    display: grid;
    place-items: center;

    width: 48px;
    height: 48px;

    color: var(--eit-white);

    background: var(--eit-gradient-brand);
    border-radius: 15px;

    font-size: 22px;
    font-weight: 900;

    box-shadow: 0 14px 30px rgba(0, 184, 176, 0.22);
}

.home-pillar-card__copy {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.home-pillar-card__copy strong {
    color: inherit;

    font-size: 13px;
    font-weight: 820;
    line-height: 1.2;
}

.home-pillar-card__title {
    color: rgba(255, 255, 255, 0.48);

    font-size: 12px;
    font-weight: 700;
}

.home-pillar-card__description {
    display: block;

    margin-top: 7px;

    color: rgba(255, 255, 255, 0.46);

    font-size: 12px;
    line-height: 1.55;
}

.home-pillar-card.is-active .home-pillar-card__description,
.home-pillar-card:hover .home-pillar-card__description {
    color: rgba(255, 255, 255, 0.69);
}

.home-pillars__emblem {
    position: relative;
    grid-area: emblem;

    width: 245px;
    aspect-ratio: 1 / 1;

    margin: 0 auto;

    filter:
        drop-shadow(0 25px 35px rgba(0, 0, 0, 0.32))
        drop-shadow(0 0 26px rgba(0, 216, 199, 0.18));
}

.home-pillars__orbit {
    position: absolute;

    border: 1px solid rgba(0, 216, 199, 0.21);
    border-radius: 50%;
}

.home-pillars__orbit--outer {
    inset: -18px;

    border-style: dashed;

    animation: home-orbit 32s linear infinite;
}

.home-pillars__orbit--inner {
    inset: 9px;

    box-shadow: inset 0 0 30px rgba(0, 216, 199, 0.06);

    animation: home-orbit-reverse 25s linear infinite;
}

.home-pillars__segment {
    position: absolute;

    opacity: 0.42;

    border: 1px solid rgba(255, 255, 255, 0.2);

    background:
        linear-gradient(
            145deg,
            rgba(90, 233, 220, 0.96),
            rgba(0, 169, 184, 0.92) 46%,
            rgba(7, 90, 150, 0.98)
        );

    box-shadow:
        inset 4px 4px 8px rgba(255, 255, 255, 0.26),
        inset -7px -7px 14px rgba(0, 42, 78, 0.26),
        0 15px 25px rgba(0, 0, 0, 0.2);

    transition:
        opacity 350ms ease,
        filter 350ms ease,
        transform 350ms ease;
}

.home-pillars__segment--services {
    top: 8px;
    right: 26px;
    left: 26px;

    height: 43%;

    border-radius: 120px 120px 23px 23px;
}

.home-pillars__segment--information {
    top: 27%;
    bottom: 17%;
    left: 8px;

    width: 43%;

    border-radius: 120px 23px 23px 120px;
}

.home-pillars__segment--technology {
    right: 26px;
    bottom: 8px;
    left: 26px;

    height: 43%;

    border-radius: 23px 23px 120px 120px;
}

.home-pillars__emblem[data-active="services"]
.home-pillars__segment--services,
.home-pillars__emblem[data-active="information"]
.home-pillars__segment--information,
.home-pillars__emblem[data-active="technology"]
.home-pillars__segment--technology {
    opacity: 1;

    filter:
        brightness(1.15)
        drop-shadow(0 0 22px rgba(0, 216, 199, 0.36));

    transform: scale(1.025);
}

.home-pillars__axis {
    position: absolute;
    z-index: 4;
    top: 2px;
    bottom: 2px;
    left: 50%;

    width: 30px;

    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: var(--eit-radius-pill);

    background:
        linear-gradient(
            180deg,
            var(--eit-teal-300),
            var(--eit-teal-500) 48%,
            var(--eit-blue-700)
        );

    box-shadow:
        inset 4px 3px 6px rgba(255, 255, 255, 0.26),
        0 12px 25px rgba(0, 0, 0, 0.25);

    transform: translateX(-50%);
}

.home-pillars__core {
    position: absolute;
    z-index: 5;
    top: 50%;
    left: 50%;

    width: 60px;
    height: 60px;

    border: 10px solid var(--eit-navy-900);
    border-radius: 50%;

    background:
        radial-gradient(
            circle at 35% 30%,
            var(--eit-teal-300),
            var(--eit-teal-500) 44%,
            var(--eit-blue-700)
        );

    box-shadow:
        0 0 0 3px rgba(90, 233, 220, 0.6),
        0 0 35px rgba(0, 216, 199, 0.65);

    transform: translate(-50%, -50%);
}

.home-pillars__panels {
    max-width: 1050px;
    margin: 40px auto 0;
}

.home-pillar-panel {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(350px, 0.9fr);
    gap: 55px;

    padding: 38px;

    color: var(--eit-white);

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.07),
            rgba(255, 255, 255, 0.025)
        );

    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--eit-radius-md);

    box-shadow: 0 25px 65px rgba(0, 0, 0, 0.22);

    backdrop-filter: blur(15px);
}

.home-pillar-panel[hidden] {
    display: none;
}

.home-pillar-panel__intro > span {
    color: var(--eit-teal-400);

    font-size: 11px;
    font-weight: 850;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.home-pillar-panel__intro h3 {
    margin: 12px 0 14px;

    font-size: 31px;
    font-weight: 830;
    letter-spacing: -1px;
}

.home-pillar-panel__intro p {
    margin: 0;

    color: rgba(255, 255, 255, 0.57);

    line-height: 1.72;
}

.home-pillar-panel__list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 13px;

    margin: 0;
    padding: 0;

    list-style: none;
}

.home-pillar-panel__list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;

    color: rgba(255, 255, 255, 0.7);

    font-size: 14px;
    line-height: 1.45;
}

.home-pillar-panel__list li span {
    display: grid;
    flex: 0 0 23px;
    place-items: center;

    width: 23px;
    height: 23px;

    color: var(--eit-white);

    background: rgba(0, 216, 199, 0.14);
    border: 1px solid rgba(0, 216, 199, 0.25);
    border-radius: 8px;

    font-size: 11px;
}


/* =========================================================
   5. Решения
   ========================================================= */

.home-solutions {
    background:
        radial-gradient(
            circle at 94% 10%,
            rgba(7, 90, 150, 0.07),
            transparent 28%
        ),
        var(--eit-background);
}

.home-solutions__layout {
    display: grid;
    grid-template-columns:
        minmax(320px, 0.9fr)
        minmax(0, 1.65fr);
    gap: 18px;
}

.home-solutions__secondary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.home-solution-card {
    position: relative;

    display: flex;
    flex-direction: column;

    min-height: 330px;
    padding: 31px;

    overflow: hidden;

    background: var(--eit-surface);
    border: 1px solid var(--eit-border);
    border-radius: var(--eit-radius-md);

    box-shadow: var(--eit-shadow-sm);

    transition:
        transform var(--eit-transition),
        border-color var(--eit-transition),
        box-shadow var(--eit-transition);
}

.home-solution-card::after {
    content: "";

    position: absolute;
    right: -60px;
    bottom: -70px;

    width: 160px;
    height: 160px;

    border: 24px solid rgba(0, 184, 176, 0.045);
    border-radius: 50%;
}

.home-solution-card:hover {
    border-color: rgba(0, 184, 176, 0.3);
    box-shadow: var(--eit-shadow-md);

    transform: translateY(-7px);
}

.home-solution-card--featured {
    min-height: 678px;

    color: var(--eit-white);

    background:
        radial-gradient(
            circle at 90% 15%,
            rgba(0, 216, 199, 0.17),
            transparent 28%
        ),
        linear-gradient(
            145deg,
            var(--eit-navy-800),
            var(--eit-navy-950)
        );

    border-color: rgba(0, 216, 199, 0.16);
}

.home-solution-card--featured::after {
    width: 270px;
    height: 270px;

    border-width: 38px;
    border-color: rgba(0, 216, 199, 0.07);
}

.home-solution-card--compact {
    min-height: 330px;
}

.home-solution-card__header {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

.home-solution-card__number {
    display: grid;
    place-items: center;

    width: 48px;
    height: 48px;

    color: var(--eit-white);

    background: var(--eit-gradient-brand);
    border-radius: 15px;

    font-size: 13px;
    font-weight: 850;

    box-shadow: 0 13px 28px rgba(0, 184, 176, 0.22);
}

.home-solution-card__label {
    color: var(--eit-teal-600);

    font-size: 10px;
    font-weight: 850;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.home-solution-card--featured .home-solution-card__label {
    color: var(--eit-teal-400);
}

.home-solution-card h3 {
    position: relative;
    z-index: 2;

    margin: 38px 0 15px;

    color: var(--eit-text);

    font-size: 27px;
    font-weight: 830;
    line-height: 1.12;
    letter-spacing: -1px;
}

.home-solution-card--featured h3 {
    margin-top: 72px;

    color: var(--eit-white);

    font-size: clamp(36px, 3vw, 48px);
}

.home-solution-card p {
    position: relative;
    z-index: 2;

    margin: 0;

    color: var(--eit-text-muted);

    font-size: 15px;
    line-height: 1.75;
}

.home-solution-card--featured p {
    color: rgba(255, 255, 255, 0.61);

    font-size: 17px;
}

.home-solution-card__list {
    position: relative;
    z-index: 2;

    display: grid;
    gap: 13px;

    margin: 40px 0 0;
    padding: 0;

    list-style: none;
}

.home-solution-card__list li {
    display: flex;
    align-items: center;
    gap: 11px;

    color: rgba(255, 255, 255, 0.72);

    font-size: 14px;
}

.home-solution-card__list li::before {
    content: "";

    width: 7px;
    height: 7px;

    background: var(--eit-teal-400);
    border-radius: 50%;

    box-shadow: 0 0 12px rgba(0, 216, 199, 0.7);
}

.home-text-link {
    position: relative;
    z-index: 2;

    display: inline-flex;
    align-items: center;
    gap: 10px;
    align-self: flex-start;

    margin-top: auto;
    padding-top: 28px;

    color: var(--eit-teal-600);

    font-size: 14px;
    font-weight: 800;
}

.home-text-link span {
    font-size: 18px;

    transition: transform var(--eit-transition);
}

.home-text-link:hover span {
    transform: translateX(5px);
}

.home-text-link--light,
.home-solution-card--featured .home-text-link {
    color: var(--eit-teal-400);
}

.home-infrastructure-card {
    position: relative;

    display: grid;
    grid-template-columns:
        minmax(300px, 0.9fr)
        minmax(350px, 1.1fr)
        auto;
    align-items: center;
    gap: 38px;

    margin-top: 18px;
    padding: 38px;

    overflow: hidden;

    color: var(--eit-white);

    background:
        radial-gradient(
            circle at 88% 50%,
            rgba(0, 216, 199, 0.14),
            transparent 30%
        ),
        linear-gradient(
            140deg,
            var(--eit-navy-800),
            var(--eit-navy-950)
        );

    border: 1px solid rgba(0, 216, 199, 0.15);
    border-radius: var(--eit-radius-md);

    box-shadow: var(--eit-shadow-md);
}

.home-infrastructure-card::after {
    content: "";

    position: absolute;
    right: -90px;
    bottom: -120px;

    width: 270px;
    height: 270px;

    border: 38px solid rgba(0, 216, 199, 0.06);
    border-radius: 50%;
}

.home-infrastructure-card__heading {
    position: relative;
    z-index: 2;
}

.home-infrastructure-card__identity {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    margin-bottom: 26px;
}

.home-infrastructure-card h3 {
    margin: 0;

    font-size: 31px;
    font-weight: 830;
    line-height: 1.13;
    letter-spacing: -1px;
}

.home-infrastructure-card p {
    margin: 17px 0 0;

    color: rgba(255, 255, 255, 0.57);

    line-height: 1.72;
}

.home-infrastructure-card__features {
    position: relative;
    z-index: 2;

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.home-infrastructure-card__features span {
    display: flex;
    align-items: center;
    gap: 10px;

    color: rgba(255, 255, 255, 0.7);

    font-size: 13px;
}

.home-infrastructure-card__features span::before {
    content: "";

    width: 7px;
    height: 7px;

    background: var(--eit-teal-400);
    border-radius: 50%;

    box-shadow: 0 0 12px rgba(0, 216, 199, 0.7);
}

.home-infrastructure-card .home-text-link {
    padding-top: 0;
    white-space: nowrap;
}


/* =========================================================
   6. Процесс
   ========================================================= */

.home-process {
    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            var(--eit-background),
            var(--eit-background-soft)
        );
}

.home-process__timeline {
    position: relative;

    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 18px;

    margin-top: 68px;
}

.home-process__timeline::before {
    content: "";

    position: absolute;
    top: 50px;
    right: 7%;
    left: 7%;

    height: 2px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--eit-teal-500) 12%,
            var(--eit-blue-700) 88%,
            transparent
        );
}

.home-process-step {
    position: relative;
    z-index: 2;

    text-align: center;
}

.home-process-step__number {
    color: var(--eit-teal-600);

    font-size: 11px;
    font-weight: 850;
    letter-spacing: 1px;
}

.home-process-step__node {
    display: grid;
    place-items: center;

    width: 54px;
    height: 54px;
    margin: 16px auto 26px;

    background: var(--eit-background);
    border: 1px solid rgba(0, 184, 176, 0.25);
    border-radius: 50%;

    box-shadow:
        0 10px 25px rgba(5, 28, 43, 0.11),
        0 0 0 8px var(--eit-background);
}

.home-process-step__node span {
    width: 14px;
    height: 14px;

    background: var(--eit-gradient-brand);
    border-radius: 50%;

    box-shadow: 0 0 17px rgba(0, 216, 199, 0.6);
}

.home-process-step h3 {
    margin: 0 0 13px;

    color: var(--eit-text);

    font-size: 20px;
    font-weight: 820;
    letter-spacing: -0.5px;
}

.home-process-step p {
    margin: 0;

    color: var(--eit-text-muted);

    font-size: 14px;
    line-height: 1.65;
}

.home-process__formula {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 23px;

    max-width: 760px;
    margin: 68px auto 0;
    padding: 20px 28px;

    color: var(--eit-white);

    background:
        linear-gradient(
            145deg,
            var(--eit-navy-800),
            var(--eit-navy-950)
        );

    border-radius: var(--eit-radius-pill);

    box-shadow: var(--eit-shadow-md);

    font-size: 14px;
    font-weight: 850;
    letter-spacing: 0.8px;
    text-transform: uppercase;
}

.home-process__formula span:nth-child(even) {
    color: var(--eit-teal-400);

    font-size: 19px;
}


/* =========================================================
   7. Экосистема
   ========================================================= */

.home-products {
    overflow: hidden;

    color: var(--eit-white);

    background:
        linear-gradient(
            140deg,
            var(--eit-navy-950),
            var(--eit-navy-800) 55%,
            var(--eit-navy-950)
        );
}

.home-products::before {
    content: "";

    position: absolute;
    inset: 0;

    opacity: 0.09;

    background-image:
        radial-gradient(
            circle at center,
            rgba(0, 216, 199, 0.4) 1px,
            transparent 1px
        );

    background-size: 32px 32px;
}

.home-products__glow {
    position: absolute;
    top: -240px;
    right: -170px;

    width: 620px;
    height: 620px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(0, 216, 199, 0.16),
            transparent 68%
        );
}

.home-products__grid {
    display: grid;
    grid-template-columns:
        repeat(
            auto-fit,
            minmax(min(100%, 320px), 1fr)
        );
    gap: 22px;
}

.home-product-card {
    position: relative;

    display: flex;
    flex-direction: column;

    min-height: 430px;
    padding: 35px;

    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.075),
            rgba(255, 255, 255, 0.027)
        );

    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: var(--eit-radius-md);

    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.2);

    backdrop-filter: blur(14px);

    transition:
        transform var(--eit-transition),
        border-color var(--eit-transition),
        background var(--eit-transition);
}

.home-product-card::after {
    content: "";

    position: absolute;
    right: -80px;
    bottom: -90px;

    width: 210px;
    height: 210px;

    border: 32px solid rgba(0, 216, 199, 0.06);
    border-radius: 50%;
}

.home-product-card:hover {
    background:
        linear-gradient(
            145deg,
            rgba(0, 216, 199, 0.11),
            rgba(255, 255, 255, 0.035)
        );

    border-color: rgba(0, 216, 199, 0.32);

    transform: translateY(-8px);
}

.home-product-card__header {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

.home-product-card__icon {
    display: grid;
    place-items: center;

    width: 58px;
    height: 58px;

    color: var(--eit-white);

    background: var(--eit-gradient-brand);
    border-radius: 18px;

    font-size: 24px;
    font-weight: 900;

    box-shadow: 0 15px 30px rgba(0, 184, 176, 0.25);
}
.home-product-card__icon img {
    display: block;

    width: 72%;
    height: 72%;

    object-fit: contain;
}

.home-product-card__status {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    padding: 7px 11px;

    border-radius: var(--eit-radius-pill);

    font-size: 10px;
    font-weight: 800;
}

.home-product-card__status::before {
    content: "";

    width: 6px;
    height: 6px;

    border-radius: 50%;
}

.home-product-card__status.is-active {
    color: #8af0d8;

    background: rgba(41, 196, 157, 0.1);
    border: 1px solid rgba(41, 196, 157, 0.2);
}

.home-product-card__status.is-active::before {
    background: #54deb8;

    box-shadow: 0 0 10px rgba(84, 222, 184, 0.7);
}
.home-product-card__status.is-development {
    color: #8dd8ff;

    background: rgba(70, 167, 226, 0.1);
    border: 1px solid rgba(70, 167, 226, 0.22);
}

.home-product-card__status.is-development::before {
    background: #64c5ff;

    box-shadow: 0 0 10px rgba(100, 197, 255, 0.65);
}

.home-product-card__status.is-planned {
    color: #d4c6ff;

    background: rgba(147, 112, 219, 0.1);
    border: 1px solid rgba(147, 112, 219, 0.22);
}

.home-product-card__status.is-planned::before {
    background: #b99aff;

    box-shadow: 0 0 10px rgba(185, 154, 255, 0.55);
}

.home-product-card__status.is-paused {
    color: #ffd590;

    background: rgba(235, 174, 70, 0.1);
    border: 1px solid rgba(235, 174, 70, 0.22);
}

.home-product-card__status.is-paused::before {
    background: #f0ba61;

    box-shadow: 0 0 10px rgba(240, 186, 97, 0.5);
}

.home-product-card__status.is-archived {
    color: rgba(255, 255, 255, 0.48);

    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.home-product-card__status.is-archived::before {
    background: rgba(255, 255, 255, 0.35);
}
.home-product-card h3 {
    position: relative;
    z-index: 2;

    margin: 40px 0 14px;

    color: var(--eit-white);

    font-size: 34px;
    font-weight: 830;
    letter-spacing: -1px;
}

.home-product-card p {
    position: relative;
    z-index: 2;

    max-width: 600px;
    margin: 0;

    color: rgba(255, 255, 255, 0.57);

    font-size: 16px;
    line-height: 1.72;
}

.home-product-card ul {
    position: relative;
    z-index: 2;

    display: flex;
    flex-wrap: wrap;
    gap: 8px;

    margin: 28px 0 0;
    padding: 0;

    list-style: none;
}

.home-product-card li {
    padding: 7px 10px;

    color: rgba(255, 255, 255, 0.58);

    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 9px;

    font-size: 11px;
}


/* =========================================================
   8. Мозаика доказательств
   ========================================================= */

.home-proof {
    background:
        radial-gradient(
            circle at 10% 20%,
            rgba(0, 216, 199, 0.07),
            transparent 27%
        ),
        linear-gradient(
            180deg,
            var(--eit-background),
            var(--eit-background-soft)
        );
}

.home-proof__grid {
    display: grid;
    grid-template-areas:
        "experience experience products"
        "experience experience engineering"
        "lifecycle lifecycle confidentiality"
        "scale scale confidentiality";
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.home-proof-card {
    position: relative;

    min-height: 230px;
    padding: 34px;

    overflow: hidden;

    background: var(--eit-surface);
    border: 1px solid var(--eit-border);
    border-radius: var(--eit-radius-md);

    box-shadow: var(--eit-shadow-sm);

    transition:
        transform var(--eit-transition),
        border-color var(--eit-transition),
        box-shadow var(--eit-transition);
}

.home-proof-card::after {
    content: "";

    position: absolute;
    right: -70px;
    bottom: -85px;

    width: 190px;
    height: 190px;

    border: 28px solid rgba(0, 184, 176, 0.05);
    border-radius: 50%;
}

.home-proof-card:hover {
    border-color: rgba(0, 184, 176, 0.3);
    box-shadow: var(--eit-shadow-md);

    transform: translateY(-6px);
}

.home-proof-card--experience {
    grid-area: experience;

    min-height: 478px;

    color: var(--eit-white);

    background:
        radial-gradient(
            circle at 85% 20%,
            rgba(0, 216, 199, 0.18),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            var(--eit-navy-800),
            var(--eit-navy-950)
        );

    border-color: rgba(0, 216, 199, 0.15);
}

.home-proof-card--products {
    grid-area: products;
}

.home-proof-card--engineering {
    grid-area: engineering;
}

.home-proof-card--lifecycle {
    grid-area: lifecycle;

    min-height: 250px;

    color: var(--eit-white);

    background:
        linear-gradient(
            135deg,
            var(--eit-teal-600),
            var(--eit-blue-700)
        );

    border-color: transparent;
}

.home-proof-card--confidentiality {
    grid-area: confidentiality;

    min-height: 498px;
}

.home-proof-card--scale {
    grid-area: scale;
}

.home-proof-card__number {
    position: relative;
    z-index: 2;

    display: block;

    color: var(--eit-teal-600);

    font-size: 42px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: -2px;
}

.home-proof-card--experience .home-proof-card__number,
.home-proof-card--lifecycle .home-proof-card__number {
    color: var(--eit-teal-400);
}

.home-proof-card--experience .home-proof-card__number {
    margin-top: 25px;

    font-size: clamp(76px, 8vw, 118px);
}

.home-proof-card h3 {
    position: relative;
    z-index: 2;

    margin: 32px 0 14px;

    color: var(--eit-text);

    font-size: 25px;
    font-weight: 830;
    line-height: 1.15;
    letter-spacing: -0.8px;
}

.home-proof-card--experience h3 {
    max-width: 520px;
    margin-top: 45px;

    color: var(--eit-white);

    font-size: clamp(34px, 3.5vw, 52px);
}

.home-proof-card--lifecycle h3 {
    color: var(--eit-white);
}

.home-proof-card p {
    position: relative;
    z-index: 2;

    max-width: 580px;
    margin: 0;

    color: var(--eit-text-muted);

    font-size: 15px;
    line-height: 1.73;
}

.home-proof-card--experience p,
.home-proof-card--lifecycle p {
    color: rgba(255, 255, 255, 0.66);
}


/* =========================================================
   9. Миссия и видение
   ========================================================= */

.home-purpose {
    padding-top: 20px;

    background: var(--eit-background-soft);
}

.home-purpose-panorama {
    position: relative;

    padding: 64px;

    overflow: hidden;

    color: var(--eit-white);

    background:
        radial-gradient(
            circle at 50% 52%,
            rgba(0, 216, 199, 0.14),
            transparent 28%
        ),
        linear-gradient(
            140deg,
            var(--eit-navy-950),
            var(--eit-navy-800) 54%,
            var(--eit-navy-950)
        );

    border: 1px solid rgba(0, 216, 199, 0.13);
    border-radius: var(--eit-radius-lg);

    box-shadow: var(--eit-shadow-md);
}

.home-purpose-panorama__grid {
    position: absolute;
    inset: 0;

    opacity: 0.08;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, 0.08) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.08) 1px,
            transparent 1px
        );

    background-size: 64px 64px;
}

.home-purpose-panorama__glow {
    position: absolute;
    top: 50%;
    left: 50%;

    width: 430px;
    height: 430px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(0, 216, 199, 0.15),
            transparent 67%
        );

    transform: translate(-50%, -50%);
}

.home-purpose-panorama__heading {
    position: relative;
    z-index: 2;

    max-width: 820px;
    margin: 0 auto 70px;

    text-align: center;
}

.home-purpose-panorama__eyebrow {
    color: var(--eit-teal-400);

    font-size: 11px;
    font-weight: 850;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

.home-purpose-panorama__heading h2 {
    margin: 16px 0 0;

    color: var(--eit-white);

    font-size: clamp(40px, 4.5vw, 66px);
    font-weight: 840;
    line-height: 1.04;
    letter-spacing: -2.5px;
}

.home-purpose-panorama__content {
    position: relative;
    z-index: 2;

    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        170px
        minmax(0, 1fr);
    align-items: center;
    gap: 38px;
}

.home-purpose-panorama__statement {
    min-height: 330px;
    padding: 34px;

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.075),
            rgba(255, 255, 255, 0.025)
        );

    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--eit-radius-md);

    backdrop-filter: blur(14px);
}

.home-purpose-panorama__index {
    color: var(--eit-teal-400);

    font-size: 10px;
    font-weight: 850;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.home-purpose-panorama__statement h3 {
    margin: 22px 0 20px;

    font-size: 18px;
    font-weight: 820;
}

.home-purpose-panorama__statement blockquote {
    margin: 0;

    color: rgba(255, 255, 255, 0.84);

    font-size: clamp(22px, 2.2vw, 32px);
    font-weight: 690;
    line-height: 1.33;
    letter-spacing: -0.8px;
}

.home-purpose-panorama__bridge {
    position: relative;

    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;

    min-height: 300px;
}

.home-purpose-panorama__line {
    position: absolute;
    top: 20px;
    bottom: 65px;
    left: 50%;

    width: 1px;

    background:
        linear-gradient(
            180deg,
            transparent,
            var(--eit-teal-400) 30%,
            var(--eit-blue-600) 70%,
            transparent
        );
}

.home-purpose-panorama__core {
    position: relative;
    z-index: 2;

    display: grid;
    place-items: center;

    width: 76px;
    height: 76px;

    background: var(--eit-navy-900);
    border: 1px solid rgba(0, 216, 199, 0.35);
    border-radius: 50%;

    box-shadow:
        0 0 0 12px rgba(0, 216, 199, 0.05),
        0 0 40px rgba(0, 216, 199, 0.28);
}

.home-purpose-panorama__core span {
    width: 30px;
    height: 30px;

    background:
        radial-gradient(
            circle at 35% 30%,
            var(--eit-teal-300),
            var(--eit-teal-500) 44%,
            var(--eit-blue-700)
        );

    border-radius: 50%;

    box-shadow: 0 0 24px rgba(0, 216, 199, 0.7);
}

.home-purpose-panorama__bridge small {
    position: absolute;
    right: -15px;
    bottom: 0;
    left: -15px;

    color: rgba(255, 255, 255, 0.42);
    text-align: center;

    font-size: 10px;
    font-weight: 700;
    line-height: 1.5;
    text-transform: uppercase;
}

.home-purpose-panorama__bridge strong {
    color: var(--eit-teal-400);
}


/* =========================================================
   10. Публикации
   ========================================================= */

.home-publications {
    background:
        radial-gradient(
            circle at 92% 15%,
            rgba(0, 216, 199, 0.07),
            transparent 28%
        ),
        var(--eit-background);
}

.home-publications__grid {
    display: grid;
    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(360px, 0.85fr);
    gap: 20px;
}

.home-publications__secondary {
    display: grid;
    gap: 20px;
}

.home-publication-card {
    position: relative;

    display: flex;
    flex-direction: column;

    padding: 34px;

    overflow: hidden;

    background: var(--eit-surface);
    border: 1px solid var(--eit-border);
    border-radius: var(--eit-radius-md);

    box-shadow: var(--eit-shadow-sm);

    transition:
        transform var(--eit-transition),
        border-color var(--eit-transition),
        box-shadow var(--eit-transition);
}

.home-publication-card::after {
    content: "";

    position: absolute;
    right: -75px;
    bottom: -90px;

    width: 200px;
    height: 200px;

    border: 30px solid rgba(0, 184, 176, 0.05);
    border-radius: 50%;
}

.home-publication-card:hover {
    border-color: rgba(0, 184, 176, 0.3);
    box-shadow: var(--eit-shadow-md);

    transform: translateY(-6px);
}

.home-publication-card--featured {
    min-height: 500px;

    color: var(--eit-white);

    background:
        radial-gradient(
            circle at 86% 20%,
            rgba(0, 216, 199, 0.17),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            var(--eit-navy-800),
            var(--eit-navy-950)
        );

    border-color: rgba(0, 216, 199, 0.14);
}

.home-publication-card--compact {
    min-height: 240px;
}

.home-publication-card__type {
    position: relative;
    z-index: 2;

    color: var(--eit-teal-600);

    font-size: 10px;
    font-weight: 850;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.home-publication-card--featured .home-publication-card__type {
    color: var(--eit-teal-400);
}

.home-publication-card h3 {
    position: relative;
    z-index: 2;

    margin: 42px 0 18px;

    color: var(--eit-text);

    font-size: 27px;
    font-weight: 830;
    line-height: 1.18;
    letter-spacing: -0.9px;
}

.home-publication-card--featured h3 {
    max-width: 720px;

    color: var(--eit-white);

    font-size: clamp(38px, 4vw, 58px);
    line-height: 1.07;
    letter-spacing: -2px;
}

.home-publication-card--compact h3 {
    margin-top: 26px;
}

.home-publication-card p {
    position: relative;
    z-index: 2;

    max-width: 720px;
    margin: 0;

    color: var(--eit-text-muted);

    font-size: 15px;
    line-height: 1.73;
}

.home-publication-card--featured p {
    color: rgba(255, 255, 255, 0.59);

    font-size: 17px;
}

.home-publication-card__meta {
    position: relative;
    z-index: 2;

    margin-top: auto;
    padding-top: 30px;

    color: rgba(96, 116, 131, 0.7);

    font-size: 12px;
    font-weight: 700;
}

.home-publication-card--featured .home-publication-card__meta {
    color: rgba(255, 255, 255, 0.38);
}


/* =========================================================
   11. CTA
   ========================================================= */

.home-project-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;

    margin-top: 28px;
}

.home-project-trust span {
    padding: 8px 11px;

    color: rgba(255, 255, 255, 0.57);

    background: rgba(255, 255, 255, 0.045);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 9px;

    font-size: 11px;
    font-weight: 700;
}


/* =========================================================
   12. Появление элементов
   ========================================================= */

body.home-motion-ready .home-reveal {
    opacity: 0;

    transform: translateY(24px);

    transition:
        opacity 700ms cubic-bezier(0.22, 1, 0.36, 1),
        transform 700ms cubic-bezier(0.22, 1, 0.36, 1);
}

body.home-motion-ready .home-reveal.is-visible {
    opacity: 1;

    transform: translateY(0);
}


/* =========================================================
   13. Анимации
   ========================================================= */

@keyframes home-orbit {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@keyframes home-orbit-reverse {
    from {
        transform: rotate(360deg);
    }

    to {
        transform: rotate(0deg);
    }
}


/* =========================================================
   14. Адаптивность
   ========================================================= */

@media (max-width: 1199.98px) {
    .home-industries__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-pillars__stage {
        grid-template-areas:
            "services information"
            "emblem emblem"
            "technology technology";
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-pillars__emblem {
        margin-top: 25px;
        margin-bottom: 25px;
    }

    .home-solutions__layout {
        grid-template-columns: 1fr;
    }

    .home-solution-card--featured {
        min-height: 520px;
    }

    .home-infrastructure-card {
        grid-template-columns:
            minmax(300px, 0.85fr)
            minmax(350px, 1.15fr);
    }

    .home-infrastructure-card .home-text-link {
        grid-column: 1 / -1;
    }

    .home-process__timeline {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        row-gap: 50px;
    }

    .home-process__timeline::before {
        display: none;
    }

    .home-proof__grid {
        grid-template-areas:
            "experience experience"
            "products engineering"
            "lifecycle lifecycle"
            "confidentiality scale";
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-proof-card--confidentiality {
        min-height: 260px;
    }

    .home-purpose-panorama__content {
        grid-template-columns:
            minmax(0, 1fr)
            120px
            minmax(0, 1fr);
        gap: 25px;
    }
}

@media (max-width: 991.98px) {
    .eit-hero {
        min-height: auto;
        padding-top: 130px;
    }

    .home-section {
        padding: 86px 0;
    }

    .home-section-heading {
        grid-template-columns: 1fr;
        gap: 22px;

        margin-bottom: 46px;
    }

    .home-section-heading > p {
        max-width: 730px;
    }

    .home-pillar-panel {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .home-products__grid {
        grid-template-columns: 1fr;
    }

    .home-infrastructure-card {
        grid-template-columns: 1fr;
    }

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

    .home-purpose-panorama {
        padding: 48px;
    }

    .home-purpose-panorama__content {
        grid-template-columns: 1fr;
    }

    .home-purpose-panorama__bridge {
        min-height: 150px;
    }

    .home-purpose-panorama__line {
        top: 50%;
        right: 20px;
        bottom: auto;
        left: 20px;

        width: auto;
        height: 1px;

        background:
            linear-gradient(
                90deg,
                transparent,
                var(--eit-teal-400) 30%,
                var(--eit-blue-600) 70%,
                transparent
            );
    }

    .home-purpose-panorama__bridge small {
        bottom: -4px;
    }

    .home-publications__grid {
        grid-template-columns: 1fr;
    }

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

@media (max-width: 767.98px) {
    .eit-hero {
        padding-top: 118px;
    }

    .home-section {
        padding: 68px 0;
    }

    .home-section-heading h2 {
        font-size: 38px;
        letter-spacing: -1.5px;
    }

    .home-industries__grid {
        grid-template-columns: 1fr;
    }

    .home-industry-card {
        min-height: 270px;
    }

    .home-pillars__stage {
        grid-template-areas:
            "emblem"
            "services"
            "information"
            "technology";
        grid-template-columns: 1fr;
    }

    .home-pillars__emblem {
        width: 220px;
    }

    .home-pillar-card[data-pillar="technology"] {
        max-width: none;
    }

    .home-pillar-panel {
        padding: 28px;
    }

    .home-pillar-panel__list {
        grid-template-columns: 1fr;
    }

    .home-solutions__secondary {
        grid-template-columns: 1fr;
    }

    .home-solution-card--featured {
        min-height: 540px;
    }

    .home-infrastructure-card {
        padding: 30px;
    }

    .home-infrastructure-card__features {
        grid-template-columns: 1fr;
    }

    .home-process__timeline {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .home-process-step {
        display: grid;
        grid-template-columns: auto 1fr;
        grid-template-areas:
            "node number"
            "node title"
            "node text";
        column-gap: 20px;

        text-align: left;
    }

    .home-process-step__number {
        grid-area: number;
    }

    .home-process-step__node {
        grid-area: node;

        margin: 0;
    }

    .home-process-step h3 {
        grid-area: title;

        margin-top: 5px;
    }

    .home-process-step p {
        grid-area: text;
    }

    .home-process__formula {
        flex-wrap: wrap;
        gap: 11px;

        border-radius: var(--eit-radius-md);

        font-size: 11px;
    }

    .home-proof__grid {
        grid-template-areas:
            "experience"
            "products"
            "engineering"
            "lifecycle"
            "confidentiality"
            "scale";
        grid-template-columns: 1fr;
    }

    .home-proof-card--experience {
        min-height: 440px;
    }

    .home-proof-card--experience .home-proof-card__number {
        font-size: 82px;
    }

    .home-proof-card--confidentiality {
        min-height: 250px;
    }

    .home-purpose {
        padding-top: 10px;
    }

    .home-purpose-panorama {
        padding: 34px 25px;
    }

    .home-purpose-panorama__heading {
        margin-bottom: 45px;
    }

    .home-purpose-panorama__heading h2 {
        font-size: 40px;
    }

    .home-purpose-panorama__statement {
        min-height: auto;
        padding: 28px;
    }

    .home-purpose-panorama__statement blockquote {
        font-size: 25px;
    }

    .home-publications__secondary {
        grid-template-columns: 1fr;
    }

    .home-publication-card--featured {
        min-height: 450px;
    }
}

@media (max-width: 575.98px) {
    .home-industry-card,
    .home-solution-card,
    .home-product-card,
    .home-proof-card,
    .home-publication-card {
        padding: 26px;
    }

    .home-solution-card--featured {
        min-height: 560px;
    }

    .home-product-card {
        min-height: 410px;
    }

    .home-infrastructure-card h3 {
        font-size: 28px;
    }

    .home-proof-card--experience h3 {
        font-size: 38px;
    }

    .home-publication-card--featured h3 {
        font-size: 40px;
    }
}


/* =========================================================
   15. Отключение анимаций
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .home-pillars__orbit {
        animation: none;
    }

    body.home-motion-ready .home-reveal {
        opacity: 1;

        transform: none;
    }
}