/* dogancoban.com Tasarım Sistemi v1.0 — bileşen stilleri.
   Fontlar tokens.css'teki @font-face kurallarıyla sistemin kendi dosyalarından (fonts/, WOFF2) yüklenir; Google Fonts bağlanmaz. */

.dc-pv { font-family: var(--font-sans); color: var(--ink); background: var(--surface-000); padding: var(--space-6); display: grid; gap: var(--space-6); }
.dc-pv h1, .dc-pv h2, .dc-pv h3 { font-family: var(--font-serif); color: var(--navy-900); margin: 0; text-wrap: balance; }
.dc-pv p { margin: 0; max-width: var(--measure); }
.dc-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4); }
.dc-row--dark { background: var(--navy-900); padding: var(--space-6); border-radius: var(--radius-md); }

/* Odak: açık zeminde lacivert, koyu zeminde turuncu */
.dc-pv :focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.dc-dark :focus-visible, .dc-row--dark :focus-visible, .dc-footer :focus-visible { outline-color: var(--focus-ring-on-dark); }

/* Button */
.dc-btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); min-height: var(--touch-min); padding: 0 var(--space-6); border-radius: var(--radius-md); font-family: var(--font-sans); font-size: 17px; line-height: 24px; font-weight: 600; text-decoration: none; border: 2px solid transparent; cursor: pointer; transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease; }
.dc-btn--primary { background: var(--orange-500); color: var(--navy-900); }
.dc-btn--primary:hover, .dc-btn--primary:active { background: var(--orange-600); }
.dc-btn--secondary { background: var(--surface-000); color: var(--navy-900); border-color: var(--navy-900); }
.dc-btn--secondary:hover { background: var(--surface-100); }
.dc-btn--on-dark { background: transparent; color: var(--ink-inverse); border-color: var(--ink-inverse); }
.dc-btn--on-dark:hover { background: var(--blue-600); }
.dc-btn--link { min-height: auto; padding: 0; color: var(--navy-900); text-decoration: underline; text-underline-offset: 3px; }
.dc-btn[disabled], .dc-btn[aria-disabled="true"] { opacity: .5; cursor: not-allowed; }

/* SiteHeader */
.dc-header { background: var(--surface-000); border-bottom: 1px solid var(--line); }
.dc-header__inner { max-width: var(--container-max); margin: 0 auto; min-height: var(--header-height); padding: 0 var(--gutter); display: flex; align-items: center; gap: var(--space-8); }
.dc-wordmark { display: flex; flex-direction: column; text-decoration: none; }
.dc-wordmark__name { font-family: var(--font-serif); font-size: 24px; line-height: 28px; font-weight: 700; color: var(--navy-900); }
.dc-wordmark__url { font-size: 13px; line-height: 18px; color: var(--blue-600); letter-spacing: .02em; }
.dc-nav { display: flex; gap: var(--space-6); margin-left: auto; }
.dc-nav a { color: var(--ink); text-decoration: none; font-size: 17px; line-height: 24px; padding: var(--space-2) 0; border-bottom: 2px solid transparent; }
.dc-nav a:hover { color: var(--navy-900); border-bottom-color: var(--line); }
.dc-nav a[aria-current="page"] { color: var(--navy-900); border-bottom-color: var(--orange-500); font-weight: 600; }
.dc-lang { display: inline-flex; border: 1px solid var(--blue-600); border-radius: var(--radius-full); padding: 2px; }
.dc-lang a { min-width: 40px; min-height: 36px; display: inline-flex; align-items: center; justify-content: center; border-radius: var(--radius-full); font-size: 15px; font-weight: 600; color: var(--blue-600); text-decoration: none; }
.dc-lang a[aria-current="true"] { background: var(--navy-900); color: var(--ink-inverse); }
.dc-menu { display: none; }
@media (max-width: 900px) {
  .dc-nav { display: none; }
  .dc-menu { display: inline-flex; margin-left: auto; }
  .dc-header__inner { gap: var(--space-4); }
}

/* ServiceCard */
.dc-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--space-6); }
.dc-card { background: var(--surface-000); border: 1px solid var(--line); border-radius: var(--radius-md); padding: var(--space-6); display: grid; gap: var(--space-4); align-content: start; }
.dc-card__eyebrow { font-size: 13px; line-height: 18px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--blue-600); }
.dc-card__title { font-family: var(--font-serif); font-size: 22px; line-height: 30px; font-weight: 600; color: var(--navy-900); margin: 0; }
.dc-card__promise { font-size: 17px; line-height: 28px; }
.dc-card__list { margin: 0; padding-left: 1.2em; display: grid; gap: var(--space-2); }
.dc-card__meta { font-size: 15px; line-height: 24px; color: var(--blue-600); }
.dc-card__actions { display: flex; flex-wrap: wrap; gap: var(--space-4); align-items: center; margin-top: var(--space-2); }

/* ProcessSteps */
.dc-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--space-6); counter-reset: step; }
.dc-step { counter-increment: step; display: grid; gap: var(--space-2); padding-top: var(--space-4); border-top: 2px solid var(--navy-900); }
.dc-step::before { content: counter(step); font-family: var(--font-serif); font-size: 30px; line-height: 38px; font-weight: 700; color: var(--navy-900); }
.dc-step__title { font-weight: 600; color: var(--navy-900); }
.dc-step__meta { font-size: 15px; line-height: 24px; color: var(--blue-600); }

/* DecisionTag */
.dc-tag { display: inline-flex; align-items: center; gap: var(--space-2); min-height: 32px; padding: 0 var(--space-3); border-radius: var(--radius-sm); border: 1px solid transparent; font-family: var(--font-sans); font-size: 15px; line-height: 20px; font-weight: 600; white-space: nowrap; }
.dc-tag svg { width: 14px; height: 14px; flex: none; }
.dc-tag--yz { background: var(--orange-500); color: var(--navy-900); }
.dc-tag--yz svg { fill: var(--navy-900); }
.dc-tag--otomasyon { background: var(--blue-600); color: var(--ink-inverse); }
.dc-tag--otomasyon svg { fill: none; stroke: var(--ink-inverse); stroke-width: 2; }
.dc-tag--yazilim { background: var(--navy-900); color: var(--ink-inverse); }
.dc-tag--yazilim svg { fill: var(--ink-inverse); }
.dc-tag--surec { background: var(--surface-100); color: var(--navy-900); border-color: var(--navy-900); }
.dc-tag--surec svg { fill: var(--navy-900); }
.dc-tag--bekle { background: var(--surface-000); color: var(--blue-600); border: 1px dashed var(--blue-600); }
.dc-tag--bekle svg { fill: var(--blue-600); }
.dc-tagtable { border-collapse: collapse; width: 100%; font-size: 15px; }
.dc-tagtable th, .dc-tagtable td { text-align: left; padding: var(--space-3); border-bottom: 1px solid var(--line); }
.dc-tagtable th { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--blue-600); }

/* Faq */
.dc-faq { display: grid; border-top: 1px solid var(--line); }
.dc-faq details { border-bottom: 1px solid var(--line); }
.dc-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: var(--space-4); padding: var(--space-4) 0; min-height: var(--touch-min); font-weight: 600; color: var(--navy-900); }
.dc-faq summary::-webkit-details-marker { display: none; }
.dc-faq summary::after { content: "+"; font-size: 22px; line-height: 24px; color: var(--blue-600); }
.dc-faq details[open] summary::after { content: "–"; }
.dc-faq details > p { padding: 0 0 var(--space-4); }

/* LeadForm */
.dc-form { display: grid; gap: var(--space-4); max-width: 560px; }
.dc-field { display: grid; gap: var(--space-1); }
.dc-field label, .dc-fieldset legend { font-weight: 600; color: var(--navy-900); font-size: 15px; }
.dc-field .dc-req { font-weight: 400; color: var(--blue-600); }
.dc-input, .dc-select, .dc-textarea { font: inherit; font-size: 17px; color: var(--ink); background: var(--surface-000); border: 1px solid var(--blue-600); border-radius: var(--radius-sm); min-height: var(--touch-min); padding: 0 var(--space-3); }
.dc-textarea { min-height: 96px; padding: var(--space-3); }
.dc-help { font-size: 15px; line-height: 22px; color: var(--blue-600); }
.dc-field--error .dc-input { border-color: var(--danger); border-width: 2px; }
.dc-error { font-size: 15px; line-height: 22px; color: var(--danger); display: flex; gap: var(--space-1); align-items: flex-start; }
.dc-error::before { content: "!"; display: inline-flex; width: 18px; height: 18px; border-radius: 50%; background: var(--danger); color: var(--ink-inverse); font-size: 13px; font-weight: 600; align-items: center; justify-content: center; flex: none; margin-top: 2px; }
.dc-fieldset { border: 0; padding: 0; margin: 0; display: grid; gap: var(--space-2); }
.dc-choice { display: flex; gap: var(--space-2); align-items: center; min-height: var(--touch-min); }
.dc-choice input { width: 20px; height: 20px; accent-color: var(--navy-900); }
.dc-optional { display: grid; gap: var(--space-4); padding: var(--space-4); background: var(--surface-100); border-radius: var(--radius-sm); }
.dc-optional[hidden] { display: none; }
.dc-daterange { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); }
.dc-legal { font-size: 15px; line-height: 22px; color: var(--ink); }
.dc-legal a { color: var(--navy-900); }

/* CookiePanel */
.dc-cookie { background: var(--surface-000); border: 1px solid var(--line); border-radius: var(--radius-sm); box-shadow: var(--shadow-panel); padding: var(--space-6); display: grid; gap: var(--space-4); max-width: 640px; }
.dc-cookie__title { font-weight: 600; color: var(--navy-900); }
.dc-cookie__actions { display: flex; flex-wrap: wrap; gap: var(--space-4); align-items: center; }
.dc-cookie__actions .dc-btn { min-width: 140px; }
.dc-cookie__done { color: var(--success); font-weight: 600; }

/* SiteFooter */
.dc-footer { background: var(--navy-900); color: var(--ink-inverse); padding: var(--space-12) var(--gutter); }
.dc-footer__inner { max-width: var(--container-max); margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--space-8); }
.dc-footer .dc-wordmark__name { color: var(--ink-inverse); }
.dc-footer .dc-wordmark__url { color: var(--surface-100); }
.dc-footer h4 { margin: 0 0 var(--space-2); font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--orange-500); }
.dc-footer a { color: var(--ink-inverse); }
.dc-footer p, .dc-footer li { font-size: 15px; line-height: 24px; margin: 0; }
.dc-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-1); }
.dc-footer .dc-lang { border-color: var(--surface-100); }
.dc-footer .dc-lang a { color: var(--surface-100); }
.dc-footer .dc-lang a[aria-current="true"] { background: var(--orange-500); color: var(--navy-900); }

@media (prefers-reduced-motion: reduce) { .dc-btn { transition: none; } }
