/* ================================================
   Polat İşkembe — Modern Frontend
   ================================================ */

/* ---- Base ---- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

::selection{background:#c9a84c;color:#100e0b}

/* ---- Grain Texture ---- */
.grain{
    position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.035;
    background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
    background-repeat:repeat;
}

/* ---- Section Dividers ---- */
.section-divider{
    position:absolute;top:0;left:0;width:100%;height:1px;
    background:linear-gradient(90deg,transparent,rgba(201,168,76,.15),transparent);
}

.section-label{
    display:inline-block;
    color:#c9a84c;
    font-size:.7rem;
    font-weight:600;
    letter-spacing:.3em;
    text-transform:uppercase;
    margin-bottom:1.25rem;
}

/* ================================================
   NAVBAR
   ================================================ */
#site-header{
    background:transparent;
}
#site-header.scrolled{
    background:rgba(16,14,11,.92);
    backdrop-filter:blur(20px) saturate(1.4);
    -webkit-backdrop-filter:blur(20px) saturate(1.4);
    border-bottom:1px solid rgba(201,168,76,.06);
}

.nav-link::after{
    content:'';position:absolute;bottom:0;left:50%;width:0;height:1px;
    background:#c9a84c;transition:all .3s;transform:translateX(-50%);
}
.nav-link:hover::after,.nav-link.active::after{width:60%}

/* Hamburger */
.hamburger{width:22px;height:14px;position:relative;cursor:pointer}
.hamburger span{
    display:block;position:absolute;left:0;width:100%;height:1.5px;
    background:#e8d5b0;transition:all .35s cubic-bezier(.77,0,.175,1);
}
.hamburger span:nth-child(1){top:0}
.hamburger span:nth-child(2){top:50%;transform:translateY(-50%)}
.hamburger span:nth-child(3){bottom:0;width:60%}

.hamburger.open span:nth-child(1){top:50%;transform:translateY(-50%) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0;transform:translateX(10px)}
.hamburger.open span:nth-child(3){bottom:50%;width:100%;transform:translateY(50%) rotate(-45deg)}

/* Mobile Menu */
.mobile-menu{
    position:fixed;inset:0;z-index:45;
    background:rgba(16,14,11,.97);
    backdrop-filter:blur(30px);
    -webkit-backdrop-filter:blur(30px);
    opacity:0;visibility:hidden;
    transition:all .5s cubic-bezier(.77,0,.175,1);
}
.mobile-menu.open{opacity:1;visibility:visible}
.mobile-menu-inner{height:100%;overflow-y:auto}

.mobile-nav-link{
    opacity:0;transform:translateY(20px);
    transition:all .4s cubic-bezier(.77,0,.175,1);
}
.mobile-menu.open .mobile-nav-link{opacity:1;transform:translateY(0)}
.mobile-menu.open .mobile-nav-link:nth-child(1){transition-delay:.1s}
.mobile-menu.open .mobile-nav-link:nth-child(2){transition-delay:.15s}
.mobile-menu.open .mobile-nav-link:nth-child(3){transition-delay:.2s}
.mobile-menu.open .mobile-nav-link:nth-child(4){transition-delay:.25s}
.mobile-menu.open .mobile-nav-link:nth-child(5){transition-delay:.3s}

/* ================================================
   HERO SLIDER
   ================================================ */
.slider{position:absolute;inset:0}

.slide{
    position:absolute;inset:0;
    opacity:0;visibility:hidden;
    transition:opacity 1.2s cubic-bezier(.4,0,.2,1), visibility 1.2s;
}
.slide.active{opacity:1;visibility:visible}

.slide-img{
    position:absolute;inset:0;
    background-size:cover;background-position:center;
    transform:scale(1.05);
    transition:transform 8s cubic-bezier(.25,.46,.45,.94);
}
.slide.active .slide-img{transform:scale(1)}

.slide-title{
    opacity:0;transform:translateY(30px);
    transition:all .8s cubic-bezier(.4,0,.2,1) .3s;
}
.slide-subtitle{
    opacity:0;transform:translateY(20px);
    transition:all .8s cubic-bezier(.4,0,.2,1) .5s;
}
.slide-cta{
    opacity:0;transform:translateY(20px);
    transition:all .8s cubic-bezier(.4,0,.2,1) .7s;
}
.slide.active .slide-title,
.slide.active .slide-subtitle,
.slide.active .slide-cta{
    opacity:1;transform:translateY(0);
}

/* Slider Controls */
.slider-dot{
    width:24px;height:2px;
    background:rgba(232,213,176,.25);border:none;
    cursor:pointer;transition:all .4s;padding:0;
}
.slider-dot.active{
    width:40px;background:#c9a84c;
}

.slider-arrow{
    width:44px;height:44px;
    display:flex;align-items:center;justify-content:center;
    border:1px solid rgba(232,213,176,.2);
    background:rgba(16,14,11,.4);
    backdrop-filter:blur(8px);
    color:#e8d5b0;cursor:pointer;
    transition:all .3s;
}
.slider-arrow:hover{
    background:#c9a84c;color:#100e0b;border-color:#c9a84c;
}

/* Scroll indicator line */
.scroll-line{
    width:1px;height:50px;
    background:linear-gradient(to bottom,transparent,#c9a84c);
    animation:scrollPulse 2s ease-in-out infinite;
}
@keyframes scrollPulse{
    0%,100%{opacity:.3;transform:scaleY(.6)}
    50%{opacity:1;transform:scaleY(1)}
}

/* ================================================
   MENU
   ================================================ */
.menu-tab{
    padding:.5rem 1.25rem;
    font-size:.8rem;
    font-weight:500;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:rgba(181,164,142,.6);
    background:transparent;
    border:1px solid rgba(181,164,142,.12);
    cursor:pointer;
    transition:all .3s;
}
.menu-tab:hover{
    color:#e8d5b0;
    border-color:rgba(181,164,142,.3);
}
.menu-tab.active{
    background:#c9a84c;
    color:#100e0b;
    border-color:#c9a84c;
}

.menu-item{
    padding-bottom:1.25rem;
    border-bottom:1px solid rgba(61,50,42,.4);
    transition:all .3s;
}
.menu-item:hover{
    padding-left:.5rem;
}

/* ================================================
   GALLERY
   ================================================ */
.gallery-masonry{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:.75rem;
}
@media(min-width:768px){
    .gallery-masonry{
        grid-template-columns:repeat(3,1fr);
        gap:1rem;
    }
    .gallery-masonry .gallery-item:nth-child(4n+1){
        grid-row:span 2;
    }
}
@media(min-width:1024px){
    .gallery-masonry{
        grid-template-columns:repeat(4,1fr);
    }
}

.gallery-item{
    position:relative;overflow:hidden;cursor:pointer;
    aspect-ratio:1;
}
.gallery-masonry .gallery-item:nth-child(4n+1){
    aspect-ratio:auto;
}

.gallery-item img{
    width:100%;height:100%;object-fit:cover;
    transition:transform .7s cubic-bezier(.4,0,.2,1),filter .5s;
    filter:grayscale(.2);
}
.gallery-item:hover img{
    transform:scale(1.08);filter:grayscale(0);
}

.gallery-overlay{
    position:absolute;inset:0;
    display:flex;align-items:center;justify-content:center;
    background:rgba(16,14,11,.5);
    opacity:0;transition:opacity .4s;
}
.gallery-item:hover .gallery-overlay{opacity:1}

/* Lightbox */
.lightbox{
    display:none;position:fixed;inset:0;z-index:9998;
    background:rgba(16,14,11,.97);
    align-items:center;justify-content:center;
    backdrop-filter:blur(20px);
}
.lightbox.active{display:flex}
.lightbox img{
    max-width:90vw;max-height:88vh;object-fit:contain;
    animation:lbFadeIn .4s;
}
@keyframes lbFadeIn{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}

.lightbox-close{
    position:absolute;top:1.5rem;right:1.5rem;
    width:44px;height:44px;
    display:flex;align-items:center;justify-content:center;
    color:#e8d5b0;background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.1);
    cursor:pointer;transition:all .3s;z-index:10;
}
.lightbox-close:hover{
    background:#c9a84c;color:#100e0b;border-color:#c9a84c;
}

/* ================================================
   CONTACT FORM — Floating Labels
   ================================================ */
.form-group{
    position:relative;
}
.form-group input,
.form-group textarea{
    width:100%;
    padding:1.25rem 0 .75rem;
    background:transparent;
    border:none;
    border-bottom:1px solid rgba(181,164,142,.15);
    color:#e8d5b0;
    font-size:.95rem;
    font-family:inherit;
    outline:none;
    transition:border-color .3s;
    resize:none;
}
.form-group input:focus,
.form-group textarea:focus{
    border-bottom-color:#c9a84c;
}

.form-group label{
    position:absolute;
    left:0;top:1.25rem;
    font-size:.95rem;
    color:rgba(181,164,142,.4);
    pointer-events:none;
    transition:all .3s cubic-bezier(.4,0,.2,1);
    transform-origin:left;
}
.form-group input:focus + label,
.form-group input:not(:placeholder-shown) + label,
.form-group textarea:focus + label,
.form-group textarea:not(:placeholder-shown) + label{
    top:0;
    font-size:.7rem;
    letter-spacing:.15em;
    text-transform:uppercase;
    color:#c9a84c;
}

/* ================================================
   SOCIAL ICONS
   ================================================ */
.social-icon{
    width:40px;height:40px;
    display:flex;align-items:center;justify-content:center;
    border:1px solid rgba(181,164,142,.15);
    color:rgba(232,213,176,.5);
    font-size:.9rem;
    transition:all .3s;
}
.social-icon:hover{
    background:#c9a84c;color:#100e0b;border-color:#c9a84c;
}

/* ================================================
   WHATSAPP & SCROLL TOP
   ================================================ */
.whatsapp-btn{
    position:fixed;bottom:6.5rem;right:1.5rem;z-index:50;
    width:52px;height:52px;
    display:flex;align-items:center;justify-content:center;
    background:#25d366;color:#fff;
    border-radius:50%;
    box-shadow:0 4px 20px rgba(37,211,102,.3);
    transition:all .3s;
}
.whatsapp-btn:hover{
    transform:scale(1.08);
    box-shadow:0 6px 28px rgba(37,211,102,.4);
}

.scroll-top-btn{
    position:fixed;bottom:1.5rem;right:1.5rem;z-index:50;
    width:44px;height:44px;
    display:flex;align-items:center;justify-content:center;
    background:rgba(16,14,11,.7);
    border:1px solid rgba(201,168,76,.2);
    color:#c9a84c;
    cursor:pointer;
    opacity:0;visibility:hidden;
    transition:all .4s;
    backdrop-filter:blur(8px);
}
.scroll-top-btn.visible{opacity:1;visibility:visible}
.scroll-top-btn:hover{
    background:#c9a84c;color:#100e0b;border-color:#c9a84c;
}

/* ================================================
   REVEAL ANIMATIONS
   ================================================ */
.reveal{
    opacity:0;
    transform:translateY(40px);
    transition:opacity .8s cubic-bezier(.4,0,.2,1),
               transform .8s cubic-bezier(.4,0,.2,1);
}
.reveal.visible{
    opacity:1;
    transform:translateY(0);
}

/* Staggered reveals */
.reveal:nth-child(2){transition-delay:.1s}
.reveal:nth-child(3){transition-delay:.15s}
.reveal:nth-child(4){transition-delay:.2s}
.reveal:nth-child(5){transition-delay:.25s}

/* ================================================
   RESPONSIVE
   ================================================ */
/* Slider bg-position for shorter hero */
.slide-img{
    background-position:center 30%;
}

@media(max-width:768px){
    .slide-title{font-size:2rem!important}
    .gallery-masonry .gallery-item:nth-child(4n+1){
        grid-row:span 1;aspect-ratio:1;
    }
}

@media(max-width:480px){
    .slide-title{font-size:1.75rem!important}
}