:root {
  --palette-midnight: #171f44;
  --palette-aqua: #74ffed;
  --palette-pink: #fe81d1;
  --bg: #080d24;
  --bg2: #0d1430;
  --card: #171f44;
  --gold: #74ffed;
  --gold2: #9efff2;
  --neon-green: #74ffed;
  --neon-purple: #fe81d1;
  --muted: #aebbd3;
  --text: #f7f9ff;
  --line: rgba(116, 255, 237, .18);
  --shadow: 0 24px 70px rgba(2, 5, 20, .52), 0 0 34px rgba(116, 255, 237, .035);
}

html {
  color-scheme: dark;
  scroll-padding-top: 96px;
}

body {
  background:
    radial-gradient(circle at 12% 8%, rgba(254, 129, 209, .075), transparent 26rem),
    radial-gradient(circle at 88% 18%, rgba(116, 255, 237, .07), transparent 30rem),
    linear-gradient(180deg, #080d24 0%, #0b112b 52%, #080d24 100%);
}

.palette-ambient {
  position: fixed;
  z-index: 0;
  inset: -22vh -18vw;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 24%, rgba(116, 255, 237, .2), transparent 25%),
    radial-gradient(circle at 78% 18%, rgba(116, 255, 237, .11), transparent 22%),
    radial-gradient(circle at 72% 76%, rgba(254, 129, 209, .1), transparent 25%),
    radial-gradient(circle at 36% 82%, rgba(116, 255, 237, .085), transparent 23%);
  opacity: .48;
  transform: translate3d(-2.5%, -1.5%, 0) scale(1.02);
  animation: palette-ambient-drift 26s cubic-bezier(.45, 0, .25, 1) infinite alternate;
  will-change: transform, opacity;
}

@keyframes palette-ambient-drift {
  0% { opacity: .42; transform: translate3d(-3%, -2%, 0) scale(1.01); }
  48% { opacity: .62; transform: translate3d(3%, 1.5%, 0) scale(1.055); }
  100% { opacity: .5; transform: translate3d(-1%, 3%, 0) scale(1.025); }
}

::selection { background: var(--palette-pink); color: #101631; }

.site-nav {
  inset: 14px auto auto 50%;
  width: min(1220px, calc(100% - 32px));
  height: 64px;
  transform: translateX(-50%);
  border: 1px solid rgba(116, 255, 237, .19);
  border-radius: 18px;
  background: rgba(8, 13, 36, .72);
  box-shadow: 0 18px 52px rgba(2, 5, 20, .38), inset 0 1px 0 rgba(255, 255, 255, .045);
  backdrop-filter: blur(18px) saturate(145%);
  -webkit-backdrop-filter: blur(18px) saturate(145%);
}

.site-nav .nav-inner {
  width: 100%;
  padding-inline: 16px;
}

.nav-links a { color: #a8b4ce; }
.nav-links a:hover,
.nav-links a.active { color: var(--palette-aqua); }
.nav-cta,
.command-trigger {
  border-color: rgba(254, 129, 209, .34);
  background: rgba(254, 129, 209, .075);
}
.nav-cta:hover,
.command-trigger:hover { border-color: rgba(254, 129, 209, .68); }

.hero::before {
  background-image:
    linear-gradient(rgba(116, 255, 237, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(116, 255, 237, .035) 1px, transparent 1px);
}
.hero::after {
  background: radial-gradient(circle, rgba(254, 129, 209, .13), rgba(116, 255, 237, .035) 38%, transparent 68%);
}
.hero-title { color: #c7d2e8; }
.hero-copy { color: #aebbd3; }
.hero h1 { text-shadow: 0 0 30px rgba(116, 255, 237, .08), 0 0 52px rgba(254, 129, 209, .035); }
.hello,
.section-no,
.profile-kicker { text-shadow: 0 0 14px rgba(116, 255, 237, .24); }
.pill {
  border-color: rgba(116, 255, 237, .23);
  background: rgba(23, 31, 68, .7);
  box-shadow: inset 0 0 18px rgba(116, 255, 237, .025);
}

.btn {
  border-color: rgba(116, 255, 237, .2);
  background: rgba(23, 31, 68, .82);
  box-shadow: 0 10px 28px rgba(2, 5, 20, .18);
}
.btn:hover,
.btn:focus-visible { border-color: rgba(116, 255, 237, .68); }
.btn-primary {
  border-color: transparent;
  background: linear-gradient(120deg, #74ffed 0%, #8ee7f4 48%, #fe81d1 100%);
  color: #111735;
  box-shadow: 0 14px 36px rgba(116, 255, 237, .16), 0 10px 30px rgba(254, 129, 209, .12);
}
.btn-primary:hover,
.btn-primary:focus-visible {
  border-color: transparent;
  box-shadow: 0 18px 44px rgba(116, 255, 237, .24), 0 12px 34px rgba(254, 129, 209, .18);
}
.btn-link { color: #b5c1d8; background: transparent; box-shadow: none; }

.actions .cv-view {
  border-color: rgba(116, 255, 237, .42);
  background: linear-gradient(135deg, rgba(116, 255, 237, .1), rgba(23, 31, 68, .72));
  color: #eafffb;
}
.actions .cv-download {
  background: linear-gradient(120deg, #74ffed 0%, #7fddec 42%, #fe81d1 100%);
  color: #111735;
  box-shadow: 0 15px 40px rgba(116, 255, 237, .16), 0 12px 32px rgba(254, 129, 209, .15);
}

.terminal,
.profile-summary,
.fact,
.skill-card,
.competency-card,
.profile-fact,
.edu-card,
.project,
.website-card,
.cert,
.contact-card,
.automation-shell,
.automation-card,
.tool-card,
.qa-card,
.work-category,
.hobby-card {
  border-color: rgba(116, 255, 237, .19);
  background-color: rgba(23, 31, 68, .78);
  box-shadow: 0 18px 52px rgba(2, 5, 20, .2);
}

.terminal {
  background: linear-gradient(155deg, rgba(18, 27, 61, .98), rgba(8, 13, 36, .99));
  box-shadow: 0 30px 90px rgba(2, 5, 20, .5), 0 0 38px rgba(116, 255, 237, .06), 0 0 48px rgba(254, 129, 209, .04);
}
.terminal-head { border-bottom-color: rgba(116, 255, 237, .13); background: rgba(23, 31, 68, .64); }
.terminal-command,
.terminal-online { color: var(--palette-aqua); }
.terminal-cursor { background: var(--palette-pink); box-shadow: 0 0 12px rgba(254, 129, 209, .72); }
.terminal-photo { border-color: var(--palette-aqua); box-shadow: 0 0 0 9px rgba(116, 255, 237, .035), 0 0 30px rgba(254, 129, 209, .11); }

.section.alt,
.career-section,
.profile-section,
.automation-section,
.games-section,
.tools-section,
.hobbies-section {
  border-color: rgba(116, 255, 237, .075);
  background:
    radial-gradient(circle at 10% 12%, rgba(116, 255, 237, .055), transparent 28rem),
    radial-gradient(circle at 90% 82%, rgba(254, 129, 209, .055), transparent 30rem),
    #0d1430;
}
.profile-section::before,
.hobbies-section::before {
  background:
    linear-gradient(rgba(116, 255, 237, .022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(254, 129, 209, .018) 1px, transparent 1px);
  background-size: 44px 44px;
}

.profile-summary {
  background: linear-gradient(145deg, rgba(23, 31, 68, .96), rgba(10, 16, 43, .98));
}
.competency-card,
.profile-fact,
.career-section .edu-card {
  background: linear-gradient(145deg, rgba(23, 31, 68, .82), rgba(11, 17, 44, .94));
}
.competency-tags span,
.skill-tags span,
.project-meta span,
.hobby-tags span {
  border-color: rgba(116, 255, 237, .11);
  background: rgba(8, 13, 36, .62);
  color: #b2bfd8;
}

.work-showcase,
.work-board {
  background:
    radial-gradient(circle at 8% 8%, rgba(116, 255, 237, .06), transparent 24rem),
    radial-gradient(circle at 92% 70%, rgba(254, 129, 209, .06), transparent 28rem),
    #080d24;
}
.work-category {
  background: linear-gradient(155deg, rgba(23, 31, 68, .78), rgba(10, 16, 43, .9));
  box-shadow: 0 20px 58px rgba(2, 5, 20, .24), inset 0 1px 0 rgba(116, 255, 237, .035);
}
.work-category-head { border-bottom-color: rgba(116, 255, 237, .1); }
.work-category-head span,
.work-total {
  border-color: rgba(116, 255, 237, .25);
  box-shadow: 0 0 22px rgba(116, 255, 237, .055);
}
.work-tile,
.work-tile-static { border-color: rgba(116, 255, 237, .12); background: #101735; }
.work-tile:hover,
.work-tile:focus-visible,
.work-tile-static:hover,
.work-tile-static:focus-visible {
  border-color: rgba(254, 129, 209, .6);
  box-shadow: 0 14px 34px rgba(254, 129, 209, .11), 0 0 24px rgba(116, 255, 237, .06);
}

/* Scroll reveal: tek observer, GPU-dostu opacity + transform hareketi. */
#showcase .section-head.reveal,
#showcase .work-category.reveal,
.profile-section .section-head.reveal,
.profile-section .profile-summary.reveal,
.profile-section .competency-card.reveal,
.profile-section .profile-facts.reveal {
  transform: translate3d(0, 34px, 0);
  transition-duration: .82s;
  transition-timing-function: cubic-bezier(.22, .78, .22, 1);
  will-change: opacity, transform;
}

#showcase .section-head.reveal.visible,
#showcase .work-category.reveal.visible,
.profile-section .section-head.reveal.visible,
.profile-section .profile-summary.reveal.visible,
.profile-section .competency-card.reveal.visible,
.profile-section .profile-facts.reveal.visible {
  transform: translate3d(0, 0, 0);
  will-change: auto;
}

#showcase .work-category:nth-child(1) { transition-delay: 40ms; }
#showcase .work-category:nth-child(2) { transition-delay: 110ms; }
#showcase .work-category:nth-child(3) { transition-delay: 180ms; }
#showcase .work-category:nth-child(4) { transition-delay: 250ms; }
#showcase .work-category:nth-child(5) { transition-delay: 320ms; }

.profile-competencies .competency-card:nth-child(1) { transition-delay: 40ms; }
.profile-competencies .competency-card:nth-child(2) { transition-delay: 100ms; }
.profile-competencies .competency-card:nth-child(3) { transition-delay: 160ms; }
.profile-competencies .competency-card:nth-child(4) { transition-delay: 220ms; }
.profile-competencies .competency-card:nth-child(5) { transition-delay: 280ms; }
.profile-competencies .competency-card:nth-child(6) { transition-delay: 340ms; }

.profile-section .competency-card:hover,
.profile-section .competency-card.reveal.visible:hover { transform: translateY(-2px); }

.profile-section .competency-tags span,
.profile-section .profile-proof,
.profile-section .profile-fact {
  opacity: 0;
  transform: translate3d(0, 10px, 0);
  transition: opacity .48s ease, transform .56s cubic-bezier(.22, .78, .22, 1);
}

.profile-section .competency-card.visible .competency-tags span,
.profile-section .profile-summary.visible .profile-proof,
.profile-section .profile-facts.visible .profile-fact {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.profile-section .competency-tags span:nth-child(2),
.profile-section .profile-proof:nth-child(2),
.profile-section .profile-fact:nth-child(2) { transition-delay: 55ms; }
.profile-section .competency-tags span:nth-child(3),
.profile-section .profile-proof:nth-child(3),
.profile-section .profile-fact:nth-child(3) { transition-delay: 110ms; }
.profile-section .competency-tags span:nth-child(4),
.profile-section .profile-fact:nth-child(4) { transition-delay: 165ms; }
.profile-section .competency-tags span:nth-child(5) { transition-delay: 220ms; }
.profile-section .competency-tags span:nth-child(6) { transition-delay: 275ms; }
.profile-section .competency-tags span:nth-child(7) { transition-delay: 330ms; }
.profile-section .competency-tags span:nth-child(8) { transition-delay: 385ms; }
.profile-section .competency-tags span:nth-child(9) { transition-delay: 440ms; }
.profile-section .competency-tags span:nth-child(10) { transition-delay: 495ms; }
.profile-section .competency-tags span:nth-child(11) { transition-delay: 550ms; }
.profile-section .competency-tags span:nth-child(12) { transition-delay: 605ms; }

.work-detail-dialog,
.command-dialog {
  border-color: rgba(116, 255, 237, .24);
  background: #0d1430;
  box-shadow: 0 35px 120px rgba(2, 5, 20, .76), 0 0 48px rgba(254, 129, 209, .065);
}
.work-detail-copy,
.command-head,
.command-body { background-color: rgba(13, 20, 48, .96); }
.work-detail-tech span {
  border-color: rgba(254, 129, 209, .25);
  background: rgba(254, 129, 209, .075);
  color: #ffc2e9;
}
.work-detail-action,
.job-showcase-link {
  border-color: rgba(116, 255, 237, .34);
  background: linear-gradient(135deg, rgba(116, 255, 237, .11), rgba(254, 129, 209, .11));
}

.command-item { background: rgba(23, 31, 68, .62); }
.command-item:hover,
.command-item:focus-visible { border-color: rgba(254, 129, 209, .46); background: rgba(31, 41, 84, .9); }
.command-item-index { border-color: rgba(116, 255, 237, .24); }

.hobby-card { --hobby-accent: var(--palette-aqua); background: linear-gradient(145deg, rgba(23, 31, 68, .94), rgba(10, 16, 43, .98)); }
.hobby-card.is-fishing,
.hobby-card.is-motorcycle { --hobby-accent: var(--palette-aqua); }
.hobby-card.is-vibecoding,
.hobby-card.is-research { --hobby-accent: var(--palette-pink); }
.fishing-profile {
  border-color: rgba(116, 255, 237, .2);
  background: linear-gradient(155deg, rgba(116, 255, 237, .07), rgba(254, 129, 209, .04));
}

.alperen-chat-bubble,
.alperen-chat-panel {
  border-color: rgba(116, 255, 237, .28);
  background: linear-gradient(155deg, rgba(23, 31, 68, .985), rgba(8, 13, 36, .995));
  box-shadow: 0 28px 85px rgba(2, 5, 20, .68), 0 0 38px rgba(254, 129, 209, .055);
}
.alperen-chat-bubble::after { border-color: rgba(116, 255, 237, .28); background: #171f44; }
.alperen-chat-head,
.alperen-chat-form,
.alperen-chat-note { background: rgba(13, 20, 48, .9); }
.alperen-chat-message.is-assistant,
.alperen-chat-input { background: rgba(23, 31, 68, .78); }
.alperen-chat-message.is-user,
.alperen-chat-send { background: linear-gradient(135deg, rgba(116, 255, 237, .15), rgba(254, 129, 209, .2)); }
.alperen-chat-input:focus { border-color: rgba(116, 255, 237, .58); box-shadow: 0 0 0 3px rgba(116, 255, 237, .08); }

.scroll-progress span {
  background: linear-gradient(90deg, #74ffed, #fe81d1, #74ffed);
  box-shadow: 0 0 14px rgba(116, 255, 237, .45);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--palette-aqua);
  outline-offset: 3px;
}

@media (max-width: 620px) {
  body {
    background:
      radial-gradient(circle at 15% 4%, rgba(254, 129, 209, .065), transparent 20rem),
      linear-gradient(180deg, #080d24, #0b112b 58%, #080d24);
  }
  .palette-ambient {
    inset: -12vh -65vw;
    opacity: .38;
    animation-duration: 32s;
  }
  .site-nav {
    inset: 8px auto auto 50%;
    width: calc(100% - 16px);
    height: 60px;
    border-radius: 16px;
    backdrop-filter: blur(14px) saturate(135%);
    -webkit-backdrop-filter: blur(14px) saturate(135%);
  }
  .site-nav .nav-inner { padding-inline: 10px; }
}

@media (max-width: 900px) {
  .site-nav .nav-links {
    top: calc(100% + 9px);
    left: 0;
    right: 0;
    border: 1px solid rgba(116, 255, 237, .18);
    border-radius: 16px;
    background: rgba(8, 13, 36, .96);
    box-shadow: 0 20px 52px rgba(2, 5, 20, .55);
  }
}

@media (prefers-reduced-motion: reduce) {
  .palette-ambient {
    animation: none;
    opacity: .42;
    transform: none;
  }
  .btn,
  .work-tile,
  .work-tile-static,
  .hobby-card { transition: none !important; }
  #showcase .reveal,
  .profile-section .reveal,
  .profile-section .competency-tags span,
  .profile-section .profile-proof,
  .profile-section .profile-fact {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}
