/* Tüm sayfalarda ortak, üstten aşağıya geçiş ve gezinme. */
html { --travel-distance: 36px; --frame-surface: #f8fcff55; }
[data-theme="dark"] { --frame-surface: #0a102066; }
body { isolation: isolate; }
.primary-nav { gap: 17px; }
.page-backdrop { position: fixed; z-index: -1; inset: 0; overflow: hidden; background: var(--paper); pointer-events: none; }
.page-backdrop > div { position: absolute; inset: -8%; background-image: linear-gradient(125deg, transparent 38%, #58bce61a 50%, transparent 67%), linear-gradient(160deg, transparent 45%, #389acb17 48%, transparent 65%); opacity: .26; animation: page-backdrop-drift 22s ease-in-out infinite alternate; }
.page-backdrop::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #f8fcffe0, #f8fcff44 70%); }
.page-backdrop.is-paused > div { animation-play-state: paused; }
body[data-page="anasayfa"] .page-backdrop { display: none; }
body:not([data-page="anasayfa"]) .section { background: transparent; }
body:not([data-page="anasayfa"]) .section-heading > div, body:not([data-page="anasayfa"]) .about-grid > div:first-child { animation: section-drift 10s ease-in-out infinite alternate; }
body:not([data-page="anasayfa"]) .section-heading > p { animation: section-drift 12s ease-in-out -4s infinite alternate; }
.page-title > span { color: var(--blue-light); }
.page-navigation { padding-block: 32px; border-top: 1px solid var(--line); background: var(--frame-surface); backdrop-filter: blur(10px); }
/* Ortak görsel, logo dahil üst ve alt çerçevenin arkasından kesintisiz geçer. */
.site-header, .site-header.is-scrolled, .site-footer,
[data-theme="dark"] .site-header, [data-theme="dark"] .site-header.is-scrolled, [data-theme="dark"] .site-footer {
  background: var(--frame-surface);
  backdrop-filter: blur(10px);
}
[data-theme="dark"] .brand-logo { background: transparent; filter: drop-shadow(0 0 8px #b8dcff70); }
.page-navigation-inner { display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch; gap: 20px; }
.page-direction { display: flex; align-items: center; gap: 18px; overflow: hidden; position: relative; padding: 20px 24px; border: 1px solid transparent; border-radius: 14px; background: linear-gradient(var(--card-background), var(--card-background)) padding-box, linear-gradient(125deg, #8ac2df80, #c7e4f040 50%, #8ac2df80) border-box; transition: transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s; }
.page-nav-copy { flex: 1; min-width: 0; }
.page-nav-copy > span { display: block; font-size: .75rem; color: var(--muted); }
.page-direction::after { content: ''; position: absolute; left: 18%; right: 18%; bottom: 0; height: 2px; background: linear-gradient(90deg, transparent, #81d6ff, transparent); transform: scaleX(.35); opacity: .35; transition: transform .4s, opacity .4s; }
.page-direction:hover::after, .page-direction:focus-visible::after { transform: scaleX(1); opacity: 1; }
.page-nav-icon, .page-home-icon { display: grid; place-items: center; flex-shrink: 0; width: 42px; height: 42px; border: 1px solid #74bce539; border-radius: 12px; color: var(--blue-light); background: linear-gradient(145deg, #86ccf320, #86ccf304); transition: background .4s, box-shadow .4s; }
.page-nav-icon svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; transition: translate .35s; }
.page-direction:hover .page-nav-icon, .page-direction:focus-visible .page-nav-icon, .page-home:hover .page-home-icon { background: #79c9f328; box-shadow: 0 0 22px #72caff24; }
.page-previous:hover svg { translate: -3px 0; }
.page-next:hover svg { translate: 3px 0; }
.page-direction strong { display: block; font-size: 1rem; font-weight: 600; color: var(--ink); margin-top: 6px; }
.page-previous:hover { transform: translateX(-4px); box-shadow: 0 10px 28px #38688612; }
.page-next { text-align: right; }
.page-next:hover { transform: translateX(4px); box-shadow: 0 10px 28px #38688612; }
.page-home { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 15px 26px; border: 1px solid #74bce52b; border-radius: 14px; background: linear-gradient(155deg, #80cded18, #80cded04); color: var(--blue-light); font-size: .75rem; font-weight: 650; transition: background .3s, transform .4s; }
.page-home:hover { background: var(--paper); transform: translateY(-3px); }
.page-home svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
[data-theme="dark"] .page-backdrop > div { opacity: .38; }
[data-theme="dark"] .page-backdrop::after { background: linear-gradient(90deg, #091020ed, #09102066 70%); }
[data-theme="dark"] .page-navigation { background: var(--frame-surface); }
[data-theme="dark"] .page-direction { background: linear-gradient(var(--card-background), var(--card-background)) padding-box, linear-gradient(125deg, #679dbb70, #35577840 50%, #679dbb70) border-box; }
@keyframes page-backdrop-drift { from { transform: scale(1.02) translate3d(-1%, -1%, 0); } to { transform: scale(1.14) translate3d(2%, 1%, 0); } }
@keyframes section-drift { from { transform: translateY(0); } to { transform: translateY(-5px); } }
@media (max-width: 860px) { .page-navigation-inner { gap: 12px; } .page-home { padding-inline: 16px; } }
@media (max-width: 600px) {
  .page-navigation { padding-block: 22px; }
  .page-navigation-inner { grid-template-columns: 1fr 1fr; }
  .page-direction { padding: 16px 12px; gap: 10px; }
  .page-nav-icon { width: 30px; height: 34px; border-radius: 9px; }
  .page-direction strong { font-size: .875rem; }
  .page-home { grid-column: 1 / -1; grid-row: 2; flex-direction: row; padding: 15px; background: var(--paper); }
  html { --travel-distance: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .page-direction, .page-direction::after, .page-nav-icon, .page-home, .page-home-icon, .page-nav-icon svg { transition: none; }
  .page-direction:hover, .page-home:hover { transform: none; }
  .page-direction:hover svg { translate: none; }
}