/**
Theme Name: Jiten Theme
Theme URI: 
Author: 
Author URI: 
Version: 2.0
**/

/* ===== RESET & BASE ===== */
*, *::before, *::after {
  margin: 0; padding: 0; outline: none;
  box-sizing: border-box; text-decoration: none;
}

body { background: #f0f4f8; font-family: 'Segoe UI', Arial, sans-serif; color: #1a1a2e; line-height: 1.6; }
li { list-style-type: none; }
.wrapper_all_body { width: 100%; background: #f0f4f8; min-height: 100vh; }
header { overflow: hidden; display: block; background: linear-gradient(135deg, #0f0c29, #302b63, #24243e); box-shadow: 0 4px 20px rgba(0,0,0,0.4); }

/* ===== NAV ===== */
nav { background: linear-gradient(135deg, #0f0c29, #302b63, #24243e); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; height: 70px; padding: 0 20px; box-shadow: 0 3px 15px rgba(0,0,0,0.3); }
nav ul { display: contents; }
nav .logo { color: #fff; font-size: 26px; font-weight: 700; letter-spacing: -0.5px; background: linear-gradient(90deg, #e0c3fc, #8ec5fc); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.logo a { background: linear-gradient(90deg, #e0c3fc, #8ec5fc); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
nav .nav-items { display: flex; }
nav .nav-items li { list-style: none; padding: 24px 15px; transition: background 0.2s; }
nav .nav-items li:hover { background: rgba(255,255,255,0.1); border-radius: 6px; }
nav .nav-items li a { color: #e0e0ff; font-size: 16px; font-weight: 500; }
nav form { display: flex; height: 40px; padding: 3px; background: rgba(255,255,255,0.1); min-width: 18% !important; border-radius: 25px; border: 1px solid rgba(255,255,255,0.2); }
nav form .search-data { width: 100%; height: 100%; padding: 0 12px; color: #fff; font-size: 15px; border: none; background: none; }
nav form button { padding: 0 16px; color: #fff; font-size: 15px; background: linear-gradient(135deg, #f093fb, #f5576c); border: none; border-radius: 22px; cursor: pointer; transition: opacity 0.2s; }
nav form button:hover { opacity: 0.85; }
nav .menu-icon, nav .cancel-icon, nav .search-icon { width: 40px; text-align: center; margin: 0 10px; font-size: 18px; color: #fff; cursor: pointer; display: none; }
nav .menu-icon span, nav .cancel-icon, nav .search-icon { display: none; }
nav .logo.space { color: red; padding: 0 5px 0 0; }

/* ===== CONTENT WRAPPER ===== */
.content_wrapper { margin: 0 auto; padding: 2em 1.5em; display: flex; flex-flow: row wrap; align-items: stretch; gap: 18px; }

/* ===== POST CARDS ===== */
.first_lavel { float: left; width: 32.1%; background: #fff; border: none; border-radius: 16px; box-shadow: 0 4px 20px rgba(0,0,0,0.08); margin: 0; overflow: hidden; transition: transform 0.25s ease, box-shadow 0.25s ease; }
.first_lavel:hover { transform: translateY(-5px); box-shadow: 0 12px 35px rgba(0,0,0,0.15); }
.colv1 { padding: 0; }
.first_lavel img { width: 100%; height: 210px; object-fit: cover; display: block; border: none; border-radius: 0; padding: 0; }
.first_lavel h2 { text-transform: capitalize; text-align: center; padding: 0.7em 1em; color: #1a1a2e; font-size: 20px; font-weight: 600; line-height: 1.3; }
.first_lavel h2:hover { color: #5b21b6; }
.first_lavel p { font-size: 15px; padding: 0 1em; color: #555; }
.first_lavel button { display: block; background: linear-gradient(135deg, #667eea, #764ba2); padding: 0.6em 1.5em; margin: 15px auto 18px; border-radius: 25px; color: white; border: none; font-size: 15px; cursor: pointer; transition: opacity 0.2s; }
.first_lavel button:hover { opacity: 0.85; }
.first_lavel button a { color: white; }

/* ===== HEADING ===== */
.heading_title { color: white; text-transform: capitalize; text-align: center; border-radius: 12px; font-size: 30px; background: linear-gradient(135deg, #1a1a2e, #16213e, #0f3460); margin-bottom: 22px; font-weight: 600; padding: 20px; box-shadow: 0 6px 25px rgba(0,0,0,0.25); letter-spacing: 0.5px; }

/* ===== SINGLE PAGE ===== */
.singlepage { width: 88%; margin: 30px auto; background: white; padding: 28px 40px 36px; border-radius: 18px; box-shadow: 0 6px 40px rgba(0,0,0,0.08); }
.colv2 h2 { text-align: center; margin-bottom: 20px; font-weight: 600; font-size: 26px; color: #fff; border: none; padding: 14px 20px; background: linear-gradient(135deg, #667eea, #764ba2); border-radius: 12px; box-shadow: 0 4px 15px rgba(102,126,234,0.4); }
.colv2 p { font-size: 18px; line-height: 1.7em; color: #333; margin-bottom: 14px; margin-top: 14px; }
.colv2 img { margin-left: auto; margin-right: auto; margin-bottom: 20px; height: 420px; width: 350px; display: block; border-radius: 12px; box-shadow: 0 8px 30px rgba(0,0,0,0.15); }

.document_title { color: #7c3aed; font-weight: 700; }
.document_title_2 { color: #2563eb; font-weight: 700; }

/* ===== BLOCKQUOTE — STAR STYLE ===== */
blockquote {
  background: linear-gradient(135deg, #a18cd1, #fbc2eb);
  border-radius: 18px;
  box-shadow: 0 6px 30px rgba(0,0,0,0.12), inset 0 1px 0 rgba(255,255,255,0.4);
  margin: 14px 0;
  padding: 32px 24px 22px;
  text-align: center;
  position: relative;
  overflow: hidden;
  border: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
blockquote::before {
  content: '\201C';
  font-size: 90px; font-family: Georgia, serif;
  color: rgba(255,255,255,0.35);
  position: absolute; top: -10px; left: 12px;
  line-height: 1; pointer-events: none;
}
blockquote::after {
  content: '\201D';
  font-size: 90px; font-family: Georgia, serif;
  color: rgba(255,255,255,0.35);
  position: absolute; bottom: -30px; right: 12px;
  line-height: 1; pointer-events: none;
}
blockquote:hover { transform: translateY(-3px); box-shadow: 0 12px 40px rgba(0,0,0,0.18); }
blockquote p { font-size: 20px; line-height: 1.6em; position: relative; letter-spacing: 0.03em; margin-bottom: 10px; color: #1a1a2e; font-weight: 500; z-index: 1; text-shadow: 0 1px 2px rgba(255,255,255,0.5); }
blockquote cite { font-weight: 600; font-size: 14px; color: rgba(26,26,46,0.75); display: block; margin-top: 8px; letter-spacing: 0.05em; text-transform: uppercase; }

/* ===== VERSE GRID ===== */
.mycontent { display: grid; grid-column-gap: 20px; grid-row-gap: 20px; grid-template-columns: repeat(3,1fr); margin-top: 24px; }

/* ===== RANDOM POSTS ===== */
.random_ul { display: grid; grid-column-gap: 20px; grid-row-gap: 20px; grid-template-columns: repeat(3,1fr); }
.random_li { background: linear-gradient(135deg, #f5f7ff, #e8ecff); padding: 12px; border: 1px solid #dde4ff; border-radius: 12px; text-align: center; transition: transform 0.2s, box-shadow 0.2s; }
.random_li:hover { transform: translateY(-3px); box-shadow: 0 8px 25px rgba(102,126,234,0.2); }
.random img { width: 100%; height: auto; display: block; margin-bottom: 10px; border-radius: 8px; }
.random_a { font-size: 17px; color: #1a1a2e; font-weight: 500; }
.random_a:hover { color: #667eea; }

/* ===== CATEGORY ===== */
.allcate { background: linear-gradient(135deg, #0f0c29, #302b63); padding: 14px 0; }
.allcate ul { width: 95%; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 8px; }
.allcate ul li { display: inline-block; }
.allcate ul li.current-cat a { background: #f5576c; border-color: #f5576c; color: #fff; }
.allcate ul li a { font-size: 15px; color: #e0e0ff; border: 1px solid rgba(255,255,255,0.2); padding: 5px 14px; border-radius: 20px; transition: background 0.2s; }
.allcate ul li a:hover { background: rgba(255,255,255,0.15); }
.total_category { width: 96%; border: none; margin: 16px auto; background: white; border-radius: 16px; box-shadow: 0 4px 20px rgba(0,0,0,0.07); overflow: hidden; }
.total_category h1 { text-align: center; background: linear-gradient(135deg, #667eea, #764ba2); color: #fff; padding: 16px; font-size: 26px; }
.total_category h1 span { color: #ffe066; }

/* ===== PAGINATION ===== */
.pagination_btn { display: inline-grid; text-align: center; font-size: 18px; margin-top: 12px; color: #667eea; background: none; }
.page_navi { margin-top: 24px; text-align: center; width: 100%; padding: 0 !important; }
.page_navi .page-numbers { display: inline-block; padding: 8px 14px; color: #667eea; border: 2px solid #dde4ff; margin: 0 4px; border-radius: 8px; font-size: 15px; transition: all 0.2s; background: white; }
.page_navi .page-numbers:hover { background: #f5f7ff; border-color: #667eea; }
.page_navi .page-numbers.current { background: linear-gradient(135deg, #667eea, #764ba2); color: #fff; border-color: transparent; }
.page_navi .prev, .page_navi .next { display: inline-block; padding: 8px 16px; color: #667eea; border: 2px solid #dde4ff; border-radius: 8px; margin: 0 6px; font-weight: 600; background: white; transition: all 0.2s; }
.page_navi .prev:hover, .page_navi .next:hover { background: #f5f7ff; border-color: #667eea; }
.page_navi .screen-reader-text { display: none; }
.nav-links{padding:20px;}

/* ===== FOOTER ===== */
footer { background: linear-gradient(135deg, #0f0c29, #302b63, #24243e); overflow: hidden; padding: 16px 0; box-shadow: 0 -4px 20px rgba(0,0,0,0.3); }
.footer_second_part { width: 92%; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; }
.footer_second_part_left p { color: rgba(255,255,255,0.7); font-size: 14px; }
.footer_second_part_right ul { display: flex; gap: 6px; }
.footer_second_part_right ul li { float: none; border: none; padding: 0; }
.footer_second_part_right ul li a { color: rgba(255,255,255,0.8); text-transform: capitalize; font-size: 14px; padding: 5px 12px; border-radius: 20px; border: 1px solid rgba(255,255,255,0.2); transition: background 0.2s; }
.footer_second_part_right ul li a:hover { background: rgba(255,255,255,0.12); color: #fff; }

/* ===== MOBILE NAV RESPONSIVE ===== */
@media (max-width: 1245px) { nav { padding: 0 30px; } }
@media (max-width: 1140px) {
  nav { padding: 0; }
  nav .logo { flex: 2; text-align: center; }
  nav .nav-items { position: fixed; z-index: 99; top: 70px; width: 100%; left: -100%; height: 100%; padding: 10px 50px 0; text-align: center; background: #0f0c29; display: inline-block; transition: left .3s ease; }
  nav .nav-items.active { left: 0; }
  nav .nav-items li { line-height: 40px; margin: 30px 0; }
  nav .nav-items li a { font-size: 20px; }
  nav form { position: absolute; top: 80px; right: 50px; opacity: 0; pointer-events: none; transition: top .3s ease, opacity .1s ease; }
  nav form.active { top: 95px; opacity: 1; pointer-events: auto; }
  nav .menu-icon { display: block; }
  nav .search-icon, nav .menu-icon span { display: block; }
  nav .menu-icon span.hide, nav .search-icon.hide { display: none; }
  nav .cancel-icon.show { display: block; }
}
@media (max-width: 980px) { nav .menu-icon, nav .cancel-icon, nav .search-icon { margin: 0 20px; } nav form { right: 30px; } }
@media (max-width: 350px) { nav .menu-icon, nav .cancel-icon, nav .search-icon { margin: 0 10px; font-size: 16px; } }