* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'StratosSkyeng', sans-serif;
    background-color: #0F0804;
}

.header {
    height: 100vh;
    background-image: url(images/13.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.header__overlay {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.50) 80.49%, #0F0804 100%);
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.header__title {
    margin: auto;
    font-size: 96px;
    text-align: center;
    color: white;
    max-width: 658px;
    font-weight: 400;
}

.header__link {
    height: 90px;
    width: 100%;
    background: rgba(255, 255, 255, 0.17);
    backdrop-filter: blur(11.5px);
}

.header__link:hover {
    opacity: .8;
}

.header__anchor {
    text-decoration: none;
    color: white;
    font-size: 24px;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 35px;
    max-width: 1060px;
    margin: 173px auto;
    justify-content: center;
    list-style: none;
}

.gallery__item {
    width: 330px;
    height: 460px;
    position: relative;
    overflow: hidden;
}

.image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.gallery__icons {
    position: absolute;
    bottom: 24px;
    right: 27px;
    display: flex;
    gap: 10px;
    z-index: 10;
}

.gallery__icon {
    width: 45px;
    height: 38px;
    border: none;
    background: transparent;
    cursor: pointer;
    transition: opacity 0.2s;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.gallery__icon_type_favorite {
    width: 35px;
    height: 37px;
    background-image: url('data:image/svg+xml;utf8,<svg width="35" height="37" viewBox="0 0 35 37" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.5 2.5H32.5V34.5L17.5 26.0102L2.5 34.5V2.5Z" fill="white" fill-opacity="0.3" stroke="white" stroke-width="5" stroke-linejoin="round"/></svg>');
}
.gallery__icon_type_like {
    background-image: url('data:image/svg+xml;utf8,<svg width="45" height="38" viewBox="0 0 45 38" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M4.15551 18.1477C3.10891 16.5561 2.5 14.651 2.5 12.6037C2.5 7.02358 7.02358 2.5 12.6037 2.5C16.924 2.5 20.6109 5.21156 22.0556 9.02564C23.5002 5.21156 27.1871 2.5 31.5074 2.5C37.0875 2.5 41.6111 7.02358 41.6111 12.6037C41.6111 14.6527 41.0012 16.5593 39.9529 18.1517C36.1476 24.5937 26.1099 32.3805 22.0554 34.6039C18.0001 32.38 7.95909 24.5905 4.15551 18.1477Z" fill="white" fill-opacity="0.3"/><path d="M4.15551 18.1477L6.30834 16.8767C6.28785 16.842 6.26652 16.8078 6.24437 16.7741L4.15551 18.1477ZM22.0556 9.02564L19.7176 9.91115C20.0857 10.8829 21.0165 11.5256 22.0556 11.5256C23.0947 11.5256 24.0254 10.8829 24.3935 9.91115L22.0556 9.02564ZM39.9529 18.1517L37.8647 16.7772C37.8425 16.811 37.821 16.8454 37.8004 16.8802L39.9529 18.1517ZM22.0554 34.6039L20.8533 36.7959C21.6021 37.2065 22.5087 37.2065 23.2575 36.7959L22.0554 34.6039ZM0 12.6037C0 15.1539 0.760067 17.5343 2.06665 19.5213L6.24437 16.7741C5.45776 15.5779 5 14.1481 5 12.6037H0ZM12.6037 0C5.64287 0 0 5.64287 0 12.6037H5C5 8.40429 8.40429 5 12.6037 5V0ZM24.3935 8.14013C22.5929 3.38633 17.9969 0 12.6037 0V5C15.8511 5 18.6289 7.03678 19.7176 9.91115L24.3935 8.14013ZM31.5074 0C26.1142 0 21.5182 3.38633 19.7176 8.14013L24.3935 9.91115C25.4822 7.03678 28.2601 5 31.5074 5V0ZM44.1111 12.6037C44.1111 5.64287 38.4682 0 31.5074 0V5C35.7068 5 39.1111 8.40429 39.1111 12.6037H44.1111ZM42.0411 19.5263C43.3498 17.5383 44.1111 15.1561 44.1111 12.6037H39.1111C39.1111 14.1494 38.6526 15.5803 37.8647 16.7772L42.0411 19.5263ZM23.2575 36.7959C25.4964 35.5681 29.1685 32.9435 32.736 29.8481C36.2852 26.7685 39.9934 22.9986 42.1054 19.4232L37.8004 16.8802C36.1071 19.7468 32.8938 23.0914 29.4592 26.0715C26.0428 29.0358 22.6689 31.4162 20.8533 32.4119L23.2575 36.7959ZM23.2575 32.4119C21.4416 31.416 18.0666 29.0348 14.6496 26.0697C11.2142 23.0886 8.00071 19.7434 6.30834 16.8767L2.00268 19.4186C4.11389 22.9948 7.8227 26.7657 11.3726 29.8461C14.9408 32.9424 18.6139 35.5679 20.8533 36.7959L23.2575 32.4119Z" fill="white"/></svg>');
}

.gallery__icon:hover {
    opacity: 0.8;
}

.gallery__icon:active {
    opacity: 1;
}

.gallery__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.2s;
    z-index: 5;
    pointer-events: none;
}

.gallery__item:hover .gallery__overlay {
    opacity: 1;
}

.gallery__overlay-text {
    color: white;
    font-size: 24px;
    font-weight: 400;
    text-align: center;
}

.footer {
    height: 100vh;
    background-image: url(./images/7.png);
    background-position: left;
    background-repeat: no-repeat;
    background-size: cover;
}

.footer__overlay {
    display: flex;
    height: 100%;
    width: 100%;
    background: linear-gradient(180deg, #0F0804 0%, rgba(0, 0, 0, 0.6) 100%);
}

.footer__text {
    margin: auto;
    font-size: 40px;
    color: white;
}