/*---------------------------------
Hero
---------------------------------*/
.section-hero .img-container:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg,rgb(from var(--global-color-bg) r g b / 1) 0%, rgb(from var(--global-color-bg) r g b / 0.05) 40%);
    pointer-events: none;
}

/*---------------------------------
Projets
---------------------------------*/
.project{
    --max-font: var(--margin-max);	--min-font: var(--margin-min);
    display:grid;
    grid-template-columns:.5fr 1fr;
    gap: calc(var(--getSize) * .5);
    row-gap: calc(var(--getSize) * .3);
    width: 100%;
}

.project .intro{
    --max-font: var(--margin-max);	--min-font: var(--margin-min);
    position: relative;
    align-self: start;
    padding-left: calc(var(--getSize) * .75);
    padding-top: 0;
    padding-bottom: 0;
    padding-right: 0;
}

.project .intro::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    bottom:calc(var(--getSize) * .5);
    width:1px;
    background:linear-gradient(var(--global-color-accent),var(--global-color-bg));
}

.project ul
{
    list-style-type: disc;
}

.project li::marker {
    color: var(--global-color-accent);
}

.project li
{
    margin-left: calc(var(--getSize) * 1);
}

.project a:hover{
    cursor: pointer;
}

.project a{
    width: calc(var(--getSize) * 13.5);
    justify-content: space-between;
}

.project.is-open .arrow{
    transform:rotate(45deg);
}

.project-hero{
    --max-font: var(--margin-max);	--min-font: var(--margin-min);
    height:calc(var(--getSize) * 5);
    overflow:hidden;
    position:relative;
    border:1px solid var(--global-color-line);
}

.project-hero:hover{
    cursor: pointer;
}

.project .gallery{
    --max-font: var(--margin-max);	--min-font: var(--margin-min);
    display:grid;
    grid-template-columns: repeat(1, 1fr);
    gap: calc(var(--getSize) * .1);
    width: 100%;
}

.project .gallery div{
    border: 1px solid var(--global-color-line);
}

.project-hero img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    transition:
        transform calc(var(--transition-time) * 2) var(--ease),
        filter calc(var(--transition-time) * 2) var(--ease);
}

.project-reveal{
    display:grid;
    grid-template-rows:0fr;
    opacity:0;
    transition:
      grid-template-rows calc(var(--transition-time) * 2) var(--ease),
      opacity calc(var(--transition-time) * 2) var(--ease) .05s;
}

.project-reveal-inner{
    min-height:0;
    overflow:hidden;
}

.project.is-open .project-reveal{
    grid-template-rows:1fr;
    opacity:1;
}

.project .text-columns{
    --max-font: var(--margin-max);	--min-font: var(--margin-min);
    column-count: 2;
    column-gap: calc(var(--getSize) * .5);
    column-fill: balance;
}

.project .text-columns > :first-child{
    margin-top: 0;
}

.project .text-columns > :last-child{
    margin-bottom: 0;
}

.project .gallery img{
    width: 100%;
    height: auto;
}

@media (max-width: 1000px) {
	.project {
		grid-template-columns: repeat(1, 1fr);
	}
}