:root{--ink:#191b1b;--deep:#242522;--gold:#c6a46c;--gold-light:#ead6b6;--cream:#f6f1e8;--muted:#b7b4ac;--white:#fff;--line:rgba(255,255,255,.19);--max:1216px}
    *{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--white);font-family:'DM Sans',sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}img{max-width:100%;display:block}::selection{background:var(--gold);color:var(--ink)}
    .container{width:min(var(--max),calc(100% - 64px));margin-inline:auto}.eyebrow{text-transform:uppercase;letter-spacing:.28em;color:var(--gold);font-size:11px;font-weight:700}.section{padding:112px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:42px}.section h2{font:500 clamp(34px,4.6vw,61px)/1.12 'Manrope',sans-serif;letter-spacing:-.052em;margin:15px 0 0}.text-muted{color:#c3c1bb;line-height:1.85}.link-arrow{display:inline-flex;align-items:center;gap:14px;color:var(--gold-light);font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:700}.link-arrow:hover{color:white}.link-arrow svg{transition:transform .2s}.link-arrow:hover svg{transform:translateX(4px)}
    .site-header{position:absolute;z-index:20;top:0;left:0;width:100%;border-bottom:1px solid rgba(255,255,255,.2)}.header-inner{height:93px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:inline-flex;flex-direction:column;line-height:1}.brand-name{font:600 29px/1 'Manrope',sans-serif;letter-spacing:.1em;color:#ead2a8}.brand-sub{font-size:9px;letter-spacing:.2em;color:#f2e7d7;margin-top:9px;white-space:nowrap}.main-nav{display:flex;align-items:center;gap:34px}.main-nav a{font-size:12px;font-weight:700;color:#ebebe8;transition:color .2s}.main-nav a:hover{color:var(--gold)}.nav-cta{border:1px solid var(--gold);padding:14px 20px!important;color:var(--gold-light)!important}.menu-toggle{display:none;background:none;border:1px solid var(--line);color:white;padding:9px 11px;cursor:pointer}
    .hero{position:relative;min-height:760px;height:min(900px,100svh);display:flex;align-items:center;overflow:hidden;background:#222}.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(16,18,18,.89) 0%,rgba(16,18,18,.69) 48%,rgba(16,18,18,.26) 100%),linear-gradient(0deg,rgba(16,18,18,.68),transparent 37%),url('https://images.unsplash.com/photo-1600607687920-4e2a09cf159d?auto=format&fit=crop&w=2200&q=85') center/cover no-repeat;transform:scale(1.015)}.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent calc(50% - .5px),rgba(255,255,255,.055) 50%,transparent calc(50% + .5px));pointer-events:none}.hero-content{position:relative;z-index:2;padding-top:92px}.hero-tag{display:flex;align-items:center;gap:13px;margin-bottom:27px}.hero-tag::before{content:"";width:43px;height:1px;background:var(--gold)}.hero h1{font:500 clamp(46px,6.6vw,94px)/1.075 'Manrope',sans-serif;letter-spacing:-.065em;margin:0;max-width:930px}.hero h1 em{font-style:normal;color:var(--gold-light)}.hero-lead{margin:30px 0 36px;color:#e4e2de;line-height:1.9;font-size:16px;max-width:500px}.button-primary{background:var(--gold);color:#181a1a;border:1px solid var(--gold);display:inline-flex;align-items:center;justify-content:center;gap:26px;padding:17px 24px;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.11em;transition:background .2s,transform .2s}.button-primary:hover{background:#e1c397;transform:translateY(-2px)}.button-primary svg,.link-arrow svg{width:18px;height:18px}.hero-bottom{position:absolute;bottom:34px;left:0;right:0;z-index:2}.hero-bottom-inner{display:flex;justify-content:space-between;align-items:center;gap:16px;color:#e1ddd6;font-size:11px;letter-spacing:.19em;text-transform:uppercase}.scroll-down{display:flex;align-items:center;gap:12px}.scroll-down::after{content:"";height:46px;width:1px;background:var(--gold)}
    .intro{background:var(--cream);color:var(--ink)}.intro-layout{display:grid;grid-template-columns:1fr 1fr;gap:12%;align-items:center}.intro h2{max-width:580px}.intro p{color:#62615c;font-size:16px;line-height:1.95;margin:0 0 25px}.intro .link-arrow{color:#8e6a3a}.statement{border-left:2px solid var(--gold);padding-left:20px;margin-top:30px;color:#45443f;font-size:14px;line-height:1.8}
    .projects{background:#202220}.projects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:23px}.project-card{position:relative;min-height:450px;overflow:hidden;background:#3b3a37;display:flex;align-items:end;isolation:isolate}.project-card::before{content:"";position:absolute;inset:0;background:var(--photo) center/cover no-repeat;transition:transform .6s;z-index:-2}.project-card::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.86),transparent 62%);z-index:-1}.project-card:hover::before{transform:scale(1.055)}.project-card-content{padding:31px;width:100%}.project-card small{color:var(--gold-light);font-size:11px;letter-spacing:.18em;text-transform:uppercase}.project-card h3{margin:10px 0 18px;font-size:25px;font-weight:600;letter-spacing:-.04em}.project-card .line{width:100%;height:1px;background:rgba(255,255,255,.4)}.project-card .project-note{font-size:12px;color:#dad6cc;margin-top:13px}.demo-note{margin-top:19px;color:#bcb9b1;font-size:12px;line-height:1.8}
    .values{background:var(--cream);color:var(--ink)}.value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#d8d0c4;border:1px solid #d8d0c4;margin-top:47px}.value{background:var(--cream);padding:34px 33px 41px}.value-index{color:#9b7e50;letter-spacing:.17em;font-weight:700;font-size:12px}.value h3{font:600 23px/1.2 'Manrope',sans-serif;letter-spacing:-.04em;margin:36px 0 13px}.value p{font-size:14px;line-height:1.85;color:#66625c;margin:0}
    .closing{position:relative;padding:110px 0;background:linear-gradient(90deg,rgba(19,21,20,.95),rgba(19,21,20,.79)),url('https://images.unsplash.com/photo-1487958449943-2429e8be8625?auto=format&fit=crop&w=1800&q=80') center/cover}.closing-layout{display:flex;align-items:end;justify-content:space-between;gap:40px}.closing h2{max-width:740px;margin:16px 0 0;font:500 clamp(36px,4.6vw,64px)/1.15 'Manrope',sans-serif;letter-spacing:-.05em}.site-footer{background:#151717;padding:45px 0}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:24px}.footer-meta{color:#aaa9a2;font-size:12px;line-height:1.8;text-align:right}.footer-meta a{color:#d9c6aa}.reveal{opacity:0;transform:translateY(22px);transition:opacity .65s ease,transform .65s ease}.reveal.visible{opacity:1;transform:none}
    @media(max-width:900px){.main-nav{gap:16px}.main-nav a{font-size:11px}.projects-grid{grid-template-columns:repeat(2,1fr)}.project-card:last-child{grid-column:span 2;min-height:350px}.intro-layout{gap:5%}}
    @media(max-width:700px){.container{width:min(var(--max),calc(100% - 40px))}.header-inner{height:78px}.brand-name{font-size:24px}.brand-sub{font-size:7px}.menu-toggle{display:block}.main-nav{display:none;position:absolute;top:78px;left:0;right:0;background:#1b1d1c;padding:20px;flex-direction:column;align-items:stretch;gap:0;border-top:1px solid var(--line);box-shadow:0 20px 35px #0005}.main-nav.open{display:flex}.main-nav a{padding:15px 4px;font-size:13px;border-bottom:1px solid var(--line)}.main-nav .nav-cta{margin-top:15px;text-align:center;border:1px solid var(--gold);padding:14px!important}.hero{height:auto;min-height:730px}.hero-content{padding-top:105px;padding-bottom:130px}.hero h1{font-size:clamp(43px,10vw,65px)}.hero-lead{font-size:14px}.hero-bottom{bottom:18px}.hero-bottom-inner{font-size:9px}.section{padding:76px 0}.intro-layout{grid-template-columns:1fr;gap:26px}.section-head{align-items:start;flex-direction:column}.projects-grid{grid-template-columns:1fr}.project-card,.project-card:last-child{grid-column:auto;min-height:425px}.value-grid{grid-template-columns:1fr}.value{padding:27px}.value h3{margin-top:24px}.closing{padding:75px 0}.closing-layout{flex-direction:column;align-items:start}.footer-inner{align-items:start;flex-direction:column}.footer-meta{text-align:left}}
    @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.project-card::before,.button-primary{transition:none}}
    
/* =====================================
   FSI INSAAT - PREMIUM ANIMASYONLAR
   ===================================== */

/* 1. Giris fotografina sinematik hareket */
.hero::before {
    animation: heroZoom 16s ease-out both;
    will-change: transform;
}

@keyframes heroZoom {
    from {
        transform: scale(1.13);
    }
    to {
        transform: scale(1.015);
    }
}

/* 2. Giris yazilarinin sirayla belirmesi */
.hero-tag {
    animation: fadeUp 0.8s ease-out 0.15s both;
}

.hero h1 {
    animation: fadeUp 1s ease-out 0.35s both;
}

.hero-lead {
    animation: fadeUp 1s ease-out 0.55s both;
}

.hero .button-primary {
    animation: fadeUp 1s ease-out 0.75s both;
}

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(28px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 3. Ana menunun daha zarif gorunmesi */
.main-nav a:not(.nav-cta) {
    position: relative;
}

.main-nav a:not(.nav-cta)::after {
    content: "";
    position: absolute;
    bottom: -8px;
    left: 0;
    width: 0;
    height: 1px;
    background: var(--gold);
    transition: width 0.3s ease;
}

.main-nav a:not(.nav-cta):hover::after {
    width: 100%;
}

/* 4. Iletisim butonuna premium hover */
.nav-cta {
    transition: background 0.3s ease,
                color 0.3s ease,
                border-color 0.3s ease;
}

.nav-cta:hover {
    background: var(--gold);
    color: #191b1b !important;
}

/* 5. Giristeki altin cizgi */
.hero-tag::before {
    transform-origin: left center;
    animation: goldLine 1s ease-out 0.2s both;
}

@keyframes goldLine {
    from {
        transform: scaleX(0);
    }
    to {
        transform: scaleX(1);
    }
}

/* 6. Asagi kaydir gostergesi */
.scroll-down::after {
    animation: scrollPulse 2s ease-in-out infinite;
    transform-origin: top center;
}

@keyframes scrollPulse {
    0%, 100% {
        opacity: 0.4;
        transform: scaleY(0.65);
    }
    50% {
        opacity: 1;
        transform: scaleY(1);
    }
}

/* 7. Klavye kullaniminda net odak */
a:focus-visible,
button:focus-visible {
    outline: 2px solid var(--gold-light);
    outline-offset: 4px;
}

/* 8. Mobil menudeki alt cizgileri duzelt */
@media (max-width: 700px) {
    .main-nav a:not(.nav-cta)::after {
        display: none;
    }
}

/* 9. Hareket azaltma tercihlerine saygi */
@media (prefers-reduced-motion: reduce) {
    .hero::before,
    .hero-tag,
    .hero h1,
    .hero-lead,
    .hero .button-primary,
    .hero-tag::before,
    .scroll-down::after {
        animation: none !important;
        will-change: auto;
    }
}

/* Dekoratif mimari cerceve */

.hero-architecture {
    position: absolute;
    z-index: 1;
    inset: 120px 45px 100px;
    pointer-events: none;
}

.architecture-line {
    position: absolute;
    display: block;
    background: rgba(198, 164, 108, 0.35);
}

.line-top {
    top: 0;
    right: 0;
    width: 130px;
    height: 1px;
}

.line-right {
    top: 0;
    right: 0;
    width: 1px;
    height: 130px;
}

.line-bottom {
    left: 0;
    bottom: 0;
    width: 75px;
    height: 1px;
}

.architecture-corner {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 1px;
    height: 75px;
    background: rgba(198, 164, 108, 0.35);
}

@media (max-width: 700px) {
    .hero-architecture {
        inset: 100px 18px 90px;
    }

    .line-top {
        width: 65px;
    }

    .line-right {
        height: 65px;
    }

    .line-bottom {
        width: 45px;
    }

    .architecture-corner {
        height: 45px;
    }
}

/* =======================================
   FSI INSAAT - PREMIUM SABIT MENU
   ======================================= */

/* Menu her zaman ekranin ustunde kalir */
.site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 1000;

    background: rgba(25, 27, 27, 0.12);
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);

    transition:
        background 0.4s ease,
        border-color 0.4s ease,
        box-shadow 0.4s ease;
}

/* Sayfa kaydirildiginda cam efekti */
.site-header.scrolled {
    background: rgba(25, 27, 27, 0.94);
    border-bottom: 1px solid rgba(198, 164, 108, 0.3);
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.18);

    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
}

/* Menu yuksekligi yumusak degissin */
.header-inner {
    transition: height 0.35s ease;
}

/* Asagi kaydirildiginda menu kuculsun */
.site-header.scrolled .header-inner {
    height: 74px;
}

/* Logo hafif kuculsun */
.brand {
    transition: transform 0.35s ease;
    transform-origin: left center;
}

.site-header.scrolled .brand {
    transform: scale(0.92);
}

/* Iletisim butonu */
.site-header.scrolled .nav-cta {
    border-color: var(--gold);
}

/* Mobil uyumluluk */
@media (max-width: 700px) {
    .site-header.scrolled .header-inner {
        height: 70px;
    }

    /* Acilir menu, sabit basligin altinda kalsin */
    .site-header.scrolled .main-nav {
        top: 70px;
    }

    .site-header.scrolled {
        background: rgba(25, 27, 27, 0.98);
    }
}

/* Hareket azaltma tercihi */
@media (prefers-reduced-motion: reduce) {
    .site-header,
    .header-inner,
    .brand {
        transition: none;
    }
}

/* Mobil menu iyilestirmesi */

@media (max-width: 700px) {

    .main-nav {
        max-height: calc(100dvh - 78px);
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    .site-header.scrolled .main-nav {
        max-height: calc(100dvh - 70px);
    }

    .main-nav.open {
        background: rgba(25, 27, 27, 0.98);
        -webkit-backdrop-filter: blur(16px);
        backdrop-filter: blur(16px);
    }

    .main-nav a {
        transition:
            color 0.25s ease,
            padding-left 0.25s ease;
    }

    .main-nav a:not(.nav-cta):hover {
        color: var(--gold);
        padding-left: 10px;
    }
}

/* ==========================================
   FSI INSAAT - PREMIUM PROJE KARTLARI
   ========================================== */

/* Kartin temel yapisi */
.project-card {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    cursor: pointer;
}

/* Fotograf gecis efekti */
.project-card::before {
    transition: transform 0.8s cubic-bezier(.2,.7,.2,1),
                filter 0.6s ease;
    transform-origin: center;
}

/* Fare ile fotografi hafif buyut */
.project-card:hover::before {
    transform: scale(1.08);
}

/* Altin cerceve */
.project-card::after {
    content: "";
    position: absolute;
    inset: 12px;
    border: 1px solid rgba(198, 164, 108, 0);
    pointer-events: none;
    z-index: 3;
    transition: border-color 0.4s ease;
}

.project-card:hover::after {
    border-color: rgba(198, 164, 108, 0.72);
}

/* Kart icerigini one cikar */
.project-card > * {
    position: relative;
    z-index: 4;
}

/* Kart basliklarina hareket */
.project-card h3 {
    transition: transform 0.4s ease,
                color 0.4s ease;
}

.project-card:hover h3 {
    transform: translateY(-4px);
    color: #e5c58e;
}

/* Hareket azaltma tercihi */
@media (prefers-reduced-motion: reduce) {
    .project-card::before,
    .project-card::after,
    .project-card h3 {
        transition: none;
    }
}

/* Proje durum etiketi */

.project-status {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 8px 13px;

    background: rgba(25, 27, 27, 0.78);
    border: 1px solid rgba(198, 164, 108, 0.55);

    color: #e5c58e;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;

    backdrop-filter: blur(8px);
}


.project-card-content .project-status {
    margin-bottom: 16px;
}

.project-card-content small {
    display: block;
}


/* Proje kartlarinin gorunme animasyonu */

.project-card {
    opacity: 1;
    transform: translateY(0);
}

.project-card.reveal-ready {
    opacity: 0;
    transform: translateY(35px);
    transition:
        opacity 0.75s ease,
        transform 0.75s ease;
}

.project-card.reveal-ready.is-visible {
    opacity: 1;
    transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
    .project-card.reveal-ready {
        opacity: 1;
        transform: none;
    }
}

/* Tiklanabilir proje kartlari */
a.project-card {
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}

a.project-card:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 4px;
}


/* ======================================
   FSI INSAAT - ORTAK FOOTER
   ====================================== */

.footer-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 14px;
}

.footer-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 18px;
}

.footer-links a {
    color: #b7b4ac;
    font-size: 12px;
    transition: color 0.25s ease;
}

.footer-links a:hover {
    color: var(--gold);
}

@media (max-width: 700px) {
    .footer-meta {
        align-items: flex-start;
    }

    .footer-links {
        justify-content: flex-start;
        gap: 12px 18px;
    }
}

/* FSI INSAAT - PHP HEADER KAYDIRMA DUZELTMESI */

.site-header.home-header.scrolled {
    background: rgba(25, 27, 27, 0.97);
    border-bottom: 1px solid rgba(198, 164, 108, 0.35);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.20);

    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
}
