

@media (prefers-reduced-motion: reduce) {
    * {
        transition-duration: 0.001ms !important;
        animation-duration: 0.001ms !important;
    }
}

/* ---------- header ---------- */
.header .container {
    transition: all .4s ease, margin-top .4s ease, box-shadow .4s ease;
}

.header.is-scrolled .container {
    background: rgba(0, 0, 0, 0.45);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.35);
}

.nav-list-item a {
    position: relative;
    padding-bottom: 2px;
    color: var(--light);
}

.nav-list-item a::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 0;
    height: 1px;
    background: currentColor;
    transition: width .3s ease;
}

.nav-list-item a:hover::after {
    width: 100%;
}

.action {
    transition: all .3s ease, color .3s ease, transform .3s ease;
}

.action:hover {
    color: #111;
    transform: translateY(-2px);
}

/* ---------- buttons ---------- */
.button-action {
    transition: transform .3s ease, all .3s ease, box-shadow .3s ease;
}

.button-action:hover {
    transform: translateY(-3px);
    background: rgba(255, 255, 255, 0.75);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35);
}

.button-action:active {
    transform: translateY(0);
}



/* ---------- hero: буквы заголовка ---------- */
.hero-title .char-mask {
    display: inline-block;
    overflow: hidden;
    vertical-align: bottom;
}

.hero-title .char {
    display: inline-block;
    transform: translateY(120%);
    opacity: 0;
    transition: transform 1.5s cubic-bezier(.16, .8, .24, 1), opacity 1.5s ease;
    will-change: transform, opacity;
}

.hero-title .char.is-visible {
    transform: translateY(0);
    opacity: 1;
}

/* ---------- hero: соцсети / карточки ---------- */
.hero-socials a {
    display: inline-flex;
    transition: transform .9s ease, opacity .9s ease;
}

.hero-socials a:hover {
    transform: translateX(4px) scale(1.1);
    opacity: .8;
}

.card-item {
    transition: transform .45s cubic-bezier(.16, .8, .24, 1), box-shadow .45s ease;
}

.card-item img {
    transition: transform .6s ease, filter .6s ease;
}

.card-item:hover {
    transform: translateY(-10px);
}

.card-item:hover img {
    transform: scale(1.1);
    filter: brightness(90%);
}

/* ---------- generic reveal (появление hero + ниже по скроллу) ---------- */
.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity .8s cubic-bezier(.16, .8, .24, 1), transform .8s cubic-bezier(.16, .8, .24, 1);
    will-change: opacity, transform;
}

.reveal.reveal-left {
    transform: translateX(-50px);
}

.reveal.reveal-right {
    transform: translateX(50px);
}

.reveal.reveal-scale {
    transform: translateY(20px) scale(0.9);
}

.reveal.is-visible {
    opacity: 1;
    transform: none;
}

/* ---------- заголовки секций (About / Included) ---------- */
/* 1. Плавное появление всего текстового блока */
.main-title {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 1.5s ease, transform 1.5s ease;
}

.main-title.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.title-line path {
    stroke: #fff;
    stroke-width: 1;
    fill: none;
     stroke-dasharray: 1000; 
}

.title-line.line-right {
    transform: scaleX(-1);
}


.main-title.is-visible .title-line path {
    animation: draw 2.8s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes draw {

   from {
    stroke-dashoffset: -1000;
   }

    to {
        stroke-dashoffset: 0;
    }

  
}


/* ---------- about / timeline ---------- */
.photo-group img {
    transition: transform .5s ease, box-shadow .5s ease;
}

.photo-group:hover img {
    transform: translateY(-6px) scale(1.04);
    box-shadow: 0 14px 26px rgba(0, 0, 0, 0.55);
}

.timeline-line {
    transform: scaleY(0);
    transform-origin: top center;
    transition: transform 1.1s cubic-bezier(.22, .9, .32, 1);
}

.timeline.is-visible .timeline-line {
    transform: scaleY(1);
}

.timeline-item {
    opacity: 0;
    transform: translateY(-18px);
    transition: opacity 1s ease, transform 1s ease;
}

.timeline.is-visible .timeline-item {
    opacity: 1;
    transform: translateY(0);
}

.timeline.is-visible .timeline-item:nth-child(2) {
    transition-delay: .25s;
}

.timeline.is-visible .timeline-item:nth-child(3) {
    transition-delay: .5s;
}

.timeline-dot {
    transform: translate(-50%, -50%) scale(0);
    transition: transform .45s cubic-bezier(.34, 1.56, .64, 1);
}

.timeline.is-visible .timeline-item:nth-child(1) .timeline-dot {
    transition-delay: .15s;
}

.timeline.is-visible .timeline-item:nth-child(2) .timeline-dot {
    transition-delay: .4s;
}

.timeline.is-visible .timeline-item:nth-child(3) .timeline-dot {
    transition-delay: .65s;
}

.timeline.is-visible .timeline-dot {
    transform: translate(-50%, -50%) scale(1);
}

/* ---------- карточки Included ---------- */
.block-card {
    transition: transform .3s ease, all .3s ease, border-color .3s ease, box-shadow .3s ease;
}

.block-card:hover {
    transform: translateY(-8px);
    background: rgba(255, 255, 255, 0.16);
    border-color: rgba(255, 255, 255, 1);
    box-shadow: 0 16px 32px rgba(0, 0, 0, 0.35);
}

.block-card img {
    transition: transform .4s ease;
}

.block-card:hover img {
    transform: scale(1.12) rotate(-4deg);
}

/* ---------- форма ---------- */
.contact-form input,
.contact-form textarea {
    transition: border-color .3s ease, transform .3s ease;
}

.contact-form input:focus,
.contact-form textarea:focus {
    transform: translateX(4px);
}

.contact-form .button-action {
    transition: transform .3s ease, opacity .3s ease;
}

/* ---------- footer ---------- */
.footer-icon a {
    transition: transform .3s ease, box-shadow .3s ease, opacity .3s ease;
}

.footer-icon a:hover {
    transform: translateY(-4px) scale(1.08);
}