/* pages.css — shared inner-page styles
   Extends style.css tokens & nav. Do NOT load without style.css first.
   ──────────────────────────────────────────────────────────────────── */

/* ── Inner page nav override ───────────────────── */
/* Nav is always scrolled-dark on inner pages */
.site-nav { background: rgba(8,6,8,.97) !important; border-bottom: 1px solid var(--border); }

/* ── Page hero banner ───────────────────────────── */
.page-banner {
  padding: 5.5rem 2.5rem 3rem;
  background: var(--bg2);
  border-bottom: 1px solid var(--border);
  position: relative; overflow: hidden;
}

.page-banner-inner { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; }

.page-banner-deco {
  position: absolute; right: 2.5rem; bottom: -1rem;
  font-family: var(--font-d);
  font-size: clamp(7rem, 18vw, 16rem);
  color: var(--fg); opacity: .03;
  letter-spacing: -.02em; line-height: 1;
  pointer-events: none; user-select: none;
}

.page-eyebrow {
  display: flex; align-items: center; gap: .7rem;
  font-family: var(--font-m); font-size: .55rem;
  letter-spacing: .28em; text-transform: uppercase;
  color: var(--accent); margin-bottom: 1rem;
}

.page-eyebrow .ey-line {
  display: block; width: 1.8rem; height: 1px;
  background: var(--accent);
}

.page-title {
  font-family: var(--font-d);
  font-size: clamp(3rem, 8vw, 7rem);
  line-height: .88; letter-spacing: .04em;
  margin-bottom: 1rem;
}

.page-subtitle {
  font-family: var(--font-m); font-size: .76rem;
  line-height: 1.9; color: rgba(212,201,192,.55);
  max-width: 520px;
}

/* ── Section tag reuse ──────────────────────────── */
.s-tag {
  display: flex; align-items: center; gap: .7rem;
  font-family: var(--font-m); font-size: .55rem;
  letter-spacing: .28em; text-transform: uppercase;
  color: var(--accent); margin-bottom: 1.2rem;
}

.s-tag .t-line {
  display: block; width: 1.8rem; height: 1px; background: var(--accent);
}

.s-title {
  font-family: var(--font-d);
  font-size: clamp(2.2rem, 5vw, 5rem);
  line-height: .9; letter-spacing: .04em;
}

.s-body {
  font-family: var(--font-m); font-size: .76rem;
  line-height: 1.9; color: rgba(212,201,192,.6);
}

/* ── Pulse dot ──────────────────────────────────── */
.pulse-dot {
  display: inline-block;
  width: .45rem; height: .45rem;
  border-radius: 50%; background: #22c55e;
  animation: pulseDot 2s ease-in-out infinite;
}

@keyframes pulseDot {
  0%,100% { opacity:1; box-shadow:0 0 0 0 rgba(34,197,94,.4); }
  50%      { opacity:.7; box-shadow:0 0 0 4px rgba(34,197,94,0); }
}

/* ── Footer same as index ───────────────────────── */
.site-footer-inner {
  background: var(--bg);
  border-top: 1px solid var(--border);
  padding: 3rem 2.5rem 2rem;
}

.footer-top-row {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 2rem; flex-wrap: wrap; gap: 1.5rem;
}

.f-logo {
  display: flex; align-items: center; gap: .5rem;
  font-family: var(--font-d); font-size: 1.8rem;
  letter-spacing: .1em; color: #fff;
}

.f-logo .f-glyph { color: var(--accent); }

.f-nav {
  display: flex; gap: 2rem; flex-wrap: wrap;
}

.f-nav a {
  font-family: var(--font-m); font-size: .6rem;
  letter-spacing: .2em; text-transform: uppercase;
  color: var(--muted); text-decoration: none;
  transition: color .3s ease;
}

.f-nav a:hover { color: var(--fg); }

.footer-bot-row {
  display: flex; align-items: center; justify-content: space-between;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(200,0,30,.08);
  font-family: var(--font-m); font-size: .55rem;
  letter-spacing: .15em; color: var(--muted);
  text-transform: uppercase;
  flex-wrap: wrap; gap: .5rem;
}

/* ── Chip reuse ─────────────────────────────────── */
.p-chip {
  font-family: var(--font-m); font-size: .52rem;
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--muted);
  border: 1px solid rgba(180,140,70,.15);
  padding: .25rem .7rem;
  transition: border-color .25s, color .25s;
}

.p-chip:hover { border-color: var(--accent); color: var(--fg); }

/* ═══════════════════════════════════════════════════
   İÇ SAYFA MOBİL — TAM KAPSAMLI
   ═══════════════════════════════════════════════════ */

@media (max-width: 900px) {
  .page-banner { padding: 5rem 1.5rem 2.5rem; }
  .page-banner-deco { display: none; }
  .footer-top-row { flex-direction: column; text-align: center; gap: 1rem; }
  .f-nav { justify-content: center; flex-wrap: wrap; gap: 1.2rem; }
  .footer-bot-row { flex-direction: column; text-align: center; gap: .4rem; }
  .site-nav { padding: 1rem 1.5rem; }
  .nav-links { display: none; }
  .nav-cta   { display: none; }
  .nav-burger { display: flex; }
}

@media (max-width: 560px) {

  /* Page banner */
  .page-banner { padding: 4.5rem 1.2rem 2rem; }
  .page-banner-deco { display: none; }
  .page-title { font-size: clamp(2.4rem, 12vw, 4.5rem); line-height: .9; }
  .page-subtitle { font-size: .72rem; line-height: 1.8; }
  .page-eyebrow { font-size: .52rem; }

  /* Section titles */
  .s-title { font-size: clamp(1.8rem, 10vw, 3.5rem); }
  .s-body  { font-size: .72rem; }

  /* Footer */
  .site-footer-inner { padding: 2.5rem 1.2rem 2rem; }
  .footer-top-row { gap: .8rem; }
  .f-logo { font-size: 1.4rem; }
  .f-nav { gap: .8rem 1.2rem; }
  .f-nav a { font-size: .56rem; }
  .footer-bot-row { font-size: .5rem; }
}

@media (max-width: 380px) {
  .page-banner { padding: 4rem 1rem 1.8rem; }
  .page-title { font-size: clamp(2rem, 12vw, 3.5rem); }
  .site-footer-inner { padding: 2rem 1rem 1.5rem; }
}

@supports (padding: max(0px)) {
  .site-footer-inner {
    padding-bottom: max(2rem, env(safe-area-inset-bottom));
  }
}
