:root{
	--bg: #f6f7f8;          /* slate-900 */
	--card: #111827;        /* gray-900 */
	--muted: #43536a;       /* slate-400 */
	/*--muted: #94a3b8;       !* slate-400 *!*/
	--text: #e5e7eb;        /* gray-200 */
	--accent: #22c55e;      /* green-500 */
	--accent-2: #60a5fa;    /* blue-400 */
	--border: rgba(255,255,255,.08);
	--shadow: 0 10px 25px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html,body{margin:0;height:auto;background:radial-gradient(1200px 800px at 100% -10%, rgba(34,197,94,.12), transparent 60%),
radial-gradient(1000px 600px at -10% 110%, rgba(96,165,250,.12), transparent 60%),
var(--bg);color:var(--text);font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji"}
a{color:inherit}



/* Header */
.hero{max-width:1100px;margin:0 auto;padding:64px 24px 24px}
.brand{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:14px;letter-spacing:.08em;text-transform:uppercase}
.brand .dot{width:8px;height:8px;border-radius:999px;background:linear-gradient(135deg,var(--accent),var(--accent-2));box-shadow:0 0 0 4px rgba(34,197,94,.15)}
h1{margin:.4rem 0 0;font-size: clamp(28px, 4vw, 44px);line-height:1.1}
.subtitle{margin:10px 0 0;color:var(--muted);max-width:800px}

/* Toolbar */
.toolbar{max-width:1100px;margin:28px auto 0;padding:0 24px;display:flex;flex-wrap:wrap;gap:10px}
.tag{padding:8px 12px;border:1px solid var(--border);border-radius:999px;color:var(--muted);backdrop-filter: blur(6px)}
.cta{padding:10px 16px;border-radius:10px;border:1px solid var(--border);background:linear-gradient(135deg,rgba(34,197,94,.12), rgba(96,165,250,.12));
	color:var(--text);text-decoration:none;display:inline-flex;gap:10px;align-items:center}

/* Grid */
.grid{max-width:1100px;margin:32px auto;padding:0 24px;display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
.card{grid-column: span 12;background:rgba(17,24,39,.7);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);
	overflow:hidden;position:relative}
@media (min-width: 800px){ .card{grid-column: span 6;}}

.card-header{display:flex;align-items:flex-start;gap:14px;padding:18px 18px 0}
.badge{flex:0 0 auto;display:inline-grid;place-items:center;width:40px;height:40px;border-radius:12px;
	background:linear-gradient(135deg, rgba(34,197,94,.15), rgba(96,165,250,.15));
	border:1px solid var(--border);font-weight:700;color:#a7f3d0}
.qtitle{margin:6px 0 0;font-size:18px}
.qmeta{margin:0;color:var(--muted);font-size:12px}

.card-body{padding:14px 18px 20px}
.list{margin:8px 0 0;padding:0 0 0 18px}
.list li{margin:6px 0}

.divider{height:1px;background:linear-gradient(90deg,transparent, var(--border), transparent);margin:12px 0}
.hint{color:var(--muted);font-size:12px}

footer{max-width:1100px;margin:40px auto 0;padding:0 24px 20px 24px;color:var(--muted);display:flex;justify-content:space-between;gap:12px}
.site{color: #ff0000
}

/* Print */
@media print{
	body{background:white;color:black}
	.card{break-inside:avoid;box-shadow:none;border-color:#ddd;background:white}
	.cta{display:none}
	.brand,.subtitle,.toolbar,footer{color:black}
	.badge{color:black;border-color:#bbb}
	.site{color:black}
}

@media only screen and (max-width: 600px) {
	#printButton{
		display: none;
	}
}

/*body, input, textarea, select, button {*/
/*	font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;*/
/*}*/

body {
	font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
}
/* qa button*/

:root{
	--brand:#0E2A47; --hint:#6B7280;
	--ok:#10B981; --err:#EF4444;
}

/* -------- Buttons -------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 14px;min-width:96px;
	border:1px solid transparent;border-radius:10px;box-sizing:border-box;font:600 14px/1 system-ui,-apple-system,Segoe UI,Roboto,Arial;cursor:pointer;
	transition:background .15s,border-color .15s,color .15s,opacity .15s;}
.btn--primary{background:var(--brand);color:#fff}.btn--primary:hover{opacity:.92}
.btn--outline{background:#fff;color:var(--brand);border-color:var(--brand)}.btn--outline:hover{background:rgba(14,42,71,.06)}
.btn--icon{width:40px;min-width:40px;padding:0}

/* -------- Inputs -------- */
.input,.textarea{width:100%;padding:10px 12px;border:1px solid var(--muted);border-radius:10px;background:#fff;color:var(--brand);
	box-sizing:border-box;font:500 14px/1.4 system-ui,-apple-system,Segoe UI,Roboto,Arial}
.input:focus,.textarea:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 4px rgba(14,42,71,.12)}
.label{font:600 12px/1.2 system-ui; color:var(--hint); margin-bottom:6px; display:block}

/* -------- Modal (isim çakışmasın diye qa-*) -------- */
.qa-modal-backdrop{
	position:fixed; inset:0; display:none; background:rgba(0,0,0,.35);
	z-index: 9999; /* yüksek tut */
	align-items:center; justify-content:center; padding:16px;
}
.qa-modal{
	width:100%; max-width:560px; background:#fff; border-radius:16px;
	box-shadow:0 12px 30px rgba(0,0,0,.25); overflow:hidden; display:block; /* force show */
}
.qa-modal-head{
	display:flex; align-items:center; justify-content:space-between;
	padding:12px 14px; border-bottom:1px solid #eee; font-weight:700; color:var(--brand);
}
.qa-modal-body{ padding:14px; }
.qa-modal-actions{ display:flex; gap:8px; justify-content:flex-end; margin-top:10px; }
.qa-modal-close{ width:36px; height:36px; border:1px solid #eee; border-radius:10px; background:#fff; cursor:pointer; }

.note-ok{ color:#065F46; }
.note-err{ color:#B91C1C; }

/* qa button bitiş*/

 #backToTop {
	 position: fixed;
	 bottom: 20px;
	 right: 20px;
	 background: #0e2a47;
	 color: #fff;
	 border: none;
	 padding: 12px 14px;
	 border-radius: 50%;
	 cursor: pointer;
	 font-size: 18px;
	 box-shadow: 0 2px 6px rgba(0,0,0,0.3);
	 display: none; /* Başlangıçta gizli */
	 z-index: 9999;
	 transition: background 0.2s ease;
 }
#backToTop:hover {
	background: #ff7a00;
}
 .card-body ul{
	 padding: 0 20px;
 }
/* Başlangıçta gövde kapalı */
.card .card-body {
	max-height: 0;
	overflow: hidden;
	transition: max-height 220ms ease, opacity 200ms ease;
	opacity: 0;
}

/* Açık kart */
.card.is-open .card-body {
	max-height: 1000px; /* içeriğinize göre yeterince büyük bir değer */
	opacity: 1;
}

/* İmleç ve ufak etkileşim */
.card .card-header { cursor: pointer; user-select: none; }

/* İsteğe bağlı: başlığa ok simgesi */
.card .card-header::after {
	content: "▸";
	float: right;
	transition: transform 200ms ease;
	opacity: .6;
}
.card.is-open .card-header::after { transform: rotate(90deg); opacity: 1; }

	 /* Toolbar stilleri */
 .toolbar {
	 display: flex;
	 justify-content: space-between;
	 flex-wrap: wrap;
	 gap: 0.5rem;
	 align-items: center;
	 margin-bottom: 1rem;
 }
.tag {
	background: #eee;
	padding: 0.4rem 0.8rem;
	border-radius: 6px;
}
.cta {
	background: #0e2a47;
	color: #fff;
	padding: 0.4rem 0.8rem;
	border-radius: 6px;
	text-decoration: none;
	font-size: 0.9rem;
}
.cta:hover {
	background: #ff7a00;
}
button.cta { border: none; cursor: pointer; }

.text-gray-600{

	color: oklch(44.6% 0.03 256.802);
}

 .qa-search-input{
	 margin-bottom: 10px;
	 padding: 6px 12px;
	 font-size: 16px;
	 font-weight: 400;
	 line-height: 1.5;
	 color: #212529;
	 background-color: #fff;
	 background-clip: padding-box;
	 border: 1px solid #ced4da;
	 appearance: none;
	 border-radius: 4px;
	 transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
	 :focus{
		 color: #212529;
		 background-color: #fff;
		 border-color: #86b7fe;
		 outline: 0;
		 box-shadow: 0 0 0 0.25rem rgb(13 110 253 / 25%);
	 }
 }