/**
 * Home sections — refined editorial presentation
 */

.site-main--home {
    width: 100%;
    max-width: none;
    padding: 0;
}

.home-section {
    position: relative;
    padding-block: clamp(var(--hemik-space-16), 8vw, var(--hemik-space-24));
}

.home-section + .home-section {
    border-block-start: 1px solid var(--hemik-color-border-soft);
}

.home-section__header {
    display: grid;
    gap: var(--hemik-space-5);
    margin-block-end: clamp(var(--hemik-space-8), 4vw, var(--hemik-space-12));
}

.home-section__header--editorial {
    padding-block-end: var(--hemik-space-6);
    border-block-end: 1px solid var(--hemik-color-border-soft);
}

.home-section__eyebrow {
    margin-block-end: var(--hemik-space-3);
    color: var(--hemik-color-brand);
    font-size: var(--hemik-font-size-xs);
    font-weight: var(--hemik-font-weight-semibold);
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.home-section__title {
    max-width: 18ch;
    color: var(--hemik-color-brand-deep);
    font-size: clamp(2rem, 1.55rem + 1.25vw, 3rem);
    letter-spacing: -0.025em;
}

.home-section__description {
    max-width: 40rem;
    color: var(--hemik-color-text-soft);
    font-size: var(--hemik-font-size-md);
    line-height: var(--hemik-line-height-relaxed);
}

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

.home-intro {
    overflow: hidden;
    background: var(--hemik-color-surface);
}

.home-intro::after {
    position: absolute;
    top: 0;
    right: -12rem;
    width: 28rem;
    height: 28rem;
    border-radius: 50%;
    background: radial-gradient(circle, rgb(237 233 254 / 0.52), transparent 66%);
    content: "";
    pointer-events: none;
}

.home-intro__layout {
    position: relative;
    z-index: 1;
    display: grid;
    gap: var(--hemik-space-8);
    align-items: start;
}

.home-intro__statement {
    max-width: 42rem;
}

.home-intro__title {
    max-width: 16ch;
}

.home-intro__copy {
    max-width: 42rem;
    margin: 0;
    color: var(--hemik-color-text-soft);
}

.home-intro__copy > :first-child {
    margin-block-start: 0;
}

.home-intro__pillars {
    position: relative;
    z-index: 1;
    margin-block-start: clamp(var(--hemik-space-10), 5vw, var(--hemik-space-16));
}

.home-pillar {
    position: relative;
    min-height: 18rem;
    padding: clamp(var(--hemik-space-6), 3vw, var(--hemik-space-8));
    overflow: hidden;
    border: 1px solid var(--hemik-color-border-soft);
    border-radius: var(--hemik-radius-xl);
    background: linear-gradient(180deg, var(--hemik-color-surface-elevated), var(--hemik-color-surface-soft));
    box-shadow: 0 1px 0 rgb(255 255 255 / 0.75) inset;
}

.home-pillar::after {
    position: absolute;
    right: -2.5rem;
    bottom: -3rem;
    width: 9rem;
    height: 9rem;
    border: 1px solid rgb(216 180 254 / 0.32);
    border-radius: 50%;
    content: "";
}

.home-pillar__index {
    display: inline-flex;
    width: 2.4rem;
    height: 2.4rem;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--hemik-color-brand-subtle);
    color: var(--hemik-color-brand);
    font-size: var(--hemik-font-size-xs);
    font-weight: var(--hemik-font-weight-semibold);
}

.home-pillar__title {
    margin-block-start: var(--hemik-space-6);
    color: var(--hemik-color-brand-deep);
    font-size: var(--hemik-font-size-2xl);
}

.home-pillar__description {
    max-width: 30rem;
    margin-block-start: var(--hemik-space-3);
    color: var(--hemik-color-text-soft);
    line-height: var(--hemik-line-height-relaxed);
}

/* --------------------------------------------------------------
 * Topics
 * -------------------------------------------------------------- */

.home-topics {
    background: var(--hemik-color-brand-mist);
}

.home-topics__grid,
.home-content__grid {
    align-items: stretch;
}

.home-topics__grid > *,
.home-content__grid > * {
    height: 100%;
}

.home-topics .hemik-card--topic {
    min-height: 17rem;
    border-color: var(--hemik-color-border-soft);
    background: rgb(255 254 255 / 0.82);
}

.home-topics .hemik-card--topic .hemik-card__body {
    padding: var(--hemik-space-6);
}

.home-topics .hemik-card--topic::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--hemik-color-brand), var(--hemik-color-action), transparent 88%);
    content: "";
    opacity: 0.52;
}

/* --------------------------------------------------------------
 * Latest content
 * -------------------------------------------------------------- */

.home-content {
    background: var(--hemik-color-surface);
}

.home-content__grid {
    row-gap: var(--hemik-space-8);
}

.home-content__footer {
    display: flex;
    justify-content: center;
    margin-block-start: var(--hemik-space-10);
}

@media (min-width: 48rem) {
    .home-section__header {
        grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.72fr);
        align-items: end;
        justify-content: space-between;
        gap: var(--hemik-space-10);
    }

    .home-section__description {
        justify-self: end;
    }

    .home-intro__layout {
        grid-template-columns: minmax(0, 1.05fr) minmax(20rem, 0.95fr);
        gap: clamp(var(--hemik-space-10), 7vw, var(--hemik-space-20));
    }
}

@media (max-width: 47.999rem) {
    .home-pillar {
        min-height: auto;
    }
}
