:root{
    --red:#E12727;
    --blue:#1B3A8C;
    --yellow:#F5C518;
    --dark:#0F1923;
    --light:#F4F4F0;
    --gray:#6B7280;
    --card-bg:rgba(255, 255, 255, 0.06);
}
*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
    font-family:'Nunito', sans-serif;
    background:var(--dark);
    color:var(--light);
    overflow-x:hidden;
}
/* ─── GRAIN OVERLAY ─── */
body::before{
    content:'';
    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='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
}
/* ─── HERO ─── */
.hero{
    min-height:100vh;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    position:relative;
    padding:2rem;
    text-align:center;
}
.hero::after{
    content:'';
    position:absolute;
    inset:0;
    background:radial-gradient(ellipse 60% 50% at 30% 80%, rgba(225, 39, 39, .12) 0%, transparent 70%),
    radial-gradient(ellipse 50% 40% at 70% 20%, rgba(27, 58, 140, .15) 0%, transparent 70%),
    radial-gradient(ellipse 40% 30% at 50% 50%, rgba(245, 197, 24, .06) 0%, transparent 70%);
    pointer-events:none;
}
.hero-content{
    position:relative;
    z-index:2;
    max-width:700px;
}
.logo-wrapper{
    margin-bottom:2.5rem;
    animation:fadeDown .8s ease-out;
}
.logo-wrapper img{
    height:64px;
    width:auto;
}
.construction-badge{
    display:inline-flex;
    align-items:center;
    gap:.5rem;
    background:linear-gradient(135deg, var(--yellow), #e6b300);
    color:var(--dark);
    font-family:'Bebas Neue', sans-serif;
    font-size:1rem;
    letter-spacing:.15em;
    padding:.55rem 1.6rem;
    border-radius:50px;
    margin-bottom:2rem;
    animation:fadeDown .8s ease-out .15s both;
    box-shadow:0 4px 20px rgba(245, 197, 24, .25);
}
.construction-badge .icon{
    font-size:1.1rem;
}
.hero h1{
    font-family:'Bebas Neue', sans-serif;
    font-size:clamp(2.8rem, 6vw, 5rem);
    line-height:1.05;
    letter-spacing:.04em;
    margin-bottom:1.2rem;
    animation:fadeDown .8s ease-out .3s both;
}
.hero h1 .accent-red{ color:var(--red); }
.hero h1 .accent-yellow{ color:var(--yellow); }
.hero p.tagline{
    font-size:1.15rem;
    color:rgba(244, 244, 240, .65);
    line-height:1.7;
    max-width:540px;
    margin:0 auto 2.5rem;
    animation:fadeDown .8s ease-out .45s both;
}
.hero-buttons{
    display:flex;
    flex-wrap:wrap;
    gap:1rem;
    justify-content:center;
    animation:fadeDown .8s ease-out .6s both;
}
.btn{
    display:inline-flex;
    align-items:center;
    gap:.5rem;
    padding:.85rem 2rem;
    border-radius:50px;
    font-family:'Nunito', sans-serif;
    font-weight:700;
    font-size:.95rem;
    text-decoration:none;
    border:none;
    cursor:pointer;
    transition:transform .2s, box-shadow .2s;
}
.btn:hover{
    transform:translateY(-2px);
}
.btn-primary{
    background:linear-gradient(135deg, var(--red), #c11e1e);
    color:#fff;
    box-shadow:0 4px 24px rgba(225, 39, 39, .35);
}
.btn-primary:hover{
    box-shadow:0 8px 32px rgba(225, 39, 39, .45);
}
.btn-outline{
    background:transparent;
    color:var(--light);
    border:2px solid rgba(244, 244, 240, .25);
}
.btn-outline:hover{
    border-color:var(--yellow);
    color:var(--yellow);
    box-shadow:0 4px 20px rgba(245, 197, 24, .15);
}
.scroll-hint{
    position:absolute;
    bottom:2.5rem;
    left:50%;
    transform:translateX(-50%);
    z-index:2;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:.5rem;
    color:rgba(244, 244, 240, .3);
    font-size:.75rem;
    letter-spacing:.1em;
    text-transform:uppercase;
    animation:bounce 2s infinite;
}
.scroll-hint svg{
    width:20px;
    height:20px;
}
/* ─── ABOUT SECTION ─── */
.section{
    padding:5rem 2rem;
    max-width:1100px;
    margin:0 auto;
}
.section-label{
    font-family:'Bebas Neue', sans-serif;
    font-size:.9rem;
    letter-spacing:.2em;
    color:var(--yellow);
    margin-bottom:.75rem;
}
.section h2{
    font-family:'Bebas Neue', sans-serif;
    font-size:clamp(2rem, 4vw, 3rem);
    letter-spacing:.03em;
    margin-bottom:1.5rem;
    line-height:1.1;
}
.section p{
    color:rgba(244, 244, 240, .6);
    line-height:1.8;
    max-width:720px;
    margin-bottom:1.2rem;
    font-size:.97rem;
}
.divider{
    width:60px;
    height:4px;
    background:linear-gradient(90deg, var(--red), var(--yellow));
    border-radius:2px;
    margin:3rem 0;
}
/* ─── FEATURE CARDS ─── */
.features{
    display:grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap:1.5rem;
    margin-top:2.5rem;
}
.feature-card{
    background:var(--card-bg);
    border:1px solid rgba(244, 244, 240, .07);
    border-radius:16px;
    padding:2rem 1.5rem;
    transition:transform .25s, border-color .25s, box-shadow .25s;
}
.feature-card:hover{
    transform:translateY(-4px);
    border-color:rgba(245, 197, 24, .25);
    box-shadow:0 8px 30px rgba(0, 0, 0, .3);
}
.feature-icon{
    width:48px;
    height:48px;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:1.4rem;
    margin-bottom:1.2rem;
}
.fi-red{ background:rgba(225, 39, 39, .15); }
.fi-blue{ background:rgba(27, 58, 140, .2); }
.fi-yellow{ background:rgba(245, 197, 24, .15); }
.fi-green{ background:rgba(34, 197, 94, .12); }
.feature-card h3{
    font-family:'Bebas Neue', sans-serif;
    font-size:1.25rem;
    letter-spacing:.05em;
    margin-bottom:.6rem;
}
.feature-card p{
    font-size:.88rem;
    color:rgba(244, 244, 240, .5);
    line-height:1.7;
    margin:0;
}
/* ─── MISSION & VISION ─── */
.mv-grid{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:2rem;
    margin-top:2rem;
}
.mv-card{
    background:var(--card-bg);
    border:1px solid rgba(244, 244, 240, .07);
    border-radius:16px;
    padding:2.5rem 2rem;
    position:relative;
    overflow:hidden;
}
.mv-card::before{
    content:'';
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:3px;
}
.mv-card.mission::before{
    background:linear-gradient(90deg, var(--red), var(--yellow));
}
.mv-card.target::before{
    background:linear-gradient(90deg, var(--blue), var(--yellow));
}
.mv-card h3{
    font-family:'Bebas Neue', sans-serif;
    font-size:1.5rem;
    letter-spacing:.05em;
    margin-bottom:1rem;
    display:flex;
    align-items:center;
    gap:.6rem;
}
.mv-card p{
    font-size:.92rem;
    color:rgba(244, 244, 240, .55);
    line-height:1.8;
    margin:0;
}
/* ─── FOOTER AREA ─── */
.footer-strip{
    border-top:1px solid rgba(244, 244, 240, .07);
    padding:2.5rem 2rem;
    text-align:center;
    color:rgba(244, 244, 240, .3);
    font-size:.82rem;
}
.footer-strip .logo-sm{
    height:32px;
    margin-bottom:1rem;
    opacity:.5;
}
.footer-slogan{
    font-family:'Bebas Neue', sans-serif;
    font-size:1.1rem;
    letter-spacing:.1em;
    color:rgba(244, 244, 240, .45);
    margin-bottom:.5rem;
}
/* ─── BAYI GİRİŞİ MODAL ─── */
.modal-overlay{
    position:fixed;
    inset:0;
    background:rgba(15, 25, 35, .85);
    backdrop-filter:blur(8px);
    z-index:10000;
    display:none;
    align-items:center;
    justify-content:center;
    padding:2rem;
}
.modal-overlay.active{
    display:flex;
}
.modal{
    background:#1a2636;
    border:1px solid rgba(244, 244, 240, .1);
    border-radius:20px;
    padding:3rem 2.5rem;
    max-width:420px;
    width:100%;
    text-align:center;
    position:relative;
    animation:scaleIn .3s ease-out;
}
.modal-close{
    position:absolute;
    top:1rem;
    right:1rem;
    background:none;
    border:none;
    color:rgba(244, 244, 240, .4);
    font-size:1.5rem;
    cursor:pointer;
    width:36px;
    height:36px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:background .2s;
}
.modal-close:hover{
    background:rgba(244, 244, 240, .08);
    color:var(--light);
}
.modal h3{
    font-family:'Bebas Neue', sans-serif;
    font-size:1.6rem;
    letter-spacing:.06em;
    margin-bottom:.5rem;
}
.modal p{
    color:rgba(244, 244, 240, .5);
    font-size:.88rem;
    margin-bottom:2rem;
    line-height:1.6;
}
.form-group{
    margin-bottom:1.2rem;
    text-align:left;
}
.form-group label{
    display:block;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.05em;
    text-transform:uppercase;
    color:rgba(244, 244, 240, .45);
    margin-bottom:.4rem;
}
.form-group input{
    width:100%;
    padding:.8rem 1rem;
    border-radius:10px;
    border:1px solid rgba(244, 244, 240, .12);
    background:rgba(255, 255, 255, .04);
    color:var(--light);
    font-family:'Nunito', sans-serif;
    font-size:.92rem;
    outline:none;
    transition:border-color .2s;
}
.form-group input:focus{
    border-color:var(--yellow);
}
.modal .btn-primary{
    width:100%;
    justify-content:center;
    padding:.95rem;
    font-size:1rem;
    border-radius:12px;
    margin-top:.5rem;
}
/* ─── ANIMATIONS ─── */
@keyframes fadeDown{
    from{ opacity:0; transform:translateY(-20px); }
    to{ opacity:1; transform:translateY(0); }
}
@keyframes scaleIn{
    from{ opacity:0; transform:scale(.92); }
    to{ opacity:1; transform:scale(1); }
}
@keyframes bounce{
    0%, 100%{ transform:translateX(-50%) translateY(0); }
    50%{ transform:translateX(-50%) translateY(8px); }
}
/* ─── RESPONSIVE ─── */
@media (max-width:700px){
    .mv-grid{
        grid-template-columns: 1fr;
    }
    .hero-buttons{
        flex-direction:column;
        align-items:center;
    }
    .btn{
        width:100%;
        max-width:280px;
        justify-content:center;
    }
    .logo-wrapper img{
        height:48px;
    }
}