/* =========================================================
   EKREM İNŞAAT
   ANA SAYFA STYLE.CSS
   SİYAH + ALTIN / RESPONSIVE
   ========================================================= */


/* =========================================================
   ROOT
   ========================================================= */

:root {
    --bg: #050505;
    --bg-soft: #090909;
    --bg-card: #0d0d0d;
    --bg-card-light: #111111;

    --gold: #c9a646;
    --gold-light: #e4cb78;

    --text: #f5f2e9;
    --muted: #9a9a9a;
    --muted-dark: #737373;

    --line: rgba(255, 255, 255, 0.08);
    --gold-line: rgba(201, 166, 70, 0.28);

    --container: 1240px;
}


/* =========================================================
   RESET
   ========================================================= */

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 90px;
}

body {
    background:
        radial-gradient(
            circle at 75% 5%,
            rgba(201, 166, 70, 0.06),
            transparent 28%
        ),
        var(--bg);

    color: var(--text);

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    line-height: 1.6;

    overflow-x: hidden;
}

body.home-page {
    min-height: 100vh;
}

img {
    display: block;
    width: 100%;
    max-width: 100%;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
a {
    -webkit-tap-highlight-color: transparent;
}

::selection {
    background: var(--gold);
    color: #050505;
}


/* =========================================================
   GENEL SAYFA GENİŞLİĞİ
   ========================================================= */

.simple-section,
.simple-about,
.simple-contact,
.simple-values,
.simple-hero,
.simple-footer-inner {
    width: min(
        calc(100% - 48px),
        var(--container)
    );

    margin-inline: auto;
}

.simple-section,
.simple-about,
.simple-contact {
    padding: 110px 0;
}


/* =========================================================
   KÜÇÜK BAŞLIKLAR
   ========================================================= */

.section-small-title {
    color: var(--gold-light);

    font-size: 11px;
    font-weight: 800;

    letter-spacing: 0.18em;

    text-transform: uppercase;
}


/* =========================================================
   BUTONLAR
   ========================================================= */

.gold-button,
.outline-button {
    min-height: 50px;

    padding: 0 22px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    border: 1px solid transparent;

    font-size: 12px;
    font-weight: 800;

    letter-spacing: 0.04em;

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        background 0.25s ease,
        color 0.25s ease;
}

.gold-button {
    background: var(--gold);
    color: #080808;
}

.gold-button:hover {
    background: var(--gold-light);
    transform: translateY(-2px);
}

.outline-button {
    color: #ffffff;

    border-color: rgba(
        255,
        255,
        255,
        0.20
    );

    background: rgba(
        255,
        255,
        255,
        0.01
    );
}

.outline-button:hover {
    color: var(--gold-light);

    border-color: rgba(
        201,
        166,
        70,
        0.55
    );

    transform: translateY(-2px);
}


/* =========================================================
   NAVBAR
   ========================================================= */

.navbar {
    position: sticky;

    top: 0;

    z-index: 1000;

    min-height: 80px;

    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 30px;

    padding:
        0
        max(
            24px,
            calc((100vw - var(--container)) / 2)
        );

    background: rgba(
        5,
        5,
        5,
        0.92
    );

    border-bottom: 1px solid rgba(
        201,
        166,
        70,
        0.13
    );

    backdrop-filter: blur(18px);

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


/* =========================================================
   NAVBAR LOGO
   ========================================================= */

.logo-text {
    flex: 0 0 auto;

    color: #ffffff;

    font-size: 21px;

    font-weight: 900;

    letter-spacing: 0.08em;

    white-space: nowrap;
}

.logo-text span {
    color: var(--gold-light);
}


/* =========================================================
   NAVIGATION
   ========================================================= */

.navbar nav {
    display: flex;

    align-items: center;
    justify-content: flex-end;

    gap: 28px;
}

.navbar nav a {
    position: relative;

    color: #d2d2d2;

    font-size: 12px;

    font-weight: 700;

    transition: color 0.25s ease;
}

.navbar nav a:not(.nav-contact)::after {
    content: "";

    position: absolute;

    left: 0;
    right: 100%;

    bottom: -8px;

    height: 1px;

    background: var(--gold);

    transition: right 0.25s ease;
}

.navbar nav a:hover {
    color: var(--gold-light);
}

.navbar nav a:not(.nav-contact):hover::after {
    right: 0;
}

.nav-contact {
    padding: 9px 14px;

    border: 1px solid rgba(
        201,
        166,
        70,
        0.45
    );

    color: var(--gold-light) !important;
}


/* =========================================================
   HERO
   ========================================================= */

.simple-hero {
    position: relative;

    min-height: calc(
        100vh - 80px
    );

    padding:
        80px
        0
        90px;

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(360px, 0.82fr);

    align-items: center;

    gap: 70px;
}

.simple-hero::before {
    content: "";

    position: absolute;

    inset: 0;

    z-index: -1;

    opacity: 0.24;

    background-image:

        linear-gradient(
            rgba(
                255,
                255,
                255,
                0.025
            )
            1px,
            transparent
            1px
        ),

        linear-gradient(
            90deg,
            rgba(
                255,
                255,
                255,
                0.025
            )
            1px,
            transparent
            1px
        );

    background-size:
        48px
        48px;

    mask-image: linear-gradient(
        to bottom,
        black,
        transparent 90%
    );
}

.simple-hero-content {
    min-width: 0;
}


/* =========================================================
   HERO KICKER
   ========================================================= */

.simple-kicker {
    display: flex;

    align-items: center;

    gap: 12px;

    color: var(--gold-light);

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 0.18em;
}

.simple-kicker span {
    width: 40px;

    height: 1px;

    background: var(--gold);
}


/* =========================================================
   HERO BAŞLIK
   ========================================================= */

.simple-hero h1 {
    margin-top: 22px;

    max-width: 720px;

    color: #ffffff;

    font-size: clamp(
        58px,
        7vw,
        98px
    );

    line-height: 0.91;

    font-weight: 500;

    letter-spacing: -0.055em;
}

.simple-hero h1 span {
    display: block;

    color: var(--gold-light);
}

.simple-hero-description {
    max-width: 570px;

    margin-top: 28px;

    color: var(--muted);

    font-size: 16px;

    line-height: 1.8;
}

.simple-hero-actions {
    margin-top: 32px;

    display: flex;

    flex-wrap: wrap;

    gap: 13px;
}


/* =========================================================
   HERO SAĞ TARAF
   ========================================================= */

.simple-hero-visual {
    position: relative;

    min-height: 500px;

    display: grid;

    place-items: center;
}

.simple-hero-visual::before {
    content: "";

    position: absolute;

    width: 88%;

    max-width: 450px;

    aspect-ratio: 1;

    border: 1px solid rgba(
        201,
        166,
        70,
        0.30
    );

    transform: rotate(45deg);
}

.simple-hero-visual::after {
    content: "";

    position: absolute;

    width: 65%;

    max-width: 330px;

    aspect-ratio: 1;

    border: 1px solid rgba(
        255,
        255,
        255,
        0.08
    );

    transform: rotate(45deg);
}


/* =========================================================
   HERO LOGO
   ========================================================= */

.simple-hero-logo {
    position: relative;

    z-index: 3;

    width: min(
        390px,
        84%
    );

    min-height: 285px;

    padding: 26px;

    display: grid;

    place-items: center;

    background: rgba(
        8,
        8,
        8,
        0.94
    );

    border: 1px solid rgba(
        201,
        166,
        70,
        0.38
    );

    box-shadow:
        0
        30px
        80px
        rgba(
            0,
            0,
            0,
            0.48
        );
}

.simple-hero-logo img {
    width: 100%;

    max-width: 340px;

    max-height: 220px;

    object-fit: contain;
}


/* =========================================================
   DEĞERLER
   ========================================================= */

.simple-values {
    display: grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    border-top: 1px solid var(--gold-line);

    border-bottom: 1px solid var(--gold-line);
}

.simple-value {
    min-width: 0;

    min-height: 138px;

    padding: 28px 30px;

    display: flex;

    align-items: center;

    gap: 20px;
}

.simple-value + .simple-value {
    border-left: 1px solid var(--line);
}

.simple-value strong {
    color: rgba(
        201,
        166,
        70,
        0.78
    );

    font-size: 21px;

    font-weight: 800;

    letter-spacing: 0.04em;
}

.simple-value span {
    display: block;

    color: #ffffff;

    font-size: 14px;

    font-weight: 700;
}

.simple-value p {
    margin-top: 2px;

    color: #777777;

    font-size: 12px;
}


/* =========================================================
   BÖLÜM BAŞLIKLARI
   ========================================================= */

.simple-section-heading {
    max-width: 760px;

    margin-bottom: 42px;
}

.simple-section-heading h2 {
    margin-top: 10px;

    color: #ffffff;

    font-size: clamp(
        38px,
        4.8vw,
        62px
    );

    line-height: 1;

    font-weight: 500;

    letter-spacing: -0.04em;
}

.simple-section-heading > p:last-child {
    max-width: 590px;

    margin-top: 18px;

    color: var(--muted);

    font-size: 15px;

    line-height: 1.75;
}


/* =========================================================
   GÜNCEL PROJELER
   ========================================================= */

.projects-section {
    border-bottom: 1px solid rgba(
        201,
        166,
        70,
        0.07
    );
}

.simple-project-grid {
    display: grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap: 20px;
}

.simple-project-card {
    min-width: 0;

    overflow: hidden;

    display: flex;

    flex-direction: column;

    background: var(--bg-card);

    border: 1px solid rgba(
        201,
        166,
        70,
        0.18
    );

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}

.simple-project-card:hover {
    transform: translateY(-4px);

    border-color: rgba(
        201,
        166,
        70,
        0.45
    );

    box-shadow:
        0
        24px
        55px
        rgba(
            0,
            0,
            0,
            0.34
        );
}


/* =========================================================
   GÜNCEL PROJE FOTOĞRAFI
   ========================================================= */

.simple-project-image {
    position: relative;

    width: 100%;

    aspect-ratio: 16 / 10;

    overflow: hidden;

    background: #111111;
}

.simple-project-image::after {
    content: "";

    position: absolute;

    inset: 0;

    pointer-events: none;

    background: linear-gradient(
        to top,
        rgba(
            0,
            0,
            0,
            0.18
        ),
        transparent 48%
    );
}

.simple-project-image img {
    width: 100%;

    height: 100%;

    object-fit: cover;

    transition: transform 0.45s ease;
}

.simple-project-card:hover
.simple-project-image img {
    transform: scale(1.025);
}


/* =========================================================
   GÜNCEL PROJE YAZILARI
   ========================================================= */

.simple-project-content {
    flex: 1;

    padding:
        22px
        22px
        24px;

    background:
        linear-gradient(
            135deg,
            rgba(
                201,
                166,
                70,
                0.025
            ),
            transparent 45%
        ),
        #090909;

    border-top: 1px solid rgba(
        201,
        166,
        70,
        0.15
    );
}

.project-location {
    display: block;

    color: var(--gold-light);

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 0.08em;
}

.simple-project-content h3 {
    margin-top: 8px;

    color: #ffffff;

    font-size: 23px;

    line-height: 1.12;

    font-weight: 500;
}

.simple-project-content p {
    margin-top: 10px;

    color: #898989;

    font-size: 13px;

    line-height: 1.65;
}


/* =========================================================
   YENİ PROJE PLACEHOLDER
   ========================================================= */

.project-placeholder {
    min-height: 100%;

    background:
        radial-gradient(
            circle at 70% 25%,
            rgba(
                201,
                166,
                70,
                0.11
            ),
            transparent 38%
        ),
        #090909;
}

.project-placeholder-inner {
    min-height: 100%;

    padding:
        34px
        28px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: flex-start;
}

.placeholder-number {
    color: rgba(
        201,
        166,
        70,
        0.52
    );

    font-size: 9px;

    letter-spacing: 0.14em;
}

.placeholder-logo {
    width: 62px;

    height: 62px;

    margin:
        32px
        0
        25px;

    display: grid;

    place-items: center;

    border: 1px solid rgba(
        201,
        166,
        70,
        0.48
    );

    color: var(--gold-light);

    font-size: 24px;

    font-weight: 900;
}

.project-placeholder small {
    color: var(--gold-light);

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 0.14em;
}

.project-placeholder h3 {
    margin-top: 7px;

    color: #ffffff;

    font-size: 26px;

    font-weight: 500;
}

.project-placeholder p {
    max-width: 290px;

    margin-top: 10px;

    color: #858585;

    font-size: 13px;
}


/* =========================================================
   ESKİ PROJELER
   ========================================================= */

.old-projects-section {
    border-bottom: 1px solid rgba(
        201,
        166,
        70,
        0.07
    );
}

.simple-old-project-grid {
    display: grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap: 20px;
}

.simple-old-project-card {
    min-width: 0;

    overflow: hidden;

    display: flex;

    flex-direction: column;

    background: #0b0b0b;

    border: 1px solid rgba(
        201,
        166,
        70,
        0.18
    );

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}

.simple-old-project-card:hover {
    transform: translateY(-4px);

    border-color: rgba(
        201,
        166,
        70,
        0.48
    );

    box-shadow:
        0
        24px
        55px
        rgba(
            0,
            0,
            0,
            0.34
        );
}

.simple-old-image {
    position: relative;

    width: 100%;

    aspect-ratio: 16 / 10;

    overflow: hidden;

    background: #111111;
}

.simple-old-image img {
    width: 100%;

    height: 100%;

    object-fit: cover;

    transition: transform 0.45s ease;
}

.simple-old-project-card:hover
.simple-old-image img {
    transform: scale(1.025);
}

.simple-old-content {
    flex: 1;

    padding:
        20px
        21px
        22px;

    background: #090909;

    border-top: 1px solid rgba(
        201,
        166,
        70,
        0.14
    );
}

.simple-old-content h3 {
    margin-top: 7px;

    color: #ffffff;

    font-size: 22px;

    line-height: 1.15;

    font-weight: 500;
}

.simple-old-content p {
    margin-top: 8px;

    color: #898989;

    font-size: 12px;

    line-height: 1.6;
}


/* =========================================================
   YAVUZ SELİM
   DİĞER ESKİ PROJELERLE AYNI BOYUT
   ========================================================= */

.yavuz-selim-card {
    grid-column: auto;

    display: flex;

    flex-direction: column;

    min-width: 0;

    overflow: hidden;

    background: #0b0b0b;

    border: 1px solid rgba(
        201,
        166,
        70,
        0.18
    );
}

.yavuz-selim-card
.simple-old-image {
    position: relative;

    width: 100%;

    height: auto;

    min-height: 0;

    aspect-ratio: 16 / 10;

    overflow: hidden;

    background: #111111;
}

.yavuz-selim-card
.simple-old-image img {
    width: 100%;

    height: 100%;

    object-fit: cover;
}

.yavuz-selim-card
.simple-old-content {
    flex: 1;

    min-height: 0;

    padding:
        20px
        21px
        22px;

    display: block;

    background: #090909;

    border-left: none;

    border-top: 1px solid rgba(
        201,
        166,
        70,
        0.14
    );
}

.yavuz-selim-card
.simple-old-content h3 {
    margin-top: 7px;

    color: #ffffff;

    font-size: 22px;

    line-height: 1.15;

    font-weight: 500;
}

.yavuz-selim-card
.simple-old-content p {
    margin-top: 8px;

    color: #898989;

    font-size: 12px;

    line-height: 1.6;
}

.yavuz-project-badge {
    position: absolute;

    left: 15px;

    bottom: 15px;

    padding:
        8px
        11px;

    background: rgba(
        5,
        5,
        5,
        0.90
    );

    border: 1px solid rgba(
        201,
        166,
        70,
        0.48
    );

    color: var(--gold-light);

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 0.12em;
}

.project-detail-link {
    display: block;

    margin-top: 14px;

    color: var(--gold-light);

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 0.04em;

    transition: color 0.2s ease;
}

.yavuz-selim-card:hover
.project-detail-link {
    color: #ffffff;
}


/* =========================================================
   HAKKIMIZDA
   ========================================================= */

.simple-about {
    position: relative;

    display: grid;

    grid-template-columns:
        minmax(0, 0.9fr)
        minmax(0, 1.1fr);

    gap:
        55px
        80px;
}

.simple-about::before {
    content: "EKREM";

    position: absolute;

    z-index: -1;

    top: 15px;

    right: -20px;

    color: rgba(
        201,
        166,
        70,
        0.022
    );

    font-size: clamp(
        120px,
        18vw,
        240px
    );

    font-weight: 900;

    letter-spacing: -0.07em;

    pointer-events: none;
}

.simple-about-heading {
    min-width: 0;
}

.simple-about-heading h2 {
    margin-top: 10px;

    color: #ffffff;

    font-size: clamp(
        38px,
        4.8vw,
        64px
    );

    line-height: 1;

    font-weight: 500;

    letter-spacing: -0.04em;
}

.simple-about-heading h2 span {
    display: block;

    color: var(--gold-light);
}

.simple-about-content {
    min-width: 0;

    padding-left: 28px;

    border-left: 1px solid rgba(
        201,
        166,
        70,
        0.32
    );
}

.simple-about-content p {
    margin-bottom: 18px;

    color: #969696;

    font-size: 15px;

    line-height: 1.75;
}

.simple-about-content
.about-lead {
    color: #dddddd;

    font-size: 19px;

    line-height: 1.65;
}

.simple-about-content strong {
    color: var(--gold-light);

    font-weight: 600;
}


/* =========================================================
   GEÇMİŞTEN BİR İZ
   ========================================================= */

.heritage-card-section {
    grid-column: 1 / -1;

    margin-top: 15px;

    padding:
        46px
        0
        10px;

    border-top: 1px solid rgba(
        201,
        166,
        70,
        0.20
    );
}

.heritage-card-heading {
    max-width: 650px;

    margin-bottom: 30px;
}

.heritage-card-heading h3 {
    margin-top: 9px;

    color: #ffffff;

    font-size: clamp(
        30px,
        3.5vw,
        46px
    );

    line-height: 1.05;

    font-weight: 500;

    letter-spacing: -0.035em;
}

.heritage-card-heading > p:last-child {
    max-width: 570px;

    margin-top: 13px;

    color: #929292;

    font-size: 14px;

    line-height: 1.7;
}


/* =========================================================
   KARTVİZİT DIŞ ÇERÇEVESİ
   ========================================================= */

.heritage-card {
    position: relative;

    width: min(
        100%,
        960px
    );

    margin-inline: auto;

    padding: 10px;

    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            rgba(
                201,
                166,
                70,
                0.07
            ),
            transparent 30%
        ),
        #070707;

    border: 1px solid rgba(
        201,
        166,
        70,
        0.32
    );

    box-shadow:
        0
        25px
        70px
        rgba(
            0,
            0,
            0,
            0.40
        );

    transition:
        transform 0.35s ease,
        border-color 0.35s ease,
        box-shadow 0.35s ease;
}

.heritage-card::before {
    content: "";

    position: absolute;

    inset: 0;

    z-index: 2;

    pointer-events: none;

    border: 1px solid rgba(
        255,
        255,
        255,
        0.025
    );
}

.heritage-card:hover {
    transform: translateY(-5px);

    border-color: rgba(
        201,
        166,
        70,
        0.60
    );

    box-shadow:
        0
        32px
        80px
        rgba(
            0,
            0,
            0,
            0.48
        );
}


/* =========================================================
   KARTVİZİT GÖRSELİ
   ========================================================= */

.heritage-card img {
    position: relative;

    z-index: 1;

    display: block;

    width: 100%;

    height: auto;

    object-fit: contain;

    background: #050505;
}


/* =========================================================
   EKİP
   ========================================================= */

.simple-team {
    grid-column: 1 / -1;

    margin-top: 15px;

    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 18px;
}

.simple-team-card {
    min-width: 0;

    min-height: 145px;

    padding: 24px;

    display: grid;

    grid-template-columns:
        auto
        minmax(0, 1fr);

    align-items: center;

    gap: 20px;

    background: #090909;

    border: 1px solid rgba(
        201,
        166,
        70,
        0.17
    );

    transition:
        transform 0.25s ease,
        border-color 0.25s ease;
}

.simple-team-card:hover {
    transform: translateY(-3px);

    border-color: rgba(
        201,
        166,
        70,
        0.38
    );
}

.team-initials {
    width: 64px;

    height: 64px;

    display: grid;

    place-items: center;

    border: 1px solid rgba(
        201,
        166,
        70,
        0.44
    );

    color: var(--gold-light);

    font-size: 20px;

    font-weight: 800;
}

.team-info {
    min-width: 0;
}

.team-info h3 {
    color: #ffffff;

    font-size: 21px;

    font-weight: 500;
}

.team-info p {
    margin-top: 3px;

    color: #777777;

    font-size: 11px;
}

.team-info a {
    display: inline-block;

    margin-top: 8px;

    color: #a4a4a4;

    font-size: 12px;

    transition: color 0.2s ease;
}

.team-info a:hover {
    color: var(--gold-light);
}


/* =========================================================
   İLETİŞİM
   ========================================================= */

.simple-contact {
    border-top: 1px solid rgba(
        201,
        166,
        70,
        0.12
    );
}

.simple-contact-heading {
    max-width: 760px;

    margin-bottom: 40px;
}

.simple-contact-heading h2 {
    margin-top: 10px;

    color: #ffffff;

    font-size: clamp(
        38px,
        4.8vw,
        62px
    );

    line-height: 1;

    font-weight: 500;

    letter-spacing: -0.04em;
}

.simple-contact-heading > p:last-child {
    max-width: 600px;

    margin-top: 17px;

    color: var(--muted);

    font-size: 15px;

    line-height: 1.75;
}

.simple-contact-grid {
    display: grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap: 18px;
}

.simple-contact-card {
    min-width: 0;

    min-height: 205px;

    padding: 25px;

    background: #090909;

    border: 1px solid rgba(
        201,
        166,
        70,
        0.17
    );
}

.contact-icon {
    width: 40px;

    height: 40px;

    display: grid;

    place-items: center;

    border: 1px solid rgba(
        201,
        166,
        70,
        0.38
    );

    color: var(--gold-light);

    font-size: 15px;
}

.simple-contact-card h3 {
    margin-top: 20px;

    color: #ffffff;

    font-size: 20px;

    font-weight: 500;
}

.simple-contact-card p {
    margin-top: 10px;

    color: #929292;

    font-size: 13px;

    line-height: 1.7;
}

.simple-contact-card a {
    display: block;

    margin-top: 8px;

    color: #9b9b9b;

    font-size: 13px;

    overflow-wrap: anywhere;

    transition: color 0.2s ease;
}

.simple-contact-card a:hover {
    color: var(--gold-light);
}

.simple-whatsapp {
    margin-top: 20px;

    display: flex;

    flex-wrap: wrap;

    gap: 12px;
}


/* =========================================================
   FOOTER
   ========================================================= */

.simple-footer {
    background: #030303;

    border-top: 1px solid rgba(
        201,
        166,
        70,
        0.15
    );
}

.simple-footer-inner {
    min-height: 115px;

    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 40px;
}

.footer-logo {
    color: #ffffff;

    font-size: 22px;

    font-weight: 900;

    letter-spacing: 0.08em;
}

.footer-logo span {
    color: var(--gold-light);
}

.simple-footer p {
    margin-top: 5px;

    color: #696969;

    font-size: 11px;
}


/* =========================================================
   TABLET
   ========================================================= */

@media
(
    min-width: 701px
)
and
(
    max-width: 1000px
) {

    .navbar {
        padding: 0 22px;
    }

    .navbar nav {
        gap: 15px;
    }

    .navbar nav a {
        font-size: 10px;
    }


    /* HERO */

    .simple-hero {
        min-height: auto;

        grid-template-columns: 1fr;

        gap: 55px;

        padding:
            70px
            0
            80px;
    }

    .simple-hero-content {
        max-width: 760px;
    }

    .simple-hero-visual {
        min-height: 430px;

        max-width: 680px;

        width: 100%;

        margin-inline: auto;
    }

    .simple-hero-logo {
        width: min(
            350px,
            76%
        );

        min-height: 255px;

        padding: 25px;
    }

    .simple-hero-logo img {
        max-width: 305px;

        max-height: 195px;
    }


    /* GÜNCEL PROJELER */

    .simple-project-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

    .simple-project-card:last-child {
        grid-column: 1 / -1;
    }

    .project-placeholder {
        min-height: 300px;
    }


    /* ESKİ PROJELER */

    .simple-old-project-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    /* HAKKIMIZDA */

    .simple-about {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .simple-about-content {
        max-width: 760px;
    }


    /* KARTVİZİT */

    .heritage-card-section {
        margin-top: 10px;

        padding-top: 40px;
    }

    .heritage-card {
        width: min(
            100%,
            850px
        );
    }


    /* İLETİŞİM */

    .simple-contact-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

    .simple-contact-card:last-child {
        grid-column: 1 / -1;
    }
}


/* =========================================================
   MOBİL
   ========================================================= */

@media
(
    max-width: 700px
) {

    html {
        scroll-padding-top: 70px;
    }

    .simple-section,
    .simple-about,
    .simple-contact,
    .simple-values,
    .simple-hero,
    .simple-footer-inner {
        width: min(
            calc(100% - 30px),
            var(--container)
        );
    }

    .simple-section,
    .simple-about,
    .simple-contact {
        padding:
            75px
            0;
    }


    /* =====================================================
       NAVBAR
       ===================================================== */

    .navbar {
        position: relative;

        min-height: 0;

        padding:
            15px
            16px;

        flex-direction: column;

        align-items: flex-start;

        gap: 12px;
    }

    .logo-text {
        font-size: 18px;
    }

    .navbar nav {
        width: 100%;

        justify-content: flex-start;

        flex-wrap: wrap;

        gap:
            7px
            12px;
    }

    .navbar nav a {
        font-size: 10px;
    }

    .nav-contact {
        padding:
            5px
            8px;
    }


    /* =====================================================
       HERO
       ===================================================== */

    .simple-hero {
        min-height: auto;

        padding:
            52px
            0
            68px;

        grid-template-columns: 1fr;

        gap: 42px;
    }

    .simple-kicker {
        font-size: 9px;
    }

    .simple-hero h1 {
        font-size: clamp(
            43px,
            13vw,
            62px
        );

        line-height: 0.94;
    }

    .simple-hero-description {
        font-size: 14px;
    }

    .simple-hero-actions {
        flex-direction: column;
    }

    .simple-hero-actions
    .gold-button,

    .simple-hero-actions
    .outline-button {
        width: 100%;
    }

    .simple-hero-visual {
        min-height: 330px;
    }

    .simple-hero-visual::before {
        width: 76%;
    }

    .simple-hero-visual::after {
        width: 55%;
    }

    .simple-hero-logo {
        width: min(
            270px,
            80%
        );

        min-height: 200px;

        padding: 22px;
    }

    .simple-hero-logo img {
        max-width: 235px;

        max-height: 160px;
    }


    /* =====================================================
       DEĞERLER
       ===================================================== */

    .simple-values {
        grid-template-columns: 1fr;
    }

    .simple-value {
        min-height: 0;

        padding:
            20px
            16px;
    }

    .simple-value + .simple-value {
        border-left: none;

        border-top: 1px solid var(--line);
    }


    /* =====================================================
       BAŞLIKLAR
       ===================================================== */

    .simple-section-heading {
        margin-bottom: 30px;
    }

    .simple-section-heading h2,
    .simple-about-heading h2,
    .simple-contact-heading h2 {
        font-size: clamp(
            34px,
            10vw,
            48px
        );
    }


    /* =====================================================
       GÜNCEL PROJELER
       ===================================================== */

    .simple-project-grid {
        grid-template-columns: 1fr;

        gap: 16px;
    }

    .simple-project-image {
        aspect-ratio: 16 / 10;
    }

    .simple-project-content {
        padding:
            18px
            17px
            20px;
    }

    .simple-project-content h3 {
        font-size: 21px;
    }

    .project-placeholder {
        min-height: 280px;
    }

    .project-placeholder-inner {
        padding:
            28px
            22px;
    }


    /* =====================================================
       ESKİ PROJELER
       ===================================================== */

    .simple-old-project-grid {
        grid-template-columns: 1fr;

        gap: 16px;
    }

    .simple-old-image {
        aspect-ratio: 16 / 10;
    }

    .simple-old-content {
        padding: 18px;
    }

    .simple-old-content h3 {
        font-size: 21px;
    }

    .yavuz-selim-card {
        grid-column: auto;

        display: flex;

        flex-direction: column;
    }

    .yavuz-selim-card
    .simple-old-image {
        min-height: 0;

        aspect-ratio: 16 / 10;
    }

    .yavuz-selim-card
    .simple-old-content {
        min-height: 0;

        padding: 18px;

        border-left: none;

        border-top: 1px solid rgba(
            201,
            166,
            70,
            0.14
        );
    }

    .yavuz-selim-card
    .simple-old-content h3 {
        font-size: 21px;
    }


    /* =====================================================
       HAKKIMIZDA
       ===================================================== */

    .simple-about {
        grid-template-columns: 1fr;

        gap: 30px;
    }

    .simple-about::before {
        display: none;
    }

    .simple-about-content {
        padding-left: 18px;
    }

    .simple-about-content
    .about-lead {
        font-size: 17px;
    }


    /* =====================================================
       GEÇMİŞTEN BİR İZ
       ===================================================== */

    .heritage-card-section {
        margin-top: 5px;

        padding:
            35px
            0
            5px;
    }

    .heritage-card-heading {
        margin-bottom: 20px;
    }

    .heritage-card-heading h3 {
        font-size: 29px;
    }

    .heritage-card-heading
    > p:last-child {
        font-size: 13px;
    }

    .heritage-card {
        width: 100%;

        padding: 5px;
    }


    /* =====================================================
       EKİP
       ===================================================== */

    .simple-team {
        grid-template-columns: 1fr;

        gap: 14px;

        margin-top: 15px;
    }

    .simple-team-card {
        min-height: 0;

        padding: 20px;
    }

    .team-initials {
        width: 58px;

        height: 58px;

        font-size: 18px;
    }


    /* =====================================================
       İLETİŞİM
       ===================================================== */

    .simple-contact-heading {
        margin-bottom: 30px;
    }

    .simple-contact-grid {
        grid-template-columns: 1fr;

        gap: 14px;
    }

    .simple-contact-card {
        min-height: 0;

        padding: 22px;
    }

    .simple-contact-card:last-child {
        grid-column: auto;
    }

    .simple-whatsapp {
        flex-direction: column;
    }

    .simple-whatsapp
    .gold-button,

    .simple-whatsapp
    .outline-button {
        width: 100%;
    }


    /* =====================================================
       FOOTER
       ===================================================== */

    .simple-footer-inner {
        min-height: 0;

        padding:
            30px
            0;

        flex-direction: column;

        align-items: flex-start;

        justify-content: center;

        gap: 16px;
    }
}


/* =========================================================
   ÇOK KÜÇÜK TELEFONLAR
   ========================================================= */

@media
(
    max-width: 400px
) {

    .simple-hero h1 {
        font-size: 40px;
    }

    .simple-hero-visual {
        min-height: 290px;
    }

    .simple-hero-logo {
        width: 235px;

        min-height: 175px;

        padding: 20px;
    }

    .simple-hero-logo img {
        max-width: 205px;

        max-height: 145px;
    }

    .simple-team-card {
        grid-template-columns: 1fr;
    }

    .simple-value {
        flex-direction: column;

        align-items: flex-start;

        gap: 5px;
    }

    .heritage-card-heading h3 {
        font-size: 26px;
    }
}