/* ==========================================================================
   travelAI ana site (travelai.com.tr) — yalnizca herkese acik sayfalar (layout `site`).
   Panel ve hesap sayfalari app.css kullanir; bu dosya onlara yuklenmez.
   Kaynak: hedef_tasarim/css/style.css + responsive.css (2026-10-09). Farklar:
   - Satir ici style="" yok (CSP): urun rengi .renk-<kod>, sira indeksi .i-<n>, cizim degerleri ozel siniflarla.
   - Font kendi sunucumuzdan (assets/fonts/geist-*.woff2, OFL); Google Fonts yok.
   - En sondaki "travelAI eklemeleri" bolumu: renk paleti, paket kartlari, bildirim kutusu, icerik (prose).
   ========================================================================== */

@font-face {
    font-family: 'Geist';
    src: url('../fonts/geist-variable.woff2') format('woff2');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Geist Mono';
    src: url('../fonts/geist-mono-variable.woff2') format('woff2');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

/* ==========================================================================
   TravelAI — Design system & components
   Renkler logodan türetildi: graphite zemin + turuncu "AI" rozeti.
   Tüm sayfalar (ana sayfa, ürün detayları, blog) bu dosyayı kullanır.
   Responsive kurallar: css/responsive.css
   ========================================================================== */

:root {
    /* Brand */
    --brand-orange: #F47A0E;
    --brand-orange-dark: #E2560F;
    --brand-orange-light: #FF9F3A;
    --brand-orange-ink: #C9490A;          /* küçük turuncu metin (AA kontrast) */
    --brand-orange-tint: #FFF3E8;
    --brand-gradient: linear-gradient(45deg, #EB5611 0%, #F47A0E 55%, #F9920C 100%);

    /* Text */
    --text-primary: #141518;
    --text-secondary: #53565E;
    --text-muted: #6E7179;
    --text-faint: #8E9097;

    /* Surfaces */
    --surface: #FFFFFF;
    --surface-muted: #F6F6F3;
    --surface-sunken: #EEEEEA;
    --graphite: #1B1C20;
    --graphite-900: #111214;
    --graphite-700: #2A2B30;
    --graphite-600: #3A3B41;
    --on-dark: #F4F4F1;
    --on-dark-muted: #9A9CA3;

    /* Lines */
    --border: #E7E7E3;
    --border-strong: #D3D3CE;
    --border-dark: #2C2D33;
    --grid-dot: #D9D9D3;
    --grid-line: #ECECE8;

    /* Operational status */
    --status-ok: #138A5A;
    --status-signal: #1597B3;

    /* Type */
    --font-sans: 'Geist', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --font-mono: 'Geist Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    --fs-display: clamp(2.5rem, 1.4rem + 4.2vw, 5.25rem);
    --fs-h1: clamp(2.5rem, 1.4rem + 2.8vw, 4rem);
    --fs-h2: clamp(2rem, 1.3rem + 2.6vw, 3.75rem);
    --fs-lead: clamp(1.0625rem, 1rem + .3vw, 1.25rem);
    --fs-body: 1rem;
    --fs-small: .875rem;
    --fs-mono: .75rem;
    --fs-mono-sm: .6875rem;
    --tracking-tight: -.035em;
    --tracking-mono: .06em;

    /* Layout */
    --container: 1320px;
    --gutter: clamp(16px, 4vw, 48px);
    --header-height: 84px;
    --header-height-compact: 64px;
    --section-y: clamp(88px, 10vw, 148px);

    /* Spacing scale */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 24px;
    --space-6: 32px;
    --space-7: 48px;
    --space-8: 64px;
    --space-9: 96px;

    /* Radius — logodaki rozet gibi: küçük, kontrollü */
    --radius-xs: 3px;
    --radius-sm: 6px;
    --radius-md: 10px;

    /* Motion */
    --ease-out: cubic-bezier(.22, 1, .36, 1);
    --ease-in-out: cubic-bezier(.65, 0, .35, 1);
    --transition-fast: .2s var(--ease-out);
    --transition-base: .45s var(--ease-out);
    --transition-slow: .9s var(--ease-out);
    --ease-plus: cubic-bezier(.7, 0, .2, 1);
}

/* ---------- Reset / base ---------- */

*, *::before, *::after { box-sizing: border-box; }

html {
    -webkit-text-size-adjust: 100%;
    scroll-padding-top: calc(var(--header-height-compact) + 16px);
}

@media (prefers-reduced-motion: no-preference) {
    html { scroll-behavior: smooth; }
}

body {
    margin: 0;
    background: var(--surface);
    color: var(--text-primary);
    font-family: var(--font-sans);
    font-size: var(--fs-body);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    overflow-x: hidden;
}

html.is-locked, html.is-locked body { overflow: hidden; }

img, svg { display: block; max-width: 100%; }
img { height: auto; }

h1, h2, h3, p, ul, ol, dl, dd, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }

a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
mark { background: none; color: inherit; }
q { quotes: none; }
address { font-style: normal; }

::selection { background: var(--brand-orange); color: #fff; }

:focus-visible {
    outline: 2px solid var(--brand-orange);
    outline-offset: 3px;
    border-radius: var(--radius-xs);
}

.nowrap { white-space: nowrap; }

.visually-hidden {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0);
    white-space: nowrap; border: 0;
}

.skip-link {
    position: fixed;
    top: 12px; left: 12px;
    z-index: 200;
    padding: 10px 16px;
    background: var(--graphite-900);
    color: #fff;
    font-size: var(--fs-small);
    border-radius: var(--radius-sm);
    transform: translateY(-160%);
    transition: transform var(--transition-fast);
}
.skip-link:focus-visible { transform: none; }

.container {
    width: 100%;
    max-width: calc(var(--container) + var(--gutter) * 2);
    margin-inline: auto;
    padding-inline: var(--gutter);
}

.section { padding-block: var(--section-y); }

/* ---------- Typography primitives ---------- */

.display {
    font-size: var(--fs-display);
    font-weight: 600;
    line-height: .98;
    letter-spacing: -.045em;
    text-wrap: balance;
}
.display__muted { color: var(--text-faint); }
.display--dark { color: var(--on-dark); }
.display--dark .display__muted { color: #6C6E75; }

.h2 {
    font-size: var(--fs-h2);
    font-weight: 600;
    line-height: 1.02;
    letter-spacing: -.04em;
    text-wrap: balance;
}

/* Logodaki "AI" rozetinden türetilen imza nokta */
.brand-dot {
    display: inline-block;
    width: .2em;
    height: .2em;
    margin-left: .06em;
    border-radius: .045em;
    background: var(--brand-gradient);
    vertical-align: baseline;
}

.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: var(--font-mono);
    font-size: var(--fs-mono);
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
    color: var(--text-secondary);
}
.eyebrow__mark {
    width: 8px; height: 8px;
    border-radius: 2px;
    background: var(--brand-gradient);
}

/* Bölüm etiketi: 02 ——— ONE ECOSYSTEM */
.sec-label {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: var(--space-6);
    font-family: var(--font-mono);
    font-size: var(--fs-mono);
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
    color: var(--text-secondary);
}
.sec-label__line {
    position: relative;
    width: 56px;
    height: 1px;
    background: var(--border-strong);
}
.sec-label__line::after {
    content: '';
    position: absolute;
    right: -3px; top: -3px;
    width: 7px; height: 7px;
    border-radius: 2px;
    background: var(--brand-orange);
}
.sec-label--dark { color: var(--on-dark-muted); }
.sec-label--dark .sec-label__line { background: var(--graphite-600); }

/* ---------- Buttons & links ---------- */

.btn {
    --btn-bg: var(--graphite-900);
    --btn-fg: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    min-height: 46px;
    padding: 6px 6px 6px 20px;
    border-radius: var(--radius-md);
    background: var(--btn-bg);
    color: var(--btn-fg);
    font-size: .9375rem;
    font-weight: 500;
    letter-spacing: -.01em;
    white-space: nowrap;
    transition: background-color var(--transition-fast), transform var(--transition-fast);
}
.btn:hover { --btn-bg: var(--graphite-700); }
.btn:active { transform: translateY(1px); }
.btn--lg { min-height: 56px; padding-left: 24px; font-size: 1rem; }
.btn--block { width: 100%; justify-content: space-between; }

.btn__icon {
    display: grid;
    place-items: center;
    width: 34px; height: 34px;
    border-radius: 7px;
    background: var(--brand-gradient);
    color: var(--graphite-900);
    overflow: hidden;
}
.btn--lg .btn__icon { width: 44px; height: 44px; border-radius: 9px; }
.btn__icon svg,
.link-cta__icon svg {
    width: 16px; height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform var(--transition-base);
}
.btn:hover .btn__icon svg,
.link-cta:hover .link-cta__icon svg { transform: translateX(3px); }

.link-cta {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-size: .9375rem;
    font-weight: 500;
    color: var(--text-primary);
    white-space: nowrap;
    background: linear-gradient(currentColor, currentColor) no-repeat 0 100% / 0 1px;
    padding-bottom: 2px;
    transition: background-size var(--transition-base);
}
.link-cta:hover { background-size: calc(100% - 42px) 1px; }
.link-cta__icon {
    display: grid;
    place-items: center;
    width: 30px; height: 30px;
    border-radius: 7px;
    border: 1px solid var(--border-strong);
    color: var(--brand-orange-ink);
    transition: background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast);
}
.link-cta:hover .link-cta__icon {
    background: var(--brand-orange);
    border-color: var(--brand-orange);
    color: var(--graphite-900);
}

/* ---------- Breadcrumb ---------- */

.breadcrumb ol {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
    font-size: .8125rem;
    color: var(--text-muted);
}
.breadcrumb li { display: flex; align-items: center; gap: 10px; }
.breadcrumb li + li::before {
    content: '';
    width: 4px;
    height: 4px;
    border-radius: 1px;
    background: var(--border-strong);
}
.breadcrumb a { transition: color var(--transition-fast); }
.breadcrumb a:hover { color: var(--text-primary); }
.breadcrumb [aria-current] { color: var(--text-primary); font-weight: 500; }

/* ==========================================================================
   HEADER
   ========================================================================== */

.site-header {
    position: fixed;
    inset: 0 0 auto;
    z-index: 100;
    background: var(--surface);
    border-bottom: 1px solid transparent;
    transition: background-color var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base);
}
.site-header__inner {
    display: flex;
    align-items: center;
    gap: var(--space-6);
    height: var(--header-height);
    transition: height var(--transition-base);
}
.site-header.is-scrolled {
    background: rgba(255, 255, 255, .88);
    border-bottom-color: var(--border);
    -webkit-backdrop-filter: saturate(160%) blur(12px);
    backdrop-filter: saturate(160%) blur(12px);
}
.site-header.is-scrolled .site-header__inner { height: var(--header-height-compact); }

.site-header__logo { flex: none; display: block; }
.site-header__logo img {
    width: auto;
    height: 38px;
    transition: height var(--transition-base);
}
.site-header.is-scrolled .site-header__logo img { height: 32px; }

.site-nav { flex: 1; display: flex; justify-content: center; }
.site-nav__list { display: flex; gap: clamp(20px, 3vw, 44px); }
.site-nav__link {
    position: relative;
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    padding-block: 8px;
    font-size: .9375rem;
    font-weight: 500;
    color: var(--text-secondary);
    transition: color var(--transition-fast);
}
.site-nav__link::after {
    content: '';
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 2px;
    border-radius: 2px;
    background: var(--brand-orange);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform var(--transition-base);
}
.site-nav__link:hover { color: var(--text-primary); }
.site-nav__link:hover::after { transform: scaleX(.35); }
.site-nav__link.is-active { color: var(--text-primary); }
.site-nav__link.is-active::after { transform: scaleX(1); }

/* ---------- Ürünler dropdown ---------- */

.site-nav__item { position: relative; }
.site-nav__item--dropdown { display: flex; align-items: center; gap: 2px; }

.site-nav__caret {
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-radius: var(--radius-xs);
    color: var(--text-muted);
    transition: color var(--transition-fast);
}
.site-nav__caret svg {
    width: 12px;
    height: 12px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform var(--transition-base);
}
.site-nav__item--dropdown:hover .site-nav__caret,
.site-nav__item--dropdown.is-open .site-nav__caret { color: var(--text-primary); }
.site-nav__item--dropdown:hover .site-nav__caret svg,
.site-nav__item--dropdown.is-open .site-nav__caret svg { transform: rotate(180deg); }

.nav-dropdown {
    position: absolute;
    top: calc(100% + 14px);
    left: 50%;
    width: 540px;
    margin-left: -270px;
    padding: 8px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--surface);
    box-shadow: 0 24px 48px -24px rgba(17, 18, 20, .22);
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity .2s var(--ease-out), transform .3s var(--ease-out), visibility 0s linear .3s;
}
/* fareyle menüye inerken kapanmasın diye görünmez köprü */
.nav-dropdown::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: -15px;
    height: 15px;
}
.site-nav__item--dropdown:hover .nav-dropdown,
.site-nav__item--dropdown.is-open .nav-dropdown {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: opacity .25s var(--ease-out), transform .35s var(--ease-out), visibility 0s;
}

.nav-dropdown__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2px;
}
.nav-dropdown__item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px;
    border-radius: var(--radius-sm);
    transition: background-color var(--transition-fast);
}
.nav-dropdown__item:hover,
.nav-dropdown__item:focus-visible { background: rgb(var(--c) / .09); }
.nav-dropdown__item[aria-current] { background: rgb(var(--c) / .09); }
.nav-dropdown__mark {
    flex: none;
    width: 10px;
    height: 10px;
    margin-top: 6px;
    border-radius: 3px;
    background: rgb(var(--c));
}
.nav-dropdown__text { display: grid; gap: 2px; }
.nav-dropdown__ikon { flex: none; width: 32px; height: 32px; border-radius: 9px; }
.site-nav__ikon { width: 22px; height: 22px; margin-right: 10px; border-radius: 6px; vertical-align: -6px; }
.q__ikon { display: block; width: 44px; height: 44px; margin-bottom: 14px; border-radius: 12px; }
.p-tag__ikon { width: 24px; height: 24px; border-radius: 7px; }
.eco-node__ikon { width: 40px; height: 40px; margin-bottom: 8px; border-radius: 11px; }
.p-next__ikon { flex: none; width: 28px; height: 28px; border-radius: 8px; }
.nav-dropdown__text strong {
    font-size: .9375rem;
    font-weight: 600;
    letter-spacing: -.01em;
    color: var(--text-primary);
}
.nav-dropdown__text small {
    font-size: .8125rem;
    line-height: 1.45;
    color: var(--text-muted);
}
.nav-dropdown__all {
    display: block;
    margin-top: 6px;
    padding: 12px 14px 6px;
    border-top: 1px solid var(--border);
    font-size: .8125rem;
    font-weight: 500;
    color: var(--text-secondary);
    transition: color var(--transition-fast);
}
.nav-dropdown__all:hover { color: var(--brand-orange-ink); }

.site-nav__drawer { display: none; }
.site-header__cta { flex: none; }
.nav-toggle { display: none; }

/* ==========================================================================
   01 · SHOWCASE (ürün vitrini — hareketli + ekosistemi)
   Temel kurallar dokunmatik/dar ekranlar içindir; hover ile hareket eden
   iki eksenli + düzeni css/responsive.css içinde tanımlıdır.
   ========================================================================== */

/* + merkezinin konumu: grid, çizgiler ve AI çekirdeği aynı değişkeni okur */
@property --sx {
    syntax: '<percentage>';
    inherits: true;
    initial-value: 50%;
}
@property --sy {
    syntax: '<percentage>';
    inherits: true;
    initial-value: 50%;
}
/* 6 urunluk izgara (plus--6): iki dikey cizgi, --x1 ve --x2 */
@property --x1 {
    syntax: '<percentage>';
    inherits: true;
    initial-value: 33.333%;
}
@property --x2 {
    syntax: '<percentage>';
    inherits: true;
    initial-value: 66.667%;
}

.showcase {
    padding-top: calc(var(--header-height) + clamp(24px, 2.6vw, 40px));
    padding-bottom: clamp(64px, 8vw, 120px);
}

.showcase__intro {
    display: grid;
    gap: var(--space-5);
    margin-bottom: clamp(28px, 3vw, 44px);
}
.showcase__title {
    margin-top: var(--space-5);
    font-size: var(--fs-h1);
    font-weight: 600;
    line-height: .98;
    letter-spacing: -.045em;
    text-wrap: balance;
}
.showcase__lede {
    max-width: 46ch;
    font-size: var(--fs-lead);
    line-height: 1.55;
    color: var(--text-secondary);
}

/* ---------- + düzeni (temel: dikey liste) ---------- */

.plus {
    --sx: 50%;
    --sy: 50%;
    --q-pad: clamp(24px, 2.6vw, 40px);
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
}

.plus__line,
.plus__core { display: none; }

.plus__line {
    position: absolute;
    z-index: 2;
    pointer-events: none;
    background: var(--border-strong);
}
.plus__line::after {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--brand-orange);
    transition: transform .7s var(--ease-plus);
}
.plus__line--top,
.plus__line--bottom {
    left: var(--sx);
    width: 1px;
    margin-left: -.5px;
}
.plus__line--top {
    top: 0;
    height: var(--sy);
    -webkit-mask-image: linear-gradient(transparent, #000 72px);
    mask-image: linear-gradient(transparent, #000 72px);
}
.plus__line--bottom {
    top: var(--sy);
    bottom: 0;
    -webkit-mask-image: linear-gradient(#000 calc(100% - 72px), transparent);
    mask-image: linear-gradient(#000 calc(100% - 72px), transparent);
}
.plus__line--left,
.plus__line--right {
    top: var(--sy);
    height: 1px;
    margin-top: -.5px;
}
.plus__line--left {
    left: 0;
    width: var(--sx);
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 72px);
    mask-image: linear-gradient(90deg, transparent, #000 72px);
}
.plus__line--right {
    left: var(--sx);
    right: 0;
    -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 72px), transparent);
    mask-image: linear-gradient(90deg, #000 calc(100% - 72px), transparent);
}
.plus__line--top::after { transform: scaleY(0); transform-origin: bottom; }
.plus__line--bottom::after { transform: scaleY(0); transform-origin: top; }
.plus__line--left::after { transform: scaleX(0); transform-origin: right; }
.plus__line--right::after { transform: scaleX(0); transform-origin: left; }

/* Merkez: logodaki "AI" rozeti — ekosistemin çekirdeği */
.plus__core {
    position: absolute;
    z-index: 3;
    left: var(--sx);
    top: var(--sy);
    width: 56px;
    height: 56px;
    margin: -28px 0 0 -28px;
    place-items: center;
    border-radius: 14px;
    background: var(--brand-gradient);
    box-shadow: 0 0 0 10px var(--surface), 0 0 0 11px var(--border);
    pointer-events: none;
}
.plus__core span {
    color: #fff;
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: -.02em;
}

/* ---------- Ürün alanı ---------- */

.q {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
    padding: var(--space-7) 0;
    border-top: 1px solid var(--border-strong);
}
/* Hover zemini: her ürünün kendi rengi (UETDS mavisi, Flightradar sarısı,
   AI çivit, Trustindex yeşili), merkeze doğru hafifçe yoğunlaşır */
.q { --q-tint: var(--c, 244 122 14); } /* urun rengi: .renk-<kod> sinifi (SiteRenk) */
.q--1 { --q-glow: 100% 100%; }
.q--2 { --q-glow: 0% 100%; }
.q--3 { --q-glow: 100% 0%; }
.q--4 { --q-glow: 0% 0%; }

.q::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(90% 90% at var(--q-glow), rgb(var(--q-tint) / .13), transparent 70%),
        rgb(var(--q-tint) / .045);
    opacity: 0;
    transition: opacity .6s var(--ease-out);
}
.q > * { position: relative; }
.q--tikla { cursor: pointer; } /* site.js: kartin tamami urun sayfasina baglanir */

.q__meta {
    display: flex;
    align-items: center;
    gap: 12px;
}
.q__cat {
    font-size: .75rem;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-muted);
}
.q__name {
    margin: 10px 0 8px;
    font-size: clamp(2.25rem, 1.2rem + 2.2vw, 3.4rem);
    font-weight: 600;
    line-height: 1;
    letter-spacing: -.045em;
    white-space: nowrap;
    transition: transform .6s var(--ease-plus), color .4s var(--ease-out);
}
.q__line {
    max-width: 36ch;
    font-size: 1.0625rem;
    line-height: 1.45;
    color: var(--text-secondary);
    transition: opacity .4s var(--ease-out);
}
.q__more {
    display: grid;
    grid-template-rows: 1fr;
}
.q__more-inner { min-height: 0; overflow: hidden; }
.q__desc {
    max-width: 42ch;
    margin-top: var(--space-4);
    font-size: .9688rem;
    line-height: 1.6;
    color: var(--text-secondary);
}
.q .link-cta { margin: var(--space-5) 0 4px; }

.q__visual {
    height: clamp(220px, 52vw, 300px);
    transition: opacity .5s var(--ease-out), transform .7s var(--ease-plus);
}

/* ---------- Ürün görselleri (sade line-art) ---------- */

.v {
    width: 100%;
    height: 100%;
    overflow: visible;
}
.v text {
    font-family: var(--font-sans);
    font-size: 13px;
    fill: var(--text-secondary);
}
.v .v-t-strong { font-size: 14px; font-weight: 600; fill: var(--text-primary); }
.v .v-t-sm { font-size: 12.5px; fill: var(--text-muted); }
.v .v-t-mono { font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; fill: var(--text-muted); }
.v .v-t-accent { font-size: 13px; font-weight: 500; fill: var(--brand-orange-ink); }
.v .v-t-msg { font-size: 14.5px; fill: var(--text-primary); letter-spacing: -.01em; }
.v .v-t-badge { font-size: 11px; font-weight: 700; fill: #fff; }
.v .v-t-score { font-size: 36px; font-weight: 600; letter-spacing: -.04em; fill: var(--text-primary); }
.v .v-t-stars { font-size: 14px; letter-spacing: 2px; fill: var(--brand-orange); }

.v-soft { fill: none; stroke: var(--border-strong); stroke-width: 1.2; }
.v-faint { fill: none; stroke: var(--border); stroke-width: 1; }
.v-dash { stroke-dasharray: 3 6; }
.v-leader { fill: none; stroke: var(--brand-orange); stroke-width: 1.2; }
.v-ring { fill: var(--surface); stroke: var(--text-primary); stroke-width: 1.4; }
.v-fill-ink { fill: var(--text-primary); }
.v-fill-orange { fill: var(--brand-orange); }
.v-chip { fill: var(--surface); stroke: var(--border-strong); stroke-width: 1; }
.v-chip--accent { stroke: var(--brand-orange); }
.v-card { fill: var(--surface); stroke: var(--border-strong); stroke-width: 1.2; }
.v-card--widget { stroke: var(--text-primary); stroke-width: 1.5; }
.v-dot { fill: var(--surface); stroke: var(--text-faint); stroke-width: 1.2; }
.v-dot--accent { fill: var(--brand-orange); stroke: var(--brand-orange); }
.v-bubble { fill: var(--surface); stroke: var(--text-primary); stroke-width: 1.4; }
.v-bubble--agent { fill: var(--brand-orange-tint); stroke: var(--brand-orange); }
.v-node-run { fill: var(--brand-orange); }
.v-node-next { fill: var(--surface); stroke: var(--text-faint); stroke-width: 1.4; stroke-dasharray: 3 3; }

.v-body { fill: var(--surface); stroke: var(--text-primary); stroke-width: 1.8; stroke-linejoin: round; }
.v-glass { fill: var(--surface-muted); stroke: var(--text-primary); stroke-width: 1.5; stroke-linejoin: round; }
.v-hair { fill: none; stroke: var(--text-faint); stroke-width: 1; stroke-linecap: round; }
.v-livery { fill: none; stroke: var(--brand-orange); stroke-width: 3.5; stroke-linecap: round; }
.v-wheel { fill: var(--surface); stroke: var(--text-primary); stroke-width: 1.8; }
.v-hub { fill: var(--surface-muted); stroke: var(--text-primary); stroke-width: 1.2; }

.v-plane { fill: var(--brand-orange); stroke: var(--graphite-900); stroke-width: 1; stroke-linejoin: round; }
.v-plane--muted { fill: var(--surface); stroke: var(--text-muted); }

.v-progress {
    fill: none;
    stroke: var(--brand-orange);
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-dasharray: 100;
    stroke-dashoffset: calc(100 - var(--p1));
    transition: stroke-dashoffset 1.1s var(--ease-out);
}
.v-flow {
    fill: none;
    stroke: var(--brand-orange);
    stroke-width: 1.6;
    stroke-dasharray: 6 18;
    opacity: 0;
}
.v-pulse {
    fill: none;
    stroke: var(--brand-orange);
    stroke-width: 1.2;
    opacity: 0;
    transform-box: fill-box;
    transform-origin: center;
}
.v-detail { transition: opacity .45s var(--ease-out); }

@keyframes vPulse {
    0% { opacity: .6; transform: scale(.3); }
    100% { opacity: 0; transform: scale(1); }
}
@keyframes vNodePulse {
    0% { opacity: .7; transform: scale(1); }
    100% { opacity: 0; transform: scale(2.4); }
}
@keyframes vFlow { to { stroke-dashoffset: -24; } }

/* ==========================================================================
   02 · ONE ECOSYSTEM
   ========================================================================== */

.eco { border-top: 1px solid var(--border); }
.eco__grid {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: clamp(40px, 6vw, 96px);
    align-items: center;
}
.eco .display { margin-bottom: var(--space-7); }
.eco__statement {
    max-width: 30ch;
    font-size: clamp(1.375rem, 1rem + 1.2vw, 2rem);
    line-height: 1.35;
    letter-spacing: -.025em;
    color: var(--text-secondary);
}
.eco__statement b { font-weight: 600; color: var(--text-primary); }
.eco__note {
    max-width: 52ch;
    margin-top: var(--space-6);
    padding-top: var(--space-5);
    border-top: 1px solid var(--border);
    color: var(--text-secondary);
}

.eco__stack { position: relative; }
.stack { width: 100%; height: auto; overflow: visible; }
.stack__guide { fill: none; stroke: var(--border-strong); stroke-width: 1; stroke-dasharray: 2 5; }
.stack__plate { fill: var(--surface); stroke: var(--text-primary); stroke-width: 1.2; stroke-linejoin: round; transition: fill var(--transition-base), stroke var(--transition-base); }
.stack__side { fill: var(--surface-sunken); stroke: var(--text-primary); stroke-width: 1.2; stroke-linejoin: round; }
.stack__leader { fill: none; stroke: var(--text-faint); stroke-width: 1; }
.stack__k { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; fill: var(--text-muted); }
.stack__v { font-family: var(--font-sans); font-size: 16px; font-weight: 600; letter-spacing: -.02em; fill: var(--text-primary); }
.stack__layer--core .stack__plate { stroke: var(--brand-orange); }
.stack__layer--core .stack__side { fill: var(--brand-orange-tint); stroke: var(--brand-orange); }
.stack__badge { fill: var(--brand-orange); }
.stack__ai { font-family: var(--font-sans); font-size: 26px; font-weight: 700; fill: #fff; }
.stack__layer:not(.stack__layer--core):hover .stack__plate { fill: var(--brand-orange-tint); stroke: var(--brand-orange); }

.js .eco__stack .stack__layer { opacity: 0; transform: translateY(-14px); }
.eco__stack.is-in .stack__layer {
    animation: stepIn .7s var(--ease-out) calc(.15s + (4 - var(--i)) * .12s) forwards;
}

.eco__caption {
    margin-top: var(--space-4);
    font-family: var(--font-mono);
    font-size: var(--fs-mono-sm);
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
    color: var(--text-muted);
}

/* ==========================================================================
   03 · HOW TRAVELAI CONNECTS
   ========================================================================== */

.journey-sec {
    background-color: var(--surface-muted);
    background-image: radial-gradient(var(--grid-dot) 1px, transparent 1.3px);
    background-size: 24px 24px;
    border-block: 1px solid var(--border);
}
.journey-sec__head {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: var(--space-7);
    align-items: end;
    margin-bottom: clamp(56px, 7vw, 96px);
}
.journey-sec__lede { color: var(--text-secondary); max-width: 48ch; }
.journey-sec__disclaimer {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: var(--space-4);
    padding: 4px 8px;
    border: 1px dashed var(--border-strong);
    border-radius: var(--radius-xs);
    font-family: var(--font-mono);
    font-size: var(--fs-mono-sm);
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
    color: var(--text-muted);
}

.journey {
    --node: 13px;
    position: relative;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
}
.journey::before,
.journey::after {
    content: '';
    position: absolute;
    left: 0; right: 0;
    top: calc(var(--node) / 2);
    height: 1px;
    background: var(--border-strong);
}
.journey::after {
    height: 2px;
    margin-top: -.5px;
    background: var(--brand-orange);
    transform-origin: left;
}
.js .journey::after { transform: scaleX(0); }
.journey.is-in::after { transform: scaleX(1); transition: transform 2.6s var(--ease-in-out) .2s; }

.journey__stop {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-right: clamp(12px, 2vw, 28px);
}
.journey__node {
    position: relative;
    z-index: 1;
    width: var(--node); height: var(--node);
    margin-bottom: 16px;
    border-radius: 3px;
    border: 1.5px solid var(--text-primary);
    background: var(--surface);
    transition: background-color .3s, border-color .3s;
}
.journey.is-in .journey__node {
    background: var(--brand-orange);
    border-color: var(--brand-orange);
    transition-delay: calc(.35s + var(--i) * .42s);
}
.journey__stop:last-child .journey__node { transform: scale(1.3); }
.journey__time {
    font-family: var(--font-mono);
    font-size: var(--fs-mono-sm);
    color: var(--text-muted);
}
.journey__label {
    font-family: var(--font-mono);
    font-size: var(--fs-mono);
    font-weight: 500;
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
}
.journey__stop p {
    font-size: .9375rem;
    line-height: 1.5;
    color: var(--text-secondary);
}
.journey__product {
    align-self: flex-start;
    margin-top: 6px;
    padding: 3px 8px;
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-xs);
    background: var(--surface);
    font-family: var(--font-mono);
    font-size: .625rem;
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
    color: var(--text-primary);
}
.journey__product--core { border-color: var(--brand-orange); color: var(--brand-orange-ink); }

.js .journey__stop > :not(.journey__node) { opacity: 0; transform: translateY(8px); }
.journey.is-in .journey__stop > :not(.journey__node) {
    animation: stepIn .6s var(--ease-out) calc(.45s + var(--i) * .42s) forwards;
}

/* ==========================================================================
   04 · AI + HUMAN OPERATIONS (koyu bölüm)
   ========================================================================== */

.ops {
    position: relative;
    background: var(--graphite-900);
    color: var(--on-dark);
    overflow: hidden;
}
.ops::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(var(--border-dark) 1px, transparent 1px),
        linear-gradient(90deg, var(--border-dark) 1px, transparent 1px);
    background-size: 80px 80px;
    background-position: center top;
    opacity: .45;
    -webkit-mask-image: linear-gradient(180deg, #000 0%, transparent 70%);
    mask-image: linear-gradient(180deg, #000 0%, transparent 70%);
    pointer-events: none;
}
.ops .container { position: relative; }
.ops__head { max-width: 980px; }
.ops .display { margin-bottom: var(--space-6); }
.ops__lede {
    max-width: 56ch;
    font-size: var(--fs-lead);
    line-height: 1.6;
    color: var(--on-dark-muted);
}

.ledger { margin-top: clamp(56px, 7vw, 96px); }
.ledger__header,
.ledger__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(96px, 12vw, 180px) minmax(0, 1fr);
    align-items: center;
}
.ledger__header {
    padding-bottom: var(--space-4);
    font-family: var(--font-mono);
    font-size: var(--fs-mono-sm);
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
    color: var(--on-dark-muted);
}
.ledger__header > :first-child { text-align: right; }
.ledger__handoff { text-align: center; color: var(--brand-orange); }

.ledger__rows { position: relative; }
.ledger__rows::before {
    content: '';
    position: absolute;
    top: 0; bottom: 0;
    left: 50%;
    width: 1px;
    background: var(--graphite-600);
}
.ledger__row { border-top: 1px solid var(--border-dark); }
.ledger__row:last-child { border-bottom: 1px solid var(--border-dark); }
.ledger__sys,
.ledger__team {
    padding: clamp(18px, 2.2vw, 28px) 0;
    font-size: clamp(1.0625rem, .9rem + .5vw, 1.375rem);
    line-height: 1.35;
    letter-spacing: -.02em;
}
.ledger__sys { text-align: right; color: var(--on-dark-muted); }
.ledger__team { color: var(--on-dark); }
.ledger__axis {
    position: relative;
    height: 1px;
    margin-inline: 12px;
    background: repeating-linear-gradient(90deg, var(--graphite-600) 0 4px, transparent 4px 8px);
}
.ledger__axis::before,
.ledger__axis::after {
    content: '';
    position: absolute;
    top: 50%;
    border-radius: 3px;
}
.ledger__axis::before {
    left: 50%;
    width: 11px; height: 11px;
    margin: -5.5px 0 0 -5.5px;
    background: var(--graphite-900);
    border: 1.5px solid var(--brand-orange);
}
.ledger__axis::after {
    left: 0;
    width: 5px; height: 5px;
    margin-top: -2.5px;
    background: var(--on-dark-muted);
}
.ledger__row:hover .ledger__sys { color: var(--on-dark); }
.ledger__row:hover .ledger__axis::before { background: var(--brand-orange); }

.js .ledger__row { opacity: 0; transform: translateY(10px); }
.ledger.is-in .ledger__row { animation: stepIn .7s var(--ease-out) calc(.1s + var(--i) * .12s) forwards; }

/* ==========================================================================
   05 · TRAVEL TECHNOLOGY (wiring diagram)
   ========================================================================== */

.tech__head {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    column-gap: var(--space-7);
    align-items: end;
}
.tech__head .sec-label { grid-column: 1 / -1; }
.tech__lede { color: var(--text-secondary); max-width: 48ch; }

.wiring {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(200px, 24vw, 320px) minmax(0, 1fr);
    margin-top: clamp(56px, 7vw, 104px);
    background-image: radial-gradient(var(--grid-dot) 1px, transparent 1.3px);
    background-size: 24px 24px;
}
.wiring__col { display: grid; grid-template-rows: repeat(3, 1fr); }
.wire {
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: clamp(110px, 11vw, 150px);
}
.wire__word {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: clamp(1.75rem, .9rem + 2.6vw, 3.75rem);
    font-weight: 600;
    line-height: .95;
    letter-spacing: -.045em;
    text-transform: uppercase;
    background: var(--surface);
    padding: 4px 6px;
    transition: color var(--transition-base);
}
.wiring__col--left .wire__word { align-items: flex-end; text-align: right; }
.wire__word small {
    font-family: var(--font-mono);
    font-size: var(--fs-mono-sm);
    font-weight: 400;
    letter-spacing: var(--tracking-mono);
    color: var(--text-muted);
}
.wire__word--muted { color: var(--text-faint); }
.wire:hover .wire__word--muted { color: var(--text-primary); }
.wire__lead {
    position: relative;
    flex: 1;
    min-width: 24px;
    height: 1px;
    background: var(--border-strong);
}
.wire__lead::after {
    content: '';
    position: absolute;
    top: -3.5px;
    width: 8px; height: 8px;
    border-radius: 2px;
    border: 1.5px solid var(--text-primary);
    background: var(--surface);
}
.wiring__col--left .wire__lead::after { right: -4px; }
.wiring__col--right .wire__lead::after { left: -4px; }
.wire:hover .wire__lead { background: var(--brand-orange); }
.wire:hover .wire__lead::after { background: var(--brand-orange); border-color: var(--brand-orange); }

.wiring__core { position: relative; display: grid; place-items: center; }
.wiring__svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.wiring__base,
.wiring__pulse {
    fill: none;
    vector-effect: non-scaling-stroke;
}
.wiring__base { stroke: var(--border-strong); stroke-width: 1; }
.wiring__pulse {
    stroke: var(--brand-orange);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-dasharray: 8 92;
    stroke-dashoffset: 8;
    opacity: 0;
}
.wiring.is-in .wiring__pulse {
    animation: wirePulse 3.2s var(--ease-in-out) calc(var(--i) * .55s) infinite;
}
@keyframes wirePulse {
    0% { stroke-dashoffset: 8; opacity: 0; }
    10% { opacity: 1; }
    70% { stroke-dashoffset: -92; opacity: 1; }
    75%, 100% { stroke-dashoffset: -92; opacity: 0; }
}

.wiring__plate {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    width: min(100%, 220px);
    padding: 22px 18px 16px;
    border: 1px solid var(--text-primary);
    border-radius: var(--radius-sm);
    background: var(--surface);
    box-shadow: 0 0 0 8px var(--surface), 0 0 0 9px var(--border);
}
.wiring__plate img { width: 150px; }
.wiring__plate span {
    font-family: var(--font-mono);
    font-size: .625rem;
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
    color: var(--text-muted);
}

/* ==========================================================================
   BLOG (ana sayfa bölümü + ortak blog kartı)
   ========================================================================== */

.blog { border-top: 1px solid var(--border); }
.blog__head {
    display: grid;
    gap: var(--space-5);
    margin-bottom: clamp(40px, 5vw, 72px);
}
.blog__lede { max-width: 44ch; color: var(--text-secondary); }

.blog__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-7) clamp(20px, 2.4vw, 36px);
}

.post-card__link {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.post-card__media {
    position: relative;
    display: block;
    aspect-ratio: 4 / 3;
    border-radius: var(--radius-md);
    background: var(--surface-muted);
    overflow: hidden;
}
.post-card__media::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px rgba(17, 18, 20, .06);
}
.post-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .9s var(--ease-out);
}
.post-card__link:hover .post-card__media img { transform: scale(1.04); }

.post-card__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 18px;
    margin-top: var(--space-5);
    font-size: .8125rem;
    color: var(--text-muted);
}
.post-card__cat {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
    color: var(--text-primary);
}
.post-card__cat i {
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background: rgb(var(--c));
}
.post-card__title {
    margin-top: var(--space-3);
    font-size: clamp(1.25rem, 1.05rem + .55vw, 1.5rem);
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: -.025em;
    text-wrap: balance;
    background: linear-gradient(currentColor, currentColor) no-repeat 0 100% / 0 1px;
    transition: background-size var(--transition-base);
}
.post-card__link:hover .post-card__title { background-size: 100% 1px; }
.post-card__excerpt {
    display: -webkit-box;
    margin-top: 10px;
    font-size: .9375rem;
    line-height: 1.6;
    color: var(--text-secondary);
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.post-card__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: auto;
    padding-top: var(--space-5);
    font-size: .8125rem;
    color: var(--text-muted);
}
.post-card__link:hover .link-cta__icon {
    background: var(--brand-orange);
    border-color: var(--brand-orange);
    color: var(--graphite-900);
}
.post-card__link:hover .link-cta__icon svg { transform: translateX(3px); }

/* ==========================================================================
   06 · CTA
   ========================================================================== */

.cta { border-top: 1px solid var(--border); }
.cta__grid {
    display: grid;
    grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
    gap: clamp(40px, 6vw, 96px);
    align-items: end;
}
.cta .display { max-width: 15ch; }
.cta__lede {
    max-width: 50ch;
    margin-top: var(--space-6);
    font-size: var(--fs-lead);
    color: var(--text-secondary);
}
.cta__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-5) var(--space-6);
    margin-top: var(--space-7);
}
.link-cta--plain .link-cta__icon { color: var(--text-primary); }

.arrival {
    padding: var(--space-5);
    border: 1px solid var(--border);
    border-radius: var(--radius-xs);
    background-image: radial-gradient(var(--grid-dot) 1px, transparent 1.3px);
    background-size: 16px 16px;
}
.arrival__meta {
    display: flex;
    justify-content: space-between;
    font-family: var(--font-mono);
    font-size: var(--fs-mono-sm);
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
    color: var(--text-muted);
}
.arrival__route {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin: var(--space-5) 0;
    padding: var(--space-5) 0;
    border-block: 1px solid var(--border);
}
.arrival__route::before {
    content: '';
    position: absolute;
    left: 5px; top: 34px; bottom: 36px;
    width: 1px;
    background: linear-gradient(var(--border-strong), var(--brand-orange));
}
.arrival__route li {
    position: relative;
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: var(--font-mono);
    font-size: var(--fs-mono);
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--text-secondary);
}
.arrival__route i {
    width: 11px; height: 11px;
    border-radius: 3px;
    border: 1.5px solid var(--text-primary);
    background: var(--surface);
}
.arrival__end { color: var(--text-primary) !important; font-weight: 500; }
.arrival__end i {
    display: grid;
    place-items: center;
    width: 28px; height: 28px;
    margin-left: -8px;
    margin-right: -6px;
    border: 0;
    border-radius: 7px;
    background: var(--brand-gradient);
    font-family: var(--font-sans);
    font-size: .6875rem;
    font-style: normal;
    font-weight: 700;
    color: #fff;
}

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

.site-footer {
    background: var(--graphite-900);
    color: var(--on-dark-muted);
    font-size: var(--fs-small);
}
.site-footer__ruler {
    height: 8px;
    background:
        linear-gradient(90deg, var(--brand-orange) 0 48px, transparent 48px) top / 100% 2px no-repeat,
        repeating-linear-gradient(90deg, var(--graphite-600) 0 1px, transparent 1px 16px) top / 100% 6px no-repeat;
}
.site-footer__top {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr));
    gap: var(--space-7);
    padding: clamp(56px, 6vw, 80px) 0 var(--space-7);
}
.site-footer__logo img { height: 34px; width: auto; }
.site-footer__brand p { max-width: 34ch; margin-top: var(--space-5); line-height: 1.6; }
.site-footer__title {
    margin-bottom: var(--space-4);
    font-family: var(--font-mono);
    font-size: var(--fs-mono-sm);
    font-weight: 400;
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
    color: #75777E;
}
.site-footer__col ul,
.site-footer__col address { display: grid; gap: 10px; }
.site-footer__col a {
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
    color: var(--on-dark);
    transition: color var(--transition-fast);
}
.site-footer__col a:hover { color: var(--brand-orange); }
.site-footer__bottom {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 8px 24px;
    padding: var(--space-5) 0;
    border-top: 1px solid var(--border-dark);
    font-family: var(--font-mono);
    font-size: var(--fs-mono-sm);
    letter-spacing: .04em;
    color: #75777E;
}
.site-footer__meta { display: flex; gap: 10px; }
.site-footer__meta a:hover { color: var(--brand-orange); }
.site-footer :focus-visible { outline-color: var(--brand-orange); }

/* ==========================================================================
   Reveal
   ========================================================================== */

.js [data-reveal] {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .8s var(--ease-out), transform .8s var(--ease-out);
}
.js [data-reveal].is-in { opacity: 1; transform: none; }

@keyframes stepIn { to { opacity: 1; transform: none; } }


.mw-unset {
    max-width: unset !important;
}

/* ==========================================================================
   ÜRÜN DETAY SAYFALARI (uetds.php, flight-radar.php, ai-agent.php, social-widget.php)
   Her sayfa <main class="product product--xxx"> ile kendi rengini alır.
   Turuncu marka vurgusu (CTA, imza nokta) değişmez; ürün rengi ikinci vurgudur.
   ========================================================================== */

/* Urun rengi <main class="product renk-<kod>"> ile gelir (--p, --p-ink, --p-line: bkz. RENKLER bolumu) */

/* ---------- Hero ---------- */

.p-hero {
    padding-top: calc(var(--header-height) + clamp(20px, 2.4vw, 36px));
    padding-bottom: clamp(56px, 7vw, 104px);
}
.p-hero__intro {
    display: grid;
    gap: var(--space-6);
    margin: clamp(32px, 4vw, 56px) 0 clamp(36px, 4.4vw, 60px);
}
.p-tag {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: .8125rem;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-secondary);
}
.p-tag__mark {
    width: 10px;
    height: 10px;
    border-radius: 3px;
    background: rgb(var(--p));
}
.p-tag__sep { color: var(--border-strong); }
.p-hero__title {
    max-width: 14ch;
    margin-top: var(--space-5);
    font-size: var(--fs-h1);
    font-weight: 600;
    line-height: .98;
    letter-spacing: -.045em;
    text-wrap: balance;
}
.p-hero__lede {
    max-width: 46ch;
    font-size: var(--fs-lead);
    line-height: 1.55;
    color: var(--text-secondary);
}
.p-hero__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-5) var(--space-6);
    margin-top: var(--space-6);
}

/* ---------- Operasyon sahnesi ---------- */

.op-scene {
    position: relative;
    display: grid;
    gap: var(--space-5);
    padding: clamp(20px, 3vw, 48px);
    border-radius: var(--radius-md);
    background:
        radial-gradient(70% 90% at 30% 60%, rgb(var(--p) / .12), transparent 70%),
        rgb(var(--p) / .04);
    overflow: hidden;
}
.op-scene__art { aspect-ratio: 16 / 9; }
.op-scene .op-scene__art--chat { aspect-ratio: auto; min-height: 0; padding: 8px 0 8px 40px; }

.op-route {
    fill: none;
    stroke: var(--p-line, rgb(var(--p)));
    stroke-width: 2.6;
    stroke-linecap: round;
    stroke-dasharray: 100;
    stroke-dashoffset: calc(100 - var(--p-progress, 76));
}
.op-live { fill: var(--p-line, rgb(var(--p))); }
.op-live-ring {
    fill: none;
    stroke: var(--p-line, rgb(var(--p)));
    stroke-width: 1.4;
    transform-box: fill-box;
    transform-origin: center;
    animation: vPulse 2.6s var(--ease-out) 1.6s infinite both;
}
.op-chip { fill: var(--surface); stroke: var(--p-line, rgb(var(--p))); stroke-width: 1.2; }
.op-scene .op-chip__text { font-size: 13px; font-weight: 500; fill: var(--p-ink); }
.op-leader { stroke: var(--p-line, rgb(var(--p))); }

/* Flight Radar sahnesi */
.op-plane { fill: rgb(var(--p)); stroke: var(--graphite-900); stroke-width: 1; stroke-linejoin: round; }
.op-plane--muted { fill: var(--surface); stroke: var(--text-faint); }
.js .op-plane-main { animation: opFade .8s var(--ease-out) 1.2s both; }
@keyframes opFade { from { opacity: 0; } }

.js .op-route { animation: opRoute 1.8s var(--ease-out) .3s both; }
.js .op-van { animation: opVan 1.4s var(--ease-plus) .1s both; }

@keyframes opRoute { from { stroke-dashoffset: 100; } }
@keyframes opVan { from { opacity: 0; transform: translateX(-48px); } }

/* Sefer kartı */
.op-card {
    position: relative;
    align-self: center;
    padding: var(--space-5);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--surface);
    box-shadow: 0 30px 60px -36px rgba(17, 18, 20, .28);
}
.op-card__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}
.op-card__eyebrow {
    display: block;
    font-size: .75rem;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-muted);
}
.op-card__title {
    font-size: 1.375rem;
    font-weight: 600;
    letter-spacing: -.03em;
}
.op-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    border-radius: 999px;
    background: rgb(var(--p) / .12);
    color: var(--p-ink);
    font-size: .75rem;
    font-weight: 600;
    white-space: nowrap;
}
.op-status::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgb(var(--p));
}

.op-card__route {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    margin: var(--space-5) 0;
    padding: var(--space-4) 0;
    border-block: 1px solid var(--border);
}
.op-card__route > div { display: grid; gap: 1px; }
.op-card__route strong { font-size: 1.0625rem; font-weight: 600; }
.op-card__route span,
.op-card__route time { font-size: .8125rem; color: var(--text-muted); }
.op-card__route time { font-family: var(--font-mono); color: var(--text-primary); }
.op-card__end { text-align: right; }
.op-card__line {
    position: relative;
    height: 2px;
    border-radius: 2px;
    background: repeating-linear-gradient(90deg, var(--border-strong) 0 4px, transparent 4px 8px);
}
.op-card__line i {
    position: absolute;
    left: 0;
    top: 0;
    width: 72%;
    height: 2px;
    border-radius: 2px;
    background: var(--p-line, rgb(var(--p)));
}
.op-card__line i::after {
    content: '';
    position: absolute;
    right: -5px;
    top: -4px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--p-line, rgb(var(--p)));
    box-shadow: 0 0 0 4px rgb(var(--p) / .2);
}

.op-card__facts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.op-card__facts dt { font-size: .75rem; color: var(--text-muted); }
.op-card__facts dd { font-size: .9375rem; font-weight: 500; }

.op-card__log {
    position: relative;
    display: grid;
    gap: 10px;
    margin-top: var(--space-5);
    padding: var(--space-4) 0 0 20px;
    border-top: 1px solid var(--border);
}
.op-card__log::before {
    content: '';
    position: absolute;
    left: 4px;
    top: calc(var(--space-4) + 8px);
    bottom: 8px;
    width: 1px;
    background: var(--border-strong);
}
.op-card__log li {
    position: relative;
    display: flex;
    gap: 10px;
    font-size: .875rem;
    color: var(--text-secondary);
}
.op-card__log li::before {
    content: '';
    position: absolute;
    left: -20px;
    top: 6px;
    width: 9px;
    height: 9px;
    border-radius: 3px;
    background: var(--text-primary);
}
.op-card__log time {
    flex: none;
    width: 42px;
    font-family: var(--font-mono);
    font-size: .75rem;
    line-height: 1.75;
    color: var(--text-muted);
}
.op-card__log .is-final { color: var(--text-primary); font-weight: 500; }
.op-card__log .is-final::before {
    background: rgb(var(--p));
    box-shadow: 0 0 0 4px rgb(var(--p) / .2);
}
.js .op-card__log li { opacity: 0; transform: translateY(6px); }
.js .op-card__log li { animation: stepIn .5s var(--ease-out) calc(.6s + var(--i) * .35s) forwards; }

.op-card__log .is-warn::before {
    background: var(--p-line, rgb(var(--p)));
    box-shadow: 0 0 0 4px rgb(var(--p) / .25);
}

/* Puan özeti (Social Widget kartı) */
.op-score {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px 12px;
    margin: var(--space-5) 0;
    padding: var(--space-4) 0;
    border-block: 1px solid var(--border);
}
.op-score strong { font-size: 2.5rem; font-weight: 600; line-height: 1; letter-spacing: -.04em; }
.op-score__stars { color: var(--brand-orange); letter-spacing: 2px; }
.op-score small { width: 100%; font-size: .8125rem; color: var(--text-muted); }

.op-bars { display: grid; gap: 10px; }
.op-bars li {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr) 64px;
    align-items: center;
    gap: 12px;
    font-size: .8125rem;
}
.op-bars span { color: var(--text-secondary); }
.op-bars b {
    height: 6px;
    border-radius: 3px;
    background: var(--surface-sunken);
    overflow: hidden;
}
.op-bars b::before {
    content: '';
    display: block;
    width: var(--w);
    height: 100%;
    border-radius: 3px;
    background: rgb(var(--p));
    transform-origin: left;
}
.js .op-bars b::before { animation: opBar 1s var(--ease-out) calc(.5s + var(--i) * .12s) both; }
@keyframes opBar { from { transform: scaleX(0); } }
.op-bars em { font-style: normal; font-family: var(--font-mono); font-size: .75rem; text-align: right; color: var(--text-primary); }

/* AI Agent sohbet sahnesi */
.chat {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 12px;
    height: 100%;
    max-width: 520px;
    margin-inline: auto;
}
.chat__msg {
    max-width: 82%;
    padding: 12px 16px;
    border-radius: 16px;
    font-size: .9688rem;
    line-height: 1.45;
}
.chat__msg span {
    display: block;
    margin-bottom: 3px;
    font-size: .6875rem;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--text-muted);
}
.chat__msg--guest {
    align-self: flex-start;
    border: 1px solid var(--border-strong);
    border-bottom-left-radius: 4px;
    background: var(--surface);
}
.chat__msg--agent {
    position: relative;
    align-self: flex-end;
    border: 1px solid rgb(var(--p) / .35);
    border-bottom-right-radius: 4px;
    background: rgb(var(--p) / .1);
}
.chat__msg--agent span { color: var(--p-ink); }
.chat__msg--agent::before {
    content: 'AI';
    position: absolute;
    left: -38px;
    bottom: 0;
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border-radius: 7px;
    background: var(--brand-gradient);
    color: #fff;
    font-size: .625rem;
    font-weight: 700;
}
.chat__typing {
    display: flex;
    gap: 4px;
    align-self: flex-end;
    padding: 12px 14px;
    border-radius: 14px;
    background: rgb(var(--p) / .1);
}
.chat__typing i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgb(var(--p));
    animation: chatDot 1.2s ease-in-out infinite;
}
.chat__typing i:nth-child(2) { animation-delay: .15s; }
.chat__typing i:nth-child(3) { animation-delay: .3s; }
@keyframes chatDot { 0%, 60%, 100% { opacity: .3; transform: none; } 30% { opacity: 1; transform: translateY(-3px); } }
.js .chat > * { opacity: 0; transform: translateY(8px); animation: stepIn .5s var(--ease-out) calc(.3s + var(--i) * .55s) forwards; }

/* Social Widget sahnesi */
.op-flow { fill: none; stroke: rgb(var(--p)); stroke-width: 1.6; stroke-dasharray: 6 18; animation: vFlow 1.4s linear infinite; }
.op-src { fill: var(--surface); stroke: var(--border-strong); stroke-width: 1.2; }
.op-frame { fill: var(--surface); stroke: var(--text-primary); stroke-width: 1.5; }
.op-skel { fill: var(--surface-sunken); }
.op-widget { fill: rgb(var(--p) / .07); stroke: rgb(var(--p) / .5); stroke-width: 1.2; }
.op-scene .op-t-score { font-size: 34px; font-weight: 600; letter-spacing: -.04em; fill: var(--text-primary); }
.op-scene .op-t-stars { font-size: 14px; letter-spacing: 2px; fill: var(--brand-orange); }
.op-scene .op-t-accent { font-size: 13px; font-weight: 500; fill: var(--brand-orange-ink); }

.op-card__note {
    margin-top: var(--space-4);
    font-size: .6875rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--text-faint);
}

/* Kimler için */
.p-audience {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 0;
    margin-top: var(--space-6);
}
.p-audience li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-right: 24px;
    font-size: .9375rem;
    font-weight: 500;
    color: var(--text-secondary);
}
.p-audience li::before {
    content: '';
    width: 5px;
    height: 5px;
    margin-right: 4px;
    border-radius: 1.5px;
    background: rgb(var(--p));
}

/* ---------- Bölüm başlığı ---------- */

.p-section-head {
    display: grid;
    gap: var(--space-5);
    margin-bottom: clamp(48px, 6vw, 80px);
}
.p-section-head .sec-label { margin-bottom: 0; }
.p-section-head__lede { max-width: 48ch; color: var(--text-secondary); }

/* ---------- Bugün / TravelAI ile ---------- */

.p-compare { border-top: 1px solid var(--border); }
.compare__header,
.compare__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: clamp(32px, 6vw, 96px);
}
.compare__header {
    padding-bottom: var(--space-4);
    font-size: .75rem;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-muted);
}
.compare__header span:last-child { color: var(--p-ink); }
.compare__row { border-top: 1px solid var(--border); }
.compare__row:last-child { border-bottom: 1px solid var(--border); }
.compare__before,
.compare__after {
    position: relative;
    padding: clamp(20px, 2.4vw, 30px) 0 clamp(20px, 2.4vw, 30px) 22px;
    font-size: clamp(1.0625rem, .95rem + .45vw, 1.375rem);
    line-height: 1.4;
    letter-spacing: -.02em;
}
.compare__before { color: var(--text-muted); }
.compare__after { color: var(--text-primary); }
.compare__before::before,
.compare__after::before {
    content: '';
    position: absolute;
    left: 0;
    top: calc(clamp(20px, 2.4vw, 30px) + .55em);
    width: 8px;
    height: 8px;
    border-radius: 2px;
}
.compare__before::before { border: 1.5px solid var(--text-faint); }
.compare__after::before { background: rgb(var(--p)); }

.js .compare__row { opacity: 0; transform: translateY(10px); }
.compare.is-in .compare__row { animation: stepIn .7s var(--ease-out) calc(.1s + var(--i) * .12s) forwards; }

/* ---------- Nasıl çalışır (journey bileşeni, 4 adım) ---------- */

.journey--4 .journey__stop:last-child .journey__node {
    background: var(--surface);
    border-color: rgb(var(--p));
}
.journey--4.is-in .journey__stop:last-child .journey__node {
    background: rgb(var(--p));
    border-color: rgb(var(--p));
}

/* ---------- Özellikler ---------- */

.p-features__grid {
    display: grid;
    gap: var(--space-8);
}
.p-features__head .h2 { font-size: clamp(2rem, 1.3rem + 1.9vw, 3.25rem); }
.p-features__lede { max-width: 42ch; margin-top: var(--space-5); color: var(--text-secondary); }
.p-features__list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: clamp(32px, 4vw, 64px);
}
.feature {
    position: relative;
    padding: var(--space-6) 0 var(--space-7);
    border-top: 1px solid var(--border);
}
.feature::before {
    content: '';
    position: absolute;
    left: 0;
    top: -1px;
    width: 48px;
    height: 2px;
    background: rgb(var(--p));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform var(--transition-base);
}
.feature:hover::before { transform: scaleX(1); }
.feature__title {
    margin-bottom: var(--space-3);
    font-size: clamp(1.25rem, 1.05rem + .5vw, 1.5rem);
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -.03em;
}
.feature > p { max-width: 46ch; color: var(--text-secondary); }
.feature__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: var(--space-4);
}
.feature__tags li {
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--surface-muted);
    font-size: .75rem;
    font-weight: 500;
    color: var(--text-secondary);
}

/* ---------- Ekosistem (koyu bant) ---------- */

.p-eco {
    background: var(--graphite-900);
    color: var(--on-dark);
}
.p-eco__head { max-width: 900px; }
.p-eco .display { margin-bottom: var(--space-6); }
.p-eco__lede { max-width: 54ch; font-size: var(--fs-lead); color: var(--on-dark-muted); }

.p-eco__map {
    --eco-gap: clamp(40px, 6vw, 88px);
    display: grid;
    gap: var(--space-4);
    margin-top: clamp(48px, 6vw, 80px);
}
.eco-node {
    position: relative;
    display: grid;
    gap: 6px;
    padding: var(--space-5);
    border: 1px solid var(--border-dark);
    border-radius: var(--radius-md);
    background: #17181B;
    transition: border-color var(--transition-fast), background-color var(--transition-fast);
}
a.eco-node:hover { border-color: rgb(var(--c) / .6); background: #1B1C20; }
.eco-node__mark {
    width: 10px;
    height: 10px;
    margin-bottom: 6px;
    border-radius: 3px;
    background: rgb(var(--c));
}
.eco-node strong { font-size: 1.25rem; font-weight: 600; letter-spacing: -.02em; }
.eco-node span:last-child { font-size: .9375rem; line-height: 1.5; color: var(--on-dark-muted); }
.eco-node--core {
    border-color: rgb(var(--c) / .55);
    background: rgb(var(--c) / .1);
}
.eco-node--core strong { font-size: 1.75rem; }

.p-eco__note {
    margin-top: var(--space-5);
    font-size: .75rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #6C6E75;
}

/* ---------- SSS ---------- */

.p-faq { border-top: 1px solid var(--border); }
.p-faq__grid { display: grid; gap: var(--space-7); }
.faq { border-top: 1px solid var(--border); }
.faq__item { border-bottom: 1px solid var(--border); }
.faq__item summary {
    position: relative;
    display: block;
    padding: var(--space-5) 48px var(--space-5) 0;
    font-size: clamp(1.0625rem, .98rem + .3vw, 1.25rem);
    font-weight: 500;
    letter-spacing: -.02em;
    cursor: pointer;
    list-style: none;
    transition: color var(--transition-fast);
}
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary::before,
.faq__item summary::after {
    content: '';
    position: absolute;
    right: 8px;
    top: 50%;
    width: 14px;
    height: 1.5px;
    border-radius: 2px;
    background: var(--text-primary);
    transition: transform var(--transition-base), background-color var(--transition-fast);
}
.faq__item summary::after { transform: rotate(90deg); }
.faq__item[open] summary::after { transform: rotate(0deg); }
.faq__item summary:hover { color: var(--p-ink); }
.faq__item[open] summary::before,
.faq__item[open] summary::after { background: rgb(var(--p)); }
.faq__item p {
    max-width: 62ch;
    padding: 0 48px var(--space-5) 0;
    color: var(--text-secondary);
}

/* ---------- Diğer ürünler (CTA yanında) ---------- */

.p-next__title {
    margin-bottom: var(--space-3);
    font-size: .75rem;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-muted);
}
.p-next ul { border-top: 1px solid var(--border); }
.p-next a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 0;
    border-bottom: 1px solid var(--border);
}
.p-next__mark {
    width: 10px;
    height: 10px;
    border-radius: 3px;
    background: rgb(var(--c));
}
.p-next strong {
    flex: 1;
    font-size: 1.125rem;
    font-weight: 600;
    letter-spacing: -.02em;
}
.p-next a:hover .link-cta__icon {
    background: var(--brand-orange);
    border-color: var(--brand-orange);
    color: var(--graphite-900);
}
.p-next a:hover .link-cta__icon svg { transform: translateX(3px); }

/* ==========================================================================
   BLOG YAZI DETAYI (blog-detay.php)
   Kategori rengi <main class="renk-<kod>"> ile gelir (yazinin bagli oldugu urunun rengi).
   ========================================================================== */

/* Okuma ilerleme çubuğu (header'ın hemen altında) */
.read-progress {
    position: fixed;
    top: var(--header-height-compact);
    left: 0;
    right: 0;
    z-index: 99;
    height: 2px;
    pointer-events: none;
}
.read-progress span {
    display: block;
    height: 100%;
    background: var(--brand-gradient);
    transform: scaleX(0);
    transform-origin: left;
}

/* ---------- Başlık ---------- */

.article__head {
    padding-top: calc(var(--header-height) + clamp(20px, 2.4vw, 36px));
}
.article__intro {
    max-width: 880px;
    margin: clamp(36px, 5vw, 72px) auto clamp(36px, 4vw, 56px);
    text-align: center;
}
.article__meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 6px 20px;
    font-size: .875rem;
    color: var(--text-muted);
}
.article__cat {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 12px;
    border-radius: 999px;
    background: rgb(var(--c) / .1);
    font-weight: 500;
    color: var(--text-primary);
}
.article__cat i {
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background: rgb(var(--c));
}
.article__title {
    margin-top: var(--space-5);
    font-size: clamp(2.25rem, 1.3rem + 3vw, 4rem);
    font-weight: 600;
    line-height: 1.03;
    letter-spacing: -.045em;
    text-wrap: balance;
}
.article__lede {
    max-width: 60ch;
    margin: var(--space-5) auto 0;
    font-size: var(--fs-lead);
    line-height: 1.6;
    color: var(--text-secondary);
}
.article__author {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-top: var(--space-6);
    text-align: left;
}
.article__author span:last-child { display: grid; font-size: .8125rem; color: var(--text-muted); }
.article__author strong { font-size: .9375rem; font-weight: 600; color: var(--text-primary); }
.article__avatar {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--brand-gradient);
    color: #fff;
    font-size: .75rem;
    font-weight: 700;
}

/* ---------- Kapak ---------- */

.article__cover img {
    width: 100%;
    aspect-ratio: 21 / 9;
    object-fit: cover;
    border-radius: var(--radius-md);
    background: var(--surface-muted);
}
.article__cover figcaption {
    margin-top: var(--space-3);
    font-size: .75rem;
    color: var(--text-muted);
}
.article__cover figcaption a { text-decoration: underline; text-underline-offset: 2px; }
.article__cover figcaption a:hover { color: var(--text-primary); }

/* ---------- Gövde ---------- */

.article__layout {
    display: grid;
    gap: var(--space-7);
    padding-top: clamp(40px, 5vw, 80px);
    padding-bottom: clamp(56px, 7vw, 112px);
}

.toc__title,
.article__product-label {
    display: block;
    margin-bottom: var(--space-3);
    font-size: .75rem;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-muted);
}
.toc ol { border-left: 1px solid var(--border); }
.toc a {
    position: relative;
    display: block;
    padding: 7px 0 7px 16px;
    font-size: .875rem;
    line-height: 1.4;
    color: var(--text-secondary);
    transition: color var(--transition-fast);
}
.toc a::before {
    content: '';
    position: absolute;
    left: -1px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--brand-orange);
    transform: scaleY(0);
    transition: transform var(--transition-base);
}
.toc a:hover { color: var(--text-primary); }
.toc a.is-active { color: var(--text-primary); font-weight: 500; }
.toc a.is-active::before { transform: none; }

.article__product {
    position: relative;
    display: grid;
    gap: 4px;
    margin-top: var(--space-6);
    padding: var(--space-5);
    border-radius: var(--radius-md);
    background: rgb(var(--c) / .08);
    transition: background-color var(--transition-fast);
}
.article__product:hover { background: rgb(var(--c) / .14); }
.article__product .article__product-label { margin-bottom: 4px; }
.article__product strong {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 1.125rem;
    font-weight: 600;
    letter-spacing: -.02em;
}
.article__product strong i {
    width: 9px;
    height: 9px;
    border-radius: 2.5px;
    background: rgb(var(--c));
}
.article__product > span:not(.article__product-label):not(.link-cta__icon) {
    padding-right: 36px;
    font-size: .875rem;
    color: var(--text-secondary);
}
.article__product .link-cta__icon {
    position: absolute;
    right: var(--space-5);
    bottom: var(--space-5);
    background: var(--surface);
}
.article__product:hover .link-cta__icon {
    background: var(--brand-orange);
    border-color: var(--brand-orange);
    color: var(--graphite-900);
}

/* Yazı tipografisi */
.prose {
    max-width: 68ch;
    font-size: 1.0938rem;
    line-height: 1.75;
    color: #2B2D33;
}
.prose > * + * { margin-top: 1.15em; }
.prose h2 {
    margin-top: 2.2em;
    scroll-margin-top: calc(var(--header-height-compact) + 32px);
    font-size: clamp(1.5rem, 1.25rem + .8vw, 1.875rem);
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -.03em;
    color: var(--text-primary);
}
.prose h2 + p { margin-top: .7em; }
.prose strong { font-weight: 600; color: var(--text-primary); }
.prose ul { display: grid; gap: .5em; padding-left: 0; }
.prose ul li { position: relative; padding-left: 22px; }
.prose ul li::before {
    content: '';
    position: absolute;
    left: 2px;
    top: .72em;
    width: 7px;
    height: 7px;
    border-radius: 2px;
    background: rgb(var(--c, 244 122 14));
}
.prose blockquote {
    margin: 2em 0;
    padding: 4px 0 4px 24px;
    border-left: 3px solid var(--brand-orange);
    font-size: clamp(1.25rem, 1.1rem + .5vw, 1.5rem);
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: -.02em;
    color: var(--text-primary);
}
.article__end {
    margin-top: 3em !important;
    padding-top: var(--space-5);
    border-top: 1px solid var(--border);
}

/* ---------- Diğer yazılar ---------- */

.related {
    background: var(--surface-muted);
    border-top: 1px solid var(--border);
}
.related .h2 { margin-bottom: clamp(32px, 4vw, 56px); }
.related__grid {
    display: grid;
    gap: var(--space-7) clamp(20px, 2.4vw, 36px);
}
.related__grid .post-card__link { display: flex; }

/* ---------- 404 ---------- */

.article-missing {
    padding: calc(var(--header-height) + 120px) 0 160px;
}
.article-missing .article__lede { margin-left: 0; }
.article-missing .cta__actions { margin-top: var(--space-6); }

/* ==========================================================================
   BLOG LİSTE SAYFASI (blog.php)
   ========================================================================== */

.blog__aside { display: grid; gap: var(--space-5); justify-items: start; }

.blog-hero {
    padding-top: calc(var(--header-height) + clamp(20px, 2.4vw, 36px));
    padding-bottom: clamp(32px, 4vw, 56px);
}
.blog-hero__intro {
    display: grid;
    gap: var(--space-5);
    margin: clamp(32px, 4vw, 56px) 0 clamp(32px, 4vw, 48px);
}
.blog-hero__intro .sec-label { margin-bottom: var(--space-5); }
.blog-hero__title {
    max-width: 15ch;
    font-size: var(--fs-h1);
    font-weight: 600;
    line-height: .98;
    letter-spacing: -.045em;
    text-wrap: balance;
}
.blog-hero__lede {
    max-width: 46ch;
    font-size: var(--fs-lead);
    line-height: 1.55;
    color: var(--text-secondary);
}

/* Kategori filtreleri */
.blog-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: var(--space-5);
    border-top: 1px solid var(--border);
}
.blog-filter a {
    display: inline-flex; /* renk: .renk-<kod> (Tumu: .renk-notr) */
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 0 8px 0 16px;
    border: 1px solid var(--border);
    border-radius: 999px;
    font-size: .875rem;
    font-weight: 500;
    color: var(--text-secondary);
    transition: border-color var(--transition-fast), background-color var(--transition-fast), color var(--transition-fast);
}
.blog-filter a i {
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background: rgb(var(--c));
}
.blog-filter a span {
    display: grid;
    place-items: center;
    min-width: 24px;
    height: 24px;
    padding: 0 6px;
    border-radius: 999px;
    background: var(--surface-muted);
    font-size: .75rem;
    color: var(--text-muted);
}
.blog-filter a:hover { border-color: var(--border-strong); color: var(--text-primary); }
.blog-filter a[aria-current] {
    border-color: var(--graphite-900);
    background: var(--graphite-900);
    color: #fff;
}
.blog-filter a[aria-current] span { background: rgba(255, 255, 255, .14); color: #fff; }

/* Liste */
.blog-list { padding-bottom: var(--section-y); }

.post-feature { margin-bottom: clamp(32px, 4vw, 56px); }
.post-feature__link {
    display: grid;
    gap: var(--space-6);
    align-items: center;
}
.post-feature__media {
    display: block;
    aspect-ratio: 16 / 10;
    border-radius: var(--radius-md);
    background: var(--surface-muted);
    overflow: hidden;
}
.post-feature__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .9s var(--ease-out);
}
.post-feature__link:hover .post-feature__media img { transform: scale(1.03); }
.post-feature__body { display: flex; flex-direction: column; align-items: flex-start; }
.post-feature__badge {
    margin-bottom: var(--space-4);
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--brand-orange-tint);
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--brand-orange-ink);
}
.post-feature .post-card__meta { margin-top: 0; }
.post-feature__title {
    margin-top: var(--space-4);
    font-size: clamp(1.75rem, 1.2rem + 1.6vw, 2.75rem);
    font-weight: 600;
    line-height: 1.08;
    letter-spacing: -.04em;
    text-wrap: balance;
    background: linear-gradient(currentColor, currentColor) no-repeat 0 100% / 0 2px;
    transition: background-size var(--transition-base);
}
.post-feature__link:hover .post-feature__title { background-size: 100% 2px; }
.post-feature__excerpt {
    max-width: 52ch;
    margin-top: var(--space-4);
    font-size: 1.0625rem;
    line-height: 1.6;
    color: var(--text-secondary);
}
.post-feature__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-5);
    width: 100%;
    margin-top: var(--space-6);
    padding-top: var(--space-5);
    border-top: 1px solid var(--border);
    font-size: .875rem;
    color: var(--text-muted);
}
.post-feature__more {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-weight: 500;
    color: var(--text-primary);
}
.post-feature__link:hover .link-cta__icon {
    background: var(--brand-orange);
    border-color: var(--brand-orange);
    color: var(--graphite-900);
}
.post-feature__link:hover .link-cta__icon svg { transform: translateX(3px); }

.blog-list__grid {
    padding-top: clamp(40px, 5vw, 64px);
    border-top: 1px solid var(--border);
}
.post-feature + .blog-list__grid { border-top: 1px solid var(--border); }

.blog-empty {
    display: grid;
    gap: var(--space-3);
    justify-items: start;
    padding: clamp(48px, 6vw, 80px) 0;
    border-top: 1px solid var(--border);
    color: var(--text-secondary);
}
.blog-empty__title {
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: -.03em;
    color: var(--text-primary);
}
.blog-empty .link-cta { margin-top: var(--space-3); }

/* ==========================================================================
   İLETİŞİM SAYFASI (iletisim.php)
   ========================================================================== */

.contact-hero {
    padding-top: calc(var(--header-height) + clamp(20px, 2.4vw, 36px));
}
.contact-hero__intro {
    display: grid;
    gap: var(--space-5);
    margin: clamp(32px, 4vw, 56px) 0 clamp(40px, 5vw, 64px);
}
.contact-hero__intro .sec-label { margin-bottom: var(--space-5); }
.contact-hero__title {
    font-size: var(--fs-display);
    font-weight: 600;
    line-height: .95;
    letter-spacing: -.05em;
}
.contact-hero__lede {
    max-width: 46ch;
    font-size: var(--fs-lead);
    line-height: 1.55;
    color: var(--text-secondary);
}

.contact { padding-bottom: clamp(56px, 7vw, 96px); }
.contact__grid {
    display: grid;
    gap: var(--space-7);
    align-items: start;
}

/* ---------- Form ---------- */

.contact-form {
    display: grid;
    gap: var(--space-5);
    padding: clamp(24px, 3vw, 44px);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--surface);
    scroll-margin-top: calc(var(--header-height-compact) + 24px);
}
.contact-form__head { display: grid; gap: 4px; }
.contact-form__title {
    font-size: clamp(1.5rem, 1.25rem + .8vw, 2rem);
    font-weight: 600;
    letter-spacing: -.035em;
}
.contact-form__head p { font-size: .8125rem; color: var(--text-muted); }

.contact-form__row {
    display: grid;
    gap: var(--space-5);
}

.field { display: grid; gap: 8px; }
.field label,
.contact-form__topics legend {
    font-size: .875rem;
    font-weight: 500;
    color: var(--text-primary);
}
.field input,
.field textarea {
    width: 100%;
    min-height: 50px;
    padding: 12px 16px;
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-sm);
    background: var(--surface);
    font: inherit;
    font-size: 1rem;
    color: var(--text-primary);
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}
.field textarea { min-height: 140px; resize: vertical; line-height: 1.55; }
.field input::placeholder,
.field textarea::placeholder { color: var(--text-faint); }
.field input:hover,
.field textarea:hover { border-color: var(--text-faint); }
.field input:focus,
.field textarea:focus {
    outline: none;
    border-color: var(--brand-orange);
    box-shadow: 0 0 0 4px rgba(244, 122, 14, .14);
}

.field--check {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    column-gap: 12px;
}
.field--check input {
    width: 20px;
    min-height: 0;
    height: 20px;
    margin-top: 2px;
    padding: 0;
    accent-color: var(--brand-orange);
}
.field--check label { font-size: .875rem; font-weight: 400; line-height: 1.5; color: var(--text-secondary); }
.field--check .field__error { grid-column: 2; }

.field__error {
    display: none;
    font-size: .8125rem;
    color: #C0352B;
}
.is-invalid > .field__error,
.is-invalid .field__error { display: block; }
.field.is-invalid input,
.field.is-invalid textarea { border-color: #C0352B; }

/* Konu seçimi (radio → etiket) */
.contact-form__topics {
    margin: 0;
    padding: 0;
    border: 0;
    min-width: 0;
}
.contact-form__topics legend { margin-bottom: 10px; padding: 0; }
.topic-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.topic-chip { position: relative; cursor: pointer; }
.topic-chip input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
}
.topic-chip span {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 0 16px;
    border: 1px solid var(--border-strong);
    border-radius: 999px;
    font-size: .875rem;
    font-weight: 500;
    color: var(--text-secondary);
    transition: border-color var(--transition-fast), background-color var(--transition-fast), color var(--transition-fast);
}
.topic-chip:hover span { border-color: var(--text-faint); color: var(--text-primary); }
.topic-chip input:checked + span {
    border-color: var(--graphite-900);
    background: var(--graphite-900);
    color: #fff;
}
.topic-chip input:focus-visible + span {
    outline: 2px solid var(--brand-orange);
    outline-offset: 2px;
}
.contact-form__topics.is-invalid .topic-chip span { border-color: #E3A39D; }

.contact-form__foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-4) var(--space-5);
    padding-top: var(--space-2);
}
.contact-form__note { max-width: 34ch; font-size: .8125rem; color: var(--text-muted); }

.contact-form__status:empty { display: none; }
.contact-form__status {
    padding: 12px 16px;
    border-radius: var(--radius-sm);
    font-size: .875rem;
}
.contact-form__status.is-success { background: #E8F6EF; color: #0E6B45; }
.contact-form__status.is-error { background: #FBECEA; color: #A42E25; }

/* ---------- Kanallar ---------- */

.channels { border-top: 1px solid var(--border); }
.channel {
    display: grid;
    gap: 4px;
    justify-items: start;
    padding: var(--space-5) 0;
    border-bottom: 1px solid var(--border);
}
.channel__label,
.contact-products__title {
    font-size: .75rem;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-muted);
}
.channel__value {
    font-size: clamp(1.125rem, 1rem + .4vw, 1.375rem);
    font-weight: 600;
    letter-spacing: -.02em;
    color: var(--text-primary);
    transition: color var(--transition-fast);
}
a.channel__value:hover { color: var(--brand-orange-ink); }
.channel__value--address { font-style: normal; font-size: 1.0625rem; font-weight: 500; line-height: 1.5; }
.channel__hint { font-size: .875rem; color: var(--text-muted); }
.channel .link-cta { margin-top: var(--space-3); }

.contact-products { margin-top: var(--space-6); }
.contact-products__title { margin-bottom: var(--space-3); text-transform: none; letter-spacing: 0; font-size: .875rem; }
.contact-products ul { display: flex; flex-wrap: wrap; gap: 8px; }
.contact-products a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 0 14px;
    border-radius: 999px;
    background: rgb(var(--c) / .1);
    font-size: .875rem;
    font-weight: 500;
    transition: background-color var(--transition-fast);
}
.contact-products a:hover { background: rgb(var(--c) / .2); }
.contact-products i {
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background: rgb(var(--c));
}

/* ---------- Harita ---------- */

.contact-map { padding-bottom: var(--section-y); }
.contact-map__frame {
    position: relative;
    height: clamp(380px, 42vw, 560px);
    border-radius: var(--radius-md);
    background: var(--surface-muted);
    overflow: hidden;
}
.contact-map__frame iframe {
    width: 100%;
    height: 100%;
    border: 0;
    filter: grayscale(1) contrast(1.05);
    transition: filter .6s var(--ease-out);
}
.contact-map__frame:hover iframe { filter: grayscale(0); }

.contact-map__card {
    position: absolute;
    left: clamp(16px, 2.4vw, 32px);
    bottom: clamp(16px, 2.4vw, 32px);
    display: grid;
    gap: 6px;
    justify-items: start;
    width: min(360px, calc(100% - 32px));
    padding: var(--space-5);
    border-radius: var(--radius-md);
    background: var(--surface);
    box-shadow: 0 24px 48px -24px rgba(17, 18, 20, .3);
}
.contact-map__eyebrow {
    font-size: .75rem;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--brand-orange-ink);
}
.contact-map__title { font-size: 1.375rem; font-weight: 600; letter-spacing: -.03em; }
.contact-map__card address { font-style: normal; font-size: .9375rem; line-height: 1.55; color: var(--text-secondary); }
.contact-map__coords {
    font-family: var(--font-mono);
    font-size: .75rem;
    color: var(--text-muted);
}
.contact-map__card .btn { margin-top: var(--space-3); }

/* ==========================================================================
   HAKKIMIZDA SAYFASI (hakkimizda.php)
   ========================================================================== */

.about-hero {
    padding-top: calc(var(--header-height) + clamp(20px, 2.4vw, 36px));
    padding-bottom: clamp(56px, 7vw, 104px);
}
.about-hero__intro {
    max-width: 1080px;
    margin: clamp(32px, 4vw, 64px) 0 clamp(48px, 6vw, 88px);
}
.about-hero__title {
    margin-bottom: var(--space-6);
    font-size: var(--fs-display);
    font-weight: 600;
    line-height: .98;
    letter-spacing: -.045em;
    text-wrap: balance;
}
.about-hero__lede {
    max-width: 58ch;
    font-size: var(--fs-lead);
    line-height: 1.6;
    color: var(--text-secondary);
}

/* Bir bakışta */
.about-facts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-top: 1px solid var(--text-primary);
}
.about-facts__item {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: var(--space-5) var(--space-5) 0 0;
}
.about-facts__item + .about-facts__item { padding-left: var(--space-5); border-left: 1px solid var(--border); }
.about-facts dt {
    order: 2;
    font-size: .75rem;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--brand-orange-ink);
}
.about-facts__value {
    order: 1;
    font-size: clamp(2.25rem, 1.5rem + 2.2vw, 3.5rem);
    font-weight: 600;
    line-height: 1;
    letter-spacing: -.045em;
}
.about-facts__note { order: 3; max-width: 26ch; font-size: .875rem; color: var(--text-secondary); }

/* Hikâye */
.about-story { border-top: 1px solid var(--border); }
.about-story__grid { display: grid; gap: var(--space-6); }
.about-story__body {
    max-width: 64ch;
    font-size: clamp(1.0625rem, 1rem + .25vw, 1.1875rem);
    line-height: 1.75;
    color: #2B2D33;
}
.about-story__body > * + * { margin-top: 1.1em; }
.about-story__body blockquote {
    margin: 1.8em 0;
    padding-left: 24px;
    border-left: 3px solid var(--brand-orange);
    font-size: clamp(1.375rem, 1.15rem + .7vw, 1.75rem);
    font-weight: 500;
    line-height: 1.35;
    letter-spacing: -.025em;
    color: var(--text-primary);
}

/* Antalya (koyu bant) */
.about-place {
    background: var(--graphite-900);
    color: var(--on-dark);
}
.about-place__grid { display: grid; }
.about-place__media { position: relative; min-height: 320px; }
.about-place__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.about-place__media figcaption {
    position: absolute;
    left: 16px;
    bottom: 12px;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(17, 18, 20, .6);
    font-size: .6875rem;
    color: rgba(255, 255, 255, .85);
}
.about-place__media figcaption a { text-decoration: underline; text-underline-offset: 2px; }
.about-place__text {
    padding: clamp(48px, 7vw, 112px) var(--gutter);
}
.about-place .display { margin-bottom: var(--space-6); }
.about-place__lede {
    max-width: 46ch;
    font-size: var(--fs-lead);
    line-height: 1.6;
    color: var(--on-dark-muted);
}
.about-place__lede + .about-place__lede { margin-top: var(--space-4); }
.about-place__foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4) var(--space-6);
    margin-top: var(--space-7);
    padding-top: var(--space-5);
    border-top: 1px solid var(--border-dark);
}
.about-place__coords { font-family: var(--font-mono); font-size: .75rem; color: #75777E; }
.about-place__link { color: var(--on-dark); }
.about-place__link .link-cta__icon { border-color: var(--graphite-600); color: var(--brand-orange); }

/* İlkeler */
.values {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: clamp(32px, 5vw, 80px);
}
.value {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: var(--space-4);
    padding: var(--space-6) 0 var(--space-7);
    border-top: 1px solid var(--border);
}
.value__mark {
    width: 12px;
    height: 12px;
    margin-top: 10px;
    border-radius: 3px;
    background: var(--brand-gradient);
}
.value__title {
    font-size: clamp(1.375rem, 1.15rem + .7vw, 1.875rem);
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -.035em;
}
.value p {
    grid-column: 2;
    max-width: 46ch;
    margin-top: var(--space-3);
    color: var(--text-secondary);
}

/* Ürün ailesi */
.about-products { border-top: 1px solid var(--border); }
.family { border-top: 1px solid var(--text-primary); }
.family__row {
    position: relative;
    display: grid;
    grid-template-columns: 14px minmax(0, 3fr) minmax(0, 2fr) minmax(0, 5fr) auto;
    align-items: center;
    column-gap: var(--space-5);
    padding: var(--space-5) var(--space-3);
    border-bottom: 1px solid var(--border);
    transition: background-color var(--transition-fast);
}
.family__row:hover { background: rgb(var(--c) / .07); }
.family__mark {
    width: 12px;
    height: 12px;
    border-radius: 3px;
    background: rgb(var(--c));
}
.family__name {
    font-size: clamp(1.375rem, 1.1rem + .9vw, 2rem);
    font-weight: 600;
    letter-spacing: -.035em;
}
.family__cat {
    font-size: .75rem;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-muted);
}
.family__line { color: var(--text-secondary); }
.family__row:hover .link-cta__icon {
    background: var(--brand-orange);
    border-color: var(--brand-orange);
    color: var(--graphite-900);
}
.family__row:hover .link-cta__icon svg { transform: translateX(3px); }


/* ==========================================================================
   Responsive (hedef_tasarim/css/responsive.css)
   ========================================================================== */

/* ==========================================================================
   TravelAI — Responsive
   ≥1024 + hover : hareketli + vitrini (iki eksenli genişleme)
   ≥768          : statik 2x2 vitrin (tablet / dokunmatik)
   <960          : mobil header + menü
   <768          : tek kolon düzenler
   ========================================================================== */

/* ---------- Mobil ürün geçiş listesi ---------- */

.sc-jump {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: var(--space-4);
    border-top: 1px solid var(--border);
}
.sc-jump a {
    display: flex;
    align-items: baseline;
    gap: 10px;
    min-height: 52px;
    padding: 14px 12px 14px 0;
    border-bottom: 1px solid var(--border);
    font-size: 1.0625rem;
    font-weight: 600;
    letter-spacing: -.02em;
}
.sc-jump a:nth-child(odd) { border-right: 1px solid var(--border); }
.sc-jump a:nth-child(even) { padding-left: 14px; }

/* ==========================================================================
   ≥768 — Statik 2x2 + düzeni
   ========================================================================== */

@media (min-width: 768px) {
    .sc-jump { display: none; }

    .showcase__intro {
        grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
        align-items: end;
        column-gap: var(--space-7);
    }

    .plus {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: 1fr;
    }
    .plus__line { display: block; }
    .plus__core { display: grid; }
    .q { padding: var(--q-pad); border-top: 0; }
    .q__visual { height: clamp(220px, 28vw, 300px); }
}

/* ==========================================================================
   ≥1024 + hover — Hareketli + vitrini
   Hover / klavye odağı :has() ile merkezi (--sx, --sy) kaydırır; grid
   izleri, + çizgileri ve AI çekirdeği aynı değerle birlikte hareket eder.
   ========================================================================== */

@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {
    .plus {
        --q-content-w: 290px;
        height: clamp(520px, calc(100vh - 330px), 700px);
        height: clamp(520px, calc(100svh - 330px), 700px);
        grid-template-columns: var(--sx) minmax(0, 1fr);
        grid-template-rows: var(--sy) minmax(0, 1fr);
        transition: --sx .72s var(--ease-plus), --sy .72s var(--ease-plus);
    }
    .plus:has(.q--1:is(:hover, :focus-within)) { --sx: 64%; --sy: 64%; }
    .plus:has(.q--2:is(:hover, :focus-within)) { --sx: 36%; --sy: 64%; }
    .plus:has(.q--3:is(:hover, :focus-within)) { --sx: 64%; --sy: 36%; }
    .plus:has(.q--4:is(:hover, :focus-within)) { --sx: 36%; --sy: 36%; }

    /* Aktif ürüne komşu + kolları turuncuya döner */
    .plus:has(.q--1:is(:hover, :focus-within)) :is(.plus__line--top, .plus__line--left)::after,
    .plus:has(.q--2:is(:hover, :focus-within)) :is(.plus__line--top, .plus__line--right)::after,
    .plus:has(.q--3:is(:hover, :focus-within)) :is(.plus__line--bottom, .plus__line--left)::after,
    .plus:has(.q--4:is(:hover, :focus-within)) :is(.plus__line--bottom, .plus__line--right)::after {
        transform: none;
        transition-delay: .12s;
    }

    .plus__core { transition: transform .6s var(--ease-plus); }
    .plus:has(.q:is(:hover, :focus-within)) .plus__core { transform: scale(1.1); }

    .q {
        display: block;
        min-width: 0;
        min-height: 0;
        padding: 0;
        overflow: hidden;
    }

    /* İçerik dış köşeye, görsel merkeze (+'ya) yaslanır */
    .q__content {
        position: absolute;
        z-index: 1;
        width: var(--q-content-w);
    }
    .q--1 .q__content { top: var(--q-pad); left: var(--q-pad); }
    .q--2 .q__content { top: var(--q-pad); right: var(--q-pad); text-align: right; }
    .q--3 .q__content { bottom: var(--q-pad); left: var(--q-pad); }
    .q--4 .q__content { bottom: var(--q-pad); right: var(--q-pad); text-align: right; }
    :is(.q--2, .q--4) .q__meta { justify-content: flex-end; }
    :is(.q--2, .q--4) :is(.q__line, .q__desc) { margin-left: auto; }

    .q__name { transform-origin: 0 0; }
    .q--2 .q__name { transform-origin: 100% 0; }
    .q--3 .q__name { transform-origin: 0 100%; }
    .q--4 .q__name { transform-origin: 100% 100%; }

    .q__visual {
        position: absolute;
        top: var(--q-pad);
        bottom: var(--q-pad);
        width: max(44%, calc(100% - var(--q-content-w) - var(--q-pad) * 3));
        height: auto;
    }
    :is(.q--1, .q--3) .q__visual { right: calc(var(--q-pad) + 8px); }
    :is(.q--2, .q--4) .q__visual { left: calc(var(--q-pad) + 8px); }
    .q--1 .q__visual { transform-origin: 100% 100%; }
    .q--2 .q__visual { transform-origin: 0 100%; }
    .q--3 .q__visual { transform-origin: 100% 0; }
    .q--4 .q__visual { transform-origin: 0 0; }

    .q__more {
        grid-template-rows: 0fr;
        opacity: 0;
        transition: grid-template-rows .6s var(--ease-plus), opacity .3s var(--ease-out);
    }

    .v-detail { opacity: 0; }
    .v-progress { stroke-dashoffset: calc(100 - var(--p0)); }

    /* ----- Aktif ürün ----- */
    .q:is(:hover, :focus-within)::before { opacity: 1; }
    .q:is(:hover, :focus-within) .q__name { transform: scale(1.08); }
    .q:is(:hover, :focus-within) .q__more {
        grid-template-rows: 1fr;
        opacity: 1;
        transition: grid-template-rows .6s var(--ease-plus) .08s, opacity .5s var(--ease-out) .22s;
    }
    .q:is(:hover, :focus-within) .v-detail { opacity: 1; transition-delay: .3s; }
    .q:is(:hover, :focus-within) .v-detail--late { transition-delay: .55s; }
    .q:is(:hover, :focus-within) .v-progress { stroke-dashoffset: calc(100 - var(--p1)); transition-delay: .2s; }
    .q:is(:hover, :focus-within) .v-pulse { animation: vPulse 2.6s var(--ease-out) .3s infinite; }
    .q:is(:hover, :focus-within) .v-pulse--node { animation-name: vNodePulse; animation-duration: 1.8s; }
    .q:is(:hover, :focus-within) .v-flow { opacity: 1; animation: vFlow 1.4s linear infinite; }

    /* ----- Geri çekilen ürünler: ad okunur kalır, detay sadeleşir ----- */
    .plus:has(.q:is(:hover, :focus-within)) .q:not(:hover, :focus-within) .q__name { color: var(--text-secondary); }
    .plus:has(.q:is(:hover, :focus-within)) .q:not(:hover, :focus-within) .q__line { opacity: .5; }
    .plus:has(.q:is(:hover, :focus-within)) .q:not(:hover, :focus-within) .q__visual { opacity: .16; transform: scale(.82); }
}

@media (min-width: 1280px) and (hover: hover) and (pointer: fine) {
    .plus { --q-content-w: 350px; }
}

/* ==========================================================================
   6 ürünlük vitrin (plus--6, Site > Vitrin Alanları): 3 sütun × 2 satır.
   Artı düzeniyle aynı mantık: üzerine gelinen hücrenin sütunu ve satırı büyür,
   komşu çizgiler turuncuya döner, AI çekirdeği orta sütunun ortasında durur.
   Hücre sınıfları: q6--s1..3 (sütun), q6--r1..2 (satır).
   ========================================================================== */

.plus--6 .q6--s1.q6--r1 { --q-glow: 100% 100%; }
.plus--6 .q6--s2.q6--r1 { --q-glow: 50% 100%; }
.plus--6 .q6--s3.q6--r1 { --q-glow: 0% 100%; }
.plus--6 .q6--s1.q6--r2 { --q-glow: 100% 0%; }
.plus--6 .q6--s2.q6--r2 { --q-glow: 50% 0%; }
.plus--6 .q6--s3.q6--r2 { --q-glow: 0% 0%; }

/* Statik (tablet ve dokunmatik): çizgi yerine hücre kenarlıkları */
@media (min-width: 768px) {
    .plus--6 .plus__line,
    .plus--6 .plus__core { display: none; }
    .plus--6 .q { border-top: 1px solid var(--border); }
    .plus--6 .q:nth-of-type(odd) { border-right: 1px solid var(--border); }
}
@media (min-width: 1024px) {
    .plus--6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .plus--6 .q:nth-of-type(odd) { border-right: 0; }
    .plus--6 .q:not(.q6--s3) { border-right: 1px solid var(--border); }
    .plus--6 .q6--r1 { border-top: 0; }
}

@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {
    .plus--6 {
        --x1: 33.333%;
        --x2: 66.667%;
        --q-pad: clamp(22px, 2vw, 32px);
        height: clamp(600px, calc(100vh - 250px), 820px);
        height: clamp(600px, calc(100svh - 250px), 820px);
        grid-template-columns: var(--x1) calc(var(--x2) - var(--x1)) minmax(0, 1fr);
        grid-template-rows: var(--sy) minmax(0, 1fr);
        transition: --x1 .72s var(--ease-plus), --x2 .72s var(--ease-plus), --sy .72s var(--ease-plus);
    }
    .plus--6 .plus__line { display: block; }
    .plus--6 .plus__core { display: grid; left: calc((var(--x1) + var(--x2)) / 2); }
    .plus--6 .q,
    .plus--6 .q:not(.q6--s3) { border: 0; }

    /* Hareket: sütun (x1, x2) ve satır (sy) */
    .plus--6:has(.q6--s1:is(:hover, :focus-within)) { --x1: 46%; --x2: 73%; }
    .plus--6:has(.q6--s2:is(:hover, :focus-within)) { --x1: 27%; --x2: 73%; }
    .plus--6:has(.q6--s3:is(:hover, :focus-within)) { --x1: 27%; --x2: 54%; }
    .plus--6:has(.q6--r1:is(:hover, :focus-within)) { --sy: 60%; }
    .plus--6:has(.q6--r2:is(:hover, :focus-within)) { --sy: 40%; }

    /* Çizgiler: yatay üç parça (sütun başına), dikey dört parça */
    .plus6__h { top: var(--sy); height: 1px; margin-top: -.5px; }
    .plus6__h--1 {
        left: 0;
        width: var(--x1);
        -webkit-mask-image: linear-gradient(90deg, transparent, #000 72px);
        mask-image: linear-gradient(90deg, transparent, #000 72px);
    }
    .plus6__h--2 { left: var(--x1); width: calc(var(--x2) - var(--x1)); }
    .plus6__h--3 {
        left: var(--x2);
        right: 0;
        -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 72px), transparent);
        mask-image: linear-gradient(90deg, #000 calc(100% - 72px), transparent);
    }
    .plus6__v { width: 1px; margin-left: -.5px; }
    .plus6__v--1u, .plus6__v--1a { left: var(--x1); }
    .plus6__v--2u, .plus6__v--2a { left: var(--x2); }
    .plus6__v--1u, .plus6__v--2u {
        top: 0;
        height: var(--sy);
        -webkit-mask-image: linear-gradient(transparent, #000 72px);
        mask-image: linear-gradient(transparent, #000 72px);
    }
    .plus6__v--1a, .plus6__v--2a {
        top: var(--sy);
        bottom: 0;
        -webkit-mask-image: linear-gradient(#000 calc(100% - 72px), transparent);
        mask-image: linear-gradient(#000 calc(100% - 72px), transparent);
    }
    .plus6__h--1::after { transform: scaleX(0); transform-origin: right; }
    .plus6__h--2::after { transform: scaleX(0); transform-origin: center; }
    .plus6__h--3::after { transform: scaleX(0); transform-origin: left; }
    .plus6__v--1u::after, .plus6__v--2u::after { transform: scaleY(0); transform-origin: bottom; }
    .plus6__v--1a::after, .plus6__v--2a::after { transform: scaleY(0); transform-origin: top; }

    /* Aktif hücreye komşu çizgiler turuncu */
    .plus--6:has(.q6--s1.q6--r1:is(:hover, :focus-within)) :is(.plus6__v--1u, .plus6__h--1)::after,
    .plus--6:has(.q6--s2.q6--r1:is(:hover, :focus-within)) :is(.plus6__v--1u, .plus6__v--2u, .plus6__h--2)::after,
    .plus--6:has(.q6--s3.q6--r1:is(:hover, :focus-within)) :is(.plus6__v--2u, .plus6__h--3)::after,
    .plus--6:has(.q6--s1.q6--r2:is(:hover, :focus-within)) :is(.plus6__v--1a, .plus6__h--1)::after,
    .plus--6:has(.q6--s2.q6--r2:is(:hover, :focus-within)) :is(.plus6__v--1a, .plus6__v--2a, .plus6__h--2)::after,
    .plus--6:has(.q6--s3.q6--r2:is(:hover, :focus-within)) :is(.plus6__v--2a, .plus6__h--3)::after {
        transform: none;
        transition-delay: .12s;
    }

    /* İçerik dış kenara (üst satır yukarı, alt satır aşağı), görsel merkeze */
    .plus--6 .q__content { left: var(--q-pad); right: var(--q-pad); width: auto; }
    .plus--6 .q6--r1 .q__content { top: var(--q-pad); }
    .plus--6 .q6--r2 .q__content { bottom: var(--q-pad); }
    .plus--6 .q6--s2 .q__content { text-align: center; }
    .plus--6 .q6--s3 .q__content { text-align: right; }
    .plus--6 .q6--s2 .q__meta { justify-content: center; }
    .plus--6 .q6--s3 .q__meta { justify-content: flex-end; }
    .plus--6 .q6--s2 :is(.q__line, .q__desc) { margin-inline: auto; }
    .plus--6 .q6--s3 :is(.q__line, .q__desc) { margin-left: auto; }

    .plus--6 .q__name { font-size: clamp(2rem, 1rem + 1.6vw, 2.75rem); }
    .plus--6 .q6--s1.q6--r1 .q__name { transform-origin: 0 0; }
    .plus--6 .q6--s2.q6--r1 .q__name { transform-origin: 50% 0; }
    .plus--6 .q6--s3.q6--r1 .q__name { transform-origin: 100% 0; }
    .plus--6 .q6--s1.q6--r2 .q__name { transform-origin: 0 100%; }
    .plus--6 .q6--s2.q6--r2 .q__name { transform-origin: 50% 100%; }
    .plus--6 .q6--s3.q6--r2 .q__name { transform-origin: 100% 100%; }

    .plus--6 .q__visual {
        left: var(--q-pad);
        right: var(--q-pad);
        width: auto;
        height: 38%;
    }
    .plus--6 .q6--r1 .q__visual { top: auto; bottom: var(--q-pad); }
    .plus--6 .q6--r2 .q__visual { top: var(--q-pad); bottom: auto; }
    .plus--6 .q6--s1.q6--r1 .q__visual { transform-origin: 100% 100%; }
    .plus--6 .q6--s2.q6--r1 .q__visual { transform-origin: 50% 100%; }
    .plus--6 .q6--s3.q6--r1 .q__visual { transform-origin: 0 100%; }
    .plus--6 .q6--s1.q6--r2 .q__visual { transform-origin: 100% 0; }
    .plus--6 .q6--s2.q6--r2 .q__visual { transform-origin: 50% 0; }
    .plus--6 .q6--s3.q6--r2 .q__visual { transform-origin: 0 0; }
}

/* ==========================================================================
   <1200
   ========================================================================== */

@media (max-width: 1199px) {
    .site-header__inner { gap: var(--space-5); }
}

/* ==========================================================================
   <1024
   ========================================================================== */

@media (max-width: 1023px) {
    .eco__grid { grid-template-columns: 1fr; }
    .eco__stack { max-width: 560px; }

    .journey-sec__head,
    .tech__head { grid-template-columns: 1fr; gap: var(--space-5); }

    .journey { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: var(--space-8); }
    .journey::before,
    .journey::after { display: none; }
    .journey__stop { border-top: 1px solid var(--border-strong); padding-top: 0; }
    .journey__node { margin-top: -7px; }

    .cta__grid { grid-template-columns: 1fr; align-items: start; }
    .arrival { max-width: 420px; }

    .site-footer__top { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .site-footer__brand { grid-column: 1 / -1; }
}

/* ==========================================================================
   <960 — Mobil header
   ========================================================================== */

@media (max-width: 959px) {
    :root {
        --header-height: 64px;
        --header-height-compact: 64px;
    }
    .site-header__logo img,
    .site-header.is-scrolled .site-header__logo img { height: 30px; }
    .site-header__cta { display: none; }

    .nav-toggle {
        display: grid;
        place-content: center;
        gap: 6px;
        width: 44px; height: 44px;
        margin-left: auto;
        border: 1px solid var(--border);
        border-radius: var(--radius-md);
        transition: border-color var(--transition-fast);
    }
    .nav-toggle:hover { border-color: var(--border-strong); }
    .nav-toggle__bar {
        display: block;
        width: 18px; height: 1.5px;
        border-radius: 2px;
        background: var(--text-primary);
        transition: transform var(--transition-base);
    }
    .nav-toggle[aria-expanded="true"] .nav-toggle__bar:first-child { transform: translateY(3.75px) rotate(45deg); }
    .nav-toggle[aria-expanded="true"] .nav-toggle__bar:last-child { transform: translateY(-3.75px) rotate(-45deg); }

    .site-nav {
        position: absolute;
        top: 100%;
        left: 0; right: 0;
        height: calc(100vh - var(--header-height));
        height: calc(100dvh - var(--header-height));
        flex-direction: column;
        justify-content: space-between;
        gap: var(--space-7);
        padding: var(--space-5) var(--gutter) calc(var(--space-6) + env(safe-area-inset-bottom));
        background: var(--surface);
        border-top: 1px solid var(--border);
        overflow-y: auto;
        overscroll-behavior: contain;
        opacity: 0;
        visibility: hidden;
        transform: translateY(-8px);
        transition: opacity .3s var(--ease-out), transform .3s var(--ease-out), visibility 0s linear .3s;
    }
    .site-header.is-nav-open { background: var(--surface); border-bottom-color: var(--border); }
    .site-header.is-nav-open .site-nav {
        opacity: 1;
        visibility: visible;
        transform: none;
        transition: opacity .35s var(--ease-out), transform .35s var(--ease-out), visibility 0s;
    }

    .site-nav__list { flex-direction: column; gap: 0; }
    .site-nav__item--dropdown { display: block; }
    .site-nav__caret,
    .nav-dropdown { display: none; }
    .site-nav__list li { border-bottom: 1px solid var(--border); }
    .site-nav__link {
        display: flex;
        gap: 14px;
        padding: 18px 0;
        font-size: 1.75rem;
        font-weight: 600;
        letter-spacing: -.035em;
        color: var(--text-primary);
    }
    .site-nav__link::after { display: none; }

    .site-nav__drawer { display: block; }
    .site-nav__label {
        margin-bottom: var(--space-3);
        font-family: var(--font-mono);
        font-size: var(--fs-mono-sm);
        letter-spacing: var(--tracking-mono);
        text-transform: uppercase;
        color: var(--text-muted);
    }
    .site-nav__products {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0 16px;
        margin-bottom: var(--space-6);
    }
    .site-nav__products a[aria-current] { color: var(--brand-orange-ink); }
    .site-nav__products a {
        display: flex;
        gap: 8px;
        align-items: baseline;
        padding: 12px 0;
        border-bottom: 1px solid var(--border);
        font-weight: 500;
    }
}

/* ==========================================================================
   <768 — Tek kolon
   ========================================================================== */

@media (max-width: 767px) {
    .showcase { padding-top: calc(var(--header-height) + 24px); }
    .q:first-of-type { border-top: 0; padding-top: var(--space-5); }

    .journey { grid-template-columns: 1fr; row-gap: 0; padding-left: 4px; }
    .journey::before,
    .journey::after {
        display: block;
        left: 10px; right: auto;
        top: 6px; bottom: 6px;
        width: 1px; height: auto;
    }
    .journey::after { width: 2px; margin: 0 0 0 -.5px; transform-origin: top; }
    .js .journey::after { transform: scaleY(0); }
    .journey.is-in::after { transform: scaleY(1); }
    .journey__stop {
        display: grid;
        grid-template-columns: 30px minmax(0, 1fr);
        column-gap: 10px;
        row-gap: 6px;
        padding: 0 0 var(--space-6);
        border-top: 0;
    }
    .journey__stop > * { grid-column: 2; }
    .journey__product { justify-self: start; }
    .journey__node { grid-column: 1; grid-row: 1 / span 2; margin: 2px 0 0; }
    .journey__stop:last-child .journey__node { transform: none; }

    .ledger__header { display: none; }
    .ledger__rows::before { display: none; }
    .ledger__row {
        grid-template-columns: 1fr;
        padding: 20px 0 20px 18px;
        position: relative;
    }
    .ledger__row::before {
        content: '';
        position: absolute;
        left: 0; top: 26px; bottom: 26px;
        width: 1px;
        background: linear-gradient(var(--on-dark-muted), var(--brand-orange));
    }
    .ledger__sys, .ledger__team { padding: 0; text-align: left; }
    .ledger__sys::before,
    .ledger__team::before {
        display: block;
        margin-bottom: 4px;
        font-family: var(--font-mono);
        font-size: .625rem;
        letter-spacing: var(--tracking-mono);
        text-transform: uppercase;
    }
    .ledger__sys::before { content: 'SYSTEM HANDLES'; color: var(--on-dark-muted); }
    .ledger__team::before { content: 'YOUR TEAM DECIDES'; color: var(--brand-orange); }
    .ledger__axis { display: none; }
    .ledger__team { margin-top: 14px; }

    .wiring {
        grid-template-columns: 1fr;
        background: none;
    }
    .wiring__core { order: -1; padding-bottom: var(--space-6); }
    .wiring__svg { display: none; }
    .wiring__plate { width: 100%; max-width: none; flex-direction: row; justify-content: space-between; box-shadow: none; padding: 16px 18px; }
    .wiring__plate img { width: 120px; }
    .wiring__col { grid-template-rows: none; }
    .wire { min-height: 0; padding: 14px 0; border-bottom: 1px solid var(--border); }
    .wiring__col--left .wire { flex-direction: row-reverse; justify-content: flex-end; }
    .wiring__col--left .wire__word { align-items: flex-start; text-align: left; }
    .wire__word { padding: 0; font-size: clamp(1.75rem, 8vw, 2.5rem); background: none; }
    .wire__lead { flex: 0 0 24px; order: -1; }
    .wiring__col--left .wire__lead { order: 0; }
    .wiring__col--left .wire__lead::after { right: auto; left: -4px; }

    .site-footer__top { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); }
    .site-footer__bottom { flex-direction: column; }
}

/* ==========================================================================
   <480
   ========================================================================== */

@media (max-width: 479px) {
    .sc-jump a { font-size: .9688rem; }
    .cta__actions { flex-direction: column; align-items: flex-start; }
    .site-footer__top { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Blog kartları
   ========================================================================== */

@media (min-width: 768px) {
    .blog__head {
        grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
        align-items: end;
        column-gap: var(--space-7);
    }
}

@media (max-width: 1023px) {
    .blog__grid { grid-template-columns: 1fr; }
}

@media (min-width: 640px) and (max-width: 1023px) {
    .post-card__link {
        display: grid;
        grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
        grid-template-rows: auto auto auto 1fr;
        column-gap: var(--space-6);
    }
    .post-card__media { grid-row: 1 / -1; }
    .post-card__meta { margin-top: 0; }
}

/* ==========================================================================
   Reduced motion
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .001ms !important;
        animation-delay: 0s !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        transition-delay: 0s !important;
    }
    .v-pulse, .v-flow, .wiring__pulse { display: none; }
}

/* ==========================================================================
   Ürün detay sayfaları
   ========================================================================== */

@media (min-width: 768px) {
    .p-hero__intro {
        grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
        align-items: end;
        column-gap: var(--space-7);
    }
    .p-section-head {
        grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
        column-gap: var(--space-7);
        align-items: end;
    }
    .p-section-head .sec-label { grid-column: 1 / -1; }
    .p-faq__grid { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); }
}

@media (min-width: 1024px) {
    .journey--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

    .op-scene {
        grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
        align-items: center;
    }
    .op-scene__art { aspect-ratio: auto; min-height: 340px; }

    .p-features__grid { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); }
    .p-features__head {
        position: sticky;
        top: calc(var(--header-height-compact) + 40px);
        align-self: start;
    }

    .p-eco__map {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr) minmax(0, 1fr);
        grid-template-rows: repeat(2, auto);
        column-gap: var(--eco-gap);
        align-items: center;
    }
    .eco-node:nth-child(1) { grid-area: 1 / 1; }
    .eco-node:nth-child(2) { grid-area: 2 / 1; }
    .eco-node--core { grid-area: 1 / 2 / 3 / 3; align-self: stretch; align-content: center; padding: var(--space-6); }
    .eco-node:nth-child(4) { grid-area: 1 / 3 / 3 / 4; align-self: center; }

    /* bağlantı çizgileri: kenar ürünler → merkez */
    .eco-node:nth-child(1)::after,
    .eco-node:nth-child(2)::after,
    .eco-node:nth-child(4)::before {
        content: '';
        position: absolute;
        top: 50%;
        width: var(--eco-gap);
        height: 1px;
        background: repeating-linear-gradient(90deg, rgb(var(--c) / .7) 0 4px, transparent 4px 8px);
    }
    .eco-node:nth-child(1)::after,
    .eco-node:nth-child(2)::after { left: 100%; }
    .eco-node:nth-child(4)::before { right: 100%; }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .journey--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
    .p-features__list { grid-template-columns: 1fr; }
    .compare__header { display: none; }
    .compare__row { grid-template-columns: 1fr; }
    .compare__before { padding-bottom: 6px; }
    .compare__after { padding-top: 6px; }
    .compare__before::before { top: calc(clamp(20px, 2.4vw, 30px) + .55em); }
    .compare__after::before { top: calc(6px + .55em); }
    .op-card__facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .p-audience li { padding-right: 16px; }
}

@media (prefers-reduced-motion: reduce) {
    .op-live-ring { display: none; }
}

/* ==========================================================================
   Blog yazı detayı
   ========================================================================== */

@media (min-width: 768px) {
    .related__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
    .article__layout {
        grid-template-columns: minmax(220px, 3fr) minmax(0, 9fr);
        column-gap: clamp(48px, 6vw, 112px);
    }
    .article__aside {
        position: sticky;
        top: calc(var(--header-height-compact) + 40px);
        align-self: start;
    }
}

@media (max-width: 1023px) {
    .article__aside { order: 2; }
    .toc { display: none; }
    .prose { max-width: none; }
}

@media (max-width: 767px) {
    .article__intro { text-align: left; }
    .article__meta { justify-content: flex-start; }
    .article__lede { margin-left: 0; }
    .article__cover { padding-inline: 0; }
    .article__cover img { aspect-ratio: 4 / 3; border-radius: 0; }
    .article__cover figcaption { padding-inline: var(--gutter); }
}

/* ==========================================================================
   Blog liste sayfası
   ========================================================================== */

@media (min-width: 768px) {
    .blog-hero__intro {
        grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
        align-items: end;
        column-gap: var(--space-7);
    }
}

@media (min-width: 1024px) {
    .post-feature__link {
        grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
        column-gap: clamp(40px, 5vw, 80px);
    }
}

@media (max-width: 1023px) {
    .blog-list__grid { border-top: 0; padding-top: 0; }
}

@media (max-width: 767px) {
    .blog-filter {
        flex-wrap: nowrap;
        margin-inline: calc(var(--gutter) * -1);
        padding-inline: var(--gutter);
        overflow-x: auto;
        scrollbar-width: none;
    }
    .blog-filter::-webkit-scrollbar { display: none; }
    .blog-filter a { flex: none; }
    .post-feature__foot { flex-wrap: wrap; }
}

/* ==========================================================================
   İletişim sayfası
   ========================================================================== */

@media (min-width: 640px) {
    .contact-form__row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 768px) {
    .contact-hero__intro {
        grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
        align-items: end;
        column-gap: var(--space-7);
    }
}

@media (min-width: 1024px) {
    .contact__grid {
        grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
        column-gap: clamp(48px, 6vw, 96px);
    }
    .contact-aside {
        position: sticky;
        top: calc(var(--header-height-compact) + 32px);
    }
}

@media (max-width: 767px) {
    .contact-map__frame { height: auto; display: flex; flex-direction: column; }
    .contact-map__frame iframe { height: 320px; }
    .contact-map__card {
        position: static;
        width: 100%;
        border-radius: 0;
        box-shadow: none;
        border-top: 1px solid var(--border);
    }
}

/* ==========================================================================
   Hakkımızda sayfası
   ========================================================================== */

@media (min-width: 768px) {
    .journey.journey--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
    .about-story__grid {
        grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
        column-gap: clamp(48px, 6vw, 112px);
    }
    .about-story__head {
        position: sticky;
        top: calc(var(--header-height-compact) + 40px);
        align-self: start;
    }
    .about-place__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
    .about-place__media { min-height: 640px; }
    .about-place__text {
        align-self: center;
        padding-inline: clamp(40px, 5vw, 88px) var(--gutter);
    }
}

@media (max-width: 1023px) {
    .about-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .about-facts__item:nth-child(3) { padding-left: 0; border-left: 0; }
    .about-facts__item:nth-child(n+3) { margin-top: var(--space-5); border-top: 1px solid var(--border); }
    .about-place__media { aspect-ratio: 3 / 2; min-height: 0; }

    .family__row {
        grid-template-columns: 14px minmax(0, 1fr) auto;
        grid-template-areas:
            "mark name icon"
            ".    cat  icon"
            ".    line icon";
        row-gap: 4px;
    }
    .family__mark { grid-area: mark; }
    .family__name { grid-area: name; }
    .family__cat { grid-area: cat; }
    .family__line { grid-area: line; }
    .family__row .link-cta__icon { grid-area: icon; }
}

@media (max-width: 767px) {
    .values { grid-template-columns: 1fr; }
}


/* ==========================================================================
   travelAI eklemeleri
   ========================================================================== */

/* ---------- Urun renkleri (App\Services\SiteRenk::RENKLER ile ayni adlar) ---------- */
.renk-turuncu { --c: 244 122 14; --p: 244 122 14; --p-ink: #C9490A; }
.renk-mavi    { --c: 0 173 239;  --p: 0 173 239;  --p-ink: #0079A8; }
.renk-sari    { --c: 248 192 35; --p: 248 192 35; --p-ink: #8A6400; --p-line: #D9A100; }
.renk-mor     { --c: 91 91 214;  --p: 91 91 214;  --p-ink: #4646B8; }
.renk-yesil   { --c: 26 151 106; --p: 26 151 106; --p-ink: #137A55; }
.renk-turkuaz { --c: 20 160 160; --p: 20 160 160; --p-ink: #0E7373; }
.renk-kirmizi { --c: 216 58 72;  --p: 216 58 72;  --p-ink: #B02A38; }
.renk-pembe   { --c: 214 64 140; --p: 214 64 140; --p-ink: #A82E6C; }
.renk-notr    { --c: 20 21 24; }

/* ---------- Sira indeksi (animasyon gecikmeleri; eskiden style="--i:n") ---------- */
.i-0 { --i: 0; } .i-1 { --i: 1; } .i-2 { --i: 2; } .i-3 { --i: 3; } .i-4 { --i: 4; }
.i-5 { --i: 5; } .i-6 { --i: 6; } .i-7 { --i: 7; } .i-8 { --i: 8; } .i-9 { --i: 9; }

/* ---------- Vitrin cizimlerindeki ilerleme cizgileri (eskiden style="--p0;--p1") ---------- */
.v-progress--uetds { --p0: 52; --p1: 100; }
.v-progress--radar { --p0: 54; --p1: 54; }
.v-progress--asistan { --p0: 33; --p1: 66.5; }
.v-progress--rezervasyon { --p0: 25; --p1: 75; }

/* ---------- Alt bilgi: sosyal baglantilar, yasal metinler ---------- */
.site-footer__social { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: var(--space-5); }
.site-footer__social a { color: var(--on-dark); transition: color var(--transition-fast); }
.site-footer__social a:hover { color: var(--brand-orange); }
.site-footer__meta { flex-wrap: wrap; }

/* ---------- Bildirim (form sonucu vb.; header'in altinda) ---------- */
.site-flash {
    padding: calc(var(--header-height) + 16px) 0 16px;
    background: var(--brand-orange-tint);
    border-bottom: 1px solid rgb(244 122 14 / .25);
    font-size: var(--fs-small);
    color: var(--text-primary);
}
.site-flash--success { background: #EAF6F0; border-bottom-color: rgb(19 138 90 / .25); }
.site-flash--error { background: #FDECEC; border-bottom-color: rgb(216 58 72 / .3); }
.site-flash + * { padding-top: clamp(32px, 4vw, 56px); }

/* ---------- Blog karti: kapak gorseli yoksa urun renginde desen ---------- */
.post-card__media--bos {
    display: grid;
    place-items: center;
    background:
        radial-gradient(rgb(var(--c, 244 122 14) / .35) 1px, transparent 1.4px) 0 0 / 14px 14px,
        linear-gradient(135deg, rgb(var(--c, 244 122 14) / .10), rgb(var(--c, 244 122 14) / .02));
}
.post-card__media--bos span {
    padding: 6px 12px;
    border-radius: 999px;
    background: var(--surface);
    font-family: var(--font-mono);
    font-size: var(--fs-mono);
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
    color: var(--text-secondary);
    box-shadow: 0 0 0 1px rgb(var(--c, 244 122 14) / .3);
}

/* ---------- Urun sayfasi sahne degerleri (eskiden style="width:..%" / "--p-progress") ---------- */
.op-card__line--30 i { width: 30%; }
.op-card__line--64 i { width: 64%; }
.op-card__line--100 i { width: 100%; }
.op-route--64 { --p-progress: 64; }
.op-route--rezervasyon { --p-progress: 66; }

/* ---------- Adim sayisi 2/3/5 (hedefte yalniz 4 vardi) ---------- */
@media (min-width: 768px) {
    .journey--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .journey--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .journey--5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
    .journey--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
.journey--3 .journey__stop:last-child .journey__node,
.journey--5 .journey__stop:last-child .journey__node { transform: scale(1.3); }

/* ---------- Acik dugme (paket kartlari vb.) ---------- */
.btn--light { --btn-bg: var(--surface); --btn-fg: var(--text-primary); box-shadow: inset 0 0 0 1px var(--border-strong); }
.btn--light:hover { --btn-bg: var(--surface-muted); }

/* ---------- SSS cevabi (Html::temizle ciktisi: p, ul, a ...) ---------- */
.faq__body { max-width: 62ch; padding: 0 48px var(--space-5) 0; color: var(--text-secondary); }
.faq__body > * + * { margin-top: .75em; }
.faq__body p { padding: 0; }
.faq__body ul, .faq__body ol { padding-left: 1.2em; list-style: disc; }
.faq__body ol { list-style: decimal; }
.faq__body a { color: var(--text-primary); text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Urun sayfasi: paketler (fiyat kartlari urunun kendi paketlerinden) ---------- */
.p-pricing { border-top: 1px solid var(--border); }
.plans__periods {
    display: inline-flex;
    gap: 4px;
    margin: var(--space-6) 0 0;
    padding: 4px;
    border-radius: var(--radius-md);
    background: var(--surface-muted);
    box-shadow: inset 0 0 0 1px var(--border);
}
.plans__periods button {
    min-height: 38px;
    padding: 0 16px;
    border-radius: var(--radius-sm);
    font-size: var(--fs-small);
    font-weight: 500;
    color: var(--text-secondary);
    transition: background-color var(--transition-fast), color var(--transition-fast);
}
.plans__periods button[aria-selected="true"] { background: var(--surface); color: var(--text-primary); box-shadow: 0 1px 2px rgba(17, 18, 20, .08), inset 0 0 0 1px var(--border); }
.plans {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: var(--space-4);
    margin-top: var(--space-6);
}
.plans[hidden] { display: none; }
.plan {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    padding: var(--space-6) var(--space-5) var(--space-5);
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-md);
    background: var(--surface);
}
.plan--featured {
    border-color: rgb(var(--p, 244 122 14) / .7);
    box-shadow: 0 0 0 3px rgb(var(--p, 244 122 14) / .12);
}
.plan__badge {
    position: absolute;
    top: -11px;
    left: var(--space-5);
    padding: 3px 10px;
    border-radius: 999px;
    background: var(--brand-gradient);
    font-family: var(--font-mono);
    font-size: var(--fs-mono-sm);
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
    color: #fff;
}
.plan__name { font-size: 1.25rem; font-weight: 600; letter-spacing: -.02em; }
.plan__price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 10px; }
.plan__price strong { font-size: clamp(1.75rem, 1.4rem + 1vw, 2.25rem); font-weight: 600; letter-spacing: -.035em; line-height: 1; }
.plan__price span { font-family: var(--font-mono); font-size: var(--fs-mono); letter-spacing: var(--tracking-mono); text-transform: uppercase; color: var(--text-muted); }
.plan__list { display: grid; gap: 10px; padding-top: var(--space-4); border-top: 1px solid var(--border); flex: 1; }
.plan__list li { position: relative; padding-left: 22px; font-size: .9375rem; line-height: 1.45; color: var(--text-secondary); }
.plan__list li::before {
    content: '';
    position: absolute;
    left: 2px;
    top: .45em;
    width: 9px;
    height: 5px;
    border-left: 1.6px solid var(--p-ink, var(--brand-orange-ink));
    border-bottom: 1.6px solid var(--p-ink, var(--brand-orange-ink));
    transform: rotate(-45deg);
}
.plan .btn { margin-top: var(--space-3); }
.plans__empty { margin-top: var(--space-6); color: var(--text-secondary); }
.plans__empty a, .plans__legal a { color: var(--text-primary); text-decoration: underline; text-underline-offset: 3px; }
.plans__legal { display: flex; flex-wrap: wrap; gap: 6px 10px; margin-top: var(--space-5); font-size: var(--fs-small); color: var(--text-muted); }

/* ---------- Serbest HTML icerik: hedefin .prose stilini (Yazi tipografisi) tamamlar; orada olmayan ogeler ---------- */
.prose h3, .prose h4 { margin-top: 1.8em; scroll-margin-top: calc(var(--header-height-compact) + 32px); font-weight: 600; line-height: 1.25; letter-spacing: -.02em; color: var(--text-primary); }
.prose h3 { font-size: 1.25rem; }
.prose h4 { font-size: 1.0625rem; }
.prose ol { display: grid; gap: .5em; padding-left: 1.4em; list-style: decimal; }
.prose a { color: var(--text-primary); text-decoration: underline; text-decoration-color: rgb(var(--c, 244 122 14) / .6); text-underline-offset: 3px; }
.prose a:hover { text-decoration-color: currentColor; }
.prose table { width: 100%; border-collapse: collapse; font-size: var(--fs-small); }
.prose th, .prose td { padding: 8px 10px; border: 1px solid var(--border); text-align: left; vertical-align: top; }
.prose th { background: var(--surface-muted); color: var(--text-primary); font-weight: 600; }

/* ---------- Blog sayfalama ---------- */
.pager { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: var(--space-8); }
.pager a {
    display: grid;
    place-items: center;
    min-width: 42px;
    height: 42px;
    padding: 0 12px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    font-size: var(--fs-small);
    font-weight: 500;
    color: var(--text-secondary);
    transition: border-color var(--transition-fast), color var(--transition-fast);
}
.pager a:hover { border-color: var(--border-strong); color: var(--text-primary); }
.pager a[aria-current] { border-color: var(--graphite-900); background: var(--graphite-900); color: #fff; }

/* ---------- Iletisim: harita cizimi (Google iframe yerine; ucuncu tarafa istek yok) ---------- */
.contact-map__art { width: 100%; height: 100%; display: block; }
.contact-map__art .cm-sea { fill: #E4EEF2; }
.contact-map__art .cm-coast { fill: none; stroke: #C9D9E0; stroke-width: 2; }
.contact-map__art .cm-road { fill: none; stroke: #FFFFFF; stroke-width: 10; stroke-linecap: round; }
.contact-map__art .cm-road--minor { stroke-width: 4; }
.contact-map__art .cm-pin { fill: var(--brand-orange); stroke: var(--graphite-900); stroke-width: 1.5; }
.contact-map__art .cm-pin-dot { fill: #fff; }
.contact-map__art .cm-pulse { fill: rgb(244 122 14 / .14); stroke: rgb(244 122 14 / .5); stroke-width: 1.5; transform-box: fill-box; transform-origin: center; }
@media (prefers-reduced-motion: no-preference) {
    .contact-map__art .cm-pulse { animation: cmPulse 2.4s var(--ease-out) infinite; }
}
@keyframes cmPulse { 0% { transform: scale(.4); opacity: 1; } 100% { transform: scale(1.6); opacity: 0; } }

/* Iletisim formu: onay metnindeki aydinlatma metni baglantisi */
.field--check label a { color: var(--text-primary); text-decoration: underline; text-underline-offset: 3px; }

/* ---------- SSS sayfasi: gruplar ---------- */
.faq-grup + .faq-grup { padding-top: 0; }
.faq-grup__link { margin-top: var(--space-5); }

/* ---------- Yasal metinler ---------- */
.legal-hero__intro { display: grid; gap: var(--space-4); margin-top: var(--space-6); max-width: 900px; }
.legal-hero__title { font-size: var(--fs-h2); font-weight: 600; line-height: 1.05; letter-spacing: -.04em; text-wrap: balance; }
.legal-hero__meta { font-family: var(--font-mono); font-size: var(--fs-mono); letter-spacing: var(--tracking-mono); text-transform: uppercase; color: var(--text-muted); }
.legal { padding: clamp(32px, 4vw, 56px) 0 var(--section-y); border-top: 1px solid var(--border); }
.legal .prose { margin-inline: auto; }

/* Kablolar (anasayfa "tek teknoloji katmanı"): Türkçe kelimeler uzun ("REZERVASYONLAR"); tablet aralığında
   sütun dar kaldığı için yazı küçülür, yine sığmazsa kelime kırılır (yatay taşma olmaz). */
.wire__word { min-width: 0; overflow-wrap: anywhere; }
@media (min-width: 768px) and (max-width: 1199px) {
    .wire__word { font-size: clamp(1.25rem, 2.6vw, 2.25rem); }
}

/* ---------- Urun mini sitesi: header altindaki urun menusu (layouts/site.php, $urun_site) ---------- */
.p-subnav {
    position: sticky;
    top: var(--header-height-compact);
    z-index: 90;
    margin-top: var(--header-height);
    /* AI turuncusu: ana header beyaz kaldigi icin urun menusu onunla kontrast olusturur; beyaz yazi icin hafif koyultulmus gradyan */
    background: linear-gradient(90deg, #D9500D 0%, #E8620E 55%, #F0730E 100%);
    color: #fff;
    border-bottom: 1px solid rgba(0, 0, 0, .08);
    box-shadow: 0 6px 18px -10px rgba(201, 73, 10, .55);
}
.p-subnav__inner { display: flex; align-items: center; gap: var(--space-6); min-height: 52px; }
.p-subnav__name { flex: none; display: inline-flex; align-items: center; gap: 10px; font-weight: 600; letter-spacing: -.02em; color: #fff; }
/* Turuncu zeminde acik zemin logosu beyaz bir kutuda durur (renkler bozulmaz) */
.p-subnav__logo { display: block; box-sizing: content-box; height: 28px; width: auto; max-width: 160px; object-fit: contain; background: #fff; padding: 3px 6px; border-radius: 6px; }
.p-subnav__mark { width: 10px; height: 10px; border-radius: 50%; background: #fff; }
.p-subnav__list { display: flex; align-items: center; gap: var(--space-5); margin: 0; padding: 0; list-style: none; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.p-subnav__list::-webkit-scrollbar { display: none; }
.p-subnav__list a { display: block; padding: 14px 0; font-size: .875rem; white-space: nowrap; color: rgba(255, 255, 255, .92); border-bottom: 2px solid transparent; transition: color var(--transition-fast), border-color var(--transition-fast); }
.p-subnav__list a:hover { color: #fff; border-bottom-color: rgba(255, 255, 255, .55); }
.p-subnav__list a[aria-current] { color: #fff; font-weight: 600; border-bottom-color: #fff; }
.p-subnav__actions { margin-left: auto; flex: none; display: flex; align-items: center; gap: var(--space-4); }
.p-subnav__login { font-size: .875rem; color: rgba(255, 255, 255, .95); white-space: nowrap; }
.p-subnav__login:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.p-subnav a:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.p-subnav__cta { min-height: 38px; padding: 0 16px; font-size: .875rem; white-space: nowrap; }
/* Menu header'in altinda durdugu icin ilk bolumlerin header payi gerekmez */
.has-subnav .p-hero,
.has-subnav .blog-hero,
.has-subnav .article__head,
.has-subnav .site-flash { padding-top: clamp(20px, 2.4vw, 36px); }
.has-subnav .site-flash { padding-top: 16px; }
@media (max-width: 959px) {
    .p-subnav__inner { gap: var(--space-4); }
    .p-subnav__login { display: none; }
}
@media (max-width: 639px) {
    .p-subnav__name { font-size: .9375rem; }
    .p-subnav__cta { display: none; }
    .p-subnav__actions { display: none; }
}

/* ---------- Urun vitrin slider'i (partials/site_slider.php, site.js data-slider) ---------- */
.p-slider { position: relative; margin: clamp(28px, 3.4vw, 48px) 0; }
.p-slider__track {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    scrollbar-width: none;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface-muted);
}
.p-slider__track::-webkit-scrollbar { display: none; }
.p-slider__track:focus-visible { outline: 2px solid rgb(var(--p, 244 122 14)); outline-offset: 3px; }
.slide {
    flex: 0 0 100%;
    scroll-snap-align: start;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
    align-items: stretch;
    min-height: clamp(300px, 34vw, 460px);
}
.slide--yazi { grid-template-columns: minmax(0, 1fr); background: linear-gradient(135deg, rgb(var(--p, 244 122 14) / .12), rgb(var(--p, 244 122 14) / .03)); }
.slide__body { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: var(--space-4); padding: clamp(24px, 4vw, 56px); }
.slide--yazi .slide__body { max-width: 760px; }
.slide__title { font-size: clamp(1.6rem, 1.1rem + 1.8vw, 2.6rem); font-weight: 600; line-height: 1.08; letter-spacing: -.035em; text-wrap: balance; }
.slide__text { font-size: var(--fs-lead); color: var(--text-secondary); max-width: 52ch; }
.slide__media { position: relative; min-height: 220px; background: var(--surface-sunken); }
.slide__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.p-slider__controls { display: flex; align-items: center; justify-content: center; gap: var(--space-4); margin-top: var(--space-4); }
.p-slider__btn {
    width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--border-strong); background: var(--surface);
    color: var(--text-primary); font-size: 1.05rem; cursor: pointer; transition: background-color var(--transition-fast), border-color var(--transition-fast);
}
.p-slider__btn:hover { background: var(--surface-muted); border-color: var(--text-primary); }
.p-slider__dots { display: flex; gap: 8px; }
.p-slider__dots button { width: 8px; height: 8px; border-radius: 50%; border: 0; padding: 0; background: var(--border-strong); cursor: pointer; transition: background-color var(--transition-fast), width var(--transition-fast); }
.p-slider__dots button[aria-current="true"] { width: 22px; border-radius: 4px; background: rgb(var(--p, 244 122 14)); }
@media (max-width: 799px) {
    .slide { grid-template-columns: minmax(0, 1fr); }
    .slide__media { order: -1; min-height: 0; aspect-ratio: 16 / 9; }
    .slide__body { padding: var(--space-5); }
}
@media (prefers-reduced-motion: reduce) { .p-slider__track { scroll-behavior: auto; } }

/* ---------- Bizi tercih edenler / referanslar (partials/site_referanslar.php, site/tercih.php) ---------- */
.refs__head { display: grid; gap: var(--space-5); margin-bottom: clamp(28px, 3.4vw, 48px); }
@media (min-width: 960px) { .refs__head { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: end; } }
.refs__lede { font-size: var(--fs-lead); color: var(--text-secondary); max-width: 52ch; }
.refs__logos { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-5) clamp(28px, 4vw, 56px); margin: 0 0 clamp(28px, 3.4vw, 48px); padding: 0; list-style: none; }
.refs__logos li { display: flex; align-items: center; min-height: 48px; }
.refs__logos img { display: block; width: auto; max-width: 170px; height: 40px; object-fit: contain; filter: grayscale(1); opacity: .75; transition: filter var(--transition-fast), opacity var(--transition-fast); }
.refs__logos a:hover img, .refs__logos a:focus-visible img { filter: none; opacity: 1; }
.refs__logos--buyuk img { height: 48px; max-width: 210px; }
.refs__ad { font-size: 1.05rem; font-weight: 600; letter-spacing: -.02em; color: var(--text-secondary); }
.refs__quotes { display: grid; gap: var(--space-5); }
@media (min-width: 800px) { .refs__quotes { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); } }
.refs__quote { margin: 0; padding: var(--space-6); border: 1px solid var(--border); border-radius: 12px; background: var(--surface); border-top: 3px solid rgb(var(--p, 244 122 14)); display: flex; flex-direction: column; justify-content: space-between; gap: var(--space-5); }
.refs__quote blockquote { margin: 0; font-size: 1.0625rem; line-height: 1.55; color: var(--text-primary); }
.refs__quote figcaption { display: flex; flex-direction: column; gap: 2px; font-size: var(--fs-small); color: var(--text-muted); }
.refs__quote figcaption strong { color: var(--text-primary); font-weight: 600; }
.refs__urun { font-family: var(--font-mono); font-size: var(--fs-mono); letter-spacing: var(--tracking-mono); text-transform: uppercase; color: rgb(var(--p-ink, #C9490A)); }
.refs__more { margin-top: var(--space-6); }
.refs--sayfa { padding-top: clamp(32px, 4vw, 56px); border-top: 1px solid var(--border); }