/*=========================================================
=                         PROCESS                         =
=========================================================*/

/*---------- Section ----------*/

.process{}

/*---------- Container ----------*/

.process__container{}

/*---------- Header ----------*/

.process__header{
    margin-bottom:var(--space-4);
}

.process__title{}

.process__description{}

/*---------- Grid ----------*/

.process__grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    gap:var(--space-3);
}

/*---------- Step (same visual language as event-card, but not a link) ----------*/

.process-step{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:var(--space-2);
    padding:var(--space-3);
    text-align:center;

    border:1px dashed var(--border-strong);
    border-radius:var(--radius-lg);
    background:var(--surface);
    transition:transform var(--transition-slow), box-shadow var(--transition);
}

.process-step:hover{
    transform:translateY(-6px);
    box-shadow:var(--shadow-sm);
}

.process-step__media{
    width:140px;
    height:140px;
    border-radius:50%;
    overflow:hidden;

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

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

.process-step__media img{
    width:100%;
    height:100%;
    object-fit:contain;   /* No corta la ilustración */
    object-position:center;
    display:block;
}

.process-step__title{
    font-size:1rem;
    text-transform:uppercase;
    letter-spacing:.03em;
    color:var(--primary-dark);
}