﻿
/* ==============================
   METUKTAKIM - EVENTS PAGE
============================== */

.events-page {
    margin: 0;
    background: #090806;
    color: #f8f3e9;
    overflow-x: hidden;
}

    .events-page *,
    .events-page *::before,
    .events-page *::after {
        box-sizing: border-box;
    }

    .events-page main {
        display: block;
    }

    .events-page h1,
    .events-page h2,
    .events-page h3,
    .events-page p {
        font-family: inherit;
    }

.event-line {
    width: 95px;
    height: 2px;
    background: #c99c48;
    margin: 22px 0;
}

    .event-line.centered {
        margin: 18px auto 45px;
    }

/* HERO */

.event-hero {
    min-height: 590px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 80px 6% 35px;
    background: linear-gradient( 270deg, rgba(0,0,0,.94) 0%, rgba(0,0,0,.70) 38%, rgba(0,0,0,.18) 100% ), url("images/event-photo1.jpeg") center center / cover no-repeat;
}

.event-hero-content {
    max-width: 650px;
}

.event-eyebrow {
    color: #e0bd78;
    font-size: 17px;
    letter-spacing: 1px;
}

.event-hero h1 {
    margin: 16px 0;
    font-size: clamp(48px, 6vw, 88px);
    color: #e7b95e;
    line-height: 1.2;
}

.event-hero-content p {
    max-width: 550px;
    font-size: 27px;
    line-height: 1.65;
    margin-bottom: 28px;
}

.event-hero-btn {
    display: inline-block;
    padding: 13px 32px;
    background: #d9ad5a;
    color: #17110a;
    border-radius: 30px;
    text-decoration: none;
    font-size: 17px;
    font-weight: 700;
    transition: .3s;
}

    .event-hero-btn:hover {
        background: #f1ce86;
        transform: translateY(-3px);
    }

.event-hero-features {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    max-width: 1000px;
    width: 100%;
    margin: 65px auto 0;
    text-align: center;
}

    .event-hero-features > div {
        padding: 5px 18px;
        border-left: 1px solid #b68a3e;
    }

        .event-hero-features > div:last-child {
            border-left: none;
        }

    .event-hero-features span {
        display: block;
        color: #e0b55e;
        font-size: 39px;
        margin-bottom: 8px;
    }

    .event-hero-features p {
        font-size: 19px;
        line-height: 1.5;
        margin: 0;
    }

/* INTRO */

.event-intro {
    background: #f6f0e6;
    color: #292015;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 65px;
    padding: 70px 7%;
}

.event-intro-text {
    max-width: 620px;
}

.event-small-title {
    color: #aa7b31;
    font-size: 18px;
}

.event-intro h2,
.event-video-text h2 {
    font-size: clamp(32px, 3.5vw, 48px);
    color: #ae7b2f;
    margin: 12px 0;
}

.event-intro p {
    font-size: 20px;
    line-height: 1.9;
}

.event-intro-image {
    width: 100%;
    height: 380px;
    overflow: hidden;
    border: 1px solid #cba75f;
    box-shadow: 0 12px 35px #0002;
}

    .event-intro-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

/* PROCESS */

.event-process {
    padding: 80px 5%;
    text-align: center;
    background: linear-gradient( rgba(5,4,3,.90), rgba(5,4,3,.94) ), url("images/hall.png") center / cover no-repeat;
}

    .event-process h2 {
        font-size: 43px;
        color: #e3b55e;
        margin: 0;
    }

.event-process-grid {
    max-width: 1250px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.event-step {
    position: relative;
    padding: 38px 20px 25px;
    border: 1px solid #8f6a30;
    border-radius: 8px;
    background: rgba(12,10,8,.66);
    transition: transform .3s, border-color .3s;
}

    .event-step:hover {
        transform: translateY(-6px);
        border-color: #e0b55e;
    }

.event-step-number {
    position: absolute;
    top: -18px;
    right: 50%;
    transform: translateX(50%);
    background: #dcb05b;
    color: #130f09;
    border-radius: 25px;
    padding: 6px 16px;
    font-size: 18px;
    font-weight: bold;
}

.event-step-icon {
    color: #e3b55e;
    font-size: 46px;
    margin-bottom: 16px;
}

.event-step h3 {
    color: #e3b55e;
    font-size: 23px;
    margin: 0 0 14px;
}

.event-step p {
    font-size: 18px;
    line-height: 1.8;
    margin: 0;
}

/* BENEFITS */

.event-benefits {
    padding: 70px 6%;
    background: #f7f1e8;
    color: #292015;
    text-align: center;
}

    .event-benefits h2 {
        font-size: 42px;
        color: #ae7b2f;
        margin: 0;
    }

.event-benefits-grid {
    max-width: 1250px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.event-benefit {
    padding: 12px 28px;
    border-left: 1px solid #c9a66d;
}

    .event-benefit:last-child {
        border-left: none;
    }

    .event-benefit span {
        display: block;
        color: #ad7c32;
        font-size: 45px;
        margin-bottom: 10px;
    }

    .event-benefit h3 {
        color: #a9782d;
        font-size: 23px;
        margin: 10px 0;
    }

    .event-benefit p {
        font-size: 18px;
        line-height: 1.7;
    }

/* VIDEO */

.event-video-section {
    padding: 75px 7%;
    background: #17120d;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 65px;
}

.event-video-text h2 {
    color: #e0b55e;
}

.event-video-text p {
    font-size: 20px;
    line-height: 1.9;
}

.event-video-frame {
    height: 390px;
    overflow: hidden;
    border-radius: 10px;
    border: 1px solid #bd934c;
    background: #000;
    box-shadow: 0 15px 40px #0007;
}

    .event-video-frame video {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

/* GALLERY */

.event-gallery {
    padding: 65px 5%;
    background: #f7f1e8;
    text-align: center;
}

    .event-gallery h2 {
        color: #a9782d;
        font-size: 39px;
        margin: 0;
    }

.event-gallery-grid {
    max-width: 1300px;
    margin: auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

    .event-gallery-grid img {
        display: block;
        width: 100%;
        height: 300px;
        object-fit: cover;
        transition: transform .3s;
    }

        .event-gallery-grid img:hover {
            transform: scale(1.025);
        }

/* CONTACT */

.event-contact {
    padding: 75px 20px;
    text-align: center;
    background: #f3eadc;
    color: #231b12;
    border-top: 1px solid #c9a66d;
}

    .event-contact h2 {
        font-size: 40px;
        color: #a9782d;
        margin: 0 0 15px;
    }

    .event-contact p {
        font-size: 21px;
    }

.event-contact-buttons {
    display: flex;
    justify-content: center;
    gap: 18px;
    flex-wrap: wrap;
    margin-top: 30px;
}

.event-contact-btn {
    display: inline-block;
    padding: 14px 30px;
    border: 2px solid #b98b42;
    background: #b98b42;
    color: #fff;
    border-radius: 30px;
    font-size: 18px;
    font-weight: 700;
    text-decoration: none;
    transition: .3s;
}

    .event-contact-btn.outline {
        background: transparent;
        color: #8c6329;
    }

    .event-contact-btn:hover {
        background: #1b1510;
        border-color: #1b1510;
        color: #fff;
    }

/* WHATSAPP */

.event-whatsapp {
    position: fixed;
    right: 25px;
    bottom: 25px;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #25d366;
    color: #fff;
    z-index: 200;
    box-shadow: 0 6px 20px #0006;
}

    .event-whatsapp svg {
        width: 35px;
        height: 35px;
    }

/* FOOTER */

.event-footer {
    padding: 24px;
    text-align: center;
    background: #070605;
    color: #d6c7ae;
    font-size: 15px;
}

/* TABLET */

@media (max-width: 950px) {
    .event-intro,
    .event-video-section {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .event-process-grid,
    .event-benefits-grid {
        grid-template-columns: repeat(2, 1fr);
        row-gap: 45px;
    }

    .event-hero-features {
        grid-template-columns: repeat(2, 1fr);
        gap: 25px;
    }
}

/* MOBILE */

@media (max-width: 600px) {
    .event-hero {
        min-height: 580px;
        padding: 60px 22px 35px;
    }

    .event-hero-content p {
        font-size: 21px;
    }

    .event-hero-features p {
        font-size: 16px;
    }

    .event-intro,
    .event-video-section {
        padding: 45px 22px;
    }

    .event-intro-image {
        height: 280px;
    }

    .event-process-grid,
    .event-benefits-grid {
        grid-template-columns: 1fr;
    }

    .event-benefit {
        border-left: none;
        border-bottom: 1px solid #c9a66d;
    }

    .event-video-frame {
        height: 270px;
    }

    .event-gallery-grid {
        grid-template-columns: 1fr;
    }

        .event-gallery-grid img {
            height: 260px;
        }

    .event-contact h2 {
        font-size: 30px;
    }
}

/* תמיכה באותו עיצוב גם בדף סידורי הושבה */
.seating-page .event-hero-content,
.seating-page .event-hero-features,
.seating-page .event-intro-text,
.seating-page .event-process-grid,
.seating-page .event-benefits-grid {
    font-family: inherit;
}
