@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Manrope:wght@400;500;600;700;800&display=swap');
:root {
    --ink:#17191c;
    --muted:#71757a;
    --orange:#f26429;
    --line:#e7e8e9;
    --soft:#f5f5f3;
    --white:#fff
}

* {
    box-sizing:border-box
}

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

body {
    margin:0;
    color:var(--ink);
    font-family:'DM Sans',sans-serif;
    background:#fff;
    -webkit-font-smoothing:antialiased
}

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

button {
    font:inherit;
    cursor:pointer
}

.wrap {
    width:min(1180px,calc(100% - 48px));
    margin:auto
}

.header {
    height:82px;
    background:#fff;
    border-bottom:1px solid var(--line);
    position:sticky;
    top:0;
    z-index:20
}

.header-inner {
    height:100%;
    display:flex;
    align-items:center;
    gap:34px
}

.brand {
    display:flex;
    align-items:center;
    gap:11px;
    margin-right:auto;
    font-family:Manrope,sans-serif;
    font-size:15px;
    letter-spacing:-.6px;
    font-weight:800;
    line-height:1.1
}

.brand img {
    width:43px;
    height:43px;
    object-fit:cover;
    border-radius:8px
}

.brand span {
    display:block
}

.brand b {
    color:var(--orange)
}

.brand small {
    display:block;
    color:#777;
    font-size:8px;
    letter-spacing:1.25px;
    margin-top:5px;
    font-weight:700
}

.header nav {
    display:flex;
    align-items:center;
    gap:27px
}

.header nav a {
    font-size:12px;
    font-weight:700;
    color:#51555a;
    transition:color .2s
}

.header nav a:hover {
    color:var(--orange)
}

.btn {
    display:inline-flex;
    align-items:center;
    justify-content:space-between;
    gap:32px;
    border-radius:5px;
    padding:16px 20px;
    font-size:12px;
    font-weight:800;
    transition:transform .2s,background .2s
}

.btn:hover {
    transform:translateY(-2px)
}

.btn-dark {
    background:var(--ink);
    color:white
}

.btn-orange {
    background:var(--orange);
    color:white
}

.btn-orange:hover {
    background:#db5521
}

.menu {
    display:none;
    background:none;
    border:0;
    font-size:25px
}

.hero {
    background:#f7f7f5;
    overflow:hidden
}

.hero-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:70px;
    align-items:center;
    min-height:610px;
    padding-top:60px;
    padding-bottom:65px
}

.eyebrow,.kicker {
    font-size:10px;
    letter-spacing:2px;
    font-weight:800;
    color:var(--orange)
}

.eyebrow {
    display:flex;
    align-items:center;
    gap:10px;
    color:#45494e
}

.dot {
    width:8px;
    height:8px;
    background:var(--orange);
    border-radius:50%
}

h1,h2,h3,p {
    margin-top:0
}

h1,h2,h3 {
    font-family:Manrope,sans-serif;
    letter-spacing:-.055em
}

h1 {
    font-size:clamp(46px,5.2vw,75px);
    line-height:1.09;
    margin:25px 0
}

h1 em,h2 em {
    font-style:normal;
    color:var(--orange)
}

.hero-copy>p {
    max-width:465px;
    font-size:15px;
    line-height:1.9;
    color:#666b70
}

.hero-actions {
    display:flex;
    align-items:center;
    gap:28px;
    margin-top:34px
}

.text-link {
    font-size:12px;
    font-weight:800
}

.text-link span {
    margin-left:9px;
    color:var(--orange)
}

.hero-foot {
    display:flex;
    align-items:center;
    gap:19px;
    margin-top:65px;
    color:#7a7d80;
    font-size:11px
}

.hero-foot strong {
    display:block;
    color:#2b2e32;
    font-size:12px;
    margin-bottom:5px
}

.separator {
    height:32px;
    width:1px;
    background:#d5d5d2
}

.hero-art {
    position:relative;
    padding:14px 27px 26px 0
}

.visual-frame {
    position:relative;
    min-height:495px;
    background:#202327;
    color:white;
    overflow:hidden;
    padding:33px;
    display:flex;
    flex-direction:column;
    box-shadow:0 25px 60px #17191c20
}

.visual-grid {
    position:absolute;
    inset:0;
    opacity:.18;
    background-image:linear-gradient(#777 1px,transparent 1px),linear-gradient(90deg,#777 1px,transparent 1px);
    background-size:38px 38px;
    mask-image:linear-gradient(90deg,transparent,#000)
}

.visual-frame:after {
    content:"";
    position:absolute;
    width:380px;
    height:380px;
    border:95px solid #f26429;
    border-radius:50%;
    right:-170px;
    top:85px;
    opacity:.95;
    filter:drop-shadow(0 0 55px #f2642933)
}

.visual-label,.visual-big,.visual-caption,.visual-stroke,.visual-bottom {
    position:relative;
    z-index:1
}

.visual-label {
    font-size:10px;
    letter-spacing:2px;
    font-weight:800;
    color:#c7c7c7
}

.visual-big {
    font-family:Manrope,sans-serif;
    font-size:clamp(105px,13vw,182px);
    font-weight:800;
    letter-spacing:-.1em;
    line-height:1;
    margin-top:70px
}

.visual-big span {
    color:var(--orange)
}

.visual-caption {
    font-size:14px;
    font-weight:800;
    letter-spacing:2px;
    line-height:1.7
}

.visual-stroke {
    position:absolute;
    right:30px;
    bottom:75px;
    text-align:right;
    color:#fff8;
    font-size:10px;
    letter-spacing:3px;
    font-weight:800
}

.visual-bottom {
    margin-top:auto;
    padding-top:35px;
    display:flex;
    justify-content:space-between;
    font-size:9px;
    letter-spacing:1.5px;
    border-top:1px solid #ffffff33
}

.float-stat {
    position:absolute;
    right:0;
    bottom:0;
    background:#fff;
    box-shadow:0 18px 35px #1112;
    padding:20px 23px;
    width:215px;
    z-index:2
}

.float-stat span {
    font-size:10px;
    color:#777
}

.float-stat strong {
    font-family:Manrope,sans-serif;
    font-size:35px;
    display:block;
    letter-spacing:-2px;
    margin:7px 0
}

.bar {
    height:5px;
    background:#eee;
    border-radius:4px
}

.bar i {
    display:block;
    background:var(--orange);
    height:100%;
    width:95.1%;
    border-radius:4px
}

.section {
    padding:105px 0
}

.section-head {
    display:flex;
    justify-content:space-between;
    align-items:end;
    gap:50px;
    margin-bottom:40px
}

.section-head h2,.audience h2 {
    font-size:clamp(31px,3.7vw,49px);
    line-height:1.18;
    margin:17px 0 0
}

.section-head>p {
    font-size:13px;
    color:var(--muted);
    line-height:1.9;
    max-width:335px;
    margin:0
}

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

.stat-card {
    min-height:225px;
    border:1px solid var(--line);
    padding:25px 22px;
    display:flex;
    flex-direction:column;
    justify-content:space-between
}

.stat-card.featured {
    background:var(--ink);
    color:#fff;
    border-color:var(--ink)
}

.stat-top {
    display:flex;
    justify-content:space-between;
    gap:12px;
    font-size:9px;
    font-weight:800;
    letter-spacing:1px;
    color:#777
}

.featured .stat-top {
    color:#c2c2c2
}

.stat-top span {
    font-size:19px;
    color:var(--orange)
}

.stat-card strong {
    font-family:Manrope,sans-serif;
    font-size:clamp(27px,2.7vw,40px);
    letter-spacing:-2px
}

.stat-bottom {
    font-size:11px;
    color:#85888b
}

.featured .stat-bottom {
    color:#bbb
}

.source {
    font-size:10px;
    color:#9a9a9a;
    margin:18px 0 0
}

.audience {
    background:#f7f7f5
}

.audience-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:100px;
    align-items:center
}

.audience .lead {
    max-width:480px;
    line-height:1.9;
    color:#6b7075;
    font-size:14px;
    margin-top:25px
}

.audience-highlight {
    display:flex;
    align-items:center;
    gap:20px;
    margin-top:37px
}

.audience-highlight strong {
    font:800 65px Manrope,sans-serif;
    letter-spacing:-5px;
    color:var(--orange)
}

.audience-highlight span {
    font-size:12px;
    color:#666;
    max-width:130px;
    line-height:1.6
}

.mini-fact {
    border-top:1px solid #ddd;
    padding-top:22px;
    margin-top:27px;
    font-size:12px;
    color:#757575
}

.mini-fact b {
    color:#222
}

.audience-panel {
    background:#fff;
    padding:38px 35px;
    box-shadow:0 14px 40px #22200009
}

.panel-title {
    font-size:10px;
    font-weight:800;
    letter-spacing:1px;
    margin-bottom:33px;
    display:flex;
    justify-content:space-between;
    gap:10px
}

.panel-title span {
    font-size:9px;
    color:#aaa;
    letter-spacing:0;
    font-weight:500
}

.city {
    margin:0 0 22px
}

.city>div {
    display:flex;
    justify-content:space-between;
    font-size:12px;
    margin-bottom:10px
}

.city b {
    font-weight:700
}

.city span {
    font-weight:800
}

.city i {
    display:block;
    height:7px;
    background:linear-gradient(to right,var(--orange) var(--p),#f0f0f0 var(--p));
    border-radius:3px
}

.panel-note {
    font-size:10px;
    line-height:1.7;
    color:#929292;
    border-top:1px solid #eee;
    padding-top:17px;
    margin-top:30px
}

.packages {
    background:#fff
}

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

.package {
    border:1px solid #e4e4e4;
    padding:24px 21px 21px;
    position:relative;
    display:flex;
    flex-direction:column;
    min-height:475px
}

.package.recommended {
    border:2px solid var(--orange);
    padding:23px 20px 20px
}

.recommend-label {
    position:absolute;
    top:-23px;
    right:-2px;
    background:var(--orange);
    color:white;
    font-size:9px;
    letter-spacing:1px;
    font-weight:800;
    padding:7px 12px
}

.package-top {
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-size:9px;
    color:#999;
    letter-spacing:1px;
    font-weight:800
}

.package-icon {
    font-size:20px;
    color:var(--orange)
}

.package h3 {
    font-size:21px;
    line-height:1.2;
    margin:35px 0 13px
}

.package>p {
    font-size:12px;
    line-height:1.75;
    color:#777;
    min-height:84px
}

.price {
    font:800 37px Manrope,sans-serif;
    letter-spacing:-2px;
    margin:16px 0
}

.price small {
    font-size:15px;
    letter-spacing:0
}

.package-line {
    height:1px;
    background:#e9e9e9;
    margin-bottom:20px
}

.package ul {
    padding:0;
    list-style:none;
    margin:0 0 27px
}

.package li {
    font-size:11px;
    line-height:1.65;
    margin:0 0 10px;
    display:flex;
    gap:9px
}

.package li:before {
    content:'✓';
    color:var(--orange);
    font-weight:800
}

.package-btn {
    margin-top:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    background:#f4f4f3;
    border:0;
    padding:15px;
    font-size:11px;
    font-weight:800;
    width:100%;
    transition:.2s
}

.package-btn:hover,.recommended .package-btn {
    background:var(--orange);
    color:white
}

.package-disclaimer {
    font-size:11px;
    line-height:1.8;
    color:#8a8a8a;
    max-width:920px;
    margin:24px 0 0
}

.process {
    background:#f7f7f5
}

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

.step {
    border-top:2px solid #d7d7d7;
    padding-top:20px
}

.step span {
    color:var(--orange);
    font:800 13px Manrope,sans-serif
}

.step h3 {
    font-size:19px;
    margin:26px 0 12px
}

.step p {
    font-size:12px;
    color:#777;
    line-height:1.8;
    max-width:220px
}

.contact {
    background:#1c1f23;
    color:white;
    padding:95px 0
}

.contact-inner {
    display:grid;
    grid-template-columns:1fr 390px;
    gap:90px;
    align-items:center
}

.kicker.light {
    color:#f58b60
}

.contact h2 {
    font-size:clamp(40px,5vw,65px);
    line-height:1.12;
    margin:22px 0
}

.contact>div>div>p {
    font-size:14px;
    color:#b3b4b7;
    line-height:1.9;
    max-width:470px
}

.contact-box {
    background:#2b2e33;
    padding:35px
}

.contact-box>span {
    font-size:9px;
    letter-spacing:2px;
    color:#aaa;
    font-weight:800
}

.contact-box h3 {
    font-size:27px;
    margin:22px 0 13px
}

.contact-box p {
    color:#bbb;
    font-size:12px;
    line-height:1.8
}

.contact-action {
    display:flex;
    margin-top:27px
}

.contact-box small {
    font-size:10px;
    color:#999;
    display:block;
    margin-top:14px
}

footer {
    background:#17191c;
    color:#fff;
    padding:28px 0
}

.footer-inner,.footer-inner>div {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px
}

.footer-inner strong {
    font-size:12px;
    letter-spacing:.4px
}

.footer-inner span,.footer-inner a {
    font-size:10px;
    color:#999
}

.toast {
    position:fixed;
    bottom:24px;
    left:50%;
    transform:translate(-50%,30px);
    background:#202226;
    color:#fff;
    padding:15px 20px;
    border-radius:5px;
    font-size:12px;
    box-shadow:0 10px 30px #0003;
    opacity:0;
    pointer-events:none;
    transition:.25s;
    z-index:50
}

.toast.show {
    opacity:1;
    transform:translate(-50%,0)
}

@media(max-width:1050px) {
    .header nav {
        gap:14px
    }
    .header nav a {
        font-size:11px
    }
    .hero-grid {
        gap:25px
    }
    .stat-grid {
        grid-template-columns:repeat(2,1fr)
    }
    .package-grid {
        grid-template-columns:repeat(2,1fr);
        row-gap:35px
    }
    .package {
        min-height:450px
    }
    .audience-grid {
        gap:40px
    }
}

@media(max-width:740px) {
    .wrap {
        width:min(100% - 32px,560px)
    }
    .header {
        height:70px
    }
    .brand img {
        width:39px;
        height:39px
    }
    .header-cta {
        display:none
    }
    .menu {
        display:block
    }
    .header nav {
        display:none;
        position:absolute;
        top:69px;
        left:0;
        right:0;
        background:white;
        padding:20px 24px;
        box-shadow:0 15px 25px #0001;
        flex-direction:column;
        align-items:flex-start;
        gap:20px
    }
    .header nav.open {
        display:flex
    }
    .hero-grid,.audience-grid,.contact-inner {
        grid-template-columns:1fr
    }
    .hero-grid {
        padding:55px 0 45px;
        gap:30px
    }
    .hero-copy h1 {
        font-size:clamp(44px,11vw,66px)
    }
    .hero-foot {
        margin-top:34px
    }
    .hero-art {
        padding-right:18px
    }
    .visual-frame {
        min-height:380px;
        padding:24px
    }
    .visual-big {
        font-size:130px;
        margin-top:48px
    }
    .visual-frame:after {
        width:270px;
        height:270px;
        border-width:65px;
        right:-130px;
        top:70px
    }
    .float-stat {
        width:190px;
        padding:15px
    }
    .section {
        padding:70px 0
    }
    .section-head {
        display:block
    }
    .section-head>p {
        margin-top:17px
    }
    .stat-card {
        min-height:185px
    }
    .stat-card strong {
        font-size:30px
    }
    .audience-panel {
        padding:27px 24px
    }
    .audience-highlight strong {
        font-size:58px
    }
    .package-grid {
        grid-template-columns:1fr;
        gap:35px
    }
    .package {
        min-height:auto
    }
    .package>p {
        min-height:0
    }
    .package h3 {
        margin-top:24px
    }
    .steps {
        grid-template-columns:repeat(2,1fr);
        gap:28px
    }
    .contact {
        padding:70px 0
    }
    .contact-inner {
        gap:25px
    }
    .contact-box {
        padding:26px
    }
    .footer-inner,.footer-inner>div {
        align-items:flex-start;
        flex-direction:column;
        gap:8px
    }
}

@media(max-width:390px) {
    .hero-actions {
        align-items:flex-start;
        flex-direction:column;
        gap:19px
    }
    .stat-grid {
        gap:9px
    }
    .stat-card {
        padding:16px 12px
    }
    .stat-card strong {
        font-size:25px
    }
    .stat-top {
        font-size:8px
    }
    .steps {
        grid-template-columns:1fr
    }
    .visual-big {
        font-size:105px
    }
}

/* =========================================================
   OKUNABİLİRLİK GÜNCELLEMESİ — MASAÜSTÜ
   Yalnızca tipografi boyutları güncellendi.
   ========================================================= */

.brand { font-size: 16px; }
.brand small { font-size: 10px; }
.header nav a { font-size: 13px; }
.btn { font-size: 13px; }
.eyebrow, .kicker { font-size: 12px; }
.hero-copy > p { font-size: 16px; }
.text-link { font-size: 13px; }
.hero-foot { font-size: 12px; }
.hero-foot strong { font-size: 13px; }
.visual-label { font-size: 12px; }
.visual-caption { font-size: 15px; }
.visual-stroke { font-size: 11px; }
.visual-bottom { font-size: 11px; }
.float-stat span { font-size: 12px; }
.section-head > p { font-size: 15px; }
.stat-top { font-size: 11px; }
.stat-bottom { font-size: 13px; }
.source { font-size: 12px; }
.audience .lead { font-size: 16px; }
.audience-highlight span { font-size: 14px; }
.mini-fact { font-size: 14px; }
.panel-title { font-size: 12px; }
.panel-title span { font-size: 11px; }
.city > div { font-size: 14px; }
.panel-note { font-size: 12px; }
.package-top { font-size: 11px; }
.recommend-label { font-size: 10px; }
.package > p { font-size: 14px; }
.package li { font-size: 13px; }
.package-btn { font-size: 13px; }
.package-disclaimer { font-size: 13px; }
.step span { font-size: 14px; }
.step p { font-size: 14px; }
.contact > div > div > p { font-size: 16px; }
.contact-box > span { font-size: 11px; }
.contact-box p { font-size: 14px; }
.contact-box small { font-size: 12px; }
.footer-inner strong { font-size: 13px; }
.footer-inner span, .footer-inner a { font-size: 12px; }
.toast { font-size: 13px; }

/* Tablet: navigasyonun mevcut kırılma noktasını koru. */
@media (max-width: 1050px) {
    .header nav a { font-size: 12px; }
}

/* Mobil: okunaklı etiketler, mevcut tek sütun düzeni. */
@media (max-width: 740px) {
    .hero-copy > p { font-size: 15px; }
    .section-head > p { font-size: 14px; }
    .stat-top { font-size: 10px; }
    .package > p { font-size: 14px; }
    .package li { font-size: 13px; }
    .panel-title { font-size: 11px; }
    .visual-bottom { font-size: 10px; }
}

@media (max-width: 390px) {
    .stat-top { font-size: 9px; }
    .brand { font-size: 15px; }
}


/* =========================================================
   DAHA BÜYÜK FONTLAR — V2
   Mevcut yerleşim, renkler ve bileşenler korunmuştur.
   Bu blok, önceki tipografi ayarlarını geçersiz kılar.
   ========================================================= */

body { font-size: 17px; }
.brand { font-size: 18px; }
.brand small { font-size: 11px; }
.header nav a { font-size: 15px; }
.btn { font-size: 15px; }
.eyebrow, .kicker { font-size: 14px; }
.hero-copy > p, .audience .lead, .contact > div > div > p { font-size: 18px; line-height: 1.8; }
.text-link { font-size: 15px; }
.hero-foot { font-size: 14px; }
.hero-foot strong { font-size: 15px; }
.visual-label { font-size: 13px; }
.visual-caption { font-size: 17px; }
.visual-stroke { font-size: 12px; }
.visual-bottom { font-size: 12px; }
.float-stat span { font-size: 13px; }
.section-head > p { font-size: 17px; }
.stat-top { font-size: 13px; line-height: 1.5; }
.stat-bottom { font-size: 15px; }
.source { font-size: 13px; line-height: 1.7; }
.audience-highlight span { font-size: 16px; }
.mini-fact { font-size: 16px; line-height: 1.7; }
.panel-title { font-size: 13px; line-height: 1.5; }
.panel-title span { font-size: 12px; }
.city > div { font-size: 16px; }
.panel-note { font-size: 14px; }
.package-top { font-size: 13px; }
.recommend-label { font-size: 11px; }
.package h3 { font-size: 23px; }
.package > p { font-size: 16px; line-height: 1.7; min-height: 112px; }
.package li { font-size: 15px; }
.package-btn { font-size: 15px; }
.package-disclaimer { font-size: 14px; }
.step span { font-size: 15px; }
.step h3 { font-size: 21px; }
.step p { font-size: 16px; }
.contact-box > span { font-size: 13px; }
.contact-box p { font-size: 16px; }
.contact-box small { font-size: 13px; }
.footer-inner strong { font-size: 15px; }
.footer-inner span, .footer-inner a { font-size: 13px; }
.toast { font-size: 15px; }

/* Yazıların büyümesiyle kartların içerik taşmasını önle. */
.package { min-height: 540px; }
.stat-card { min-height: 240px; }

@media (max-width: 1050px) {
    .header nav a { font-size: 13px; }
    .package { min-height: 510px; }
}

@media (max-width: 740px) {
    .hero-copy > p, .audience .lead, .contact > div > div > p { font-size: 17px; }
    .section-head > p { font-size: 16px; }
    .stat-top { font-size: 12px; }
    .stat-bottom { font-size: 14px; }
    .package { min-height: auto; }
    .package > p { min-height: 0; font-size: 16px; }
    .package li { font-size: 15px; }
    .panel-title { font-size: 12px; }
    .visual-bottom { font-size: 11px; }
}

@media (max-width: 390px) {
    .stat-top { font-size: 11px; }
    .brand { font-size: 16px; }
}


/* SVG ok ikonları — tüm cihazlarda aynı görünüm */
.arrow-icon {
    display: inline-block;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    vertical-align: middle;
}
.stat-top .arrow-icon {
    width: 20px;
    height: 20px;
    color: var(--orange);
}
.stat-top span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.btn .arrow-icon,
.package-btn .arrow-icon,
.visual-bottom .arrow-icon {
    width: 17px;
    height: 17px;
}
.text-link .arrow-icon {
    width: 16px;
    height: 16px;
    color: var(--orange);
}