:root {
    --gold: #e6ae43;
    --gold-light: #ffd36e;
    --gold-dark: #ad741d;
    --dark: #05090d;
    --dark-soft: #0b1117;
    --white: #ffffff;
    --text-gray: #aab0b8;
    --green: #42d66d;
    --blue: #2e82ff;
}

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

html {
    scroll-behavior: smooth;
}

body {
    font-family: "Inter", sans-serif;
    background: #ffffff;
    color: #11151b;
    overflow-x: hidden;
}

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

button {
    font-family: inherit;
}

svg {
    display: block;
}

.container {
    width: min(1380px, calc(100% - 80px));
    margin: 0 auto;
}

/* HEADER */

.header {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
    width: 100%;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(2, 7, 11, 0.64);
    backdrop-filter: blur(16px);
}

.navbar {
    height: 110px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 35px;
}

.logo {
    min-width: 250px;
    display: flex;
    align-items: center;
    gap: 14px;
}

.logo-icon {
    width: 69px;
    height: 75px;
}

.logo-icon svg {
    width: 100%;
    height: 100%;
    overflow: visible;
}

.logo-icon svg path {
    fill: none;
    stroke: var(--gold-light);
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.logo-text {
    display: flex;
    flex-direction: column;
}

.logo-text strong {
    color: #ffffff;
    font-family: "Playfair Display", serif;
    font-size: 38px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: 1px;
}

.logo-text span {
    margin-top: 8px;
    color: var(--gold-light);
    font-size: 15px;
    line-height: 1;
    letter-spacing: 8px;
}

.desktop-menu {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 44px;
}

.desktop-menu a {
    position: relative;
    color: #f2f3f5;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    transition: color 0.25s ease;
}

.desktop-menu a:hover {
    color: var(--gold-light);
}

.desktop-menu a::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -22px;
    width: 0;
    height: 1px;
    background: var(--gold);
    transform: translateX(-50%);
    transition: width 0.25s ease;
}

.desktop-menu a:hover::after,
.desktop-menu a.active::after {
    width: 44px;
}

.header-button {
    min-width: 220px;
    height: 54px;
    padding: 0 21px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
    border: 1px solid #bd801e;
    border-radius: 6px;
    color: #f6bd4d;
    font-size: 14px;
    font-weight: 600;
    background: rgba(4, 9, 14, 0.45);
    transition: 0.25s ease;
}

.header-button:hover {
    color: #0b0d10;
    background: var(--gold-light);
}

.header-button .button-user-icon {
    font-size: 19px;
}

.header-button .arrow {
    margin-left: auto;
    font-size: 20px;
}

.mobile-menu-button {
    width: 42px;
    height: 42px;
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.mobile-menu-button span {
    width: 28px;
    height: 2px;
    border-radius: 5px;
    background: #ffffff;
    transition: 0.25s ease;
}

.mobile-menu {
    display: none;
}

/* HERO */

.hero {
    position: relative;
    min-height: 650px;
    padding: 128px 0 20px;
    overflow: hidden;
    color: #ffffff;
    background:
        radial-gradient(
            circle at 75% 32%,
            rgba(34, 60, 84, 0.28),
            transparent 36%
        ),
        linear-gradient(
            130deg,
            #03070a 0%,
            #050b10 46%,
            #071019 100%
        );
}

.hero-lines {
    position: absolute;
    right: -60px;
    bottom: -40px;
    width: 900px;
    height: 400px;
    opacity: 0.5;
    transform: rotate(-3deg);
    background:
        repeating-radial-gradient(
            ellipse at 80% 100%,
            transparent 0 18px,
            rgba(224, 165, 45, 0.13) 19px 20px,
            transparent 21px 35px
        );
}

.hero-light {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    filter: blur(90px);
}

.hero-light-one {
    top: 110px;
    right: 260px;
    width: 300px;
    height: 300px;
    background: rgba(31, 70, 103, 0.13);
}

.hero-light-two {
    right: 0;
    bottom: 30px;
    width: 280px;
    height: 150px;
    background: rgba(218, 153, 30, 0.08);
}

.hero-container {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 0.9fr 1.18fr;
    align-items: center;
    gap: 70px;
}

.hero-content {
    padding: 35px 0 28px;
}

.hero-label {
    margin-bottom: 22px;
    color: var(--gold-light);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.8px;
}

.hero-content h1 {
    margin-bottom: 24px;
    font-size: clamp(44px, 3.2vw, 57px);
    line-height: 1.12;
    font-weight: 800;
    letter-spacing: -2px;
}

.hero-content h1 span {
    color: var(--gold);
}

.hero-description {
    max-width: 590px;
    margin-bottom: 28px;
    color: #f1f3f5;
    font-size: 16px;
    line-height: 1.7;
}

.hero-buttons {
    display: flex;
    align-items: center;
    gap: 24px;
}

.main-button,
.outline-button {
    min-height: 56px;
    padding: 0 24px;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 27px;
    border-radius: 6px;
    font-size: 15px;
    font-weight: 650;
    transition: 0.25s ease;
}



.main-button {
    min-width: 264px;
    color: #111317;
    background: linear-gradient(
        135deg,
        #ffe08b 0%,
        #dea334 100%
    );
    box-shadow: 0 12px 30px rgba(218, 154, 41, 0.18);
}

.main-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 38px rgba(218, 154, 41, 0.28);
}

.outline-button {
    min-width: 229px;
    border: 1px solid #a97220;
    color: #ffffff;
    background: rgba(5, 10, 15, 0.4);
}

.outline-button:hover {
    color: #111317;
    background: var(--gold);
}

.main-button span,
.outline-button span {
    font-size: 20px;
}

.hero-features {
    max-width: 625px;
    margin-top: 31px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.hero-feature {
    min-height: 58px;
    padding-right: 18px;
    display: flex;
    align-items: center;
    gap: 14px;
}

.hero-feature + .hero-feature {
    padding-left: 21px;
    border-left: 1px solid rgba(255, 255, 255, 0.14);
}

.feature-icon {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
}

.feature-icon svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: #ffca4c;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.hero-feature p {
    color: #f0f1f2;
    font-size: 12px;
    line-height: 1.75;
}

/* DASHBOARD */

.hero-dashboard-wrapper {
    position: relative;
    width: 100%;
    padding: 16px 0;
}

.dashboard {
    position: relative;
    z-index: 2;
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 22px;
    background:
        linear-gradient(
            145deg,
            rgba(25, 32, 41, 0.97),
            rgba(8, 13, 18, 0.98)
        );
    box-shadow:
        0 30px 80px rgba(0, 0, 0, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.dashboard-header {
    margin-bottom: 13px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.dashboard-header h2 {
    font-size: 17px;
    font-weight: 600;
}

.date-button {
    padding: 9px 14px;
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 7px;
    color: #ffffff;
    font-size: 12px;
    background: #0c1117;
}

.date-button span {
    margin-left: 17px;
}

.statistics {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.statistic-card {
    min-width: 0;
    padding: 16px;
    border: 1px solid rgba(255, 255, 255, 0.055);
    border-radius: 10px;
    background:
        linear-gradient(
            145deg,
            #111820,
            #0b1016
        );
}

.statistic-title {
    color: #e8ebef;
    font-size: 11px;
    white-space: nowrap;
}

.statistic-symbol {
    margin-right: 6px;
    color: #ffffff;
}

.statistic-card strong {
    margin: 15px 0 7px;
    display: block;
    color: #ffffff;
    font-size: 22px;
    font-weight: 600;
    letter-spacing: 0.2px;
}

.statistic-card small {
    color: var(--green);
    font-size: 11px;
}

.chart-card {
    margin-top: 10px;
    padding: 14px 17px 11px;
    border: 1px solid rgba(255, 255, 255, 0.035);
    border-radius: 10px;
    background: rgba(4, 9, 14, 0.52);
}

.chart-legend {
    margin-bottom: 6px;
    padding-left: 52px;
    display: flex;
    align-items: center;
    gap: 18px;
    color: #d2d7dd;
    font-size: 10px;
}

.chart-legend div {
    display: flex;
    align-items: center;
    gap: 8px;
}

.legend-line {
    width: 11px;
    height: 2px;
    display: inline-block;
}

.legend-line.blue {
    background: var(--blue);
}

.legend-line.green {
    background: #55d878;
}

.chart-content {
    display: flex;
    gap: 9px;
}

.chart-values {
    width: 42px;
    padding: 7px 0 17px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    color: #c4cad1;
    font-size: 9px;
}

.chart-area {
    position: relative;
    flex: 1;
    min-width: 0;
}

.horizontal-lines {
    position: absolute;
    inset: 4px 0 22px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.horizontal-lines span {
    width: 100%;
    height: 1px;
    background: rgba(255, 255, 255, 0.055);
}

.performance-chart {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 126px;
    overflow: visible;
}

.blue-chart-fill {
    fill: url("#blueFill");
}

.green-chart-fill {
    fill: url("#greenFill");
}

.blue-chart-line,
.green-chart-line {
    fill: none;
    stroke-width: 2;
}

.blue-chart-line {
    stroke: var(--blue);
}

.green-chart-line {
    stroke: #55d878;
}

.chart-dates {
    padding: 0 3px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #c4c9cf;
    font-size: 9px;
}

.dashboard-bottom {
    margin-top: 10px;
    display: grid;
    grid-template-columns: 0.92fr 1.1fr;
    gap: 12px;
}

.platform-distribution,
.campaigns {
    padding: 15px;
    border: 1px solid rgba(255, 255, 255, 0.055);
    border-radius: 10px;
    background:
        linear-gradient(
            145deg,
            #111820,
            #0b1016
        );
}

.platform-distribution h3,
.campaigns h3 {
    margin-bottom: 14px;
    color: #ffffff;
    font-size: 13px;
    font-weight: 600;
}

.platform-row {
    margin-top: 12px;
    display: grid;
    grid-template-columns: 25px 82px 1fr 34px;
    align-items: center;
    gap: 8px;
    color: #edf0f4;
    font-size: 11px;
}

.mini-google-icon {
    color: #f8bf24;
    font-size: 16px;
    font-weight: 800;
}

.mini-meta-icon {
    color: #2f84ff;
    font-size: 21px;
    line-height: 1;
}

.progress {
    height: 6px;
    overflow: hidden;
    border-radius: 10px;
    background: #242b34;
}

.progress span {
    height: 100%;
    display: block;
    border-radius: 10px;
    background: var(--blue);
}

.platform-row strong {
    color: #ffffff;
    font-size: 11px;
}

.campaign-row {
    margin-top: 13px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    color: #eef1f5;
    font-size: 11px;
}

.campaign-row strong {
    color: #ffffff;
    font-size: 11px;
}

/* FLOATING LOGOS */

.floating-platform {
    position: absolute;
    z-index: 5;
    display: grid;
    place-items: center;
    border: 1px solid rgba(239, 183, 73, 0.28);
    border-radius: 18px;
    background:
        linear-gradient(
            145deg,
            #181d22,
            #080c10
        );
    box-shadow:
        0 15px 35px rgba(0, 0, 0, 0.55),
        0 0 24px rgba(229, 169, 59, 0.08);
}

.google-floating {
    top: 100px;
    left: -105px;
    width: 88px;
    height: 94px;
}

.meta-floating {
    right: -48px;
    bottom: 105px;
    width: 88px;
    height: 94px;
}

.google-ads-logo,
.service-google-logo {
    position: relative;
    width: 55px;
    height: 58px;
}

.google-blue,
.google-green {
    position: absolute;
    top: 4px;
    width: 17px;
    height: 48px;
    border-radius: 12px;
}

.google-blue {
    left: 27px;
    background: #4285f4;
    transform: rotate(-29deg);
}

.google-green {
    left: 12px;
    top: 19px;
    height: 34px;
    background: #34a853;
    transform: rotate(29deg);
}

.google-yellow {
    position: absolute;
    left: 4px;
    bottom: 0;
    width: 19px;
    height: 19px;
    border-radius: 50%;
    background: #fbbc04;
}

.meta-logo {
    color: #317fff;
    font-size: 63px;
    font-weight: 500;
    line-height: 1;
    transform: translateY(-4px);
}

/* SERVICES */

.services {
    padding: 80px 0 40px;
    background:
        radial-gradient(
            circle at 50% 0,
            #ffffff,
            transparent 44%
        ),
        #f7f8fa;
}

.section-heading {
    margin-bottom: 14px;
    text-align: center;
}

.section-label {
    margin-bottom: 8px;
    color: #bc7e19;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
}

.section-label span {
    margin-right: 5px;
}

.section-heading h2 {
    margin-bottom: 6px;
    color: #10141b;
    font-size: 30px;
    font-weight: 700;
    letter-spacing: -0.8px;
}

.section-description {
    color: #4e5562;
    font-size: 14px;
}

.services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

/* Masaüstünde sadece ilk 3 kart */
.services-grid .service-card:nth-child(n+4){
    display: none;
}

.service-card {
    min-height: 174px;
    padding: 15px;
    display: flex;
    gap: 15px;
    border: 1px solid #e4e7eb;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 8px 20px rgba(31, 42, 55, 0.06);
    transition: 0.25s ease;
}

.service-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 28px rgba(31, 42, 55, 0.1);
}

.service-card-icon {
    width: 60px;
    height: 60px;
    flex: 0 0 60px;
    display: grid;
    place-items: center;
    border: 1px solid #f0debd;
    border-radius: 50%;
    color: #59616c;
    font-size: 29px;
    background: #ffffff;
    box-shadow: 0 6px 18px rgba(183, 130, 33, 0.08);
}

.service-card-icon svg {
    width: 36px;
    height: 36px;
    fill: none;
    stroke: #59616c;
    stroke-width: 2.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.google-service-icon {
    padding: 9px;
}

.service-google-logo {
    width: 43px;
    height: 45px;
    transform: scale(0.8);
}

.meta-service-icon {
    color: #287cf7;
    font-size: 40px;
    line-height: 0.8;
}

.report-service-icon svg {
    stroke: #15bc96;
}

.service-card-content {
    min-width: 0;
}

.service-card-content h3 {
    margin: 10px 0 8px;
    color: #151920;
    font-size: 15px;
    font-weight: 700;
}

.service-card-content p {
    min-height: 58px;
    color: #444c58;
    font-size: 12px;
    line-height: 1.65;
}

.service-card-content a {
    margin-top: 10px;
    display: inline-flex;
    align-items: center;
    gap: 15px;
    color: #c47c0b;
    font-size: 12px;
    font-weight: 600;
}

.service-card-content a:hover {
    color: #8f5800;
}

.trusted-brands {
    margin-top: 14px;
}

.trusted-brands > p {
    margin-bottom: 11px;
    color: #747b86;
    font-size: 10px;
    letter-spacing: 1.7px;
    text-align: center;
}

.brands-grid {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    align-items: center;
    gap: 15px;
    color: #7e8590;
    text-align: center;
}

.brands-grid span {
    font-size: 17px;
    font-weight: 750;
    white-space: nowrap;
}

.brand-trendyol {
    font-weight: 500 !important;
    text-transform: lowercase;
}

.brand-hepsi {
    font-size: 15px !important;
}

.brand-nike {
    display: inline-block;
    font-size: 46px !important;
    line-height: 1;
    transform: rotate(-18deg);
}

.brand-telekom,
.brand-decathlon,
.brand-pegasus {
    font-size: 12px !important;
}

/* TABLET */

@media (max-width: 1250px) {
    .desktop-menu {
        gap: 22px;
    }

    .header-button {
        display: none;
    }

    .hero-container {
        grid-template-columns: 1fr 1.15fr;
        gap: 38px;
    }

    .hero-content h1 {
        font-size: 43px;
    }

    .statistics {
        grid-template-columns: repeat(2, 1fr);
    }

    .google-floating {
        left: -55px;
    }

    .meta-floating {
        right: -18px;
    }
}

@media (max-width: 992px) {
    .container {
        width: min(900px, calc(100% - 40px));
    }

    .navbar {
        height: 88px;
    }

    .logo {
        min-width: 0;
    }

    .logo-icon {
        width: 51px;
        height: 58px;
    }

    .logo-text strong {
        font-size: 27px;
    }

    .logo-text span {
        font-size: 11px;
        letter-spacing: 6px;
    }

    .desktop-menu {
        display: none;
    }

    .mobile-menu-button {
        display: flex;
    }

    .mobile-menu {
        position: absolute;
        top: 88px;
        left: 20px;
        right: 20px;
        padding: 16px;
        flex-direction: column;
        border: 1px solid rgba(255, 255, 255, 0.12);
        border-radius: 10px;
        background: #0b1117;
        box-shadow: 0 20px 45px rgba(0, 0, 0, 0.4);
    }

    .mobile-menu.open {
        display: flex;
    }

    .mobile-menu a {
        padding: 13px 7px;
        color: #ffffff;
        font-size: 14px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    }

    .mobile-analysis-button {
        margin-top: 10px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        border: 1px solid var(--gold-dark) !important;
        border-radius: 6px;
        color: var(--gold-light) !important;
    }

    .hero {
        padding-top: 105px;
    }

    .hero-container {
        grid-template-columns: 1fr;
    }

    .hero-content {
        padding-bottom: 10px;
        text-align: center;
    }

    .hero-description {
        margin-right: auto;
        margin-left: auto;
    }

    .hero-buttons {
        justify-content: center;
    }

    .hero-features {
        margin-right: auto;
        margin-left: auto;
    }

    .hero-dashboard-wrapper {
        max-width: 780px;
        margin: 0 auto;
    }

    .google-floating {
        top: 55px;
        left: -20px;
    }

    .meta-floating {
        right: -10px;
    }

    .services-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .brands-grid {
        grid-template-columns: repeat(4, 1fr);
        row-gap: 21px;
    }
}

/* MOBILE */

@media (max-width: 640px) {
    .container {
        width: calc(100% - 28px);
    }

    .main-button,
.outline-button{
    border-radius: 10px;
}

    .navbar {
        height: 76px;
    }

    .logo {
        gap: 9px;
    }

    .logo-icon {
        width: 43px;
        height: 49px;
    }

    .logo-text strong {
        font-size: 22px;
    }

    .logo-text span {
        margin-top: 6px;
        font-size: 9px;
        letter-spacing: 5px;
    }

    .mobile-menu {
        top: 76px;
        left: 14px;
        right: 14px;
    }

    .hero {
        min-height: auto;
        padding-top: 92px;
    }

    .hero-label {
        font-size: 11px;
    }

    .hero-content h1 {
        font-size: 34px;
        line-height: 1.12;
        letter-spacing: -1px;
        margin-bottom: 20px;
    }

    .hero-description {
        font-size: 14px;
        margin-top: 12px;
        margin-bottom: 20px;
        line-height: 1.6;
    }

    .hero-buttons {
        flex-direction: column;
        gap: 10px;
    }

    .main-button,
.outline-button {
    width: 90%;
    height: 52px;
    min-height: 52px;
    font-size: 15px;
    padding: 0 18px;
}

    .hero-features {
        grid-template-columns: 1fr;
        gap: 13px;
        text-align: left;
    }

    .hero-feature {
        justify-content: flex-start;
    }

    .hero-feature + .hero-feature {
        padding-left: 0;
        border-left: 0;
    }

    .hero-dashboard-wrapper {
        padding-top: 20px;
    }

    .dashboard {
        padding: 12px;
        border-radius: 16px;
    }

    .dashboard-header h2 {
        font-size: 14px;
    }

    .date-button {
        padding: 7px 9px;
        font-size: 10px;
    }

    .date-button span {
        margin-left: 8px;
    }

    .statistics {
        grid-template-columns: repeat(2, 1fr);
        gap: 7px;
    }

    .statistic-card {
        padding: 12px 10px;
    }

    .statistic-title {
        font-size: 9px;
    }

    .statistic-card strong {
        margin: 11px 0 6px;
        font-size: 17px;
    }

    .statistic-card small {
        font-size: 9px;
    }

    .chart-card {
        padding: 10px 8px 8px;
    }

    .chart-legend {
        padding-left: 40px;
        font-size: 8px;
    }

    .chart-values {
        width: 30px;
        font-size: 7px;
    }

    .performance-chart {
        height: 95px;
    }

    .chart-dates {
        font-size: 7px;
    }

    .dashboard-bottom {
        grid-template-columns: 1fr;
    }

    .platform-row {
        grid-template-columns: 23px 75px 1fr 31px;
    }

    .floating-platform {
        display: none;
    }

    .services {
        padding-top: 28px;
    }

    .section-heading h2 {
        font-size: 25px;
    }

    .section-description {
        display: block;
        font-size: 13px;
        line-height: 1.5;
    }

    .services-grid {
        grid-template-columns: 1fr;
    }

    .service-card {
        min-height: auto;
    }

    .brands-grid {
        grid-template-columns: repeat(2, 1fr);
        padding-bottom: 8px;
    }

    .brands-grid span {
        font-size: 15px;
    }
}

@media (max-width: 640px) {
    .hero-features {
        display: none;
    }
}

/* NEDEN KUĞU AJANS */

.why-us {
    padding: 75px 0 60px;
    background:
        radial-gradient(
            circle at 25% 20%,
            rgba(241, 174, 49, 0.06),
            transparent 30%
        ),
        #ffffff;
}

.why-us-container {
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    align-items: center;
    gap: 58px;
}

.small-badge {
    min-height: 34px;
    padding: 7px 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e6a52e;
    border-radius: 30px;
    color: #d88b14;
    font-size: 13px;
    font-weight: 500;
    background: #ffffff;
}

.why-us-content h2 {
    max-width: 620px;
    margin: 20px 0 14px;
    color: #101319;
    font-size: clamp(38px, 3.4vw, 57px);
    line-height: 1.11;
    font-weight: 750;
    letter-spacing: -2.2px;
}

.why-us-content h2 span {
    display: block;
    color: #eba62f;
}

.why-us-description {
    max-width: 590px;
    color: #555d69;
    font-size: 16px;
    line-height: 1.65;
}

.why-us-statistics {
    margin-top: 28px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
}

.why-stat-card {
    position: relative;
    min-height: 111px;
    padding: 22px 24px 22px 28px;
    display: flex;
    align-items: center;
    gap: 23px;
    overflow: hidden;
    border-radius: 14px;
    color: #ffffff;
    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(39, 53, 66, 0.35),
            transparent 45%
        ),
        linear-gradient(135deg, #080c11, #111821);
    box-shadow: 0 10px 20px rgba(14, 19, 25, 0.15);
}

.stat-line {
    position: absolute;
    top: 24px;
    bottom: 24px;
    left: 9px;
    width: 2px;
    border-radius: 4px;
    background: linear-gradient(
        to bottom,
        #ffd166,
        #b87300
    );
}

.why-stat-icon {
    width: 58px;
    height: 58px;
    flex: 0 0 58px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 190, 61, 0.1);
    border-radius: 12px;
    background:
        linear-gradient(
            145deg,
            rgba(255, 195, 74, 0.13),
            rgba(255, 255, 255, 0.02)
        );
    box-shadow: inset 0 0 18px rgba(237, 172, 45, 0.05);
}

.why-stat-icon svg {
    width: 32px;
    height: 32px;
    fill: none;
    stroke: #f3b138;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.why-stat-text {
    display: flex;
    flex-direction: column;
}

.why-stat-text strong {
    color: #ffffff;
    font-size: 31px;
    line-height: 1;
    font-weight: 650;
}

.why-stat-text span {
    margin-top: 12px;
    color: #c7cbd1;
    font-size: 15px;
}

.why-us-image {
    position: relative;
    min-height: 473px;
    overflow: hidden;
    border-radius: 20px;
    background: #090b0e;
    box-shadow: 0 15px 35px rgba(23, 26, 30, 0.12);
}

.why-us-image > img {
    position: absolute;
    z-index: 3;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.office-placeholder {
    position: absolute;
    inset: 0;
    overflow: hidden;
    background:
        linear-gradient(
            90deg,
            rgba(0, 0, 0, 0.22),
            transparent 55%
        ),
        radial-gradient(
            circle at 73% 45%,
            rgba(128, 92, 39, 0.4),
            transparent 25%
        ),
        linear-gradient(
            120deg,
            #080808 0%,
            #17120d 55%,
            #24221c 100%
        );
}

.office-placeholder::after {
    content: "";
    position: absolute;
    top: 0;
    right: 8%;
    width: 18%;
    height: 62%;
    border-left: 6px solid #34312c;
    border-right: 6px solid #34312c;
    background:
        repeating-linear-gradient(
            90deg,
            #d6d1c5 0 3px,
            #161616 3px 12px
        );
    opacity: 0.75;
}

.office-logo {
    position: absolute;
    z-index: 2;
    top: 43px;
    left: 62px;
    display: flex;
    align-items: center;
    gap: 16px;
}

.office-swan {
    color: #eda932;
    font-family: Georgia, serif;
    font-size: 80px;
    font-weight: 700;
    font-style: italic;
    line-height: 1;
}

.office-logo div:last-child {
    display: flex;
    flex-direction: column;
}

.office-logo strong {
    color: #dedede;
    font-family: Georgia, serif;
    font-size: 42px;
    letter-spacing: 2px;
}

.office-logo span {
    margin-top: 2px;
    color: #eba934;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 7px;
}

.office-desk {
    position: absolute;
    right: -5%;
    bottom: -17%;
    left: 0;
    height: 53%;
    background:
        repeating-linear-gradient(
            5deg,
            rgba(255, 255, 255, 0.03) 0 1px,
            transparent 1px 19px
        ),
        linear-gradient(
            160deg,
            #342315,
            #0e0c0a 55%,
            #1b130e
        );
    transform: perspective(600px) rotateX(6deg);
}

.office-laptop {
    position: absolute;
    top: -104px;
    left: 47%;
    width: 180px;
    height: 130px;
    border: 2px solid #d6d6d6;
    border-radius: 8px;
    background: linear-gradient(
        135deg,
        #49433c,
        #171717
    );
    transform: skewY(5deg);
    box-shadow: 0 15px 15px rgba(0, 0, 0, 0.5);
}

.office-laptop::after {
    content: "";
    position: absolute;
    right: -15px;
    bottom: -13px;
    left: -5px;
    height: 13px;
    border-radius: 2px;
    background: #99958f;
}

.office-book {
    position: absolute;
    top: 38px;
    left: 15%;
    width: 220px;
    height: 65px;
    padding-top: 23px;
    color: #dd9f2e;
    font-family: Georgia, serif;
    font-size: 13px;
    letter-spacing: 2px;
    text-align: center;
    background: #090909;
    border-bottom: 8px solid #b7aa94;
    transform: rotate(-5deg);
    box-shadow: 0 8px 12px rgba(0, 0, 0, 0.65);
}

.office-cup {
    position: absolute;
    top: -14px;
    right: 13%;
    width: 56px;
    height: 70px;
    padding-top: 18px;
    border-radius: 4px 4px 14px 14px;
    color: #dd9d27;
    font-family: Georgia, serif;
    font-size: 24px;
    text-align: center;
    background: #070707;
    box-shadow: 0 8px 14px rgba(0, 0, 0, 0.5);
}

.office-cup::after {
    content: "";
    position: absolute;
    top: 17px;
    right: -18px;
    width: 21px;
    height: 29px;
    border: 5px solid #070707;
    border-left: 0;
    border-radius: 0 16px 16px 0;
}

.office-plant {
    position: absolute;
    z-index: 2;
    top: -66px;
    left: 13%;
    width: 61px;
    height: 80px;
    border-radius: 50% 50% 15px 15px;
    background:
        radial-gradient(
            ellipse at 30% 25%,
            #638331,
            transparent 25%
        ),
        radial-gradient(
            ellipse at 65% 25%,
            #456c25,
            transparent 28%
        ),
        radial-gradient(
            ellipse at 50% 55%,
            #294d19,
            transparent 40%
        );
}

.office-plant::after {
    content: "";
    position: absolute;
    bottom: -18px;
    left: 10px;
    width: 42px;
    height: 28px;
    background: #090909;
}


/* KAPSAMLI DİJİTAL ÇÖZÜMLER */

.solutions {
    padding: 23px 0 64px;
    border-top: 1px solid #e7e7e7;
    background:
        radial-gradient(
            circle at 50% 35%,
            rgba(242, 178, 53, 0.06),
            transparent 25%
        ),
        #ffffff;
}

.solutions-heading {
    margin-bottom: 23px;
    text-align: center;
}

.solutions-heading h2 {
    margin: 14px 0 5px;
    color: #111419;
    font-size: clamp(34px, 3vw, 45px);
    font-weight: 750;
    letter-spacing: -1.5px;
}

.solutions-heading h2 span {
    color: #e9a42e;
}

.solutions-heading p {
    color: #626873;
    font-size: 14px;
}

.solutions-layout {
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 310px 1fr;
    align-items: stretch;
    gap: 28px;
}

.solution-column {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 13px;
}

.solution-item {
    min-height: 82px;
    padding: 12px 20px 12px 16px;
    display: grid;
    grid-template-columns: 57px 1fr 30px;
    align-items: center;
    gap: 17px;
    border: 1px solid rgba(255, 255, 255, 0.03);
    border-radius: 14px;
    color: #ffffff;
    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(54, 69, 84, 0.25),
            transparent 40%
        ),
        linear-gradient(135deg, #080c11, #111821);
    box-shadow: 0 7px 14px rgba(12, 17, 22, 0.17);
    transition: 0.25s ease;
}

.solution-item:hover {
    border-color: rgba(235, 168, 43, 0.38);
    transform: translateY(-3px);
}

.solution-icon {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 193, 66, 0.08);
    border-radius: 11px;
    color: #f0ad32;
    background:
        linear-gradient(
            145deg,
            rgba(255, 190, 56, 0.13),
            rgba(255, 255, 255, 0.02)
        );
}

.solution-icon svg {
    width: 31px;
    height: 31px;
    fill: none;
    stroke: #f0ad32;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.solution-letter {
    font-size: 31px;
    font-weight: 800;
}

.solution-meta {
    font-size: 42px;
    font-weight: 600;
    line-height: 1;
}

.solution-item > span {
    font-size: 16px;
    font-weight: 650;
}

.solution-item > strong {
    color: #efaa2d;
    font-size: 29px;
    font-weight: 300;
    transition: transform 0.25s ease;
}

.solution-item:hover > strong {
    transform: translateX(4px);
}

.solutions-center {
    position: relative;
    min-height: 272px;
    padding: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 2px solid #dc9924;
    border-radius: 18px;
    color: #ffffff;
    background:
        radial-gradient(
            circle at 50% 42%,
            rgba(45, 59, 72, 0.3),
            transparent 38%
        ),
        linear-gradient(145deg, #080c11, #101720);
    box-shadow:
        0 10px 20px rgba(15, 18, 23, 0.2),
        inset 0 0 30px rgba(230, 161, 43, 0.04);
}

.center-lines {
    position: absolute;
    inset: 0;
    opacity: 0.35;
    background:
        repeating-radial-gradient(
            ellipse at 50% 65%,
            transparent 0 23px,
            rgba(220, 157, 45, 0.25) 24px 25px,
            transparent 26px 42px
        );
}

.center-logo-symbol,
.solutions-center strong,
.solutions-center > span {
    position: relative;
    z-index: 2;
}

.center-logo-symbol {
    margin-bottom: -5px;
    color: #e9a72f;
    font-family: Georgia, serif;
    font-size: 81px;
    font-weight: 700;
    font-style: italic;
    line-height: 1;
}

.solutions-center strong {
    font-family: Georgia, serif;
    font-size: 44px;
    line-height: 1;
    letter-spacing: 2px;
}

.solutions-center > span {
    margin-top: 9px;
    color: #efad35;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 8px;
}


/* TABLET */

@media (max-width: 992px) {

    .why-us {
        padding: 55px 0;
    }

    .why-us-container {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .why-us-content {
        text-align: center;
    }

    .why-us-content h2,
    .why-us-description {
        margin-right: auto;
        margin-left: auto;
    }

    .why-us-image {
        min-height: 430px;
    }

    .solutions-layout {
        grid-template-columns: 1fr 1fr;
    }

    .solutions-center {
        grid-column: 1 / -1;
        grid-row: 1;
        min-height: 260px;
    }

}


/* MOBİL */

@media (max-width: 640px) {

    .why-us {
        padding: 42px 0 35px;
    }

    .why-us-content h2 {
        margin-top: 16px;
        font-size: 34px;
        line-height: 1.13;
        letter-spacing: -1.3px;
    }

    .why-us-description {
        font-size: 14px;
    }

    .why-us-statistics {
        grid-template-columns: 1fr;
        gap: 11px;
    }

    .why-stat-card {
        min-height: 91px;
        padding: 16px 19px 16px 25px;
    }

    .why-stat-icon {
        width: 52px;
        height: 52px;
        flex-basis: 52px;
    }

    .why-stat-text strong {
        font-size: 27px;
    }

    .why-stat-text span {
        margin-top: 7px;
        font-size: 14px;
    }

    .why-us-image {
        min-height: 320px;
        border-radius: 15px;
    }

    .office-logo {
        top: 31px;
        left: 28px;
    }

    .office-swan {
        font-size: 55px;
    }

    .office-logo strong {
        font-size: 30px;
    }

    .office-logo span {
        font-size: 12px;
        letter-spacing: 5px;
    }

    .office-laptop {
        left: 47%;
        width: 130px;
        height: 95px;
    }

    .office-book {
        left: 8%;
        width: 150px;
    }

    .solutions {
        padding: 35px 0 45px;
    }

    .solutions-heading h2 {
        font-size: 32px;
        line-height: 1.15;
    }

    .solutions-heading p {
        font-size: 13px;
        line-height: 1.55;
    }

    .solutions-layout {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .solutions-center {
        grid-column: auto;
        grid-row: auto;
        min-height: 240px;
        order: -1;
    }

    .solution-column {
        gap: 11px;
    }

    .solution-item {
        min-height: 75px;
        grid-template-columns: 50px 1fr 24px;
        padding: 11px 16px 11px 12px;
        gap: 13px;
    }

    .solution-icon {
        width: 49px;
        height: 49px;
    }

    .solution-item > span {
        font-size: 15px;
    }

    .solution-item > strong {
        font-size: 25px;
    }

}

/* FİYATLANDIRMA BÖLÜMÜ */

.pricing-section {
    padding: 70px 0 55px;
    background:
        radial-gradient(
            circle at 50% 15%,
            rgba(235, 169, 44, 0.07),
            transparent 30%
        ),
        #ffffff;
}

.pricing-heading {
    max-width: 1050px;
    margin: 0 auto 45px;
    text-align: center;
}

.pricing-badge {
    min-height: 35px;
    padding: 7px 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e2a02c;
    border-radius: 30px;
    color: #d58912;
    font-size: 14px;
    font-weight: 600;
    background: #ffffff;
}

.pricing-heading h2 {
    margin: 20px 0 13px;
    color: #080a0d;
    font-size: clamp(40px, 4vw, 59px);
    line-height: 1.13;
    font-weight: 800;
    letter-spacing: -2.3px;
}

.pricing-heading h2 span {
    color: #e3a029;
}

.pricing-heading p {
    max-width: 690px;
    margin: 0 auto;
    color: #464d58;
    font-size: 18px;
    line-height: 1.55;
}

.pricing-grid {
    max-width: 1180px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: stretch;
    gap: 25px;
}

.pricing-card {
    position: relative;
    min-height: 610px;
    padding: 26px 32px 31px;
    display: flex;
    flex-direction: column;
    overflow: visible;
    border: 1px solid rgba(255, 255, 255, 0.04);
    border-radius: 25px;
    color: #ffffff;
    background:
        radial-gradient(
            circle at 70% 30%,
            rgba(45, 59, 73, 0.25),
            transparent 42%
        ),
        linear-gradient(
            145deg,
            #0a0e13,
            #121923
        );
    box-shadow: 0 14px 26px rgba(20, 25, 31, 0.16);
}

.pricing-card-popular {
    border: 1px solid #e5a126;
    box-shadow:
        0 15px 30px rgba(20, 25, 31, 0.2),
        0 0 22px rgba(229, 161, 38, 0.16);
}

.popular-label {
    position: absolute;
    top: -17px;
    right: 16px;
    min-height: 39px;
    padding: 9px 17px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 24px;
    color: #111419;
    font-size: 14px;
    font-weight: 750;
    background: linear-gradient(
        135deg,
        #ffbd28,
        #eca51d
    );
    box-shadow: 0 7px 16px rgba(231, 162, 35, 0.2);
}

.pricing-icon {
    width: 68px;
    height: 68px;
    margin-bottom: 15px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 189, 61, 0.07);
    border-radius: 14px;
    background:
        linear-gradient(
            145deg,
            rgba(255, 195, 77, 0.14),
            rgba(255, 255, 255, 0.03)
        );
}

.pricing-icon svg {
    width: 38px;
    height: 38px;
    fill: none;
    stroke: #f2ac28;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.pricing-card h3 {
    margin-bottom: 6px;
    color: #ffffff;
    font-size: 29px;
    line-height: 1.2;
    font-weight: 750;
}

.pricing-subtitle {
    color: #d1d4d8;
    font-size: 15px;
    line-height: 1.5;
}

.pricing-line {
    width: 38px;
    height: 2px;
    margin: 23px 0 19px;
    display: block;
    background: #e5a127;
}

.pricing-price {
    margin-bottom: 22px;
    display: flex;
    flex-direction: column;
}

.pricing-price strong {
    color: #ffffff;
    font-size: 39px;
    line-height: 1.1;
    font-weight: 750;
    letter-spacing: -1px;
}

.pricing-price strong span {
    color: #eca627;
}

.pricing-price small {
    margin-top: 6px;
    color: #efaa28;
    font-size: 18px;
    font-weight: 500;
}

.pricing-offer-price strong {
    font-size: 35px;
}

.pricing-features {
    margin: 0 0 25px;
    padding: 0;
    list-style: none;
}

.pricing-features li {
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 11px;
    color: #f1f2f3;
    font-size: 16px;
    line-height: 1.3;
}

.pricing-features li span {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    display: grid;
    place-items: center;
    border: 1.5px solid #eca827;
    border-radius: 50%;
    color: #eca827;
    font-size: 11px;
    font-weight: 700;
}

.pricing-button {
    width: 100%;
    min-height: 59px;
    margin-top: auto;
    padding: 0 27px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 35px;
    border-radius: 11px;
    font-size: 17px;
    font-weight: 650;
    transition: 0.25s ease;
}

.pricing-button span {
    margin-left: auto;
    font-size: 27px;
    font-weight: 300;
}

.pricing-outline-button {
    border: 1px solid #e8a51f;
    color: #ffffff;
    background: transparent;
}

.pricing-outline-button:hover {
    color: #101318;
    background: #e8a51f;
    transform: translateY(-2px);
}

.pricing-filled-button {
    color: #101318;
    background: linear-gradient(
        135deg,
        #ffbf32,
        #efa91f
    );
    box-shadow: 0 9px 22px rgba(233, 164, 34, 0.18);
}

.pricing-filled-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 27px rgba(233, 164, 34, 0.28);
}

.pricing-information {
    max-width: 1180px;
    min-height: 88px;
    margin: 30px auto 0;
    padding: 18px 30px;
    display: flex;
    align-items: center;
    gap: 22px;
    border-radius: 15px;
    color: #d9dde1;
    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(54, 68, 82, 0.2),
            transparent 35%
        ),
        linear-gradient(
            135deg,
            #0b0f14,
            #131a23
        );
    box-shadow: 0 8px 18px rgba(20, 25, 31, 0.14);
}

.pricing-info-icon {
    width: 37px;
    height: 37px;
    flex: 0 0 37px;
    display: grid;
    place-items: center;
    border: 2px solid #eda723;
    border-radius: 50%;
    color: #eda723;
    font-size: 22px;
    font-family: Georgia, serif;
    font-weight: 700;
}

.pricing-information p {
    color: #dadde1;
    font-size: 15px;
    line-height: 1.55;
}

.pricing-information p span {
    display: block;
}


/* TABLET */

@media (max-width: 992px) {

    .pricing-section {
        padding: 55px 0 45px;
    }

    .pricing-grid {
    grid-template-columns: 1fr;
    gap: 12px;
}

    .pricing-card:last-child {
        grid-column: 1 / -1;
        width: calc(50% - 13px);
        margin: 0 auto;
    }

}


/* MOBİL */

@media (max-width: 640px) {

    .pricing-section {
        padding: 43px 0 35px;
    }

    .pricing-heading {
        margin-bottom: 36px;
    }

    .pricing-badge {
        min-height: 32px;
        padding: 6px 14px;
        font-size: 12px;
    }

    .pricing-heading h2 {
        margin: 16px 0 12px;
        font-size: 33px;
        line-height: 1.14;
        letter-spacing: -1.3px;
    }

    .pricing-heading h2 span {
        display: block;
    }

    .pricing-heading p {
        font-size: 14px;
        line-height: 1.6;
    }

    .pricing-grid {
    grid-template-columns: 1fr;
    gap: 12px;
}

    .pricing-card,
    .pricing-card:last-child {
        width: 100%;
        min-height: auto;
        padding: 25px 23px 24px;
        grid-column: auto;
        border-radius: 19px;
    }

    .pricing-card-popular {
        margin-top: 8px;
    }

    .popular-label {
        top: -15px;
        right: 14px;
        min-height: 34px;
        padding: 7px 13px;
        font-size: 12px;
    }

    .pricing-icon {
        width: 60px;
        height: 60px;
    }

    .pricing-icon svg {
        width: 33px;
        height: 33px;
    }

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

    .pricing-subtitle {
        font-size: 14px;
    }

    .pricing-line {
        margin: 19px 0 17px;
    }

    .pricing-price strong {
        font-size: 35px;
    }

    .pricing-offer-price strong {
        font-size: 32px;
    }

    .pricing-price small {
        font-size: 16px;
    }

    .pricing-features li {
        margin-bottom: 13px;
        font-size: 15px;
    }

    .pricing-button {
        min-height: 54px;
        margin-top: 8px;
        padding: 0 20px;
        font-size: 15px;
    }

    .pricing-information {
    margin-top: 0;
    padding: 17px;
    align-items: flex-start;
    gap: 14px;
    border-radius: 13px;
}

    .pricing-info-icon {
        width: 33px;
        height: 33px;
        flex-basis: 33px;
        font-size: 19px;
    }

    .pricing-information p {
        font-size: 13px;
    }

}

/* SIKÇA SORULAN SORULAR */

.faq-section {
    padding: 75px 0 55px;
    background:
        radial-gradient(
            circle at 70% 25%,
            rgba(233, 165, 40, 0.05),
            transparent 34%
        ),
        #ffffff;
}

.faq-layout {
    display: grid;
    grid-template-columns: 1.45fr 0.82fr;
    align-items: stretch;
    gap: 58px;
}

.faq-badge {
    min-height: 44px;
    padding: 0 17px;
    display: inline-flex;
    align-items: center;
    gap: 11px;
    border-radius: 8px;
    color: #f2ae2f;
    font-size: 17px;
    font-weight: 700;
    background: linear-gradient(
        145deg,
        #0b0f14,
        #151c25
    );
}

.faq-badge span {
    font-size: 18px;
}

.faq-left h2 {
    margin: 27px 0 11px;
    color: #0c0f14;
    font-size: clamp(42px, 4vw, 65px);
    line-height: 1.08;
    font-weight: 800;
    letter-spacing: -2.5px;
}

.faq-left h2 span {
    color: #dda027;
}

.faq-description {
    margin-bottom: 30px;
    color: #656c77;
    font-size: 17px;
    line-height: 1.6;
}

.faq-list {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.faq-item {
    overflow: hidden;
    border: 1px solid transparent;
    border-radius: 14px;
    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(49, 63, 77, 0.28),
            transparent 42%
        ),
        linear-gradient(
            145deg,
            #090d12,
            #141b24
        );
    box-shadow: 0 7px 16px rgba(12, 17, 22, 0.14);
    transition: 0.25s ease;
}

.faq-item.active {
    border-color: #d99b22;
    box-shadow:
        0 8px 20px rgba(12, 17, 22, 0.18),
        0 0 18px rgba(225, 157, 33, 0.1);
}

.faq-question {
    width: 100%;
    min-height: 77px;
    padding: 0 27px;
    display: grid;
    grid-template-columns: 43px 1fr 30px;
    align-items: center;
    gap: 16px;
    border: 0;
    color: #ffffff;
    text-align: left;
    background: transparent;
    cursor: pointer;
}

.faq-toggle-icon {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border: 1px solid #d99a20;
    border-radius: 50%;
    color: #e5a326;
    font-size: 25px;
    font-weight: 300;
    line-height: 1;
}

.faq-question-text {
    font-size: 20px;
    font-weight: 650;
}

.faq-arrow {
    color: #e5a326;
    font-size: 30px;
    line-height: 1;
    text-align: right;
}

.faq-answer {
    max-height: 0;
    padding: 0 27px;
    display: flex;
    align-items: center;
    gap: 27px;
    overflow: hidden;
    opacity: 0;
    transition:
        max-height 0.4s ease,
        padding 0.4s ease,
        opacity 0.3s ease;
}

.faq-item.active .faq-answer {
    max-height: 300px;
    padding: 7px 27px 31px;
    opacity: 1;
}

.faq-answer-icon {
    width: 147px;
    height: 92px;
    flex: 0 0 147px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 19px;
    border: 1px solid rgba(226, 158, 32, 0.65);
    border-radius: 13px;
    background: rgba(4, 8, 12, 0.38);
}

.faq-google-symbol {
    color: #e2a12b;
    font-size: 39px;
    font-weight: 700;
    transform: skewX(-14deg);
}

.faq-meta-symbol {
    color: #e2a12b;
    font-size: 53px;
    line-height: 1;
}

.faq-answer p {
    color: #d5d8dd;
    font-size: 16px;
    line-height: 1.65;
}


/* DESTEK KARTI */

.faq-support-card {
    position: relative;
    min-height: 660px;
    padding: 52px 33px 31px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 27px;
    color: #ffffff;
    background:
        radial-gradient(
            circle at 50% 25%,
            rgba(52, 66, 81, 0.25),
            transparent 38%
        ),
        linear-gradient(
            145deg,
            #080c11,
            #131a23
        );
    box-shadow:
        0 15px 30px rgba(19, 24, 31, 0.18),
        inset 0 0 30px rgba(230, 164, 39, 0.03);
}

.support-lines {
    position: absolute;
    right: -120px;
    bottom: -10px;
    width: 430px;
    height: 480px;
    opacity: 0.35;
    background:
        repeating-radial-gradient(
            ellipse at 100% 100%,
            transparent 0 21px,
            rgba(222, 159, 38, 0.24) 22px 23px,
            transparent 24px 39px
        );
}

.support-chat-icon {
    position: relative;
    z-index: 2;
    width: 145px;
    height: 145px;
    margin: 0 auto 22px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(227, 165, 42, 0.65);
    border-radius: 50%;
}

.support-chat-icon::before,
.support-chat-icon::after {
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #ffca54;
    box-shadow: 0 0 12px #ffb52c;
}

.support-chat-icon::before {
    top: 18px;
    left: 13px;
}

.support-chat-icon::after {
    right: 11px;
    bottom: 20px;
}

.support-chat-one {
    position: relative;
    z-index: 3;
    width: 61px;
    height: 49px;
    padding-top: 8px;
    display: block;
    border-radius: 50%;
    color: #11151a;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: 3px;
    text-align: center;
    background: #e6a42d;
}

.support-chat-one::after {
    content: "";
    position: absolute;
    bottom: -8px;
    left: 11px;
    border-width: 9px 8px 0 0;
    border-style: solid;
    border-color: #e6a42d transparent transparent transparent;
}

.support-chat-two {
    position: absolute;
    right: 32px;
    bottom: 38px;
    width: 52px;
    height: 39px;
    border-radius: 50%;
    background: rgba(216, 152, 34, 0.75);
}

.faq-support-card h3 {
    position: relative;
    z-index: 2;
    margin-bottom: 16px;
    font-size: 37px;
    line-height: 1.18;
    font-weight: 750;
    letter-spacing: -1px;
    text-align: center;
}

.faq-support-card h3 span {
    color: #e4a128;
}

.support-description {
    position: relative;
    z-index: 2;
    max-width: 290px;
    margin: 0 auto;
    color: #d1d4d8;
    font-size: 17px;
    line-height: 1.55;
    text-align: center;
}

.support-divider {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 1px;
    margin: 31px 0 25px;
    background: linear-gradient(
        90deg,
        rgba(230, 164, 41, 0.65),
        rgba(230, 164, 41, 0.1)
    );
}

.support-features {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.support-feature {
    display: flex;
    align-items: center;
    gap: 18px;
}

.support-feature-icon {
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(228, 161, 35, 0.75);
    border-radius: 50%;
}

.support-feature-icon svg {
    width: 28px;
    height: 28px;
    fill: none;
    stroke: #e6a32a;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.support-feature div:last-child {
    display: flex;
    flex-direction: column;
}

.support-feature strong {
    margin-bottom: 3px;
    color: #ffffff;
    font-size: 16px;
}

.support-feature span {
    color: #c8ccd1;
    font-size: 14px;
    line-height: 1.45;
}

.support-button {
    position: relative;
    z-index: 2;
    width: 100%;
    min-height: 60px;
    margin-top: auto;
    padding: 0 24px;
    display: grid;
    grid-template-columns: 28px 1fr 25px;
    align-items: center;
    gap: 15px;
    border-radius: 9px;
    color: #111419;
    font-size: 16px;
    font-weight: 700;
    background: linear-gradient(
        135deg,
        #ffc33e,
        #e8a126
    );
    transition: 0.25s ease;
}

.support-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 22px rgba(226, 158, 34, 0.25);
}

.support-phone {
    font-size: 25px;
}

.support-button strong {
    font-size: 28px;
    font-weight: 300;
}


/* ALT İLETİŞİM ÇUBUĞU */

.faq-contact-bar {
    min-height: 112px;
    margin-top: 44px;
    padding: 23px 38px;
    display: grid;
    grid-template-columns: 1.18fr 1fr;
    align-items: center;
    gap: 28px;
    border-radius: 17px;
    color: #ffffff;
    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(49, 64, 78, 0.25),
            transparent 38%
        ),
        linear-gradient(
            145deg,
            #090d12,
            #151c25
        );
    box-shadow: 0 9px 20px rgba(18, 23, 29, 0.16);
}

.faq-contact-intro {
    display: flex;
    align-items: center;
    gap: 22px;
}

.faq-message-icon {
    width: 62px;
    height: 62px;
    flex: 0 0 62px;
    display: grid;
    place-items: center;
    border: 1px solid #e2a027;
    border-radius: 50%;
}

.faq-message-icon svg {
    width: 33px;
    height: 33px;
    fill: none;
    stroke: #e2a027;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.faq-contact-intro p {
    color: #e1e3e6;
    font-size: 16px;
    line-height: 1.5;
}

.faq-contact-intro p span {
    display: block;
}

.faq-contact-intro p a {
    color: #e5a329;
    font-weight: 650;
}

.faq-contact-links {
    min-height: 59px;
    padding-left: 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-left: 1px solid rgba(229, 164, 40, 0.35);
}

.faq-contact-links a {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #f0f1f2;
    font-size: 13px;
    white-space: nowrap;
}

.faq-contact-links a span {
    color: #e6a329;
    font-size: 21px;
}


/* TABLET */

@media (max-width: 992px) {

    .faq-section {
        padding: 55px 0 45px;
    }

    .faq-layout {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .faq-support-card {
        min-height: 610px;
        max-width: 610px;
        width: 100%;
        margin: 0 auto;
    }

    .faq-contact-bar {
        grid-template-columns: 1fr;
    }

    .faq-contact-links {
        padding: 22px 0 0;
        border-top: 1px solid rgba(229, 164, 40, 0.35);
        border-left: 0;
    }

}


/* MOBİL */

@media (max-width: 640px) {

    .faq-section {
        padding: 43px 0 35px;
    }

    .faq-badge {
        min-height: 37px;
        font-size: 14px;
    }

    .faq-left h2 {
        margin-top: 20px;
        font-size: 38px;
        line-height: 1.1;
        letter-spacing: -1.7px;
    }

    .faq-left h2 span {
        display: block;
    }

    .faq-description {
        margin-bottom: 23px;
        font-size: 14px;
    }

    .faq-question {
        min-height: 70px;
        padding: 0 16px;
        grid-template-columns: 37px 1fr 23px;
        gap: 11px;
    }

    .faq-toggle-icon {
        width: 35px;
        height: 35px;
        font-size: 22px;
    }

    .faq-question-text {
        font-size: 15px;
        line-height: 1.35;
    }

    .faq-arrow {
        font-size: 24px;
    }

    .faq-item.active .faq-answer {
        max-height: 500px;
        padding: 3px 17px 23px;
    }

    .faq-answer {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }

    .faq-answer-icon {
        width: 112px;
        height: 67px;
        flex-basis: 67px;
    }

    .faq-google-symbol {
        font-size: 28px;
    }

    .faq-meta-symbol {
        font-size: 39px;
    }

    .faq-answer p {
        font-size: 14px;
        line-height: 1.6;
    }

    .faq-support-card {
        min-height: 580px;
        padding: 38px 22px 23px;
        border-radius: 20px;
    }

    .support-chat-icon {
        width: 117px;
        height: 117px;
    }

    .faq-support-card h3 {
        font-size: 31px;
    }

    .support-description {
        font-size: 15px;
    }

    .support-divider {
        margin: 25px 0 21px;
    }

    .support-feature {
        gap: 14px;
    }

    .support-feature-icon {
        width: 46px;
        height: 46px;
        flex-basis: 46px;
    }

    .support-feature strong {
        font-size: 15px;
    }

    .support-feature span {
        font-size: 13px;
    }

    .support-button {
        min-height: 55px;
        padding: 0 17px;
        grid-template-columns: 24px 1fr 21px;
        font-size: 14px;
    }

    .faq-contact-bar {
        margin-top: 28px;
        padding: 21px 18px;
        gap: 20px;
    }

    .faq-contact-intro {
        align-items: flex-start;
        gap: 15px;
    }

    .faq-message-icon {
        width: 48px;
        height: 48px;
        flex-basis: 48px;
    }

    .faq-message-icon svg {
        width: 27px;
        height: 27px;
    }

    .faq-contact-intro p {
        font-size: 14px;
    }

    .faq-contact-links {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }

    .faq-contact-links a {
        font-size: 13px;
    }

}

/* MÜŞTERİ YORUMLARI */

.testimonials-section {
    padding: 60px 0 55px;
    background:
        radial-gradient(
            circle at 50% 20%,
            rgba(229, 164, 39, 0.05),
            transparent 28%
        ),
        #ffffff;
}

.testimonials-heading {
    margin-bottom: 28px;
    text-align: center;
}

.testimonials-badge {
    min-height: 30px;
    padding: 5px 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dca02f;
    border-radius: 25px;
    color: #c98513;
    font-size: 12px;
    font-weight: 600;
    background: #ffffff;
}

.testimonials-heading h2 {
    margin: 13px 0 5px;
    color: #0c0f13;
    font-size: clamp(35px, 3.5vw, 52px);
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: -1.8px;
}

.testimonials-heading h2 span {
    color: #dda027;
}

.testimonials-heading p {
    color: #737984;
    font-size: 14px;
    line-height: 1.55;
}

.testimonials-grid {
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px 22px;
}

.testimonial-card {
    position: relative;
    min-height: 255px;
    padding: 20px 22px 19px;
    display: flex;
    flex-direction: column;
    overflow: visible;
    border: 1px solid rgba(255, 255, 255, 0.04);
    border-radius: 13px;
    color: #ffffff;
    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(50, 63, 77, 0.3),
            transparent 40%
        ),
        linear-gradient(
            145deg,
            #090d12,
            #151c25
        );
    box-shadow: 0 7px 16px rgba(14, 19, 25, 0.17);
    transition: 0.25s ease;
}

.testimonial-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 13px 24px rgba(14, 19, 25, 0.2);
}

.testimonial-featured {
    border-color: #dda025;
    box-shadow:
        0 8px 20px rgba(14, 19, 25, 0.2),
        0 0 18px rgba(224, 159, 35, 0.12);
}

.featured-label {
    position: absolute;
    top: -14px;
    right: 17px;
    min-height: 30px;
    padding: 6px 13px;
    border-radius: 5px;
    color: #111419;
    font-size: 11px;
    font-weight: 700;
    background: linear-gradient(
        135deg,
        #ffc140,
        #dfa020
    );
}

.testimonial-stars {
    margin-bottom: 16px;
    color: #f1aa24;
    font-size: 18px;
    letter-spacing: 2px;
}

.testimonial-quote {
    position: absolute;
    top: 14px;
    right: 19px;
    color: rgba(255, 255, 255, 0.2);
    font-family: Georgia, serif;
    font-size: 58px;
    font-weight: 700;
    line-height: 1;
}

.testimonial-text {
    margin-bottom: 18px;
    color: #e1e4e8;
    font-size: 13px;
    line-height: 1.7;
}

.testimonial-author {
    margin-top: auto;
    display: flex;
    align-items: center;
    gap: 14px;
}

.testimonial-author-icon {
    width: 47px;
    height: 47px;
    flex: 0 0 47px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(226, 161, 39, 0.65);
    border-radius: 50%;
    background:
        linear-gradient(
            145deg,
            rgba(255, 193, 64, 0.1),
            rgba(255, 255, 255, 0.02)
        );
}

.testimonial-author-icon svg {
    width: 27px;
    height: 27px;
    fill: none;
    stroke: #e5a227;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.testimonial-author > div:last-child {
    display: flex;
    flex-direction: column;
}

.testimonial-author strong {
    margin-bottom: 3px;
    color: #ffffff;
    font-size: 15px;
}

.testimonial-author span {
    color: #e3a027;
    font-size: 12px;
}


/* ALT İSTATİSTİK ALANI */

.testimonials-statistics {
    max-width: 1120px;
    min-height: 91px;
    margin: 24px auto 0;
    padding: 15px 22px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: center;
    border-radius: 13px;
    color: #ffffff;
    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(49, 63, 76, 0.28),
            transparent 40%
        ),
        linear-gradient(
            145deg,
            #090d12,
            #151c25
        );
    box-shadow: 0 8px 18px rgba(15, 20, 26, 0.16);
}

.testimonial-stat {
    min-height: 59px;
    padding: 0 22px;
    display: flex;
    align-items: center;
    gap: 15px;
}

.testimonial-stat + .testimonial-stat {
    border-left: 1px solid rgba(255, 255, 255, 0.11);
}

.testimonial-stat-icon {
    width: 51px;
    height: 51px;
    flex: 0 0 51px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(225, 160, 37, 0.6);
    border-radius: 50%;
    background:
        linear-gradient(
            145deg,
            rgba(255, 191, 58, 0.11),
            rgba(255, 255, 255, 0.02)
        );
}

.testimonial-stat-icon svg {
    width: 28px;
    height: 28px;
    fill: none;
    stroke: #e2a027;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.testimonial-stat > div:last-child {
    display: flex;
    flex-direction: column;
}

.testimonial-stat strong {
    color: #ffffff;
    font-size: 23px;
    line-height: 1.1;
    font-weight: 700;
}

.testimonial-stat span {
    margin-top: 5px;
    color: #d3d6db;
    font-size: 11px;
}


/* TABLET */

@media (max-width: 992px) {

    .testimonials-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .testimonials-statistics {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px 0;
    }

    .testimonial-stat:nth-child(3) {
        border-left: 0;
    }

}


/* MOBİL */

@media (max-width: 640px) {

    .testimonials-section {
        padding: 43px 0 35px;
    }

    .testimonials-heading {
        margin-bottom: 25px;
    }

    .testimonials-heading h2 {
        font-size: 34px;
        line-height: 1.13;
        letter-spacing: -1.3px;
    }

    .testimonials-heading h2 span {
        display: block;
    }

    .testimonials-heading p {
        font-size: 13px;
    }

    .testimonials-heading p br {
        display: none;
    }

    .testimonials-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .testimonial-card {
        min-height: auto;
        padding: 19px 18px;
        border-radius: 12px;
    }

    .testimonial-stars {
        margin-bottom: 13px;
        font-size: 16px;
    }

    .testimonial-text {
        font-size: 13px;
        line-height: 1.65;
    }

    .testimonial-author-icon {
        width: 44px;
        height: 44px;
        flex-basis: 44px;
    }

    .testimonial-author strong {
        font-size: 14px;
    }

    .testimonial-author span {
        font-size: 11px;
    }

    .featured-label {
        top: -12px;
        right: 13px;
    }

    .testimonials-statistics {
        grid-template-columns: 1fr;
        gap: 0;
        padding: 10px 18px;
    }

    .testimonial-stat {
        min-height: 76px;
        padding: 10px 0;
    }

    .testimonial-stat + .testimonial-stat,
    .testimonial-stat:nth-child(3) {
        border-top: 1px solid rgba(255, 255, 255, 0.11);
        border-left: 0;
    }

    .testimonial-stat-icon {
        width: 47px;
        height: 47px;
        flex-basis: 47px;
    }

    .testimonial-stat strong {
        font-size: 21px;
    }

}

/* YENİ FOOTER */

.site-footer {
    position: relative;
    width: 100%;
    padding: 65px 0 0;
    color: #ffffff;
    background: #030303;
}

.footer-container {
    width: min(960px, calc(100% - 40px));
    margin: 0 auto;
}

.footer-top {
    display: grid;
    grid-template-columns: 1.45fr 1fr 0.75fr 1fr;
    gap: 65px;
    padding-bottom: 55px;
}


/* LOGO ALANI */

.footer-brand {
    max-width: 310px;
}

.footer-logo {
    display: inline-flex;
    align-items: center;
    gap: 16px;
}

.footer-logo-symbol {
    color: #e5a126;
    font-family: Georgia, serif;
    font-size: 77px;
    line-height: 0.85;
    font-weight: 700;
    font-style: italic;
}

.footer-logo-text {
    display: flex;
    flex-direction: column;
}

.footer-logo-text strong {
    color: #ffffff;
    font-family: Georgia, serif;
    font-size: 37px;
    line-height: 1;
    font-weight: 500;
    letter-spacing: 5px;
}

.footer-logo-text span {
    margin-top: 10px;
    color: #e5a126;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 8px;
}

.footer-brand > p {
    margin-top: 31px;
    color: #b5bac2;
    font-size: 13px;
    line-height: 1.75;
}


/* SOSYAL MEDYA */

.footer-socials {
    margin-top: 25px;
    display: flex;
    gap: 10px;
}

.footer-socials a {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border: 1px solid #252b32;
    border-radius: 8px;
    color: #ffffff;
    background: #050607;
    transition: 0.25s ease;
}

.footer-socials a:hover {
    border-color: #e1a026;
    color: #e1a026;
    transform: translateY(-2px);
}

.footer-socials svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.facebook-link {
    font-size: 20px;
    font-weight: 700;
}

.linkedin-link {
    font-size: 16px;
    font-weight: 700;
}


/* FOOTER BAŞLIKLARI */

.footer-column h3,
.footer-contact h3 {
    position: relative;
    margin-bottom: 23px;
    padding-bottom: 13px;
    color: #ffffff;
    font-size: 17px;
    line-height: 1.2;
    font-weight: 700;
}

.footer-column h3::after,
.footer-contact h3::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 39px;
    height: 1px;
    background: #e4a126;
}


/* FOOTER LİNKLERİ */

.footer-column ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.footer-column li + li {
    margin-top: 17px;
}

.footer-column a {
    position: relative;
    display: inline-block;
    padding-left: 17px;
    color: #b8bec7;
    font-size: 13px;
    line-height: 1.4;
    transition: 0.25s ease;
}

.footer-column a::before {
    content: "›";
    position: absolute;
    top: -2px;
    left: 0;
    color: #e5a126;
    font-size: 22px;
    line-height: 1;
}

.footer-column a:hover {
    color: #ffffff;
    transform: translateX(3px);
}


/* İLETİŞİM */

.footer-contact-item {
    min-height: 54px;
    display: flex;
    align-items: center;
    gap: 13px;
    color: #b8bec7;
    font-size: 13px;
    border-bottom: 1px solid #20252b;
}

.footer-contact-item:last-child {
    border-bottom: 0;
}

.footer-contact-item svg {
    width: 19px;
    height: 19px;
    flex: 0 0 19px;
    fill: none;
    stroke: #e5a126;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

a.footer-contact-item {
    transition: 0.25s ease;
}

a.footer-contact-item:hover {
    color: #ffffff;
}


/* ETİKETLER */

.footer-tags {
    padding: 20px 15px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 10px;
    border-top: 1px solid #1c2127;
    border-bottom: 1px solid #1c2127;
}

.footer-tags span {
    min-height: 37px;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #252b32;
    border-radius: 8px;
    color: #b7bdc5;
    font-size: 12px;
    background: #050607;
}

.footer-tags span::first-letter {
    color: #e5a126;
}


/* ALT TELİF */

.footer-bottom {
    padding: 25px 0;
    text-align: center;
}

.footer-bottom p {
    color: #727983;
    font-size: 12px;
}

.footer-bottom strong {
    color: #e5a126;
    font-weight: 500;
}


/* WHATSAPP BUTONU */

.whatsapp-button {
    position: fixed;
    right: 17px;
    bottom: 17px;
    z-index: 999;
    width: 47px;
    height: 47px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: #20cd67;
    box-shadow: 0 7px 20px rgba(32, 205, 103, 0.3);
    transition: 0.25s ease;
}

.whatsapp-button:hover {
    transform: translateY(-3px);
}

.whatsapp-button svg {
    width: 28px;
    height: 28px;
    fill: none;
    stroke: #ffffff;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}


/* TABLET */

@media (max-width: 900px) {

    .footer-container {
        width: min(720px, calc(100% - 40px));
    }

    .footer-top {
        grid-template-columns: repeat(2, 1fr);
        gap: 45px 60px;
    }

    .footer-brand {
        max-width: none;
    }

}


/* MOBİL */

@media (max-width: 640px) {

    .site-footer {
        padding-top: 45px;
    }

    .footer-container {
        width: calc(100% - 30px);
    }

    .footer-top {
        grid-template-columns: 1fr;
        gap: 35px;
        padding-bottom: 35px;
    }

    .footer-brand {
        max-width: 100%;
    }

    .footer-logo-symbol {
        font-size: 64px;
    }

    .footer-logo-text strong {
        font-size: 29px;
        letter-spacing: 4px;
    }

    .footer-logo-text span {
        margin-top: 7px;
        font-size: 11px;
        letter-spacing: 6px;
    }

    .footer-brand > p {
        margin-top: 23px;
        font-size: 13px;
    }

    .footer-column h3,
    .footer-contact h3 {
        margin-bottom: 20px;
        font-size: 17px;
    }

    .footer-column li + li {
        margin-top: 14px;
    }

    .footer-column a {
        font-size: 13px;
    }

    .footer-tags {
        padding: 18px 0;
        gap: 8px;
    }

    .footer-tags span {
        min-height: 35px;
        padding: 0 11px;
        font-size: 11px;
    }

    .footer-bottom {
        padding: 22px 50px 22px 0;
        text-align: left;
    }

    .footer-bottom p {
        font-size: 11px;
        line-height: 1.6;
    }

    .whatsapp-button {
        right: 13px;
        bottom: 13px;
        width: 45px;
        height: 45px;
        border-radius: 11px;
    }

    .whatsapp-button svg {
        width: 26px;
        height: 26px;
    }

}

/* HİZMETLERİMİZ SAYFASI */

.services-page {
    background: #ffffff;
    color: #101318;
}

.services-page-container {
    width: min(1220px, calc(100% - 60px));
    margin: 0 auto;
}


/* ÜST ALAN */

.services-hero {
    padding: 65px 0 40px;
    background:
        radial-gradient(
            circle at 72% 35%,
            rgba(235, 168, 39, 0.06),
            transparent 30%
        ),
        #ffffff;
}

.services-hero-grid {
    display: grid;
    grid-template-columns: 1fr 0.9fr;
    align-items: center;
    gap: 70px;
}

.services-eyebrow {
    margin-bottom: 20px;
    color: #d69119;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1px;
}

.services-hero-content h1 {
    margin-bottom: 22px;
    color: #101216;
    font-size: clamp(43px, 4vw, 61px);
    line-height: 1.08;
    font-weight: 800;
    letter-spacing: -2.4px;
}

.services-hero-content h1 span {
    color: #dda027;
}

.services-hero-description {
    max-width: 590px;
    color: #676d77;
    font-size: 15px;
    line-height: 1.8;
}


/* SAĞ GRAFİK */

.services-visual {
    position: relative;
    min-height: 290px;
}

.visual-circle {
    position: absolute;
    border: 1px solid rgba(216, 158, 47, 0.13);
    border-radius: 50%;
}

.visual-circle-one {
    width: 330px;
    height: 330px;
    top: -20px;
    right: 30px;
}

.visual-circle-two {
    width: 245px;
    height: 245px;
    top: 23px;
    right: 72px;
}

.visual-dot {
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #dadce0;
}

.visual-dot-one {
    top: 53px;
    left: 30px;
}

.visual-dot-two {
    right: 10px;
    bottom: 52px;
}

.visual-main-chart {
    position: absolute;
    top: 37px;
    right: 85px;
    width: 285px;
    height: 177px;
    padding: 27px 20px 16px;
    overflow: hidden;
    border-radius: 13px;
    background: linear-gradient(145deg, #090b0e, #17191d);
    box-shadow: 0 18px 30px rgba(13, 16, 20, 0.22);
    transform: rotate(-2deg);
}

.chart-browser-bar {
    position: absolute;
    top: 12px;
    left: 15px;
    display: flex;
    gap: 5px;
}

.chart-browser-bar i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #45484d;
}

.chart-grid-lines {
    position: absolute;
    inset: 42px 20px 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.chart-grid-lines span {
    height: 1px;
    background: rgba(255, 255, 255, 0.09);
}

.visual-main-chart svg {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%;
}

.visual-main-chart path,
.visual-roas-card path,
.included-chart-panel path {
    fill: none;
    stroke: #d99b22;
    stroke-width: 3;
    stroke-linecap: round;
}

.visual-roas-card {
    position: absolute;
    z-index: 4;
    top: 111px;
    left: 45px;
    width: 141px;
    height: 114px;
    padding: 15px;
    border-radius: 9px;
    color: #ffffff;
    background: linear-gradient(145deg, #111317, #07090b);
    box-shadow: 0 13px 23px rgba(8, 10, 12, 0.3);
}

.visual-roas-card > span {
    display: block;
    font-size: 11px;
}

.visual-roas-card strong {
    display: inline-block;
    margin-top: 7px;
    font-size: 23px;
}

.visual-roas-card small {
    margin-left: 8px;
    color: #34c96b;
    font-size: 10px;
}

.visual-roas-card svg {
    width: 100%;
    height: 38px;
    margin-top: 4px;
}

.visual-pie-chart {
    position: absolute;
    z-index: 5;
    right: 88px;
    bottom: 8px;
    width: 112px;
    height: 112px;
    border-radius: 50%;
    background:
        conic-gradient(
            #f0ad30 0 24%,
            #17191e 24% 52%,
            #ffffff 52% 78%,
            #6e7074 78% 100%
        );
    box-shadow: 0 12px 22px rgba(14, 17, 20, 0.26);
}

.pie-center {
    position: absolute;
    inset: 28px;
    border-radius: 50%;
    background: #0b0d10;
}

.visual-bars-card {
    position: absolute;
    z-index: 6;
    right: 18px;
    bottom: 4px;
    width: 104px;
    height: 82px;
    padding: 21px 17px 15px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    border-radius: 9px;
    background: #101215;
    box-shadow: 0 12px 20px rgba(12, 15, 18, 0.25);
}

.visual-bars-card span {
    width: 10px;
    background: linear-gradient(to top, #c78a1c, #f7e5bc);
}

.visual-platform {
    position: absolute;
    z-index: 8;
    width: 70px;
    height: 70px;
    display: grid;
    place-items: center;
    border: 1px solid #e0e2e4;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 8px 17px rgba(16, 20, 25, 0.1);
}

.visual-meta {
    top: 0;
    left: 68px;
    color: #2479ed;
    font-size: 48px;
    font-weight: 600;
}

.visual-google {
    top: 73px;
    right: 18px;
}

.mini-google-logo {
    position: relative;
    width: 43px;
    height: 43px;
}

.mini-google-blue,
.mini-google-green {
    position: absolute;
    width: 13px;
    height: 38px;
    border-radius: 10px;
}

.mini-google-blue {
    top: 1px;
    left: 23px;
    background: #4285f4;
    transform: rotate(-29deg);
}

.mini-google-green {
    top: 13px;
    left: 9px;
    height: 28px;
    background: #34a853;
    transform: rotate(29deg);
}

.mini-google-yellow {
    position: absolute;
    left: 2px;
    bottom: 0;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #fbbc04;
}


/* HİZMET KARTLARI */

.services-cards-section {
    padding: 25px 0 58px;
}

.services-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

.service-page-card {
    min-height: 207px;
    padding: 28px 24px;
    display: flex;
    align-items: flex-start;
    gap: 19px;
    border-radius: 10px;
    color: #ffffff;
    background:
        radial-gradient(
            circle at 85% 20%,
            rgba(44, 54, 64, 0.25),
            transparent 40%
        ),
        linear-gradient(145deg, #06090c, #11161b);
    box-shadow: 0 8px 18px rgba(18, 22, 27, 0.14);
    transition: 0.25s ease;
}

.service-page-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 27px rgba(18, 22, 27, 0.19);
}

.service-page-icon {
    width: 76px;
    height: 76px;
    flex: 0 0 76px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 187, 58, 0.1);
    border-radius: 50%;
    color: #e2a229;
    background: linear-gradient(145deg, #202124, #121416);
}

.service-page-icon svg {
    width: 42px;
    height: 42px;
    fill: none;
    stroke: #e2a229;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.google-card-icon .mini-google-logo {
    transform: scale(0.83);
}

.meta-card-icon {
    color: #2d83f5;
    font-size: 51px;
    line-height: 1;
}

.service-page-card-content h2 {
    margin: 10px 0 12px;
    font-size: 17px;
    line-height: 1.3;
}

.service-page-card-content p {
    min-height: 73px;
    color: #c7cbd0;
    font-size: 12px;
    line-height: 1.75;
}

.service-page-card-content a {
    margin-top: 14px;
    display: inline-flex;
    align-items: center;
    gap: 18px;
    color: #e4a329;
    font-size: 12px;
    font-weight: 600;
}

.service-page-card-content a span {
    font-size: 20px;
}


/* CTA */

.services-consultation {
    min-height: 122px;
    margin-top: 24px;
    padding: 25px 40px 25px 25px;
    display: grid;
    grid-template-columns: 75px 1fr auto;
    align-items: center;
    gap: 25px;
    border-radius: 11px;
    color: #ffffff;
    background: linear-gradient(145deg, #070a0d, #11161b);
    box-shadow: 0 8px 20px rgba(17, 21, 26, 0.16);
}

.consultation-icon {
    width: 64px;
    height: 64px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(225, 162, 39, 0.22);
    border-radius: 50%;
}

.consultation-icon svg {
    width: 37px;
    height: 37px;
    fill: none;
    stroke: #e2a128;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.consultation-text h2 {
    margin-bottom: 6px;
    font-size: 24px;
}

.consultation-text p {
    color: #c8ccd1;
    font-size: 13px;
}

.consultation-button {
    min-width: 225px;
    min-height: 55px;
    padding: 0 21px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    border-radius: 8px;
    color: #111419;
    font-size: 13px;
    font-weight: 700;
    background: linear-gradient(135deg, #f3b73c, #dda027);
}

.consultation-button span {
    font-size: 22px;
}


/* SÜREÇ */

.process-section {
    padding: 55px 0 60px;
    border-top: 1px solid #eeeeee;
    background: #ffffff;
}

.process-heading {
    margin-bottom: 35px;
    text-align: center;
}

.process-heading > p,
.included-heading > p {
    margin-bottom: 7px;
    color: #dda027;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.5px;
}

.process-heading h2 {
    margin-bottom: 8px;
    color: #111318;
    font-size: 35px;
    font-weight: 800;
}

.process-heading > span {
    color: #747a83;
    font-size: 13px;
}

.process-steps {
    display: grid;
    grid-template-columns: 1fr 90px 1fr 90px 1fr 90px 1fr;
    align-items: start;
}

.process-step {
    text-align: center;
}

.process-number-icon {
    position: relative;
    width: 79px;
    height: 79px;
    margin: 0 auto 22px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #07090b;
}

.process-number-icon svg {
    width: 36px;
    height: 36px;
    fill: none;
    stroke: #ffffff;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.process-number-icon small {
    position: absolute;
    left: 50%;
    bottom: -9px;
    min-width: 26px;
    height: 18px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    color: #17191d;
    font-size: 9px;
    font-weight: 700;
    background: #e2a127;
    transform: translateX(-50%);
}

.process-step h3 {
    margin-bottom: 10px;
    font-size: 14px;
}

.process-step p {
    max-width: 190px;
    margin: 0 auto;
    color: #6c727b;
    font-size: 11px;
    line-height: 1.55;
}

.process-arrow {
    position: relative;
    margin-top: 31px;
    color: #dda027;
    font-size: 27px;
    text-align: center;
}

.process-arrow::before,
.process-arrow::after {
    content: "";
    position: absolute;
    top: 15px;
    width: 30px;
    border-top: 1px dashed #dda027;
}

.process-arrow::before {
    left: 0;
}

.process-arrow::after {
    right: 0;
}


/* NELER DAHİL */

.included-section {
    padding: 48px 0;
    background: #f7f7f8;
}

.included-grid {
    display: grid;
    grid-template-columns: 0.85fr 1.25fr 0.9fr;
    align-items: center;
    gap: 45px;
}

.included-heading h2 {
    max-width: 310px;
    margin-bottom: 13px;
    font-size: 30px;
    line-height: 1.2;
}

.included-heading > span {
    display: block;
    max-width: 310px;
    color: #737984;
    font-size: 12px;
    line-height: 1.65;
}

.included-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
}

.included-list ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.included-list li {
    position: relative;
    margin-bottom: 17px;
    padding-left: 24px;
    color: #30343a;
    font-size: 12px;
}

.included-list li::before {
    content: "✓";
    position: absolute;
    top: -1px;
    left: 0;
    width: 15px;
    height: 15px;
    display: grid;
    place-items: center;
    border: 1px solid #dda027;
    border-radius: 50%;
    color: #dda027;
    font-size: 9px;
}

.included-dashboard {
    position: relative;
    min-height: 210px;
}

.included-chart-panel {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 245px;
    height: 172px;
    padding: 36px 20px 16px;
    border-radius: 9px;
    background: #0c0e11;
    box-shadow: 0 13px 25px rgba(16, 19, 23, 0.22);
}

.included-window-dots {
    position: absolute;
    top: 13px;
    left: 13px;
    display: flex;
    gap: 5px;
}

.included-window-dots i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #645b4b;
}

.included-bars {
    height: 52px;
    display: flex;
    align-items: flex-end;
    gap: 8px;
}

.included-bars span {
    width: 12px;
    background: #dda027;
}

.included-chart-panel svg {
    width: 100%;
    height: 62px;
}

.included-pie-card {
    position: absolute;
    top: 0;
    right: 3px;
    width: 110px;
    height: 111px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: #131519;
    box-shadow: 0 9px 18px rgba(13, 16, 20, 0.25);
}

.included-pie {
    position: relative;
    width: 66px;
    height: 66px;
    border-radius: 50%;
    background: conic-gradient(#dda027 0 30%, #4c4e53 30% 58%, #ffffff 58% 100%);
}

.included-pie span {
    position: absolute;
    inset: 17px;
    border-radius: 50%;
    background: #131519;
}

.included-success-card {
    position: absolute;
    right: -25px;
    bottom: -13px;
    width: 132px;
    height: 106px;
    padding: 13px;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 8px;
    color: #ffffff;
    background: #111317;
    box-shadow: 0 10px 18px rgba(13, 16, 19, 0.25);
}

.included-check {
    width: 50px;
    height: 50px;
    margin-bottom: 8px;
    display: grid;
    place-items: center;
    border: 1px solid #dda027;
    border-radius: 50%;
    color: #dda027;
    font-size: 25px;
}

.included-success-card span {
    font-size: 9px;
}


/* TABLET */

@media (max-width: 992px) {

    .services-page-container {
        width: min(900px, calc(100% - 40px));
    }

    .services-hero-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .services-hero-content {
        text-align: center;
    }

    .services-hero-description {
        margin: 0 auto;
    }

    .services-visual {
        max-width: 570px;
        width: 100%;
        margin: 0 auto;
    }

    .services-cards-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .process-steps {
        grid-template-columns: repeat(2, 1fr);
        gap: 35px;
    }

    .process-arrow {
        display: none;
    }

    .included-grid {
        grid-template-columns: 1fr 1.4fr;
    }

    .included-dashboard {
        grid-column: 1 / -1;
        width: 360px;
        margin: 10px auto 0;
    }

}


/* MOBİL */

@media (max-width: 640px) {

    .services-page-container {
        width: calc(100% - 28px);
    }

    .services-hero {
        padding: 42px 0 20px;
    }

    .services-hero-content h1 {
        font-size: 37px;
        line-height: 1.12;
        letter-spacing: -1.5px;
    }

    .services-hero-content h1 span {
        display: inline;
    }

    .services-hero-description {
        font-size: 14px;
        line-height: 1.65;
    }

    .services-visual {
        min-height: 250px;
        transform: scale(0.83);
        transform-origin: center;
        margin-top: -5px;
        margin-bottom: -25px;
    }

    .services-cards-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .service-page-card {
        min-height: auto;
        padding: 22px 19px;
    }

    .service-page-icon {
        width: 63px;
        height: 63px;
        flex-basis: 63px;
    }

    .service-page-card-content h2 {
        margin-top: 6px;
        font-size: 16px;
    }

    .service-page-card-content p {
        min-height: auto;
        font-size: 12px;
    }

    .services-consultation {
        grid-template-columns: 55px 1fr;
        padding: 22px 18px;
    }

    .consultation-icon {
        width: 52px;
        height: 52px;
    }

    .consultation-text h2 {
        font-size: 20px;
    }

    .consultation-text p {
        font-size: 12px;
        line-height: 1.55;
    }

    .consultation-button {
        grid-column: 1 / -1;
        width: 100%;
        min-width: 0;
        margin-top: 8px;
    }

    .process-section {
        padding: 42px 0;
    }

    .process-heading h2 {
        font-size: 30px;
    }

    .process-heading > span {
        display: block;
        font-size: 12px;
        line-height: 1.55;
    }

    .process-steps {
        grid-template-columns: 1fr;
        gap: 31px;
    }

    .process-step p {
        max-width: 280px;
    }

    .included-section {
        padding: 40px 0;
    }

    .included-grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .included-heading {
        text-align: center;
    }

    .included-heading h2,
    .included-heading > span {
        max-width: none;
    }

    .included-heading h2 {
        font-size: 27px;
    }

    .included-list {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .included-dashboard {
        grid-column: auto;
        width: 310px;
        max-width: 100%;
        transform: scale(0.88);
        transform-origin: center;
    }

}

/* Hizmetler sayfası navbar düzeltmesi */

.services-header {
    background: #05090d;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.services-page {
    padding-top: 110px;
}

@media (max-width: 992px) {
    .services-page {
        padding-top: 88px;
    }
}

@media (max-width: 640px) {
    .services-page {
        padding-top: 76px;
    }
}

/* HAKKIMIZDA SAYFASI */

.about-page {
    padding-top: 110px;
    color: #111419;
    background: #ffffff;
}

.about-container {
    width: min(1160px, calc(100% - 60px));
    margin: 0 auto;
}


/* ÜST ALAN */

.about-hero {
    padding: 30px 0 23px;
    background:
        radial-gradient(
            circle at 70% 30%,
            rgba(223, 160, 39, 0.05),
            transparent 35%
        ),
        #ffffff;
}

.about-hero-grid {
    display: grid;
    grid-template-columns: 0.73fr 1.27fr;
    align-items: center;
    gap: 70px;
}

.about-label {
    margin-bottom: 13px;
    color: #d7941f;
    font-size: 11px;
    line-height: 1.3;
    font-weight: 700;
    letter-spacing: 0.8px;
}

.about-hero-content h1 {
    margin-bottom: 23px;
    color: #101216;
    font-size: clamp(35px, 3.2vw, 49px);
    line-height: 1.08;
    font-weight: 800;
    letter-spacing: -1.7px;
}

.about-hero-content h1 span,
.about-values-content h2 span {
    color: #dda027;
}

.about-description {
    max-width: 450px;
    margin-bottom: 23px;
    color: #656b74;
    font-size: 13px;
    line-height: 1.8;
}

.about-button {
    min-width: 133px;
    min-height: 39px;
    padding: 0 18px;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    border-radius: 8px;
    color: #e3a128;
    font-size: 11px;
    font-weight: 600;
    background: linear-gradient(145deg, #07090c, #11161b);
    transition: 0.25s ease;
}

.about-button span {
    font-size: 18px;
}

.about-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(15, 18, 23, 0.17);
}


/* OFİS GÖRSELİ */

.about-office-image {
    position: relative;
    min-height: 270px;
    overflow: hidden;
    border-radius: 10px;
    background: #0b0c0e;
}

.about-office-image img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.office-image-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            90deg,
            rgba(0, 0, 0, 0.05),
            rgba(0, 0, 0, 0.33)
        );
}

.office-image-logo {
    position: absolute;
    top: 48px;
    right: 55px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.office-logo-symbol {
    color: #e3a029;
    font-family: Georgia, serif;
    font-size: 62px;
    line-height: 0.8;
    font-weight: 700;
    font-style: italic;
}

.office-image-logo > div:last-child {
    display: flex;
    flex-direction: column;
}

.office-image-logo strong {
    color: #ffffff;
    font-family: Georgia, serif;
    font-size: 28px;
    font-weight: 500;
    letter-spacing: 3px;
}

.office-image-logo span {
    margin-top: 5px;
    color: #e4a229;
    font-size: 10px;
    letter-spacing: 5px;
}


/* İSTATİSTİK */

.about-statistics-section {
    padding: 0 0 24px;
}

.about-statistics {
    min-height: 87px;
    padding: 15px 28px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: center;
    border-radius: 9px;
    color: #ffffff;
    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(54, 65, 75, 0.25),
            transparent 35%
        ),
        linear-gradient(145deg, #07090c, #10151a);
    box-shadow: 0 7px 17px rgba(15, 19, 23, 0.13);
}

.about-stat-item {
    min-height: 58px;
    padding: 0 35px;
    display: flex;
    align-items: center;
    gap: 19px;
}

.about-stat-item + .about-stat-item {
    border-left: 1px solid rgba(255, 255, 255, 0.12);
}

.about-stat-icon {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
}

.about-stat-icon svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: #e2a027;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.about-stat-item > div:last-child {
    display: flex;
    flex-direction: column;
}

.about-stat-item strong {
    color: #ffffff;
    font-size: 22px;
    line-height: 1.1;
}

.about-stat-item span {
    margin-top: 5px;
    color: #bfc4ca;
    font-size: 10px;
}


/* DEĞERLER */

.about-values-section {
    padding: 10px 0 24px;
}

.about-values-grid {
    display: grid;
    grid-template-columns: 0.72fr 1.28fr;
    align-items: center;
    gap: 70px;
}

.about-values-content h2 {
    margin-bottom: 18px;
    color: #15181d;
    font-size: 31px;
    line-height: 1.12;
    font-weight: 800;
    letter-spacing: -1px;
}

.about-values-content > p:not(.about-label) {
    max-width: 420px;
    margin-bottom: 11px;
    color: #60666f;
    font-size: 12px;
    line-height: 1.6;
}

.founder-signature {
    margin-top: 15px;
    display: flex;
    align-items: center;
    gap: 14px;
}

.signature {
    color: #111419;
    font-family: cursive;
    font-size: 25px;
    font-style: italic;
    transform: rotate(-8deg);
}

.founder-signature small {
    color: #4c5158;
    font-size: 10px;
}

.about-values-cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}

.about-value-card {
    min-height: 98px;
    padding: 17px 19px;
    display: flex;
    align-items: flex-start;
    gap: 17px;
    border: 1px solid #eceef0;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 5px 14px rgba(22, 27, 32, 0.05);
}

.about-value-icon {
    width: 45px;
    height: 45px;
    flex: 0 0 45px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: linear-gradient(145deg, #090c0f, #171b20);
}

.about-value-icon svg {
    width: 27px;
    height: 27px;
    fill: none;
    stroke: #dfa027;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.about-value-card h3 {
    margin-bottom: 6px;
    color: #111419;
    font-size: 12px;
}

.about-value-card p {
    color: #666c74;
    font-size: 10px;
    line-height: 1.55;
}


/* EKİP */

.about-team-section {
    padding: 4px 0 28px;
}

.about-team-heading {
    margin-bottom: 15px;
    text-align: center;
}

.about-team-heading .about-label {
    margin-bottom: 5px;
}

.about-team-heading h2 {
    color: #111419;
    font-size: 24px;
    font-weight: 750;
}

.about-team-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 11px;
}

.team-card {
    min-height: 68px;
    padding: 11px 14px;
    display: grid;
    grid-template-columns: 45px 1fr 20px;
    align-items: center;
    gap: 11px;
    border: 1px solid #ebedef;
    border-radius: 9px;
    background: #ffffff;
    box-shadow: 0 5px 12px rgba(15, 20, 25, 0.06);
}

.team-avatar {
    width: 43px;
    height: 43px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #e0a025;
    font-family: Georgia, serif;
    font-size: 29px;
    font-style: italic;
    background: #090c0f;
}

.team-information {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.team-information strong {
    overflow: hidden;
    color: #15181c;
    font-size: 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.team-information span {
    margin-top: 4px;
    overflow: hidden;
    color: #6a7078;
    font-size: 8px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.team-linkedin {
    width: 19px;
    height: 19px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #ffffff;
    font-size: 9px;
    font-weight: 700;
    background: #0b0d10;
}


/* TABLET */

@media (max-width: 992px) {

    .about-page {
        padding-top: 88px;
    }

    .about-container {
        width: min(900px, calc(100% - 40px));
    }

    .about-hero-grid,
    .about-values-grid {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .about-hero-content,
    .about-values-content {
        text-align: center;
    }

    .about-description,
    .about-values-content > p:not(.about-label) {
        margin-right: auto;
        margin-left: auto;
    }

    .about-office-image {
        min-height: 350px;
    }

    .about-statistics {
        grid-template-columns: repeat(2, 1fr);
        gap: 14px 0;
    }

    .about-stat-item:nth-child(3) {
        border-left: 0;
    }

    .about-team-grid {
        grid-template-columns: repeat(3, 1fr);
    }

}


/* MOBİL */

@media (max-width: 640px) {

    .about-page {
        padding-top: 76px;
    }

    .about-container {
        width: calc(100% - 28px);
    }

    .about-hero {
        padding: 36px 0 21px;
    }

    .about-hero-content h1 {
        font-size: 36px;
        line-height: 1.12;
        letter-spacing: -1.3px;
    }

    .about-description {
        font-size: 14px;
        line-height: 1.65;
    }

    .about-office-image {
        min-height: 240px;
    }

    .office-image-logo {
        top: 30px;
        right: 25px;
    }

    .office-logo-symbol {
        font-size: 48px;
    }

    .office-image-logo strong {
        font-size: 22px;
    }

    .about-statistics {
        grid-template-columns: 1fr;
        padding: 10px 20px;
    }

    .about-stat-item {
        min-height: 72px;
        padding: 10px 0;
    }

    .about-stat-item + .about-stat-item,
    .about-stat-item:nth-child(3) {
        border-top: 1px solid rgba(255, 255, 255, 0.12);
        border-left: 0;
    }

    .about-values-content h2 {
        font-size: 29px;
    }

    .about-values-content > p:not(.about-label) {
        font-size: 13px;
    }

    .founder-signature {
        justify-content: center;
    }

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

    .about-value-card {
        min-height: auto;
    }

    .about-team-heading h2 {
        font-size: 27px;
        line-height: 1.2;
    }

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

    .team-card {
        min-height: 75px;
        grid-template-columns: 49px 1fr 24px;
    }

    .team-avatar {
        width: 48px;
        height: 48px;
    }

    .team-information strong {
        font-size: 13px;
    }

    .team-information span {
        font-size: 11px;
    }

    .team-linkedin {
        width: 23px;
        height: 23px;
        font-size: 10px;
    }

}

/* ÇALIŞMALARIMIZ SAYFASI */

.works-page {
    padding-top: 110px;
    color: #111419;
    background: #ffffff;
}

.works-container {
    width: min(1060px, calc(100% - 60px));
    margin: 0 auto;
}

.works-section {
    min-height: 100vh;
    padding: 22px 0 35px;
    background:
        radial-gradient(
            circle at 50% 12%,
            rgba(224, 159, 39, 0.05),
            transparent 25%
        ),
        #ffffff;
}


/* BAŞLIK */

.works-heading {
    max-width: 650px;
    margin: 0 auto 20px;
    text-align: center;
}

.works-label {
    margin-bottom: 6px;
    color: #db971e;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.8px;
}

.works-heading h1 {
    margin-bottom: 9px;
    color: #111318;
    font-size: clamp(33px, 3vw, 43px);
    line-height: 1.06;
    font-weight: 800;
    letter-spacing: -1.4px;
}

.works-heading h1 span {
    color: #d99c27;
}

.works-description {
    color: #6b717a;
    font-size: 12px;
    line-height: 1.55;
}


/* FİLTRELER */

.works-filters {
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 14px;
}

.work-filter {
    min-width: 84px;
    height: 34px;
    padding: 0 17px;
    border: 1px solid #e1e3e6;
    border-radius: 9px;
    color: #50555d;
    font-size: 11px;
    background: #ffffff;
    cursor: pointer;
    transition: 0.25s ease;
}

.work-filter:hover {
    border-color: #d99c27;
    color: #bd7b0c;
}

.work-filter.active {
    border-color: #050709;
    color: #e2a229;
    background: #050709;
    box-shadow: 0 5px 12px rgba(10, 13, 16, 0.16);
}


/* KARTLAR */

.works-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px 17px;
}

.work-card {
    position: relative;
    min-height: 200px;
    display: grid;
    grid-template-columns: 1.06fr 0.94fr;
    grid-template-rows: 1fr 64px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 10px;
    color: #ffffff;
    background:
        radial-gradient(
            circle at 80% 15%,
            rgba(54, 64, 74, 0.22),
            transparent 38%
        ),
        linear-gradient(145deg, #070a0d, #11161b);
    box-shadow: 0 7px 15px rgba(15, 19, 23, 0.15);
    transition:
        opacity 0.25s ease,
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

.work-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 13px 24px rgba(15, 19, 23, 0.22);
}

.work-card.hidden {
    display: none;
}

.work-card-top {
    position: relative;
    z-index: 3;
    min-width: 0;
    padding: 14px 6px 10px 17px;
}

.work-category {
    min-height: 19px;
    margin-bottom: 13px;
    padding: 3px 13px;
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 20px;
    color: #dfe2e5;
    font-size: 8px;
    line-height: 1;
    background: rgba(3, 5, 7, 0.32);
}

.work-card-brand {
    margin-bottom: 9px;
    display: flex;
    align-items: center;
    gap: 9px;
}

.work-brand-logo {
    min-width: 25px;
    color: #dfa127;
    font-size: 25px;
    line-height: 1;
    font-weight: 750;
}

.work-card-brand h2 {
    color: #ffffff;
    font-family: Georgia, serif;
    font-size: 16px;
    line-height: 1;
    font-weight: 500;
    letter-spacing: 0.7px;
}

.work-card-brand > div:last-child > span {
    margin-top: 3px;
    display: block;
    color: #d29a34;
    font-size: 6px;
    letter-spacing: 4px;
}

.work-card-top > p {
    color: #d1d5d9;
    font-size: 8px;
    line-height: 1.55;
}

.work-card-image {
    position: relative;
    min-width: 0;
    overflow: hidden;
    background:
        radial-gradient(
            circle at 60% 45%,
            rgba(143, 105, 52, 0.3),
            transparent 36%
        ),
        linear-gradient(145deg, #151515, #060708);
}

.work-card-image::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        rgba(7, 10, 13, 0.82),
        transparent 42%
    );
}


/* İSTATİSTİKLER */

.work-card-stats {
    position: relative;
    z-index: 5;
    grid-column: 1 / -1;
    padding: 8px 11px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 7px;
}

.work-card-stats > div {
    min-width: 0;
    padding: 7px 10px;
    border: 1px solid rgba(255, 255, 255, 0.025);
    border-radius: 6px;
    background: rgba(4, 7, 10, 0.8);
}

.work-card-stats span {
    display: block;
    overflow: hidden;
    color: #c7cbd0;
    font-size: 7px;
    line-height: 1.2;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.work-card-stats strong {
    margin: 5px 0 3px;
    display: block;
    overflow: hidden;
    color: #ffffff;
    font-size: 15px;
    line-height: 1;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.work-card-stats small {
    display: block;
    color: #42d66d;
    font-size: 7px;
}


/* MARKA RENKLERİ */

.luxxe-logo {
    color: #d7b071;
    font-family: Georgia, serif;
}

.dental-logo {
    color: #2c91ef;
}

.akademix-logo {
    color: #8b62f0;
}

.fashion-logo {
    color: #dfaa59;
}

.law-logo {
    color: #dca226;
}

.vita-logo {
    color: #a5d45c;
}

.pet-logo {
    color: #8fc445;
    font-size: 20px;
}

.edu-logo {
    color: #4a8de9;
}

.maxrent-logo {
    color: #db2d43;
    font-style: italic;
}


/* LUXXE GÖRSELİ */

.luxxe-chair {
    position: absolute;
    z-index: 2;
    right: 45px;
    bottom: 12px;
    width: 64px;
    height: 72px;
    border-radius: 35px 35px 12px 12px;
    background: linear-gradient(145deg, #594c40, #171310);
    box-shadow: 0 10px 15px rgba(0, 0, 0, 0.45);
}

.luxxe-chair::before {
    content: "";
    position: absolute;
    right: -11px;
    bottom: 9px;
    width: 17px;
    height: 40px;
    border-radius: 8px;
    background: #342b24;
}

.luxxe-chair::after {
    content: "";
    position: absolute;
    bottom: -12px;
    left: 10px;
    width: 4px;
    height: 16px;
    background: #916b38;
    box-shadow: 38px 0 #916b38;
}

.luxxe-plant {
    position: absolute;
    z-index: 2;
    right: 5px;
    bottom: 10px;
    width: 35px;
    height: 75px;
    background:
        radial-gradient(
            ellipse at 25% 30%,
            #335a25 0 16%,
            transparent 17%
        ),
        radial-gradient(
            ellipse at 70% 20%,
            #284d20 0 17%,
            transparent 18%
        ),
        radial-gradient(
            ellipse at 55% 50%,
            #496c2b 0 17%,
            transparent 18%
        );
}

.luxxe-decoration {
    position: absolute;
    z-index: 2;
    right: 7px;
    bottom: 4px;
    width: 52px;
    height: 20px;
    border-radius: 50%;
    background: #8d6434;
}


/* DENTAL */

.dental-chair {
    position: absolute;
    z-index: 2;
    right: 20px;
    bottom: 18px;
    width: 93px;
    height: 45px;
    border-radius: 32px 32px 15px 15px;
    background: linear-gradient(150deg, #d7e3e9, #4e626c);
    transform: rotate(-6deg);
}

.dental-chair::after {
    content: "";
    position: absolute;
    bottom: -28px;
    left: 38px;
    width: 11px;
    height: 31px;
    background: #8b9aa2;
}

.dental-light {
    position: absolute;
    z-index: 2;
    top: 16px;
    right: 64px;
    width: 31px;
    height: 18px;
    border: 4px solid #b7c3c9;
    border-radius: 50%;
}

.dental-light::after {
    content: "";
    position: absolute;
    top: -23px;
    left: 12px;
    width: 4px;
    height: 28px;
    background: #929ea5;
}

.dental-monitor {
    position: absolute;
    z-index: 2;
    top: 27px;
    right: 7px;
    width: 40px;
    height: 31px;
    border: 3px solid #999;
    background: #16202a;
}


/* AKADEMİX */

.akademix-desk,
.edu-desk {
    position: absolute;
    z-index: 2;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 43px;
    background: linear-gradient(160deg, #5a4029, #17110c);
}

.akademix-laptop,
.edu-laptop {
    position: absolute;
    z-index: 3;
    right: 18px;
    bottom: 35px;
    width: 105px;
    height: 65px;
    padding-top: 25px;
    border: 3px solid #4c4f52;
    border-radius: 4px;
    color: #8f65f2;
    font-size: 7px;
    text-align: center;
    background: linear-gradient(145deg, #161b21, #050608);
    transform: rotate(4deg);
}

.akademix-laptop::after,
.edu-laptop::after {
    content: "";
    position: absolute;
    right: -7px;
    bottom: -7px;
    left: -7px;
    height: 7px;
    background: #777;
}

.akademix-plant {
    position: absolute;
    z-index: 2;
    top: 7px;
    left: 11px;
    width: 43px;
    height: 73px;
    background:
        radial-gradient(
            ellipse at 25% 25%,
            #405b2c 0 14%,
            transparent 15%
        ),
        radial-gradient(
            ellipse at 70% 22%,
            #526f34 0 15%,
            transparent 16%
        ),
        radial-gradient(
            ellipse at 52% 45%,
            #314922 0 18%,
            transparent 19%
        );
}


/* FASHION */

.fashion-clothes {
    position: absolute;
    z-index: 2;
    top: 26px;
    right: 12px;
    display: flex;
    gap: 4px;
}

.fashion-clothes::before {
    content: "";
    position: absolute;
    top: -11px;
    left: -5px;
    width: 122px;
    height: 3px;
    background: #96928a;
}

.fashion-clothes span {
    width: 20px;
    height: 76px;
    border-radius: 9px 9px 3px 3px;
    background: linear-gradient(145deg, #3b3733, #111);
}

.fashion-clothes span:nth-child(2) {
    background: #4b443e;
}

.fashion-clothes span:nth-child(3) {
    background: #282929;
}

.fashion-clothes span:nth-child(4) {
    background: #54483b;
}


/* LAW */

.law-bookcase {
    position: absolute;
    inset: 0;
    background:
        repeating-linear-gradient(
            90deg,
            #17120e 0 18px,
            #573b20 19px 21px
        );
    opacity: 0.55;
}

.law-table {
    position: absolute;
    z-index: 2;
    right: 0;
    bottom: 4px;
    width: 130px;
    height: 36px;
    background: linear-gradient(160deg, #654629, #1e150f);
}

.law-lamp {
    position: absolute;
    z-index: 3;
    top: 18px;
    right: 52px;
    width: 34px;
    height: 18px;
    border-radius: 50% 50% 4px 4px;
    background: #c09a56;
    box-shadow: 0 0 22px rgba(237, 194, 111, 0.5);
}

.law-lamp::after {
    content: "";
    position: absolute;
    top: 16px;
    left: 15px;
    width: 3px;
    height: 46px;
    background: #a47a3a;
}


/* VITA */

.vita-sofa {
    position: absolute;
    z-index: 2;
    right: 10px;
    bottom: 17px;
    width: 120px;
    height: 52px;
    border-radius: 26px 26px 10px 10px;
    background: linear-gradient(145deg, #d0c0a6, #625849);
}

.vita-table {
    position: absolute;
    z-index: 3;
    right: 52px;
    bottom: 4px;
    width: 49px;
    height: 12px;
    background: #6c5134;
}

.vita-table::after {
    content: "";
    position: absolute;
    top: 10px;
    left: 22px;
    width: 4px;
    height: 18px;
    background: #44301f;
}

.vita-lamp {
    position: absolute;
    z-index: 3;
    top: 11px;
    right: 12px;
    width: 24px;
    height: 26px;
    border-radius: 50% 50% 5px 5px;
    background: #d3b77e;
}


/* PET */

.pet-dog,
.pet-cat {
    position: absolute;
    z-index: 2;
    bottom: 9px;
    font-size: 62px;
    line-height: 1;
    filter: saturate(0.55) brightness(0.85);
}

.pet-dog {
    right: 49px;
}

.pet-cat {
    right: 2px;
    font-size: 54px;
}


/* EDUPLUS */

.edu-laptop {
    color: #4d92f3;
}


/* OTOMOTİV */

.car-body {
    position: absolute;
    z-index: 2;
    right: 2px;
    bottom: 17px;
    width: 139px;
    height: 48px;
    border-radius: 45px 55px 18px 20px;
    background: linear-gradient(
        145deg,
        #4c4f54,
        #090a0c 55%,
        #282b2e
    );
    box-shadow: 0 8px 17px rgba(0, 0, 0, 0.48);
}

.car-body::before {
    content: "";
    position: absolute;
    top: -29px;
    left: 33px;
    width: 69px;
    height: 41px;
    border-radius: 37px 41px 0 0;
    background: linear-gradient(145deg, #5e6267, #16181b);
}

.car-window {
    position: absolute;
    z-index: 2;
    top: -23px;
    left: 44px;
    width: 48px;
    height: 25px;
    border-radius: 25px 25px 0 0;
    background: #101923;
}

.car-wheel {
    position: absolute;
    bottom: -12px;
    width: 26px;
    height: 26px;
    border: 6px solid #070809;
    border-radius: 50%;
    background: #777;
}

.car-wheel-left {
    left: 18px;
}

.car-wheel-right {
    right: 17px;
}


/* TABLET */

@media (max-width: 992px) {

    .works-page {
        padding-top: 88px;
    }

    .works-container {
        width: min(900px, calc(100% - 40px));
    }

    .works-grid {
        grid-template-columns: repeat(2, 1fr);
    }

}


/* MOBİL */

@media (max-width: 640px) {

    .works-page {
        padding-top: 76px;
    }

    .works-container {
        width: calc(100% - 28px);
    }

    .works-section {
        padding-top: 32px;
    }

    .works-heading h1 {
        font-size: 34px;
        line-height: 1.12;
    }

    .works-heading h1 br {
        display: none;
    }

    .works-description {
        font-size: 13px;
    }

    .works-filters {
        gap: 8px;
    }

    .work-filter {
        min-width: 0;
        height: 35px;
        padding: 0 14px;
        font-size: 10px;
    }

    .works-grid {
        grid-template-columns: 1fr;
    }

    .work-card {
        min-height: 220px;
        grid-template-columns: 1fr 0.9fr;
        grid-template-rows: 1fr 68px;
    }

    .work-card-top {
        padding-left: 15px;
    }

    .work-card-top > p {
        font-size: 8px;
    }

    .work-card-stats strong {
        font-size: 14px;
    }

}

/* İLETİŞİM SAYFASI */

.contact-page {
    padding-top: 110px;
    color: #111419;
    background: #ffffff;
}

.contact-container {
    width: min(1020px, calc(100% - 60px));
    margin: 0 auto;
}


/* ÜST ALAN */

.contact-hero {
    position: relative;
    min-height: 205px;
    overflow: hidden;
    color: #ffffff;
    background:
        radial-gradient(
            circle at 72% 43%,
            rgba(140, 105, 58, 0.23),
            transparent 26%
        ),
        linear-gradient(
            110deg,
            #090a0b 0%,
            #17130f 45%,
            #080909 100%
        );
}

.contact-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.33;
    background:
        linear-gradient(
            90deg,
            transparent 47%,
            rgba(0, 0, 0, 0.25) 47%
        ),
        repeating-linear-gradient(
            90deg,
            transparent 0 90px,
            rgba(225, 181, 113, 0.11) 91px 92px
        ),
        repeating-linear-gradient(
            0deg,
            transparent 0 70px,
            rgba(225, 181, 113, 0.06) 71px 72px
        );
}

.contact-hero-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            90deg,
            rgba(5, 6, 7, 0.94) 0%,
            rgba(5, 6, 7, 0.75) 35%,
            rgba(5, 6, 7, 0.05) 72%,
            rgba(5, 6, 7, 0.25) 100%
        );
}

.contact-hero-content {
    position: relative;
    z-index: 3;
    padding-top: 43px;
}

.contact-label {
    margin-bottom: 14px;
    color: #dda027;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.8px;
}

.contact-hero h1 {
    margin-bottom: 15px;
    color: #ffffff;
    font-size: clamp(36px, 3.4vw, 49px);
    line-height: 1.1;
    font-weight: 800;
    letter-spacing: -1.5px;
}

.contact-hero h1 span {
    color: #dda027;
}

.contact-hero-content > p:last-child {
    max-width: 485px;
    color: #d7d9dc;
    font-size: 13px;
    line-height: 1.65;
}

.contact-office-logo {
    position: absolute;
    z-index: 4;
    top: 45px;
    right: 18%;
    display: flex;
    align-items: center;
    gap: 11px;
}

.contact-logo-symbol {
    color: #dfa027;
    font-family: Georgia, serif;
    font-size: 62px;
    line-height: 0.8;
    font-style: italic;
    font-weight: 700;
}

.contact-office-logo > div:last-child {
    display: flex;
    flex-direction: column;
}

.contact-office-logo strong {
    color: #ffffff;
    font-family: Georgia, serif;
    font-size: 29px;
    font-weight: 500;
    letter-spacing: 3px;
}

.contact-office-logo span {
    margin-top: 5px;
    color: #dfa027;
    font-size: 10px;
    letter-spacing: 5px;
}


/* FORM ALANI */

.contact-content-section {
    padding: 0 0 18px;
    background:
        radial-gradient(
            circle at 50% 10%,
            rgba(224, 160, 40, 0.05),
            transparent 30%
        ),
        #ffffff;
}

.contact-main-grid {
    position: relative;
    z-index: 6;
    margin-top: -14px;
    display: grid;
    grid-template-columns: 1.72fr 0.98fr;
    align-items: stretch;
    gap: 20px;
}

.contact-form-card,
.contact-info-card {
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(19, 24, 29, 0.12);
}

.contact-form-card {
    padding: 27px 28px 23px;
    border: 1px solid #eceef0;
    background: rgba(255, 255, 255, 0.96);
}

.contact-card-heading {
    margin-bottom: 15px;
}

.contact-card-heading h2 {
    margin-bottom: 7px;
    color: #111419;
    font-size: 21px;
}

.contact-card-heading p {
    color: #6b7179;
    font-size: 11px;
}

.contact-form-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 11px;
}

.contact-form-group {
    position: relative;
}

.contact-form-group label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
}

.contact-form-group input,
.contact-form-group textarea {
    width: 100%;
    border: 1px solid #dfe2e5;
    border-radius: 7px;
    outline: none;
    color: #15191e;
    font-family: inherit;
    font-size: 11px;
    background: #ffffff;
    transition: 0.25s ease;
}

.contact-form-group input {
    height: 42px;
    padding: 0 14px;
}

.contact-form-group textarea {
    min-height: 103px;
    padding: 13px 14px;
    resize: vertical;
}

.contact-form-group input:focus,
.contact-form-group textarea:focus {
    border-color: #d99b22;
    box-shadow: 0 0 0 3px rgba(217, 155, 34, 0.09);
}

.contact-message-group {
    grid-column: 1 / -1;
}

.contact-kvkk {
    margin-top: 13px;
    display: flex;
    align-items: flex-start;
    gap: 8px;
    color: #666c74;
    font-size: 10px;
    line-height: 1.4;
    cursor: pointer;
}

.contact-kvkk input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.custom-checkbox {
    position: relative;
    width: 13px;
    height: 13px;
    flex: 0 0 13px;
    border: 1px solid #b8bdc3;
    border-radius: 2px;
    background: #ffffff;
}

.contact-kvkk input:checked + .custom-checkbox {
    border-color: #d99b22;
    background: #d99b22;
}

.contact-kvkk input:checked + .custom-checkbox::after {
    content: "✓";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: #ffffff;
    font-size: 9px;
}

.contact-kvkk a {
    color: #d58f18;
    font-weight: 600;
}

.contact-submit-button {
    width: 152px;
    min-height: 43px;
    margin-top: 17px;
    padding: 0 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 0;
    border-radius: 6px;
    color: #e1a127;
    font-size: 11px;
    font-weight: 650;
    background: linear-gradient(145deg, #080a0c, #13171c);
    cursor: pointer;
    transition: 0.25s ease;
}

.contact-submit-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 17px rgba(14, 18, 22, 0.18);
}

.contact-submit-button span {
    font-size: 18px;
}

.contact-form-message {
    margin-top: 10px;
    color: #278d4f;
    font-size: 11px;
}


/* İLETİŞİM BİLGİ KARTI */

.contact-info-card {
    position: relative;
    padding: 28px 26px 22px;
    overflow: hidden;
    color: #ffffff;
    background:
        radial-gradient(
            circle at 75% 20%,
            rgba(54, 64, 74, 0.25),
            transparent 40%
        ),
        linear-gradient(145deg, #07090c, #11161b);
}

.contact-info-lines {
    position: absolute;
    right: -110px;
    bottom: -100px;
    width: 320px;
    height: 320px;
    opacity: 0.22;
    background:
        repeating-radial-gradient(
            ellipse at 100% 100%,
            transparent 0 18px,
            rgba(220, 159, 39, 0.25) 19px 20px,
            transparent 21px 34px
        );
}

.contact-info-card h2 {
    position: relative;
    z-index: 2;
    margin-bottom: 22px;
    font-size: 20px;
}

.contact-info-list {
    position: relative;
    z-index: 2;
}

.contact-info-item {
    margin-bottom: 17px;
    display: flex;
    align-items: flex-start;
    gap: 14px;
    color: #ffffff;
}

.contact-info-icon {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    display: grid;
    place-items: center;
    border: 1px solid #dda027;
    border-radius: 50%;
}

.contact-info-icon svg {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: #dda027;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.contact-info-item > div:last-child {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.contact-info-item strong {
    margin-bottom: 4px;
    color: #dfa027;
    font-size: 11px;
}

.contact-info-item span {
    color: #f0f1f2;
    font-size: 11px;
    line-height: 1.5;
}

.contact-socials {
    position: relative;
    z-index: 2;
    margin-top: 20px;
    display: flex;
    gap: 11px;
}

.contact-socials a {
    width: 39px;
    height: 39px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 50%;
    color: #ffffff;
    transition: 0.25s ease;
}

.contact-socials a:hover {
    border-color: #dda027;
    color: #dda027;
    transform: translateY(-2px);
}

.contact-socials svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.contact-social-letter {
    font-size: 17px;
    font-weight: 700;
}


/* HARİTA */

.contact-map {
    position: relative;
    min-height: 117px;
    margin-top: 14px;
    overflow: hidden;
    border-radius: 10px;
    background:
        linear-gradient(
            90deg,
            #eef4f6,
            #f5f6f4
        );
    box-shadow: 0 5px 13px rgba(22, 27, 32, 0.07);
}

.contact-map::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.65;
    background:
        repeating-linear-gradient(
            18deg,
            transparent 0 23px,
            rgba(180, 190, 196, 0.55) 24px 25px,
            transparent 26px 45px
        ),
        repeating-linear-gradient(
            -21deg,
            transparent 0 31px,
            rgba(191, 199, 203, 0.45) 32px 33px,
            transparent 34px 57px
        );
}

.map-sea {
    position: absolute;
    left: -10px;
    bottom: -25px;
    width: 300px;
    height: 70px;
    border-radius: 50%;
    background: #91ddeb;
    transform: rotate(-7deg);
}

.map-road {
    position: absolute;
    z-index: 2;
    height: 4px;
    border: 1px solid #ffffff;
    border-radius: 20px;
    background: #c8d1d5;
}

.road-one {
    top: 34px;
    left: 3%;
    width: 65%;
    transform: rotate(4deg);
}

.road-two {
    top: 65px;
    left: 9%;
    width: 80%;
    transform: rotate(-5deg);
}

.road-three {
    top: 35px;
    right: 5%;
    width: 44%;
    transform: rotate(-18deg);
}

.road-four {
    top: 85px;
    left: 37%;
    width: 50%;
    transform: rotate(8deg);
}

.road-five {
    top: 25px;
    left: 54%;
    width: 4px;
    height: 100px;
    transform: rotate(14deg);
}

.map-location-text {
    position: absolute;
    z-index: 3;
    color: #6e7880;
    font-size: 8px;
}

.map-location-university {
    top: 20px;
    left: 17%;
    max-width: 100px;
    text-align: center;
}

.map-location-center {
    top: 54px;
    left: 54%;
}

.map-location-hospital {
    top: 30px;
    right: 19%;
    color: #df7474;
}

.map-location-mall {
    right: 15%;
    bottom: 8px;
    color: #62a9dd;
}

.map-company-card {
    position: absolute;
    z-index: 6;
    top: 7px;
    left: 28%;
    min-width: 139px;
    min-height: 57px;
    padding: 10px 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 7px;
    color: #ffffff;
    background: linear-gradient(145deg, #07090c, #151a20);
    box-shadow: 0 8px 17px rgba(14, 18, 22, 0.17);
}

.map-company-icon {
    width: 25px;
    height: 25px;
    flex: 0 0 25px;
}

.map-company-icon svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: #dfa027;
    stroke-width: 1.8;
}

.map-company-card > div:last-child {
    display: flex;
    flex-direction: column;
}

.map-company-card strong {
    color: #dfa027;
    font-size: 10px;
}

.map-company-card span {
    margin-top: 3px;
    color: #e1e3e5;
    font-size: 8px;
}

.map-pin {
    position: absolute;
    z-index: 4;
    width: 16px;
    height: 16px;
    border-radius: 50% 50% 50% 0;
    background: #e3a128;
    transform: rotate(-45deg);
}

.map-pin::after {
    content: "";
    position: absolute;
    inset: 5px;
    border-radius: 50%;
    background: #ffffff;
}

.map-main-pin {
    left: 34%;
    bottom: 19px;
}


/* TABLET */

@media (max-width: 992px) {

    .contact-page {
        padding-top: 88px;
    }

    .contact-container {
        width: min(900px, calc(100% - 40px));
    }

    .contact-main-grid {
        grid-template-columns: 1fr;
    }

    .contact-info-card {
        min-height: 420px;
    }

    .contact-office-logo {
        right: 8%;
    }

}


/* MOBİL */

@media (max-width: 640px) {

    .contact-page {
        padding-top: 76px;
    }


    .contact-container {
        width: calc(100% - 28px);
    }

    .contact-hero {
        min-height: 260px;
    }

    .contact-hero-content {
        padding-top: 35px;
        text-align: center;
    }

    .contact-hero h1 {
        font-size: 37px;
    }

    .contact-hero-content > p:last-child {
        margin: 0 auto;
        font-size: 13px;
    }

    .contact-office-logo {
        display: none;
    }

    .contact-main-grid {
        margin-top: -15px;
        gap: 14px;
    }

    .contact-form-card {
        padding: 23px 18px 21px;
    }

    .contact-card-heading h2 {
        font-size: 20px;
    }

    .contact-card-heading p {
        font-size: 12px;
        line-height: 1.5;
    }

    .contact-form-grid {
        grid-template-columns: 1fr;
    }

    .contact-message-group {
        grid-column: auto;
    }

    .contact-form-group input {
        height: 45px;
        font-size: 12px;
    }

    .contact-form-group textarea {
        min-height: 125px;
        font-size: 12px;
    }

    .contact-kvkk {
        font-size: 11px;
    }

    .contact-submit-button {
        width: 100%;
        min-height: 49px;
    }

    .contact-info-card {
        min-height: auto;
        padding: 25px 20px;
    }

    .contact-info-card h2 {
        font-size: 21px;
    }

    .contact-info-item span {
        font-size: 12px;
    }

    .contact-map {
        min-height: 190px;
    }

    .map-company-card {
        top: 17px;
        left: 50%;
        transform: translateX(-50%);
    }

    .map-main-pin {
        left: 48%;
        bottom: 32px;
    }

    .map-location-university,
    .map-location-hospital,
    .map-location-mall {
        display: none;
    }

}

/* ===========================
   HİZMETLER SAYFASI - MOBİL
=========================== */

@media (max-width:768px){

    /* Sadece ilk 3 kart görünsün */
    .services-cards-grid .service-page-card:nth-child(n+4){
        display:none;
    }

    .services-cards-grid{
        grid-template-columns:1fr;
        gap:16px;
    }

    .service-page-card{
        min-height:180px;
        padding:20px;
        display:flex;
        align-items:flex-start;
        gap:16px;
        border-radius:14px;
        background:linear-gradient(145deg,#0b0f13,#171c22);
        box-shadow:0 10px 30px rgba(0,0,0,.18);
    }

    .service-page-icon{
        width:66px;
        height:66px;
        flex:0 0 66px;
    }

    .service-page-icon svg{
        width:34px;
        height:34px;
    }

    .meta-card-icon{
        font-size:42px;
    }

    .service-page-card-content h2{
        margin:6px 0 10px;
        font-size:28px;
        line-height:1.25;
        color:#fff;
    }

    .service-page-card-content p{
        min-height:auto;
        margin-bottom:16px;
        font-size:15px;
        line-height:1.8;
        color:#cfd4da;
    }

    .service-page-card-content a{
        margin-top:0;
        color:#e6ae43;
        font-size:15px;
        font-weight:600;
    }

}

/* ANA SAYFA HİZMET KARTLARI - MOBİL */

@media (max-width: 992px) {

    /* Mobilde sadece ilk 3 kart görünsün */
    .services .services-grid .service-card:nth-child(n + 4) {
        display: none !important;
    }

    .services .services-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .services .service-card {
        width: 100%;
        min-height: 183px;
        padding: 20px;
        display: flex;
        align-items: flex-start;
        gap: 18px;
        border: none;
        border-radius: 11px;
        color: #ffffff;
        background:
            radial-gradient(
                circle at 85% 15%,
                rgba(45, 57, 69, 0.24),
                transparent 42%
            ),
            linear-gradient(145deg, #090d12, #131a21);
        box-shadow: 0 8px 20px rgba(10, 14, 18, 0.16);
    }

    .services .service-card-icon {
        width: 62px;
        height: 62px;
        flex: 0 0 62px;
        border: 1px solid rgba(230, 174, 67, 0.18);
        background: linear-gradient(145deg, #202226, #15171a);
    }

    .services .service-card-content {
        flex: 1;
        min-width: 0;
    }

    .services .service-card-content h3 {
        margin: 8px 0 10px;
        color: #ffffff;
        font-size: 16px;
        line-height: 1.3;
    }

    .services .service-card-content p {
        min-height: auto;
        margin: 0;
        color: #e0e3e7;
        font-size: 12px;
        line-height: 1.7;
    }

    .services .service-card-content a {
        margin-top: 17px;
        color: #f0a91e;
        font-size: 12px;
        font-weight: 700;
    }

    .services .service-card-content a span {
        margin-left: 3px;
        font-size: 18px;
    }
}

/* =========================================
   ANA SAYFA HİZMET KARTLARI - TÜM CİHAZLAR
========================================= */

.services .services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

.services .services-grid .service-card:nth-child(n + 4) {
    display: none !important;
}

.services .service-card {
    width: 100%;
    min-height: 183px;
    padding: 20px;
    display: flex;
    align-items: flex-start;
    gap: 18px;
    border: none !important;
    border-radius: 11px;
    color: #ffffff;
    background:
        radial-gradient(
            circle at 85% 15%,
            rgba(45, 57, 69, 0.24),
            transparent 42%
        ),
        linear-gradient(145deg, #090d12, #131a21) !important;
    box-shadow: 0 8px 20px rgba(10, 14, 18, 0.16);
}

.services .service-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 30px rgba(10, 14, 18, 0.25);
}

.services .service-card-icon {
    width: 62px;
    height: 62px;
    flex: 0 0 62px;
    border: 1px solid rgba(230, 174, 67, 0.22);
    background: linear-gradient(145deg, #202226, #15171a) !important;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25);
}

.services .service-card-content {
    flex: 1;
    min-width: 0;
}

.services .service-card-content h3 {
    margin: 8px 0 10px;
    color: #ffffff !important;
    font-size: 16px;
    line-height: 1.3;
}

.services .service-card-content p {
    min-height: auto;
    margin: 0;
    color: #e0e3e7 !important;
    font-size: 12px;
    line-height: 1.7;
}

.services .service-card-content a {
    margin-top: 17px;
    color: #f0a91e !important;
    font-size: 12px;
    font-weight: 700;
}

/* TABLET VE MOBİL */

@media (max-width: 992px) {
    .services .services-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }
}

/* HİZMETLER BAŞLIK ALANI REVİZE */

.services .section-heading {
    max-width: 760px;
    margin: 0 auto 34px;
    text-align: center;
}

.services .section-label {
    margin-bottom: 12px;
    color: #c98518;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 18px;
}

.services .section-heading h2 {
    margin-bottom: 14px;
    color: #0d1117;
    font-size: 38px;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: -1.2px;
}

.services .section-description {
    max-width: 680px;
    margin: 0 auto;
    color: #5b6470;
    font-size: 15px;
    line-height: 1.75;
}

/* Kartlarla başlık arasındaki mesafe */

.services .services-grid {
    margin-top: 8px;
}

/* Tablet */

@media (max-width: 992px) {
    .services .section-heading {
        margin-bottom: 26px;
    }

    .services .section-heading h2 {
        font-size: 32px;
    }
}

/* Mobil */

@media (max-width: 640px) {
    .services .section-heading {
        margin-bottom: 22px;
        padding: 0 8px;
    }

    .services .section-label {
        font-size: 11px;
        letter-spacing: 1.6px;
    }

    .services .section-heading h2 {
        font-size: 27px;
        line-height: 1.25;
        letter-spacing: -0.7px;
    }

    .services .section-description {
        font-size: 14px;
        line-height: 1.65;
    }
}

.services .section-heading{
    max-width:700px;
    margin:0 auto 55px;
    text-align:center;
}

.section-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:10px 22px;
    margin-bottom:24px;
    border-radius:50px;
    background:#fff6e8;
    color:#d68b11;
    font-size:12px;
    font-weight:700;
    letter-spacing:2px;
    text-transform:uppercase;
}

.services .section-heading h2{
    margin:0;
    color:#0f1722;
    font-size:34px;
    line-height:1.08;
    font-weight:800;
    letter-spacing:-2px;
}

.services .section-heading h2 span{
    display:block;
    color:#d68b11;
}

.services .section-heading p{
    max-width:620px;
    margin:22px auto 0;
    color:#5e6673;
    font-size:17px;
    line-height:1.8;
}

@media (max-width: 768px) {

    .why-us-image{
        display: none !important;
    }

    .why-us-container{
        grid-template-columns: 1fr !important;
    }

    .why-us-content{
        max-width: 100%;
    }

}

@media (max-width: 992px) {
    .solutions{
        display: none !important;
    }
}

@media (max-width: 992px) {

    .pricing-grid{
        gap:24px;
    }

    

}

/* Fiyatlandırma başlığı - Mobil */

@media (max-width: 768px) {

    .pricing-heading{
        margin-bottom: 32px;
    }

    .pricing-heading h2{
        font-size: 38px;
        line-height: 1.12;
        letter-spacing: -1px;
    }

    .pricing-heading h2 span{
        display: inline;
    }

    .pricing-heading p{
        max-width: 330px;
        margin: 18px auto 0;
        font-size: 15px;
        line-height: 1.7;
    }

}

@media (max-width: 992px){

    .pricing-grid{
        display:flex;
        flex-direction:column;
        align-items:center;
        gap:18px;
    }

    .pricing-card,
    .pricing-card:last-child{
        width:100%;
        max-width:420px;
        margin:0;
        transform:none;
    }

    .pricing-information{
        margin-top:18px;
    }

}

/* SSS BAŞLIK ALANI */

.faq-heading {
    margin-bottom: 30px;
}

/* Mobilde fiyatlandırma başlığıyla aynı görünüm */

@media (max-width: 770x) {

    .faq-heading {
        margin-bottom: 30px;
        text-align: center;
    }

    .faq-heading .pricing-badge {
        min-height: 32px;
        padding: 6px 16px;
        font-size: 12px;
    }

    .faq-heading h2 {
        margin: 16px 0 12px;
        color: #080a0d;
        font-size: 33px;
        line-height: 1.14;
        font-weight: 800;
        letter-spacing: -1.3px;
        text-align: center;
    }

    .faq-heading h2 span {
        color: #e3a029;
    }

    .faq-heading .faq-description {
        max-width: 390px;
        margin: 0 auto;
        color: #464d58;
        font-size: 14px;
        line-height: 1.6;
        text-align: center;
    }

    /* Mobil - Yardım kartını küçült */

.contact-card{
    padding:24px 20px;
    border-radius:22px;
}

.contact-card h2{
    font-size:38px;
    line-height:1.15;
    margin:18px 0 12px;
}

.contact-card > p{
    font-size:16px;
    line-height:1.6;
    margin-bottom:24px;
}

.contact-features{
    gap:18px;
    margin-bottom:28px;
}

.contact-feature{
    gap:14px;
}

.contact-feature-icon{
    width:48px;
    height:48px;
}

.contact-feature h4{
    font-size:22px;
}

.contact-feature p{
    font-size:14px;
}

.contact-button{
    height:56px;
    font-size:17px;
}
}

/* Tablet ve Mobilde Hakkımızda sayfasındaki görseli gizle */
@media (max-width: 992px) {
    .about-office-image {
        display: none;
    }
}

.whatsapp-button svg{
    width:42px;
    height:42px;
    fill:none;
    stroke:#ffffff;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.whatsapp-button{
    background:#111418;
    border:1px solid #e6ae43;
    width:80px;
    height:80px;
}

.whatsapp-button:hover{
    background:#e6ae43;
}

.whatsapp-button:hover svg{
    stroke:#111418;
}

.whatsapp-button{
    position:fixed;
    right:30px;
    bottom:30px;
    width:72px;
    height:72px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:18px;
    background:#111418;
    border:1px solid #e6ae43;
    box-shadow:0 15px 35px rgba(0,0,0,.25);
    transition:.25s;
    z-index:9999;
}

.whatsapp-button i{
    font-size:42px;
    color:#25D366;
}

.whatsapp-button:hover{
    transform:translateY(-4px);
    border-color:#25D366;
    box-shadow:0 20px 40px rgba(37,211,102,.35);
}

@media (max-width: 992px) {
    .whatsapp-button{
        width: 60px;
        height: 60px;
        border-radius: 16px;
    }

    .whatsapp-button i{
        font-size: 34px;
    }
}