/*
Theme Name: BeePet Theme
Template: hello-elementor
Version: 1.0
*/
/* ===== BEE BLOG PRO ===== */

:root{
  --bee-primary:#f2cc0d;
  --bee-dark:#1c190d;
  --bee-text:#333;
  --bee-radius:20px;
}

body.single-post{
  background:#fcfbf8;
}

/* Container */
.bee-article{
  max-width:820px;
  margin:80px auto;
  padding:0 20px;
}

/* Title */
.bee-article h1{
  font-size:42px;
  line-height:1.3;
  font-weight:800;
  margin-bottom:20px;
}

/* Paragraph */
.bee-article p{
  font-size:18px;
  line-height:1.9;
  color:var(--bee-text);
  margin-bottom:22px;
}

/* Headings */
.bee-article h2{
  font-size:26px;
  margin-top:60px;
  border-left:5px solid var(--bee-primary);
  padding-left:15px;
}

.bee-article h3{
  font-size:22px;
  margin-top:40px;
}

/* Image hover effect */
.bee-article img{
  border-radius:var(--bee-radius);
  transition:.4s ease;
  box-shadow:0 10px 30px rgba(0,0,0,.08);
  margin:30px 0;
}

.bee-article img:hover{
  transform:translateY(-8px);
  box-shadow:0 25px 50px rgba(0,0,0,.15);
}

/* Author box */
.bee-author{
  margin-top:80px;
  padding:30px;
  border-radius:var(--bee-radius);
  background:#fff;
  box-shadow:0 10px 30px rgba(0,0,0,.05);
}

/* Progress bar */
#beeProgress{
  position:fixed;
  top:0;
  left:0;
  height:4px;
  width:0%;
  background:var(--bee-primary);
  z-index:9999;
  transition:.2s;
}

/* TOC */
.bee-toc{
  background:#fff8dc;
  padding:25px;
  border-radius:var(--bee-radius);
  margin:40px 0;
}

.bee-toc a{
  display:block;
  padding:6px 0;
  color:var(--bee-dark);
  text-decoration:none;
}

/* Related posts */
.bee-related{
  margin-top:80px;
}

.bee-related-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:25px;
}

.bee-card{
  background:#fff;
  border-radius:var(--bee-radius);
  overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.05);
  transition:.3s;
}

.bee-card:hover{
  transform:translateY(-6px);
}

.bee-card img{
  width:100%;
  height:180px;
  object-fit:cover;
}

.bee-card-content{
  padding:20px;
}

@media(max-width:768px){
  .bee-article h1{font-size:28px;}
  .bee-article p{font-size:16px;}
}