:root {
    /* --- Temel Renkler --- */
    --color-primary: #0f172a;
    --color-accent: #0369a1;
    --color-accent-hover: #075985;
    --color-success: #22c55e;
    --color-ice-blue: #f0f9ff;

    /* --- Arka Planlar --- */
    --bg-main: #fcfcfc;
    --bg-light: #f8fafc;
    --bg-alt: #f1f5f9;
    --bg-card: #ffffff;

    /* --- Metinler --- */
    --text-primary: #1e293b;
    --text-secondary: #526071;
	
	/* --- Typography Scale --- */
    --text-xs: 0.8rem;
    --text-sm: 0.9rem;
    --text-md: 1rem;
    --text-lg: 1.1rem;
    --text-xl: 1.25rem;
    --text-2xl: 1.6rem;
    --text-3xl: 2rem;
    --text-4xl: 2.4rem;


    /* --- Yardımcılar --- */
    --border-color: #e2e8f0;
    --header-bg: rgba(255, 255, 255, 0.95);
    --shadow-md: 0 10px 25px -5px rgba(15, 23, 42, 0.1);
	--shadow-soft: 0 4px 12px rgba(15, 23, 42, 0.04);

    --header-height: 70px;

    /* ⚠️ optimize edildi */
    --transition: transform 0.25s ease, opacity 0.25s ease;
}

/* --- DARK MODE (FINAL PRO VERSION) --- */
body[data-theme="dark"] {

    /* --- BACKGROUNDS --- */
    --bg-main: #0f172a;      /* ana zemin */
    --bg-light: #1e293b;     /* section */
    --bg-alt: #111827;       /* contrast section */
    --bg-card: #1f2937;      /* kartlar */

    /* --- TEXT --- */
    --text-primary: #f8fafc;
    --text-secondary: #a3b1c6;

    /* --- UI --- */
    --border-color: #273449;
    --header-bg: rgba(15, 23, 42, 0.95);

    /* --- ACCENT SYSTEM --- */
    --color-accent: #38bdf8;         /* 🔥 daha canlı */
    --color-accent-hover: #0ea5e9;   /* hover */
    --color-ice-blue: rgba(56, 189, 248, 0.12);

    /* --- SHADOWS --- */
    --shadow-md: 0 10px 25px -5px rgba(0, 0, 0, 0.5);
    --shadow-soft: 0 4px 12px rgba(0, 0, 0, 0.35);
}

/* =========================================
   2. GENEL SIFIRLAMA
========================================= */

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

html {
    scroll-behavior: smooth;
}

body {
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    background-color: var(--bg-main);
    color: var(--text-primary);
    line-height: 1.6;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
	transition: background-color 0.3s ease, color 0.3s ease;
}

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

img {
    max-width: 100%;
    display: block;
}
/* =========================================
   GLOBAL TEXT HELPERS
========================================= */
.text-accent {
    color: var(--color-accent);
    font-weight: 800;
}
/* =========================================
   GLOBAL LAYOUT
========================================= */
.container {
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
    padding: 0 20px;
}

.section-divider {
    position: relative;
}

.section-divider::after {
    content: '';
    display: block;

    margin-top: 60px;
    margin-left: auto;
    margin-right: auto;

    width: 100px;
    height: 2px;

    background: linear-gradient(
        90deg,
        transparent,
        var(--color-accent),
        transparent
    );

    opacity: 0.25;
}

/* =========================================
   HEADER (FINAL)
========================================= */

.main-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: var(--header-height);
    background-color: var(--header-bg);
    backdrop-filter: blur(10px);
    z-index: 1000;
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--border-color);
}

/* NAVBAR */
.navbar {
    width: 100%;
    padding: 0 20px;

    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* MENU LIST */
.nav-list {
    list-style: none;

    display: flex;
    flex-direction: column;
    gap: 22px;

    align-items: center;
}

/* MENU ITEM ANIMATION */
.nav-list li {
    opacity: 0;
    transform: translateY(10px);
    transition: all 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}
.nav-menu.active .nav-list li:nth-child(1) { transition-delay: 0.05s; }
.nav-menu.active .nav-list li:nth-child(2) { transition-delay: 0.1s; }
.nav-menu.active .nav-list li:nth-child(3) { transition-delay: 0.15s; }
.nav-menu.active .nav-list li:nth-child(4) { transition-delay: 0.2s; }
.nav-menu.active .nav-list li:nth-child(5) { transition-delay: 0.25s; }
.nav-menu.active .nav-list li:nth-child(6) { transition-delay: 0.3s; }

/* ACTIVE ITEMS */
.nav-menu.active .nav-list li {
    opacity: 1;
    transform: translateY(0);
}

/* CTA BUTTON */
.nav-list .btn-primary.mobile-cta {
    background-color: var(--color-accent);
    color: #ffffff;

    padding: 14px 26px;
    border-radius: 14px;

    font-weight: 700;
    font-size: 1rem;

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

    min-height: 48px;
    margin-top: 12px;

    box-shadow: var(--shadow-soft);
    transition: var(--transition);
}

.nav-list .btn-primary.mobile-cta:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.nav-list .btn-primary.mobile-cta:active {
    background-color: var(--color-accent-hover);
    transform: scale(0.97);
}

/* LINKS */
.nav-link {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text-primary);
    transition: color 0.2s ease;
}

.nav-link:hover,
.nav-link:active {
    color: var(--color-accent);
}

/* MOBILE MENU */
.nav-menu {
    position: fixed;
    top: var(--header-height);
    right: -100%;

    width: 100%;
    height: calc(100dvh - var(--header-height));

    backdrop-filter: blur(12px);
    background: rgba(255, 255, 255, 0.97);

    padding: 40px 20px;

    z-index: 999;

    display: flex;
    justify-content: center;

    opacity: 0;

    transition: right 0.35s ease, opacity 0.3s ease;

    will-change: transform, opacity;
}

/* ACTIVE MENU */
.nav-menu.active {
    right: 0;
    opacity: 1;
}

/* DARK MODE MENU */
body[data-theme="dark"] .nav-menu {
    background: rgba(15, 23, 42, 0.97);
}

/* LOGO */
.logo {
    display: flex;
    align-items: center;
    cursor: pointer;
}

.logo img {
    width: 140px;
    height: 40px;
    object-fit: contain;
}

/* LOGO SWITCH */
.logo-light {
    display: block;
}

.logo-dark {
    display: none;
}

body[data-theme="dark"] .logo-light {
    display: none;
}

body[data-theme="dark"] .logo-dark {
    display: block;
}

/* HEADER ACTIONS */
.header-actions {
    display: flex;
    align-items: center;
    gap: 6px;
}

/* THEME BUTTON */
.theme-btn {
    background: transparent;
    border: none;

    color: var(--text-primary);
    cursor: pointer;

    width: 44px;
    height: 44px;

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

    transition: opacity 0.2s ease;
}

.theme-icon {
    width: 24px;
    height: 24px;
}

/* ICON SWITCH */
#sun-icon { display: none; }
#moon-icon { display: block; }

body[data-theme="dark"] #sun-icon { display: block; }
body[data-theme="dark"] #moon-icon { display: none; }

/* HAMBURGER */
.hamburger-btn {
    background: transparent;
    border: none;
	 position: relative; /* 🔥 KRİTİK */

    color: var(--text-primary);
    cursor: pointer;

    width: 48px;
    height: 48px;

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

/* LINES */
.hamburger-line {
    position: absolute;
    left: 10px;
    right: 10px;
    height: 3px; /* 🔥 2px → 3px yaptık */
    background: var(--text-primary); /* 🔥 FIX */
    border-radius: 2px;

    transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
                opacity 0.2s ease;
}

/* POSITION */
.hamburger-line:nth-child(1) {
    top: 16px;
}

.hamburger-line:nth-child(2) {
    top: 23px;
}

.hamburger-line:nth-child(3) {
    top: 30px;
}

/* ACTIVE → X */
body.menu-open .hamburger-line:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

body.menu-open .hamburger-line:nth-child(2) {
    opacity: 0;
}

body.menu-open .hamburger-line:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

/* BODY LOCK */
body.menu-open {
    overflow: hidden;
}
/* =========================================
   HERO → RESIDENCE INLINE CTA
========================================= */

.residence-redirect {
    margin-top: 28px;
    text-align: center;
    max-width: 480px;
}

/* üst text (soft trigger) */
.redirect-text {
    font-size: var(--text-xs);
    color: var(--text-secondary);
    margin-bottom: 6px;
    opacity: 0.9;
}

/* title */
.redirect-title {
    font-size: var(--text-lg);
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 12px;
    color: var(--text-primary);
}

/* button */
.residence-redirect .btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 12px 20px;

    border-radius: 999px;
    border: 1px solid var(--border-color);

    font-size: var(--text-sm);
    font-weight: 700;

    background: transparent;
    color: var(--color-accent);

    min-height: 40px;

    transition: var(--transition);
}

/* hover */
.residence-redirect .btn-secondary:hover {
    background: var(--color-accent);
    color: #fff;
    transform: translateY(-1px);
}

/* active */
.residence-redirect .btn-secondary:active {
    transform: scale(0.96);
}
/* =========================================
   HERO SECTION (OPTIMIZED)
========================================= */

.hero {
    padding-top: calc(var(--header-height) + 40px);
    padding-bottom: 80px;
    padding-left: 20px;
    padding-right: 20px;
    min-height: 100dvh;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    text-align: center;
    background: var(--bg-main);
}

/* BADGE */
.hero-badge {
    background: var(--color-ice-blue);
    color: var(--color-accent);
    padding: 8px 18px;
    border-radius: 999px;
    font-size: 0.85rem;
    font-weight: 700;
    margin-bottom: 20px;
    border: 1px solid var(--border-color);
}

/* TITLE */
.hero-title {
    font-size: 2.4rem;
    line-height: 1.15;
    margin-bottom: 18px;
    font-weight: 800;
    max-width: 640px;
    color: var(--text-primary);
    letter-spacing: -0.02em;
}

/* SUBTEXT */
.hero-sub {
    font-size: 1.1rem;
    color: var(--text-secondary);
    max-width: 480px;
    margin-bottom: 14px;
}

/* 🔥 NEW: SOFT FILTER (IMPORTANT) */
.hero-note {
    font-size: 0.95rem;
    color: var(--text-secondary);
    background: var(--bg-alt);
    padding: 10px 14px;
    border-radius: 8px;
    margin-bottom: 18px;
    max-width: 460px;
    border: 1px solid var(--border-color);
}

/* PROOF */
.hero-proof {
    font-size: 0.95rem;
    color: var(--text-secondary);
    margin-bottom: 28px;
}

/* BUTTON WRAPPER */
.hero-btns {
    display: flex;
    justify-content: center;
    width: 100%;
}

/* CTA BUTTON */
.btn-main {
    background-color: var(--color-accent);
    color: #ffffff;
    font-size: 1.1rem;
    font-weight: 700;
    padding: 16px 32px;
    border-radius: 14px;

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

    width: 100%;
    max-width: 360px;
    min-height: 58px;

    transition: var(--transition);
    box-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.15);
}

.btn-main:hover {
    background-color: var(--color-accent-hover);
    transform: translateY(-1px);
}

.btn-main:active {
    transform: scale(0.98);
}

/* MICRO TEXT */
.micro-reassurance {
    font-size: 0.85rem;
    color: var(--text-secondary);
    margin-top: 14px;
    margin-bottom: 36px;
}

/* TRUST BADGES */
.trust-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    padding-top: 20px;
    border-top: 1px solid var(--border-color);
    width: 100%;
    max-width: 520px;
}

.badge-item {
    background: var(--color-ice-blue);
    color: var(--color-accent);
    padding: 6px 12px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
}
/* =========================================
   HERO DIVIDER (SYSTEM MATCH)
========================================= */

.hero-divider {
    width: 64px; /* process ile aynı grid */
    height: 4px;

    margin: 32px auto 24px;

    background: var(--color-accent);
    opacity: 0.25;

    border-radius: 2px;
}
/* =========================================
   RESIDENCE REDIRECT (INLINE HERO CTA)
========================================= */

.residence-redirect {
    text-align: center;
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 24px;
}

/* small intro */
.redirect-text {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    margin-bottom: 6px;
    opacity: 0.85;          /* biraz daha soft */
    font-weight: 600;
    letter-spacing: 0.01em; /* 0.02 → düşürdük */
}

/* title */
.redirect-title {
    font-size: var(--text-lg);
    font-weight: 700;
    line-height: 1.4;

    max-width: 460px;
    margin-left: auto;
    margin-right: auto;

    margin-bottom: 12px;
    color: var(--text-primary);

    letter-spacing: -0.01em;
}

/* button (secondary CTA) */
.residence-redirect .btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 12px 20px;

    border-radius: 999px;
    border: 1px solid var(--border-color);

    font-size: var(--text-sm);
    font-weight: 700;

    background: var(--color-ice-blue); /* ✅ artık dolu ama soft */
    color: var(--color-accent);

    min-height: 40px;

    transition: var(--transition);
}

/* hover */
.residence-redirect .btn-secondary:hover {
    background: var(--color-accent);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: var(--shadow-soft);
}
.residence-redirect .btn-secondary:active {
    transform: scale(0.96);
}




/* =========================================
   WHY US SECTION (GOLDEN SYSTEM)
========================================= */

.why-us {
    background: var(--bg-light);
    padding: 80px 16px; /* 80 (section) + 16 (grid) */
    border-top: 1px solid var(--border-color);
}

/* HEADER */
.section-header {
    text-align: center;
    max-width: 700px;
    margin: 0 auto 56px; /* 56 = 32 + 24 */
}

.section-title {
    font-size: var(--text-3xl); /* 2rem */
    font-weight: 800;
    color: var(--text-primary);

    margin-bottom: 12px; /* 12 */
    letter-spacing: -0.02em;
    line-height: 1.3;
}

.section-subtitle {
    font-size: var(--text-lg); /* ~1.1rem */
    color: var(--text-secondary);

    line-height: 1.6;

    max-width: 512px; /* 512 = 64 * 8 */
    margin-left: auto;
    margin-right: auto;
}

/* GRID */
.why-us-grid {
    display: grid;
    grid-template-columns: 1fr;

    gap: 24px; /* 24 ✔ */

    max-width: 700px;
    margin: 0 auto;
}

/* CARD */
.why-card {
    background: var(--bg-card);
    padding: 24px; /* 24 ✔ */
    border-radius: 16px;
    border: 1px solid var(--border-color);

    text-align: left;

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

    position: relative;
    overflow: hidden;
}

/* HOVER */
.why-card:hover {
    transform: translateY(-8px); /* 8 ✔ */
    box-shadow: var(--shadow-md);
    border-color: var(--color-accent);
}

/* subtle top accent line */
.why-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 4px; /* 4 = 8’in yarısı */

    background: var(--color-accent);
    opacity: 0;

    transition: opacity 0.25s ease;
}

.why-card:hover::before {
    opacity: 0.5;
}

/* ICON */
.why-icon {
    width: 48px; /* 48 = 6 * 8 */
    height: 48px;

    background: var(--color-ice-blue);

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

    border-radius: 12px;
    margin-bottom: 16px; /* 16 ✔ */

    box-shadow: var(--shadow-soft);

    transition: transform 0.25s ease;
}

/* ICON HOVER */
.why-card:hover .why-icon {
    transform: scale(1.05);
}

.why-icon svg {
    color: var(--color-accent);
}

/* TITLE */
.why-card h3 {
    font-size: var(--text-xl); /* 1.25rem */
    font-weight: 700;
    color: var(--text-primary);

    margin-bottom: 8px; /* 8 ✔ */
    line-height: 1.4;
}

/* TEXT */
.why-card p {
    font-size: var(--text-md); /* 1rem */
    color: var(--text-secondary);

    line-height: 1.6;
}

/* MICRO NOTE */
.why-note {
    text-align: center;

    margin: 56px auto 0; /* 56 ✔ */
    max-width: 560px;

    font-size: var(--text-lg);
    color: var(--text-secondary);

    line-height: 1.6;

    position: relative;
    padding-top: 24px; /* 24 ✔ */
}

/* separator */
.why-note::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;

    transform: translateX(-50%);

    width: 80px; /* 80 = 10 * 8 */
    height: 4px;

    background: var(--color-accent);
    opacity: 0.25;
}
/* =========================================
   AUTHORITY BOX (FINAL – GRID PERFECT)
========================================= */

.authority-box {
    background: var(--bg-card);
    padding: 32px; /* ✔ 32 */
    border-radius: 16px; /* ✔ 16 */
    border: 1px solid var(--border-color);

    max-width: 700px;
    margin: 0 auto 56px; /* ✔ section spacing */

    position: relative;
    box-shadow: var(--shadow-soft);

    background-image: linear-gradient(
        to bottom,
        var(--color-ice-blue),
        var(--bg-card)
    );

    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

/* TOP ACCENT */
.authority-box::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 4px; /* ✔ 4 (8’in yarısı allowed) */

    background: var(--color-accent);
    border-radius: 16px 16px 0 0;

    opacity: 0.6;
}

/* HOVER */
.authority-box:hover {
    transform: translateY(-4px); /* ✔ 4 */
    box-shadow: var(--shadow-md);
}

/* TITLE */
.authority-box h3 {
    font-size: var(--text-xl);
    font-weight: 800;
    color: var(--text-primary);

    text-align: center;

    max-width: 480px;
    margin: 0 auto 24px; /* ✔ 24 */

    line-height: 1.4;
    letter-spacing: -0.01em;
}

/* TEXT */
.authority-box p {
    font-size: var(--text-md);
    color: var(--text-secondary);

    line-height: 1.75; /* 🔥 readability upgrade */

    max-width: 420px;
    margin: 0 auto 24px; /* ✔ 24 */

    text-align: center;
}

/* STRONG */
.authority-box p strong {
    color: var(--text-primary);
    font-weight: 700;
}

/* LIST */
.authority-proof {
    margin: 24px auto 0; /* ✔ 24 */
    padding: 0;

    list-style: none;

    display: flex;
    flex-direction: column;
    gap: 12px; /* ✔ 12 */

    max-width: 480px;
}

/* ITEM */
.authority-proof li {
    display: flex;
    align-items: flex-start;
    gap: 8px; /* ✔ 8 */

    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-primary);

    line-height: 1.6;
}

/* ICON */
.authority-proof li::before {
    content: "✔";
    color: var(--color-accent);

    margin-top: 2px;
    font-size: 0.85rem;

    flex-shrink: 0;
}

/* =========================================
   PROCESS (GOLDEN SYSTEM FINAL)
========================================= */

.process {
    background: var(--bg-alt);
    padding: 80px 16px; /* 16 grid */
}

/* HEADER */
.process .section-header {
    text-align: center;
    max-width: 700px;
    margin: 0 auto 56px; /* 32 + 24 */
}

/* GRID */
.process-steps {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px; /* ✔ */

    margin-top: 48px; /* ✔ */

    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

/* CARD */
.step-item {
    position: relative;
    padding: 24px; /* ✔ */

    background: var(--bg-card);
    border-radius: 16px;
    border: 1px solid var(--border-color);

    text-align: left;

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

/* HOVER */
.step-item:hover {
    transform: translateY(-8px); /* ✔ */
    box-shadow: var(--shadow-md);
    border-color: var(--color-accent);
}

/* ACCENT LINE (hover) */
.step-item::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background: var(--color-accent);
    opacity: 0;

    transition: opacity 0.25s ease;
}

.step-item:hover::before {
    opacity: 0.5;
}

/* STEP NUMBER */
.step-number {
    font-size: var(--text-lg);
    font-weight: 800;

    color: var(--color-accent);
    background: var(--color-ice-blue);

    width: 48px;
    height: 48px;

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

    border-radius: 12px;
    margin-bottom: 16px;
}

/* TITLE */
.step-item h3 {
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--text-primary);

    margin-bottom: 8px;
}

/* TEXT */
.step-item p {
    font-size: var(--text-md);
    line-height: 1.6;
    color: var(--text-secondary);
}

/* CTA TEXT */
.process-cta-text {
    text-align: center;
    margin-top: 32px;
    margin-bottom: 12px;

    font-size: var(--text-md);
    color: var(--text-secondary);
}

/* CTA BUTTON */
.process-cta {
    display: flex;
    justify-content: center;
    margin-bottom: 16px;
}

.process-cta .btn-main {
    max-width: 360px;
}

/* NOTE */
.process-note {
    text-align: center;
    margin: 0 auto;

    max-width: 512px;

    font-size: var(--text-sm);
    color: var(--text-secondary);

    opacity: 0.9;

    padding-top: 24px;

    position: relative; /* 🔥 çizgi için */
}

/* 🔥 NEW DIVIDER (WHY-NOTE STYLE) */
.process-note::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;

    transform: translateX(-50%);

    width: 64px;
    height: 4px;

    background: var(--color-accent);
    opacity: 0.25;
}
/* =========================================
   SERVICES (GOLDEN SYSTEM FINAL)
========================================= */

.services {
    background: var(--bg-light);
    padding: 80px 16px; /* 16 grid */
}

/* GRID */
.services-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px; /* ✔ */

    margin-top: 48px; /* ✔ */

    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

/* CARD */
.service-card {
    position: relative;
    padding: 24px; /* ✔ */

    background: var(--bg-card);
    border-radius: 16px;
    border: 1px solid var(--border-color);

    text-align: left;

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

    overflow: hidden;
}

/* HOVER */
.service-card:hover {
    transform: translateY(-8px); /* ✔ */
    box-shadow: var(--shadow-md);
    border-color: var(--color-accent);
}

/* 🔥 subtle top accent (process ile aynı) */
.service-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background: var(--color-accent);
    opacity: 0;

    transition: opacity 0.25s ease;
}

.service-card:hover::before {
    opacity: 0.5;
}

/* ICON */
.service-icon {
    width: 48px;
    height: 48px;

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

    background: var(--color-ice-blue);
    border-radius: 12px;

    margin-bottom: 16px; /* ✔ */

    box-shadow: var(--shadow-soft);
    transition: transform 0.25s ease;
}

/* ICON HOVER */
.service-card:hover .service-icon {
    transform: scale(1.05);
}

.service-icon svg {
    color: var(--color-accent);
}

/* TITLE */
.service-card h3 {
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--text-primary);

    margin-bottom: 8px;
}

/* TEXT */
.service-card p {
    font-size: var(--text-md);
    color: var(--text-secondary);
    line-height: 1.6;
}

/* HIGHLIGHT CARD */
.highlight-card {
    border: 1px solid var(--color-accent);
    background: var(--color-ice-blue);
}

.highlight-card:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: var(--shadow-md);
}

/* =========================================
   SERVICES CTA (UNIFIED SYSTEM)
========================================= */

.services-cta {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;

    gap: 16px; /* ✔ */
    margin-top: 48px; /* ✔ */

    max-width: 512px;
    margin-left: auto;
    margin-right: auto;
}

/* PROOF */
.services-proof {
    font-size: var(--text-md);
    color: var(--text-secondary);
}

.services-proof strong {
    color: var(--text-primary);
    font-weight: 700;
}

/* CTA NOTE */
.services-note {
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

/* 🔥 OPTIONAL (istersen divider ekle) */
.services-note::before {
    content: "";
    display: block;

    width: 64px;
    height: 4px;

    margin: 0 auto 16px;

    background: var(--color-accent);
    opacity: 0.25;
}
/* =========================================
   RESULTS SECTION – FINAL (ALIGNED)
========================================= */

.results {
    background: var(--bg-alt);
    padding: 80px 20px;
}

/* GRID (🔥 diğer sectionlarla hizalı) */
.results-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;

    margin-top: 50px;

    max-width: 700px;       /* 🔥 kritik */
    margin-left: auto;
    margin-right: auto;
}

/* CARD */
.result-card {
    position: relative;
    background: var(--bg-card);
    padding: 26px;
    border-radius: 16px;
    border: 1px solid var(--border-color);

    text-align: left; /* 🔥 readability */

    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

/* HOVER */
.result-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-md);
}

/* BADGE */
.result-badge {
    position: absolute;
    top: 16px;
    right: 16px;

    font-size: 0.7rem;
    font-weight: 700;

    background: var(--color-ice-blue);
    color: var(--color-accent);

    padding: 5px 10px;
    border-radius: 20px;
}

/* USER */
.result-user {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.result-user img {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    object-fit: cover;
}

.result-user strong {
    display: block;
    font-size: 0.95rem;
    color: var(--text-primary);
}

.result-user span {
    font-size: 0.8rem;
    color: var(--text-secondary);
}

/* DIVIDER */
.result-divider {
    height: 1px;
    background: var(--border-color);
    margin: 12px 0;
}

/* TEXT */
.result-text {
    font-size: 0.95rem;
    color: var(--text-secondary);
    line-height: 1.5;
    margin-bottom: 14px;
}

/* STARS */
.result-stars {
    font-size: 0.9rem;
    letter-spacing: 2px;
}

/* =========================================
   STATS (🔥 ortalanmış yapı)
========================================= */

.results-stats {
    display: flex;
    justify-content: space-between;
    gap: 12px;

    margin-top: 60px;

    max-width: 700px;     /* 🔥 kritik */
    margin-left: auto;
    margin-right: auto;
}

.stat-item {
    flex: 1;
    text-align: center;

    background: var(--bg-card);
    padding: 20px 10px;
    border-radius: 14px;
    border: 1px solid var(--border-color);
}

.stat-item strong {
    display: block;
    font-size: 1.3rem;
    font-weight: 800;
    color: var(--color-accent);
}

.stat-item span {
    font-size: 0.8rem;
    color: var(--text-secondary);
}

/* =========================================
   CTA (🔥 process ile aynı mantık)
========================================= */

.results-cta {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;

    gap: 14px;
    margin-top: 40px;

    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.results-proof {
    font-size: 1rem;
    color: var(--text-secondary);
}
/* =========================================
   CTA SECTION – FINAL (ALIGNED)
========================================= */

.cta {
    background: var(--bg-main);
    padding: 80px 20px;
}

/* BOX (🔥 diğer sectionlarla aynı hizalama) */
.cta-box {
    max-width: 700px;
    margin: 0 auto;

    text-align: center;

    background: var(--bg-card);
    padding: 40px 24px;

    border-radius: 20px;
    border: 1px solid var(--border-color);

    box-shadow: var(--shadow-soft);
}

/* TITLE */
.cta-title {
    font-size: 1.9rem;
    font-weight: 800;
    color: var(--text-primary);
    line-height: 1.3;

    max-width: 550px;
    margin: 0 auto 16px;
}

/* SUBTITLE */
.cta-subtitle {
    font-size: 1rem;
    color: var(--text-secondary);
    margin-bottom: 24px;
    line-height: 1.5;
}

/* BENEFITS */
.cta-benefits {
    display: flex;
    flex-direction: column;
    gap: 10px;

    margin-bottom: 26px;
}

/* ITEM */
.cta-item {
    font-size: 0.95rem;
    color: var(--text-primary);
    font-weight: 500;
}

/* CTA BUTTON */
.cta-box .btn-main {
    display: block;
    margin: 10px auto 0;
    width: fit-content;   /* 🔥 KRİTİK */
}

/* URGENCY 🔥 */
.cta-urgency {
    font-size: 0.85rem;
    color: var(--color-accent);
    margin-top: 12px;
    font-weight: 600;
}

/* TRUST */
.cta-trust {
    font-size: 0.9rem;
    color: var(--text-secondary);
    margin-top: 16px;
}

.cta-trust strong {
    color: var(--text-primary);
    font-weight: 700;
}

/* NOTE */
.cta-note {
    font-size: 0.8rem;
    color: var(--text-secondary);
    margin-top: 8px;
}
/* =========================================
   FAQ SECTION – FINAL (ALIGNED)
========================================= */

.faq {
    background: var(--bg-light);
    padding: 80px 20px;
}

/* LIST (🔥 ortalanmış yapı) */
.faq-list {
    display: flex;
    flex-direction: column;
    gap: 16px;

    margin-top: 40px;

    max-width: 700px;     /* 🔥 diğer sectionlarla aynı */
    margin-left: auto;
    margin-right: auto;
}

/* ITEM */
.faq-item {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 14px;
    padding: 20px;

    text-align: left; /* 🔥 readability */

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

/* HOVER */
.faq-item:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
   border-color: color-mix(in srgb, var(--color-accent) 25%, transparent);
}

/* QUESTION */
.faq-question {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 8px;
}

/* ANSWER */
.faq-answer {
    font-size: 0.95rem;
    color: var(--text-secondary);
    line-height: 1.6;
}

/* =========================================
   CTA (🔥 diğer section mantığı)
========================================= */

.faq-cta {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;

    gap: 14px;
    margin-top: 40px;

    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

/* CTA TEXT */
.faq-cta-text {
    font-size: 1rem;
    color: var(--text-secondary);
	
}

/* BUTTON FIX (🔥 ortalama) */
.faq-cta .btn-main {
    display: block;
    width: fit-content;
    margin: 0 auto;
}

/* =========================================
   CONTACT SECTION – FINAL (ALIGNED)
========================================= */

.contact {
    background: var(--bg-alt);
    padding: 80px 20px;
}

/* WRAPPER (🔥 ortalanmış yapı) */
.contact-wrapper {
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;

    margin-top: 50px;

    max-width: 700px;   /* 🔥 kritik */
    margin-left: auto;
    margin-right: auto;
}

/* ================= LEFT ================= */
/* =========================================
   CONTACT INFO (MATCHED WITH AUTHORITY)
========================================= */

.contact-info {
    background: var(--bg-card);
    padding: 32px; /* ✔ 32 */
    border-radius: 16px;
    border: 1px solid var(--border-color);

    max-width: 700px;
    margin: 0 auto;

    text-align: center;
    position: relative;

    box-shadow: var(--shadow-soft);

    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

/* HOVER */
.contact-info:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}

/* TITLE */
.contact-info h3 {
    font-size: var(--text-xl);
    font-weight: 800;
    color: var(--text-primary);

    max-width: 480px;
    margin: 0 auto 24px;

    line-height: 1.4;
}

/* TEXT */
.contact-text {
    font-size: var(--text-md);
    color: var(--text-secondary);

    line-height: 1.7;

    max-width: 420px;
    margin: 0 auto 24px;
}

/* BENEFITS */
.contact-benefits {
    list-style: none;
    padding: 0;

    display: flex;
    flex-direction: column;
    gap: 12px;

    max-width: 420px;
    margin: 0 auto 24px;
}

/* ITEM */
.contact-benefits li {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-primary);

    line-height: 1.6;
}

/* CTA BUTTON */
.contact-info .btn-main {
    display: inline-block;
    margin: 0 auto;

    padding: 16px 28px;

    text-align: center;
    line-height: 1.3;
}

/* MICRO TRUST */
.contact-micro {
    font-size: var(--text-xs);
    color: var(--text-secondary);

    margin-top: 16px;

    max-width: 420px;
    margin-left: auto;
    margin-right: auto;
}

/* ================= RIGHT ================= */
.contact-form {
    background: var(--bg-card);
    padding: 26px;
    border-radius: 16px;
    border: 1px solid var(--border-color);

    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.contact-form:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}

/* FORM */
.contact-form form {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* INPUTS */
.form-group input,
.form-group textarea {
    width: 100%;
    padding: 14px 16px;

    border-radius: 10px;
    border: 1px solid var(--border-color);

    background: var(--bg-main);
    color: var(--text-primary);

    font-size: 0.95rem;

    transition: border 0.2s ease, box-shadow 0.2s ease;
}

/* TEXTAREA */
.form-group textarea {
    resize: vertical;
    min-height: 100px;
}

/* FOCUS */
.form-group input:focus,
.form-group textarea:focus {
    outline: none;
    border-color: var(--color-accent);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-accent) 30%, transparent);
}

/* BUTTON CENTER */
.contact-form .btn-main {
    display: block;
    width: fit-content;
    margin: 10px auto 0;
}

/* NOTE */
.form-note {
    font-size: 0.8rem;
    color: var(--text-secondary);
    margin-top: 10px;
    text-align: center;
}
/* =========================================
   LOCATION SECTION (MATCHED WITH AUTHORITY)
========================================= */

.location {
    background: var(--bg-main);
    padding: 80px 16px;
}

/* CONTENT */
.location .location-content {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;

    max-width: 700px;
    margin: 0 auto 56px;
}

/* MAP */
.location .location-map {
    width: 100%;
    height: 320px;

    border-radius: 16px;
    overflow: hidden;

    border: 1px solid var(--border-color);
    box-shadow: var(--shadow-soft);

    background-image: linear-gradient(
        to bottom,
        var(--color-ice-blue),
        var(--bg-card)
    );

    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.location .location-map:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}

.location .location-map iframe {
    width: 100%;
    height: 100%;
    border: 0;
}

/* INFO */
.location .location-info {
    text-align: center;
}

/* TITLE */
.location .location-info h3 {
    font-size: var(--text-xl);
    font-weight: 800;
    color: var(--text-primary);

    max-width: 480px;
    margin: 0 auto 24px;

    line-height: 1.4;
    letter-spacing: -0.01em;
}

/* ADDRESS */
.location .location-address {
    font-size: var(--text-md);
    color: var(--text-secondary);

    line-height: 1.7;

    max-width: 480px;
    margin: 0 auto 18px;
}

/* CONTACT */
.location .location-contact {
    margin: 20px auto 0;

    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;

    max-width: 480px;
}

/* CONTACT ITEM */
.location .contact-item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-primary);

    text-decoration: none;

    transition: color 0.2s ease, transform 0.2s ease;
}

/* ICON */
.location .contact-item svg {
    width: 18px;
    height: 18px;
    color: var(--color-accent);
    flex-shrink: 0;
}

/* HOVER */
.location .contact-item:hover {
    color: var(--color-accent);
    transform: translateY(-1px);
}

/* TRUST */
.location .location-trust {
    font-size: var(--text-sm);
    color: var(--text-secondary);

    max-width: 480px;
    margin: 20px auto 24px;

    line-height: 1.6;
}

/* BUTTON */
.location .btn-secondary {
    display: inline-block;

    padding: 10px 20px;

    border-radius: 999px;
    border: 1px solid var(--color-accent);

    color: var(--color-accent);
    font-weight: 600;
    font-size: var(--text-sm);

    transition: all 0.25s ease;
}

.location .btn-secondary:hover {
    background: var(--color-accent);
    color: #fff;
}
/* LOCATION PROOF (FINAL CLEAN VERSION) */
.location .location-proof {
    margin: 24px auto 32px; /* 🔥 altı biraz daha açtık */
    padding: 16px 18px;     /* 🔥 iç boşluk geri geldi */

    max-width: 480px;

    background: var(--bg-alt);
    border: 1px solid var(--border-color);
    border-radius: 12px;

    list-style: none;

    display: flex;
    flex-direction: column;
    gap: 12px;

    align-items: center;
}

/* ITEM */
.location .location-proof li {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 8px;

    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-primary);

    line-height: 1.6;
    text-align: center;
}

/* ICON */
.location .location-proof li::before {
    content: "✔";
    color: var(--color-accent);

    font-size: 0.9rem;
    flex-shrink: 0;
}


/* =========================================
   FOOTER – CENTERED (UPDATED)
========================================= */

.footer {
    background: var(--bg-main);
    padding: 60px 20px 30px;
    border-top: 1px solid var(--border-color);
    position: relative;
    text-align: center; /* 🔥 GENEL CENTER */
}

/* subtle depth */
.footer::before {
    content: "";
    position: absolute;
    inset: 0;

    background: linear-gradient(
        to bottom,
        transparent,
        color-mix(in srgb, var(--text-primary) 6%, transparent)
    );

    pointer-events: none;
}

/* CONTENT */
.footer-content {
    display: flex;
    flex-direction: column;
    align-items: center; /* 🔥 center */
    gap: 28px;

    
    margin: 0 auto;
    position: relative;
}

/* BRAND */
.footer-brand {
    max-width: 700px;
    text-align: center; /* 🔥 */
}

.footer-logo {
    width: 140px;
    margin: 0 auto 12px;
}
.footer-logo-link {
    display: inline-flex;
    justify-content: center;
    align-items: center;

    width: 100%;
}

/* DESC + TRUST */
.footer-desc {
    font-size: 0.9rem;
    color: var(--text-secondary);
    line-height: 1.5;
    margin-bottom: 10px;
}

.footer-trust {
    font-size: 0.85rem;
    color: var(--text-secondary);
}

.footer-trust strong {
    color: var(--text-primary);
}

/* LINKS */
.footer-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* 🔥 */
    gap: 10px 16px;
}

.footer-links a {
    font-size: 0.9rem;
    color: var(--text-secondary);
    text-decoration: none;

    position: relative;
    transition: color 0.2s ease;
}

/* underline animation */
.footer-links a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;

    width: 0%;
    height: 1px;

    background: var(--color-accent);
    transition: width 0.25s ease;
}

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

.footer-links a:hover::after {
    width: 100%;
}

/* SOCIAL */
.footer-social {
    display: flex;
    justify-content: center; /* 🔥 */
    gap: 12px;
    margin-top: 14px;
}

.footer-social a {
    width: 42px;
    height: 42px;

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

    background: var(--bg-card);
    border-radius: 12px;

    color: var(--text-primary);

    border: 1px solid var(--border-color);

    transition: all 0.25s ease;
}

/* SVG */
.footer-social svg {
    width: 20px;
    height: 20px;
}

/* hover */
.footer-social a:hover {
    background: var(--color-accent);
    color: #fff;
    transform: translateY(-2px) scale(1.03);

    box-shadow: 0 8px 25px color-mix(in srgb, var(--color-accent) 25%, transparent);
}

/* EXTRA TRUST */
.footer-extra {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 14px;

    margin-top: 40px;

    max-width: 700px;
    margin-left: auto;
    margin-right: auto;

    font-size: 0.85rem;
    color: var(--text-secondary);
    text-align: center;
}

.footer-extra span {
    display: inline-block;
    min-width: 140px;
}

/* BOTTOM */
.footer-bottom {
    text-align: center;
    margin-top: 20px;
    font-size: 0.8rem;
    color: var(--text-secondary);
}
/* =========================================
   WHATSAPP STICKY (PULSE EFEKTLİ)
   ========================================= */
.whatsapp-sticky {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 9999;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
}

.wp-content {
    background-color: #25d366;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 10px rgba(0,0,0,0.3);
    /* Pulse Animasyonu Burada Başlıyor */
    animation: whatsapp-pulse 2s infinite;
}

.whatsapp-sticky:active .wp-content {
    transform: scale(0.9);
    animation: none; /* Basıldığında animasyonu durdurur, daha gerçekçi hissettirir */
}

/* Lighthouse dostu, işlemciyi yormayan Pulse animasyonu */
@keyframes whatsapp-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7);
    }
    70% {
        box-shadow: 0 0 0 15px rgba(37, 211, 102, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(37, 211, 102, 0);
    }
}
/* =========================================
   RESIDENCE PAGE – SPACING SYSTEM
========================================= */

#residence-page .header-actions .btn-main {
    padding: 8px 16px;
    font-size: 0.8rem;
    min-height: auto;
    box-shadow: none;
}

#residence-page .trust-badges {
    border: none;
    padding-top: 0;
    margin-top: 16px;
    gap: 8px;
}

#residence-page .process {
    margin-top: 24px;
}

#residence-page .process-note {
    margin-top: 32px;
    margin-bottom: 8px;
}

#residence-page .process-cta {
    margin-top: 12px;
}

#residence-page .process-cta .btn-main {
    margin-top: 8px;
}

/* =========================================
   RESIDENCE PAGE – TYPOGRAPHY SYSTEM
========================================= */

#residence-page .hero-title {
    font-size: var(--text-4xl);
    letter-spacing: -0.02em;
    font-weight: 800;
}

#residence-page .hero-sub {
    font-size: var(--text-lg);
    line-height: 1.6;
}

#residence-page .hero-proof {
    font-size: var(--text-sm);
}

#residence-page .micro-reassurance {
    font-size: var(--text-xs);
}
#residence-page .why-icon {
    width: 52px;
    height: 52px;
    border-radius: 12px;
    background: var(--color-ice-blue);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
    color: var(--color-accent);
}


/* =========================================
   RESIDENCE PAGE – SECTION HEADERS
========================================= */
#residence-page .section-header {
    margin-bottom: 24px;
}

#residence-page .section-title {
    margin-bottom: 12px;
}

#residence-page .section-subtitle {
    margin-bottom: 0;
    font-size: var(--text-md);
    line-height: 1.6;
}
/* =========================================
   RESIDENCE PAGE – WHY SECTION
========================================= */
#residence-page .why-us-grid {
    gap: 16px;
    margin-top: 24px;
}

#residence-page .why-card {
    padding: 16px;
}

#residence-page .why-card h3 {
    margin-bottom: 8px;
}

#residence-page .why-card p {
    font-size: var(--text-sm);
    line-height: 1.6;
}
/* =========================================
   RESIDENCE PAGE – PROCESS SECTION
========================================= */
#residence-page .process-steps {
    gap: 16px;
    margin-top: 24px;
}

#residence-page .step-item {
    padding: 16px;
}

#residence-page .step-item h3 {
    margin-bottom: 8px;
}

#residence-page .step-item p {
    font-size: var(--text-sm);
    line-height: 1.6;
}
/* =========================================
   RESIDENCE PAGE – CTA SECTION
========================================= */
#residence-page .cta-box {
    padding: 24px;
}

#residence-page .cta-title {
    margin-bottom: 12px;
}

#residence-page .cta-subtitle {
    margin-bottom: 16px;
    font-size: var(--text-md);
}

#residence-page .cta-benefits {
    margin-bottom: 16px;
    gap: 8px;
}

/* =========================================
   RESIDENCE PAGE – FAQ SECTION
========================================= */
#residence-page .faq-list {
    margin-top: 24px;
    gap: 16px;
}

#residence-page .faq-item {
    padding: 16px;
}

#residence-page .faq-question {
    margin-bottom: 8px;
}

#residence-page .faq-answer {
    font-size: var(--text-sm);
    line-height: 1.6;
}
/* =========================================
   RESIDENCE PAGE – BUTTON FIX
========================================= */

#residence-page .btn-main {
    display: flex;              /* 🔥 FIX */
    justify-content: center;
    align-items: center;
    text-align: center;
    line-height: 1.4;

    width: 100%;                /* 🔥 garanti */
    max-width: 360px;           /* 🔥 hero ile aynı */
}
/* =========================================
   RESIDENCE PAGE – SOCIAL PROOF (FINAL SYSTEM)
========================================= */

#residence-page .proof-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;            /* card arası */
    margin-top: 32px;     /* section ritmi (24 → 32 upgrade) */
}

#residence-page .proof-card {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 16px;        /* ana iç boşluk */

    display: flex;
    flex-direction: column;
    gap: 12px;            /* içerik arası */

    transition: var(--transition);
}

#residence-page .proof-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-soft);
}

/* 👤 USER HEADER */
#residence-page .proof-user {
    display: flex;
    align-items: center;
    gap: 12px;            /* 10 → 12 (sisteme oturdu) */
}

/* avatar */
#residence-page .proof-user img {
    width: 40px;          /* 8px grid → 40 = 5x8 */
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
}

/* name */
#residence-page .proof-user strong {
    font-size: var(--text-sm);
    color: var(--text-primary);
    display: block;
    line-height: 1.2;
}

/* location */
#residence-page .proof-user span {
    font-size: var(--text-xs);
    color: var(--text-secondary);
}

/* divider */
#residence-page .proof-divider {
    height: 1px;
    background: var(--border-color);
    margin: 8px 0;        /* 🔥 kritik: 0 → 8 */
}

/* text */
#residence-page .proof-text {
    font-size: var(--text-sm);
    line-height: 1.6;
    color: var(--text-primary);
}

/* stars */
#residence-page .proof-stars {
    font-size: var(--text-sm);
    letter-spacing: 2px;
    color: #f59e0b;
}

/* section closing note */
#residence-page .proof-grid + .process-note {
    margin-top: 24px;     /* 16 → 24 (daha premium kapanış) */
}
/* =========================================
   RESIDENCE PAGE – FINAL CTA
========================================= */

#residence-page .section:last-of-type {
    text-align: center;
}

/* başlık */
#residence-page .section:last-of-type .section-title {
    margin-bottom: 12px;   /* 8-12 scale */
}

/* subtitle */
#residence-page .section:last-of-type .section-subtitle {
    font-size: var(--text-md);
    margin-bottom: 24px;   /* 🔥 ana boşluk */
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

/* CTA button alanı */
#residence-page .section:last-of-type .process-cta {
    margin-bottom: 16px;
    display: flex;
    justify-content: center;
}

/* button zaten global → sadece hizalama */
#residence-page .section:last-of-type .btn-main {
    max-width: 360px;
}

/* reassurance */
#residence-page .section:last-of-type .micro-reassurance {
    font-size: var(--text-xs);
    color: var(--text-secondary);
    margin-top: 8px;
}
