/* ============================================================
   YKA Teknoloji — Base Styles (base.css)
   ============================================================
   CSS reset, global typography, utility helpers, custom
   scrollbar, and text-selection styling.
   ============================================================ */

/* ----------------------------------------------------------
   CSS RESET
   ---------------------------------------------------------- */

/* Universal box-sizing for predictable layout */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Smooth anchor scrolling */
html {
  scroll-behavior: smooth;
}

/* Base body styles */
body {
  font-family: var(--font-body);
  color: var(--color-text);
  background-color: #FAFBFF;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 0;
  line-height: 1.6;
}

/* ----------------------------------------------------------
   TYPOGRAPHY RESET
   ---------------------------------------------------------- */

/* Headings — display font, heavy weight, no default margin */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: 800;
  margin: 0;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

/* Links — inherit color, no underline by default */
a {
  color: inherit;
  text-decoration: none;
}

/* Paragraphs — no default margin */
p {
  margin: 0;
}

/* Lists — clean slate */
ul, ol {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* Images — responsive by default */
img {
  max-width: 100%;
  display: block;
}

/* Buttons — inherit font family from parent */
button {
  font-family: inherit;
}

/* ----------------------------------------------------------
   CONTAINER UTILITIES
   ---------------------------------------------------------- */

/* Standard centered container */
.container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 20px;
}

/* Narrow variant for text-heavy sections (FAQ, etc.) */
.container--narrow {
  max-width: 768px;
}

/* Wide variant for full-bleed sections */
.container--wide {
  max-width: 1400px;
}

/* ----------------------------------------------------------
   TEXT UTILITIES
   ---------------------------------------------------------- */

/* Gold gradient text — used for hero highlights */
.text-gradient {
  background: linear-gradient(135deg, #C4891A 0%, #F0B54A 60%, #C4891A 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Semantic color helpers */
.text-green {
  color: var(--color-success);
}

.text-white {
  color: #fff;
}

.text-accentgold {
  color: var(--color-accent);
}

/* Accent color — used by logo dots, inline highlights */
.accent {
  color: var(--color-accent);
}

/* ----------------------------------------------------------
   VISIBILITY UTILITIES
   ---------------------------------------------------------- */

/* Hard hide */
.hidden {
  display: none;
}

/* Hide on mobile, show on desktop (≥1024px) */
.hide-mobile {
  display: inline;
}

@media (max-width: 1023px) {
  .hide-mobile {
    display: none;
  }
}

/* ----------------------------------------------------------
   CUSTOM SCROLLBAR
   Thin gold-on-light scrollbar for WebKit browsers.
   ---------------------------------------------------------- */
::-webkit-scrollbar {
  width: 6px;
}

::-webkit-scrollbar-track {
  background: #F5F5F7;
}

::-webkit-scrollbar-thumb {
  background: var(--color-primary);
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--color-primary-light);
}

/* ----------------------------------------------------------
   TEXT SELECTION
   Primary background with white foreground.
   ---------------------------------------------------------- */
::selection {
  background: var(--color-primary);
  color: white;
}

::-moz-selection {
  background: var(--color-primary);
  color: white;
}