/* Theme Name: Cennetim Sohbet Teması
Theme URI: www.QBilisim.com
Author: QBilisim
Author URI: Geliştirici Web Sayfası
Description: Qbilisim.com tema "Cennetim" serisi.
Version: v1 */
*{
	box-sizing:border-box;
}

html, body{
	margin:0;
	padding:0;
	overflow-x:hidden;
}

body{
	background: linear-gradient(71deg, rgb(174 106 80), rgb(66 86 125), rgba(59, 130, 246, .85));
	position:relative;
	overflow: hidden;
}

/* GENEL RESİM AYARLARI */
img{
	max-width:100%;
	height:auto;
	display:block;
}

/* LOGO */
.logo {
	position: absolute;
	top: 21px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 5;
	width: min(50%, 721px);
	height: auto;
}

/* ARKAPLAN */
.arkaplan{
	display:block;
	position:relative;
	width:100%;
	height:auto;
	margin:0 auto;
	z-index:1;
}

/* ALTBAR */
.ustbar{
	display:block;
	position:relative;
	width:100%;
	height:auto;
	margin:0 auto;
	z-index:1;
}

/* USTBAR */
.altbar{
	display:block;
	position:relative;
	width:100%;
	height:auto;
	margin:0 auto;
	z-index:1;
}

/* SOHBET HERO */
.sohbet-hero{
	position: relative;
	z-index: 2;
	width: min(100% - 32px, 1100px);
	margin: -120px auto 40px auto;
	padding: 72px 48px 46px;
	overflow: hidden;
	border-radius: 24px;
	margin-top: -390px;
	margin-bottom: 18px;
}
/* dış çerçeve */
.sohbet-hero::before{
	content:"";
	position:absolute;
	inset:10px;
	border-radius:18px;
	border:1px solid rgba(120,70,15,.25);
	box-shadow:
	inset 0 0 0 1px rgba(255,255,255,.12),
	0 0 0 1px rgba(255,215,160,.03);
	pointer-events:none;
	z-index:1;
}

/* parlama */
.sohbet-hero::after{
	content:"";
	position:absolute;
	inset:-30%;
	background:linear-gradient(
		120deg,
		transparent 20%,
		rgba(255,255,255,.10) 35%,
		rgba(255,255,255,.22) 50%,
		transparent 65%
	);
	transform:translateX(-120%) rotate(8deg);
	animation:sohbetShine 6s linear infinite;
	pointer-events:none;
	z-index:0;
}

/* SVG arka dekor */
.sohbet-bg-svg{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	z-index:0;
	pointer-events:none;
	opacity:.55;
}

.sohbet-orb{
	position:absolute;
	border-radius:50%;
	filter:blur(2px);
	pointer-events:none;
	z-index:0;
}

.sohbet-orb-1{
	width:180px;
	height:180px;
	top:-40px;
	left:-40px;
	background:radial-gradient(circle, rgba(231,193,107,.22), transparent 70%);
	animation:floatOrb1 8s ease-in-out infinite;
}

.sohbet-orb-2{
	width:220px;
	height:220px;
	right:-70px;
	bottom:-70px;
	background:radial-gradient(circle, rgba(62,126,59,.18), transparent 70%);
	animation:floatOrb2 10s ease-in-out infinite;
}

.sohbet-top{
	position:absolute;
	left:50%;
	top:16px;
	transform:translateX(-50%);
	padding:6px;
	border-radius:999px;
	background:linear-gradient(180deg, #e7c16b, #a9782b);
	box-shadow:
	0 10px 22px rgba(0,0,0,.22),
	inset 0 1px 0 rgba(255,255,255,.35);
	z-index:3;
	animation:topFloat 3.5s ease-in-out infinite;
}

.sohbet-top button{
	border:0;
	background:transparent;
	padding:0;
	cursor:pointer;
}

.sohbet-top-inner{
	width:100%;
	font-size:30px;
	text-align:center;
	display:inline-block;
	padding:8px 24px;
	border-radius:999px;
	font-weight:700;
	letter-spacing:.2px;
	color:#f6f1da;
	text-shadow:0 1px 0 rgba(0, 0, 0, .35);
	background:linear-gradient(180deg, #3e7e3b 0%, #1f5a26 100%);
	border:1px solid rgba(0, 0, 0, .25);
	box-shadow:
	inset 0 1px 0 rgba(255, 255, 255, .18),
	inset 0 -2px 0 rgba(0, 0, 0, .25);
	position:relative;
	overflow:hidden;
}

.sohbet-top-inner::before,
.sohbet-top-inner::after{
	content:"";
	position:absolute;
	top:50%;
	width:18px;
	height:18px;
	transform:translateY(-50%) rotate(45deg);
	background:linear-gradient(180deg, #e7c16b, #a9782b);
	border-radius:3px;
	filter:drop-shadow(0 2px 3px rgba(0,0,0,.22));
}

.sohbet-top-inner::before{ left:-12px; }
.sohbet-top-inner::after{ right:-12px; }

.sohbet-top-inner .btn-shine{
	position:absolute;
	inset:0;
	background:linear-gradient(
		120deg,
		transparent 15%,
		rgba(255,255,255,.10) 35%,
		rgba(255,255,255,.30) 50%,
		transparent 70%
	);
	transform:translateX(-130%);
	animation:btnShine 3s linear infinite;
	pointer-events:none;
}

/* TITLE */
.sohbet-title{
	position:relative;
	z-index:2;
	margin:8px 0 18px;
	text-align:center;
	font-family:Georgia, "Times New Roman", serif;
	font-weight:700;
	font-size:clamp(20px, 2.4vw, 34px);
	line-height:1.15;
	color:#2f2418;
	text-shadow:0 1px 0 rgba(255,255,255,.35);
	padding-top:28px;
	animation:fadeUp .9s ease both;
}

.sohbet-features{
	position:relative;
	z-index:2;
	list-style:none;
	display:flex;
	gap:22px;
	justify-content:center;
	flex-wrap:wrap;
	margin:0 0 22px;
	padding:0;
	color:#3c2c1c;
	font-size:16px;
	font-family:Georgia, "Times New Roman", serif;
}

.sohbet-features li{
	position:relative;
	padding:12px 18px 12px 38px;
	opacity:.95;
	background:rgba(255,255,255,.28);
	border:1px solid rgba(169,120,43,.18);
	border-radius:999px;
	box-shadow:
	0 6px 14px rgba(0,0,0,.06),
	inset 0 1px 0 rgba(255,255,255,.22);
	animation:fadeUp .9s ease both;
}

.sohbet-features li:nth-child(1){ animation-delay:.10s; }
.sohbet-features li:nth-child(2){ animation-delay:.22s; }
.sohbet-features li:nth-child(3){ animation-delay:.34s; }

.sohbet-features li::before{
	content:"✓";
	position:absolute;
	left:14px;
	top:50%;
	transform:translateY(-50%);
	color:#1f5a26;
	font-weight:900;
	text-shadow:0 1px 0 rgba(255,255,255,.35);
}

.sohbet-cta{
	display:block;
	position:relative;
	z-index:2;
	width:fit-content;
	margin:0 auto;
	padding:12px 34px;
	border-radius:999px;
	text-decoration:none;
	font-weight:700;
	font-family:Georgia, "Times New Roman", serif;
	color:#f6f1da;
	text-shadow:0 1px 0 rgba(0,0,0,.35);
	background:linear-gradient(180deg, #3e7e3b 0%, #1f5a26 100%);
	border:1px solid rgba(0,0,0,.25);
	box-shadow:
	0 10px 22px rgba(0,0,0,.18),
	inset 0 1px 0 rgba(255,255,255,.18),
	inset 0 -2px 0 rgba(0,0,0,.25);
	overflow:hidden;
	animation:fadeUp 1s ease both .45s;
}

.sohbet-cta::before{
	content:"";
	position:absolute;
	inset:0;
	background:linear-gradient(
		120deg,
		transparent 18%,
		rgba(255,255,255,.10) 38%,
		rgba(255,255,255,.28) 50%,
		transparent 65%
	);
	transform:translateX(-120%);
	animation:btnShine 4s linear infinite;
}

.sohbet-cta:hover{
	filter:brightness(1.08);
	transform:translateY(-2px) scale(1.02);
}

.sohbet-cta:active{
	transform:translateY(1px) scale(.99);
}

/* küçük partiküller */
.sohbet-particles{
	position:absolute;
	inset:0;
	z-index:0;
	pointer-events:none;
}

.sohbet-particles span{
	position:absolute;
	display:block;
	width:8px;
	height:8px;
	border-radius:50%;
	background:radial-gradient(circle, rgba(231,193,107,.9), rgba(231,193,107,0));
	opacity:.45;
	animation:particleFloat linear infinite;
}

.sohbet-particles span:nth-child(1){ left:10%; top:82%; animation-duration:9s; animation-delay:0s; }
.sohbet-particles span:nth-child(2){ left:22%; top:75%; animation-duration:11s; animation-delay:1s; }
.sohbet-particles span:nth-child(3){ left:38%; top:88%; animation-duration:8s; animation-delay:2s; }
.sohbet-particles span:nth-child(4){ left:56%; top:78%; animation-duration:10s; animation-delay:1.5s; }
.sohbet-particles span:nth-child(5){ left:70%; top:84%; animation-duration:12s; animation-delay:.7s; }
.sohbet-particles span:nth-child(6){ left:84%; top:80%; animation-duration:9.5s; animation-delay:2.4s; }

@keyframes sohbetShine{
	0%{ transform:translateX(-120%) rotate(8deg); }
	100%{ transform:translateX(120%) rotate(8deg); }
}

@keyframes btnShine{
	0%{ transform:translateX(-130%); }
	100%{ transform:translateX(130%); }
}

@keyframes topFloat{
	0%,100%{ transform:translateX(-50%) translateY(0); }
	50%{ transform:translateX(-50%) translateY(-4px); }
}

@keyframes fadeUp{
	from{
		opacity:0;
		transform:translateY(18px);
	}
	to{
		opacity:1;
		transform:translateY(0);
	}
}

@keyframes floatOrb1{
	0%,100%{ transform:translate(0,0) scale(1); }
	50%{ transform:translate(18px,12px) scale(1.06); }
}

@keyframes floatOrb2{
	0%,100%{ transform:translate(0,0) scale(1); }
	50%{ transform:translate(-18px,-12px) scale(1.08); }
}

@keyframes particleFloat{
	0%{
		transform:translateY(0) scale(.8);
		opacity:0;
	}
	20%{ opacity:.45; }
	80%{ opacity:.35; }
	100%{
		transform:translateY(-180px) scale(1.25);
		opacity:0;
	}
}

.sohbet-line-1{
	stroke-dasharray:12 18;
	animation:dashMove 8s linear infinite;
}

.sohbet-line-2{
	stroke-dasharray:8 14;
	animation:dashMoveReverse 10s linear infinite;
}

@keyframes dashMove{
	from{ stroke-dashoffset:0; }
	to{ stroke-dashoffset:-220; }
}

@keyframes dashMoveReverse{
	from{ stroke-dashoffset:0; }
	to{ stroke-dashoffset:220; }
}
.blogbar {
	background: url(img/ustbar.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
	height: 852px;
	position: relative;
	top: 0px;

}
.blogbar .baslik {
	text-align: center;
	font-size: 40px;
	font-weight: bold;
	color: #fcdbb6;
	padding-top: 30px;

}
.col-blog {
	background: url(img/blog.png);
	background-size: 100% 100%;
	padding: 25px;
	text-align: center;
	flex: 0 0 auto;
	width: 31%;
	margin: 5px auto;
}
.col-blog img {
	width: 100%;
	height: 150px;
}
.col-blog a {
	color: black;
	text-decoration: none;
}
.col-blog h2 {
	font-size: 24px;
	font-weight: bold;
}
.col-blog button {
	background: linear-gradient(71deg, rgb(174 106 80), #cb8929, rgb(179 73 19));
	padding: 10px;
	border-radius: 20px;
	border: 5px solid #e5c1a2;
	font-weight: bold;
	color: white;

}
.col-blog button:hover {
	transform: scale(1.2);
	
}
.pageler {
	margin-top: 20px;
	padding: 17px;
	background: linear-gradient(71deg, rgb(174 106 80), #cb8929, rgb(179 73 19));
	border: 1px solid #e5c1a2;
	border-radius: 10px;
}
.pageler .page-numbers {
	background: var(--primary);;
	padding: 5px 10px;
	border-radius: 5px;
	color: white;
	text-decoration: none;
}
.pageler .page-numbers:hover {
	background: var(--primary);;
	color: #cb8929;
}
.pageler .current {
	background:white;
	color: var(--primary);
}
.makalebar {
	padding: 24px;
}
.makalebar h1 {
	font-size: 36px;
	font-weight: 900;
	color: var(--secondary);
	margin-bottom: 20px;
	line-height: 1.3;
}

.makalebar h2 {
	font-size: 28px;
	font-weight: 800;
	color: var(--primary);
	margin: 40px 0 20px;
	display: flex;
	align-items: center;
	gap: 12px;
}

.makalebar h3 {
	font-size: 22px;
	font-weight: 700;
	color: var(--secondary);
	margin: 30px 0 15px;
}

.makalebar h4 {
	font-size: 18px;
	font-weight: 600;
	color: var(--secondary);
	margin: 20px 0 10px;
}

.makalebar h5 {
	font-size: 16px;
	font-weight: 600;
	color: var(--primary);
	margin: 15px 0 8px;
}

.makalebar h6 {
	font-size: 14px;
	font-weight: 600;
	color: #666;
	margin: 10px 0 6px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

/* Paragraflar */
.makalebar p {
	font-size: 15px;
	line-height: 1.8;
	color: white;
	margin-bottom: 18px;
}

/* Listeler */
.makalebar ul,
.makalebar ol {
	margin: 15px 0 20px 40px;
	color: #444;
	font-size: 15px;
	line-height: 1.8;
}

.makalebar li {
	margin-bottom: 8px;
}

/* Bağlantılar */
.makalebar a {
	color: var(--primary);
	text-decoration: none;
	font-weight: 600;
	transition: color 0.2s ease;
}

.makalebar a:hover {
	color: var(--secondary);
	text-decoration: underline;
}

/* Alıntılar */
.makalebar blockquote {
	border-left: 5px solid var(--primary);
	padding-left: 20px;
	margin: 25px 0;
	font-style: italic;
	color: #444;
	background: #f9f9ff;
	border-radius: 8px;
}

/* Görseller */
.makalebar img {
	max-width: 100%;
	border-radius: 20px;
	margin: 25px 0;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

/* Tablolar */
.makalebar table {
	width: 100%;
	border-collapse: collapse;
	margin: 25px 0;
	font-size: 15px;
}

.makalebar th,
.makalebar td {
	padding: 12px 15px;
	border: 1px solid #ddd;
	text-align: left;
}

.makalebar th {
	background-color: var(--primary);
	color: white;
	font-weight: 700;
}

.makalebar tr:nth-child(even) {
	background-color: #f8f8f8;
}
.yorum{
	color: white;
	padding: 10px;
	border-radius: 10px;
	margin-top: 10px;
}
.yorum a{
	color: #C1FF72;
}
.yorum li{
	margin-bottom: 10px;
	padding: 10px;
	border: 1px solid #2F748E;
	list-style-type: none;
	border-radius: 5px
}
.yorum textarea{
	width: 100%;
	height: 100px;
	border-radius: 5px
}
.yorum input[type=text]{
	width: 100%;
	border-radius: 5px;
	background: #F3F5F9;
	border: none;
}
.yorum input[type=submit]{
	background: #101d25;
	color: #f7f9fa;
	border-radius: 10px;
	text-align: center;
	padding: 10px;
	border: none;
}
.yorum input[type=submit]:hover {
	background: #81cdb7;
	color: #2B3465;
}
.yorum .comment-form-url{
	display: none
}

.footer {
	position: relative;
	top: 245px;
}
.footer .hakkimizda {
	font-weight: bold;
	color: rgb(252 219 182);
	font-size: 20px;
	margin: 0;

}
.footer ul {
	display: flex;
	gap: 30px;
	list-style: none;
	padding: 0;
	margin: 0;
	font-size: 17px;
}
.footer ul li {
	margin: 5px auto;
}
.footer ul li a {
	text-decoration: none;
	color: rgb(252 219 182);
	font-weight: bold;
}

/* RESPONSIVE */
@media (max-width: 768px){
	.logo{
		width:min(75%, 300px);
		top:14px;
	}

	.sohbet-hero{
		margin:-50px auto 28px auto;
		padding:68px 20px 36px;
		border-radius:18px;
		margin-top: -490px;
	}
	.sohbet-top {
		top: 12px;
		width: 100%;
		text-align: center;
	}
	.sohbet-top-inner{
		font-size:22px;
		padding:8px 18px;
	}

	.sohbet-features{
		gap:12px;
		font-size:15px;
	}

	.sohbet-features li{
		width:100%;
		text-align:center;
		padding:12px 16px 12px 36px;
	}
	.ustbar {
		height: 514px;
	}
	.blogbar {
		overflow: hidden;
		height: 100%;
	}
	.col-blog {
		width: 92%;
		margin: 5px auto;
	}
	.footer {
		position: relative;
		top: 39px;
		height: 165px;
		text-align: center;
	}
	.footer .hakkimizda {
		font-size: 15px;
	}
	.footer ul {
		font-size: 13px;
	}
	.footer ul li {
		margin: 5px auto;
	}
	.footer .row div:nth-child(2){
		order: -1;
		gap: 30px;
	}
}