/*
Theme Name: Cafepezeshki
Author: Vaxi.ir
Version: 1.1
Text Domain: Cafepezeshki
*/

@font-face {
  font-family: 'IRANSans';
  src: url('font/IRANSansWeb.eot');
  src: url('font/IRANSansWeb.eot?#iefix') format('embedded-opentype'),
       url('font/IRANSansWeb.woff2') format('woff2'),
       url('font/IRANSansWeb.woff') format('woff'),
       url('font/IRANSansWeb.ttf') format('truetype');
  font-weight: 400;
}

@font-face {
  font-family: 'IRANSans';
  src: url('font/IRANSansWeb_Bold.eot');
  src: url('font/IRANSansWeb_Bold.eot?#iefix') format('embedded-opentype'),
       url('font/IRANSansWeb_Bold.woff2') format('woff2'),
       url('font/IRANSansWeb_Bold.woff') format('woff'),
       url('font/IRANSansWeb_Bold.ttf') format('truetype');
  font-weight: 700;
}

/* =========================
   PEYDA FONT
========================= */

@font-face {
  font-family: 'Peyda';
  src: url('font/PeydaWebFaNum-Regular.woff2') format('woff2'),
       url('font/PeydaWebFaNum-Regular.woff') format('woff'),
       url('font/PeydaFaNum-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Peyda';
  src: url('font/PeydaWebFaNum-Bold.woff2') format('woff2'),
       url('font/PeydaWebFaNum-Bold.woff') format('woff'),
       url('font/PeydaFaNum-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root{
  --primary:#0f766e;
  --primary-dark:#115e59;
  --primary-light:#ccfbf1;

  --bg:#f4f8f7;
  --card:#ffffff;

  --text:#1f2937;
  --muted:#6b7280;

  --line:#dbe7e5;

  --shadow:0 14px 35px rgba(15,118,110,.12);
  --shadow-soft:0 8px 22px rgba(15,118,110,.08);

  --radius-xl:32px;
  --radius-lg:24px;
  --radius-md:18px;
}

*{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  background:linear-gradient(
    180deg,
    #f8fbfb 0%,
    #f1f7f6 100%
  );
  color:var(--text);
  direction:rtl;
  text-align:right;
  font-family:'IRANSans',system-ui,sans-serif;
  line-height:2;
  overflow-x:hidden;
}

img{
  max-width:100%;
  height:auto;
  display:block;
}

a{
  text-decoration:none;
  transition:.25s ease;
}

button,
input,
textarea{
  font:inherit;
}

.container{
  width:min(100%,1240px);
  margin:0 auto;
  padding-inline:22px;
}


/* =========================
   HEADER - MODERN MEDICAL STYLE
========================= */

.site-header {
  position: sticky;
  top: 0;
  z-index: 999;

  padding: 14px 0;

  background: rgba(255,255,255,.85);
  backdrop-filter: blur(14px);

  border-bottom: 1px solid #e6f2ef;

  box-shadow: 0 8px 25px rgba(15,118,110,.06);
}

/* =========================
   LAYOUT CONTROL
   LOGO RIGHT / MENU LEFT
========================= */

.header-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;

  direction: rtl;
}

/* =========================
   LOGO (RIGHT SIDE)
========================= */

.logo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.logo-image {
  height: 58px;
  width: auto;

  transition: .25s ease;
}

.logo:hover .logo-image {
  transform: scale(1.03);
}

/* =========================
   DESKTOP MENU (LEFT SIDE CENTERED)
========================= */

.desktop-menu {
  flex: 1;

  display: flex;
  justify-content: flex-start; /* مهم: سمت چپ */

  margin-right: 30px;
}

/* NAV LIST */
.desktop-nav {
  display: flex;
  align-items: center;

  gap: 26px;

  list-style: none;
  margin: 0;
  padding: 0;

  direction: rtl; /* متن فارسی درست */
}

/* ITEMS */
.desktop-nav li {
  margin: 0;
}

/* LINKS */
.desktop-nav a {
  position: relative;

  color: #1f2937;
  font-size: 15px;
  font-weight: 700;

  text-decoration: none;

  padding: 8px 0;

  transition: .25s ease;
}

/* hover color */
.desktop-nav a:hover {
  color: #0f766e;
}

/* underline animation */
.desktop-nav a::after {
  content: "";

  position: absolute;
  bottom: -6px;
  right: 0;

  width: 0;
  height: 3px;

  background: linear-gradient(90deg, #0f766e, #10b981);
  border-radius: 99px;

  transition: .25s ease;
}

.desktop-nav a:hover::after {
  width: 100%;
}

/* =========================
   ACTIONS
========================= */

.header-actions{
  display:flex;
  align-items:center;
  gap:12px;
  direction:rtl;
}

.header-auth-link{
  height:42px;
  padding:0 18px;
  border-radius:12px;
  background:#ecfdf5;
  color:var(--primary);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
  font-weight:700;
}

.header-auth-link:hover{
  background:var(--primary);
  color:#fff;
}

.header-auth-sep{
  display:none;
}


/* =========================
   MOBILE BUTTON
========================= */

.menu-btn{
  width:48px;
  height:48px;
  border:none;
  background:#ecfdf5;
  border-radius:14px;
  padding:0;
  display:grid;
  align-content:center;
  justify-items:center;
  gap:5px;
  cursor:pointer;
}

.menu-btn span{
  width:24px;
  height:3px;
  border-radius:99px;
  background:var(--primary);
}

.menu-btn span:nth-child(2){
  width:18px;
}


/* =========================
   MOBILE MENU
========================= */

.mobile-menu{
  position:fixed;
  top:0;
  right:-320px;
  width:290px;
  height:100vh;
  background:#0f766e;
  z-index:99999;
  transition:.35s ease;
  padding:100px 24px 40px;
  overflow-y:auto;
  box-shadow:-15px 0 40px rgba(0,0,0,.18);
}

.mobile-menu.active{
  right:0;
}

.mobile-nav{
  list-style:none;
  margin:0;
  padding:0;
  text-align:right;
}

.mobile-nav li{
  margin-bottom:14px;
}

.mobile-nav a{
  color:#fff !important;
  font-size:16px;
  font-weight:700;
  display:block;
  padding:10px 0;
}


/* =========================
   OVERLAY
========================= */

.menu-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.45);
  opacity:0;
  visibility:hidden;
  transition:.3s ease;
  z-index:99990;
}

.menu-overlay.active{
  opacity:1;
  visibility:visible;
}

body.menu-open{
  overflow:hidden;
}


/* =========================
   RESPONSIVE
========================= */

@media(min-width:768px){

  .menu-btn,
  .mobile-menu,
  .menu-overlay{
    display:none !important;
  }

}

@media(max-width:767px){

  .desktop-menu,
  .header-actions{
    display:none;
  }

  .site-header{
    padding:14px 0;
  }

  .logo-image{
    height:52px;
  }

  .container{
    padding-inline:16px;
  }

}


.hero{
  position:relative;
  overflow:hidden;

  background:
  linear-gradient(
  135deg,
  #0f766e 0%,
  #14b8a6 100%
  );

  border-radius:32px;

  padding:60px;

  min-height:280px;

  display:flex;
  align-items:center;

  box-shadow:
  0 25px 60px rgba(15,118,110,.18);
}

.hero::before{
  content:"";
  position:absolute;
  width:420px;
  height:420px;
  border-radius:50%;
  background:rgba(255,255,255,.08);
  left:-120px;
  top:-120px;
}

.hero::after{
  content:"";
  position:absolute;
  width:280px;
  height:280px;
  border-radius:50%;
  background:rgba(255,255,255,.06);
  right:-80px;
  bottom:-80px;
}

.hero-inner{
  position:relative;
  z-index:2;
  max-width:760px;
  color:#fff;
}

.hero h1{
  margin:0 0 18px;
  font-size:44px;
  line-height:1.4;
  font-weight:800;
  font-family:'Peyda',sans-serif;
}

.hero p{
  margin:0;
  font-size:18px;
  line-height:2.2;
  color:rgba(255,255,255,.95);
}


/* =========================
   FEATURED POST
========================= */

.featured-card{
  margin-top:34px;

  background:#fff;

  border:none;

  border-radius:28px;

  padding:26px;

  box-shadow:
  0 20px 50px rgba(15,118,110,.08);
}

.featured-grid{
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:30px;
  align-items:center;
  direction:ltr;
}

.featured-image{
  min-height:320px;
  border-radius:24px;
  overflow:hidden;
  background:#e5f7f4;
}

.featured-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:.4s ease;
}

.featured-card:hover .featured-image img{
  transform:scale(1.04);
}

.featured-info{
  direction:rtl;
  text-align:right;
}

.featured-badge{
  display:inline-flex;
  align-items:center;

  background:#ecfdf5;

  color:#0f766e;

  padding:8px 16px;

  border-radius:999px;

  font-size:13px;

  font-weight:700;

  margin-bottom:18px;
}

.featured-title{
  margin:0 0 18px;

  font-size:34px;

  line-height:1.8;

  font-family:'Peyda';

  font-weight:800;

  color:#111827;
}

.featured-title a{
  color:inherit;
}

.featured-excerpt{
  margin:0;

  color:#6b7280;

  font-size:15px;

  line-height:2.3;
}

.featured-meta{
  display:flex;

  flex-wrap:wrap;

  gap:12px;

  margin-top:24px;

  color:#94a3b8;

  font-size:13px;

  justify-content:flex-start;
}

.featured-actions{
  margin-top:26px;
}

.read-more-btn{
  display:inline-flex;

  align-items:center;

  gap:10px;

  height:50px;

  padding:0 22px;

  border-radius:14px;

  background:#0f766e;

  color:#fff;

  font-weight:700;

  box-shadow:
  0 10px 25px rgba(15,118,110,.25);
}

.read-more-btn:hover{
  transform:translateY(-3px);
}

.read-more-btn .arrow{
  font-size:20px;
}


/* =========================
   POSTS GRID
========================= */

.list-card{
  width:100%;

  margin-top:40px;

  display:grid;

  grid-template-columns:repeat(3,minmax(0,1fr));

  gap:26px;
}

.post-card{
  background:#fff;

  border:none;

  border-radius:24px;

  overflow:hidden;

  padding:14px;

  transition:.3s ease;

  box-shadow:
  0 12px 30px rgba(15,118,110,.06);
}

.post-card:hover{
  transform:translateY(-8px);

  box-shadow:
  0 20px 50px rgba(15,118,110,.12);
}

.post-thumb{
  height:220px;

  border-radius:18px;

  overflow:hidden;

  background:#e5f7f4;
}

.post-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:.4s ease;
}

.post-card:hover .post-thumb img{
  transform:scale(1.05);
}

.thumb-placeholder{
  width:100%;
  height:100%;
  background:#d1fae5;
}

.post-date{
  position:absolute;

  top:12px;
  right:12px;

  background:rgba(15,118,110,.9);

  color:#fff;

  padding:4px 10px;

  border-radius:999px;

  font-size:12px;

  font-weight:700;
}

.post-content{
  padding:22px 8px 8px;
  text-align:right;
}



/* =========================================================
   TITLE
========================================================= */

.post-title{

    margin:0 0 12px;

    font-size:22px;

    line-height:1.9;

    font-weight:700;

    font-family:'Peyda';
}

.post-title a{

    color:#2f3240;

    text-decoration:none;

    transition:.2s ease;
}

.post-title a:hover{

    color:#1f2454;
}


/* =========================================================
   EXCERPT
========================================================= */

.post-excerpt{

    margin:0 0 20px;

    color:#8f93a0;

    font-size:14px;

    line-height:2.2;

    font-weight:700;
}


/* =========================================================
   BUTTON
========================================================= */

.post-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    min-width:130px;

    height:42px;

    padding:0 20px;

    border-radius:12px;

    background:#1f2454;

    color:#fff;

    font-size:14px;

    font-weight:700;

    transition:.25s ease;

    text-decoration:none;

    gap:8px;
}

.post-btn::before{

    content:"‹";

    font-size:18px;

    line-height:1;
}

.post-btn:hover{

    background:#15193f;

    transform:translateY(-2px);
}


/* =========================================================
   TABLET
========================================================= */

@media(max-width:991px){

    .list-card{

        grid-template-columns:repeat(2,1fr);

        gap:18px;
    }

    .post-thumb{

        height:180px;
    }

    .post-title{

        font-size:20px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:767px){

    .list-card{

        grid-template-columns:1fr;

        gap:18px;
    }

    .post-card{

        border-radius:18px;

        padding:12px;
    }

    .post-thumb{

        height:220px;

        border-radius:14px;
    }

    .post-content{

        padding:16px 6px 6px;
    }

    .post-title{

        font-size:18px;

        line-height:1.8;
    }

    .post-excerpt{

        font-size:13px;

        line-height:2;
    }

    .post-btn{

        width:100%;

        height:44px;
    }
}
@media(max-width:991px){

    .list-card{

        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:767px){

    .list-card{

        grid-template-columns:1fr;
    }
}
/* =========================
   ARCHIVE
========================= */

.archive-hero {
  margin-bottom: 28px;
}

.archive-pagination {
  padding: 30px 20px;
}

.archive-pagination .page-numbers {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 0;
  padding: 0;
}

.archive-pagination a,
.archive-pagination span {
  min-width: 42px;
  height: 42px;
  padding: 0 14px;
  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 12px;
  border: 1px solid rgba(23, 30, 67, 0.08);
  background: #fff;

  color: var(--navy);
  font-weight: 700;
  text-decoration: none;
}

.archive-pagination .current {
  background: var(--navy);
  color: #fff;
}

.empty-posts {
  padding: 60px 20px;
  text-align: center;
}

.empty-posts h2 {
  margin: 0 0 12px;
  color: #35363f;
}

.empty-posts p {
  margin: 0;
  color: #9a9ba5;
}


/* =========================
   404 PAGE
========================= */

.not-found-page {
  padding: 80px 0;
}

.not-found-inner {
  padding: 60px 30px;
  text-align: center;

  background: #fff;
  border-radius: 28px;
  border: 1px solid rgba(23, 30, 67, 0.08);
  box-shadow: var(--shadow-soft);
}

.not-found-code {
  margin-bottom: 20px;

  font-size: 120px;
  font-weight: 700;
  line-height: 1;

  color: var(--navy);
}

.not-found-inner h1 {
  margin: 0 0 16px;
  font-size: 34px;
  color: #35363f;
}

.not-found-inner p {
  margin: 0;
  font-size: 16px;
  line-height: 2;
  color: #9a9ba5;
}

.not-found-actions {
  margin-top: 28px;
}

.home-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-width: 220px;
  height: 54px;
  padding: 0 24px;

  border-radius: 16px;
  background: var(--navy);
  color: #fff;

  font-weight: 700;
}


/* =========================
   SEARCH FORM
========================= */

.search-form {
  display: flex;
  align-items: center;
  gap: 10px;
}

.search-field {
  width: 100%;
  height: 52px;

  padding: 0 18px;

  border-radius: 16px;
  border: 1px solid rgba(23, 30, 67, 0.1);

  background: #fff;
  outline: none;

  font-family: inherit;
}

.search-submit {
  min-width: 120px;
  height: 52px;

  border: 0;
  border-radius: 16px;

  background: var(--navy);
  color: #fff;

  font-weight: 700;
  font-family: inherit;

  cursor: pointer;
}


/* =========================
   MOBILE
========================= */

@media (max-width: 767px) {

  .not-found-page {
    padding: 60px 0;
  }

  .not-found-inner {
    padding: 40px 20px;
  }

  .not-found-code {
    font-size: 84px;
  }

  .not-found-inner h1 {
    font-size: 24px;
  }

  .search-form {
    flex-direction: column;
    align-items: stretch;
  }

  .search-submit {
    width: 100%;
  }
}


/* =========================
   BREADCRUMB
========================= */

.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;

  margin-bottom: 20px;

  font-size: 14px;
  font-weight: 700;
  color: #9a9ca8;
}

.breadcrumb a {
  color: var(--navy);
}

.breadcrumb .current {
  color: #9a9ca8;
}


/* =========================
   SINGLE TAGS
========================= */

.single-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 30px;
}

.single-tags a {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  height: 42px;
  padding: 0 18px;

  border-radius: 999px;
  background: #f3f4f8;

  font-size: 14px;
  font-weight: 700;
  color: var(--navy);
}


/* =========================
   SHARE
========================= */

.share-box {
  margin-top: 30px;
  padding-top: 24px;

  border-top: 1px solid var(--line);
}

.share-title {
  display: block;
  margin-bottom: 14px;

  font-weight: 700;
  color: #35363f;
}

/* =========================
   SHARE LINKS (FIX + MEDICAL STYLE)
========================= */

.share-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 12px;
}

/* دکمه‌های واضح و کارت‌مانند */
.share-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-width: 130px;
  height: 46px;

  padding: 0 16px;

  border-radius: 14px;

  background: #ecfdf5;            /* سبز خیلی روشن */
  border: 1px solid #cdebe3;      /* خط مشخص */

  color: #0f766e;                /* متن سبز پزشکی */
  font-weight: 800;
  font-size: 14px;

  text-decoration: none;

  box-shadow: 0 8px 20px rgba(15,118,110,.08);

  transition: .25s ease;
}

/* hover حرفه‌ای */
.share-links a:hover {
  background: #d1fae5;
  border-color: #10b981;
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(15,118,110,.15);
}

/* موبایل */
@media (max-width: 767px) {
  .share-links a {
    min-width: 48%;
    height: 44px;
    font-size: 13px;
  }
}

/* =========================
   AUTHOR
========================= */

.author-box {
  display: flex;
  align-items: center;
  gap: 18px;

  margin-top: 34px;
  padding: 24px;

  border-radius: 24px;
  background: #f7f8fc;
}

.author-avatar img {
  border-radius: 50%;
}

.author-content h3 {
  margin: 0 0 8px;
  color: #35363f;
}

.author-content p {
  margin: 0;
  color: #8f93a0;
  line-height: 2;
}


/* =========================
   RELATED POSTS
========================= */

.related-posts {
  margin-top: 40px;
}

.related-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.related-item {
  overflow: hidden;

  background: #fff;
  border-radius: 22px;
  border: 1px solid rgba(23, 30, 67, 0.08);

  box-shadow: var(--shadow-soft);
}

.related-thumb {
  display: block;
  height: 220px;
  overflow: hidden;
}

.related-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.related-content {
  padding: 18px;
}

.related-content h3 {
  margin: 0 0 10px;

  font-size: 18px;
  line-height: 1.7;
}

.related-content h3 a {
  color: #35363f;
}

.related-content p {
  margin: 0;

  font-size: 14px;
  line-height: 2;
  color: #9a9ca8;
}

/* =========================
   MOBILE GENERAL
========================= */

@media (max-width: 767px) {

  .author-box {
    flex-direction: column;
    text-align: center;
  }

  .related-grid {
    grid-template-columns: 1fr;
  }

  .related-thumb {
    height: 200px;
  }


  /* =========================
     MOBILE LIST ITEM
  ========================= */

  .list-item {
    display: grid;
    grid-template-columns: 95px 1fr 18px;
    align-items: flex-start;
    gap: 12px;

    padding: 14px;
    min-height: auto;
  }

  .item-thumb {
    width: 95px;
    height: 95px;

    border-radius: 14px;
    overflow: hidden;
    flex-shrink: 0;
  }

  .item-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 14px;
  }

  .item-content {
    width: 100%;
    min-width: 0;
    overflow: hidden;
  }

  .item-title {
    margin: 0 0 6px;

    font-size: 15px;
    font-weight: 700;
    line-height: 1.9;
  }

  .item-title a {
    display: block;
    color: #35363f;
  }

  .item-excerpt {
    display: none;
  }

  .item-date {
    font-size: 11px;
    margin-bottom: 6px;
  }

  .item-arrow {
    width: 18px;
    height: 18px;

    font-size: 20px;

    align-self: center;
    justify-content: flex-end;

    transform: none;
  }


  /* =========================
     PAGE (MOBILE ADJUSTMENTS)
  ========================= */

  .page-content {
    font-size: 15px;
    line-height: 2.15;
  }

  .page-content blockquote {
    padding: 18px;
  }
}


/* =========================
   PAGE (DESKTOP BASE)
========================= */

.page-wrap {
  margin-top: 28px;
}

.page-title {
  margin-bottom: 24px;
}

.page-thumb {
  margin-bottom: 28px;
}

.page-content {
  font-size: 16px;
  line-height: 2.3;
  color: #3b3d45;
}

.page-content h2,
.page-content h3,
.page-content h4 {
  margin: 34px 0 14px;

  color: var(--navy);
  font-weight: 700;
  line-height: 1.6;
}

.page-content p {
  margin: 0 0 22px;
}

.page-content ul,
.page-content ol {
  margin-bottom: 22px;
  padding-right: 24px;
}

.page-content li {
  margin-bottom: 10px;
}

.page-content img {
  margin: 26px auto;
  border-radius: 20px;
}

.page-content blockquote {
  margin: 28px 0;
  padding: 24px;

  border-radius: 22px;
  border-right: 4px solid var(--navy);

  background: #f6f7fb;
  color: #444;
  line-height: 2.2;
}

.page-content a {
  color: var(--navy);
  text-decoration: underline;
}

/* =========================
   TABLES
========================= */

.page-content table {
  width: 100%;
  margin: 30px 0;

  border-collapse: collapse;
  border-radius: 18px;
  overflow: hidden;
}

.page-content th {
  padding: 14px;
  background: var(--navy);
  color: #fff;
}

.page-content td {
  padding: 14px;
  border: 1px solid #eceef5;
}


/* =========================
   PAGE TYPOGRAPHY (MOBILE ADJUST)
========================= */

@media (max-width: 767px) {

  .page-content {
    font-size: 15px;
    line-height: 2.15;
  }

  .page-content blockquote {
    padding: 18px;
  }
}


/* =========================
   CATEGORIES / CHIPS
========================= */

.categories {
  margin-top: 28px;
}

.section-head {
  display: flex;
  align-items: center;
  justify-content: flex-start;

  gap: 10px;
  margin-bottom: 16px;

  color: var(--navy);
  direction: rtl;
}

.section-head h2 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
}

.section-icon {
  font-size: 20px;
  opacity: .9;
}

.chips {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.chips a,
.chips button {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-width: 96px;
  height: 46px;
  padding: 0 18px;

  border-radius: 999px;
  border: 1px solid rgba(23, 30, 67, .08);

  background: #fff;
  color: var(--navy-2);

  font-size: 16px;
  font-weight: 700;

  box-shadow: var(--shadow-soft);
}



/* =========================
   SINGLE POST
========================= */

.single-wrap {
  margin-top: 28px;
  padding: 26px;

  background: #fff;
  border-radius: 28px;
  border: 1px solid rgba(23, 30, 67, .08);

  box-shadow: var(--shadow-soft);
}

.single-title {
  margin: 16px 0 10px;

  font-size: 34px;
  font-weight: 700;
  line-height: 1.55;

  color: #35363f;
}

.single-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;

  margin-bottom: 20px;

  font-size: 14px;
  font-weight: 700;
  color: #9a9ca8;
}

.single-thumb img {
  width: 100%;
  border-radius: 18px;
  margin-bottom: 22px;
}

.single-content {
  font-size: 16px;
  line-height: 2.2;
  color: #3a3b43;
}

.single-content h2,
.single-content h3,
.single-content h4 {
  margin: 28px 0 12px;
  color: var(--navy);
  line-height: 1.5;
}

.single-content p {
  margin: 0 0 18px;
}

.single-content ul,
.single-content ol {
  padding-right: 22px;
}

.single-content a {
  color: var(--navy);
  text-decoration: underline;
}


/* =========================
   FEATURED / RESPONSIVE FIXES
========================= */

@media (max-width: 991px) {

  .container {
    padding-inline: 16px;
  }

  .featured-grid {
    grid-template-columns: 1fr 1.1fr;
    gap: 18px;
    direction: ltr;
  }

  .featured-image {
    min-height: 260px;
  }

  .featured-title {
    font-size: 24px;
  }
}


/* =========================
   MOBILE MASTER
========================= */

@media (max-width: 767px) {

  .hero {
    min-height: 162px;
    padding: 24px 22px;
    border-radius: 22px;
  }

  .hero h1 {
    font-size: 30px;
  }

  .featured-card,
  .list-card,
  .single-wrap {
    border-radius: 22px;
  }

  .featured-card {
    padding: 18px;
    margin-top: 20px;
  }

  .featured-image {
    min-height: 220px;
  }

  .featured-title {
    font-size: 20px;
  }

  .chips a,
  .chips button {
    min-width: 88px;
    height: 44px;
    font-size: 15px;
  }

  .footer-card {
    padding: 24px 18px 16px;
    border-radius: 22px;
  }

  .footer-top {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .footer-links {
    border-right: 0;
    border-top: 1px solid rgba(255,255,255,.35);
    padding: 16px 0 0;
  }

  .single-wrap {
    padding: 20px 16px;
  }

  .single-title {
    font-size: 26px;
  }

  .single-content {
    font-size: 15px;
    line-height: 2.15;
  }
}

/* =========================
   MOBILE MENU
========================= */

.mobile-menu {
  position: fixed;
  top: 0;
  right: -320px;

  width: 280px;
  height: 100vh;

  padding: 100px 24px 40px;

  background: #1f2454;

  overflow-y: auto;

  z-index: 99999;

  transition: right .35s ease;
}

.mobile-menu.active {
  right: 0;
}

.mobile-nav {
  margin: 0;
  padding: 0;

  list-style: none;

  direction: rtl;
  text-align: right;
}

.mobile-nav li {
  margin-bottom: 18px;
}

.mobile-nav a {
  display: block;

  font-size: 17px;
  font-weight: 700;
  line-height: 2;

  color: #fff !important;
  text-decoration: none;
}


/* =========================
   OVERLAY
========================= */

.menu-overlay {
  position: fixed;
  inset: 0;

  background: rgba(0,0,0,.45);

  opacity: 0;
  visibility: hidden;

  transition: .3s ease;

  z-index: 99990;
}

.menu-overlay.active {
  opacity: 1;
  visibility: visible;
}

body.menu-open {
  overflow: hidden;
}


/* =========================
   POST CARD STRUCTURE
========================= */

.post-card {
  display: flex;
  flex-direction: column;
}

.post-content {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.post-btn {
  margin-top: auto;
}


/* =========================
   POST THUMB + DATE
========================= */

.post-thumb a {
  position: relative;
  display: block;

  width: 100%;
  height: 100%;
}

.post-date {
  position: absolute;
  top: 12px;
  right: 12px;
}



/* =========================
   FOOTER - MODERN MEDICAL CARD STYLE
========================= */

.footer-card {
  margin-top: 40px;
  padding: 28px 0 18px;

  background: #f6fbfa; /* روشن و پزشکی */
  border: 1px solid #dbe7e5;

  border-radius: 28px;
  box-shadow: 0 18px 45px rgba(15,118,110,.08);
}

/* =========================
   MAIN GRID (CARD STYLE)
========================= */

.footer-top {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 26px;

  direction: rtl;
  align-items: start;
}

/* =========================
   LEFT CARD (BRAND)
========================= */

.footer-brand {
  background: #ffffff;
  border: 1px solid #e6f2ef;
  border-radius: 22px;

  padding: 22px;
  box-shadow: 0 10px 25px rgba(15,118,110,.06);
}

.footer-logo {
  display: flex;
  align-items: center;
  gap: 10px;
}

.footer-heading {
  margin: 16px 0 10px;

  font-size: 18px;
  font-weight: 800;

  color: #0f766e;
}

.footer-contact {
  margin: 0;

  font-size: 14px;
  line-height: 2;

  color: #4b5563;
  font-weight: 600;
}


/* =========================
   SOCIAL (SOFT BUTTONS)
========================= */

.socials {
  display: flex;
  align-items: center;
  gap: 12px;

  margin-top: 18px;
}

.socials a {
  width: 42px;
  height: 42px;

  display: grid;
  place-items: center;

  border-radius: 14px;

  background: #ecfdf5;
  border: 1px solid #cdebe3;

  transition: .25s ease;
}

.socials a:hover {
  transform: translateY(-3px);
  background: #d1fae5;
  border-color: #10b981;
}

.socials img {
  width: 22px;
  height: 22px;
}


/* =========================
   RIGHT CARD (LINKS)
========================= */

.footer-links {
  background: #ffffff;
  border: 1px solid #e6f2ef;
  border-radius: 22px;

  padding: 22px;
  box-shadow: 0 10px 25px rgba(15,118,110,.06);
}

.footer-links h3 {
  margin: 0 0 14px;

  font-size: 18px;
  font-weight: 800;

  color: #0f766e;
}

.footer-links ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.footer-links li + li {
  margin-top: 10px;
}

.footer-links a {
  display: inline-flex;
  align-items: center;
  gap: 8px;

  color: #374151;
  font-size: 15px;
  font-weight: 700;

  text-decoration: none;

  transition: .2s ease;
}

.footer-links a::before {
  content: "›";
  color: #10b981;
  font-size: 18px;
}

.footer-links a:hover {
  color: #10b981;
}


/* =========================
   DIVIDER + BOTTOM
========================= */

.footer-divider {
  height: 1px;
  margin: 20px 0 12px;

  background: #dbe7e5;
}

.footer-bottom {
  text-align: center;
  font-size: 12px;

  color: #6b7280;
  direction: ltr;
}


/* =========================
   MOBILE
========================= */

@media (max-width: 767px) {

  .footer-card {
    padding: 20px 0 14px;
    border-radius: 22px;
  }

  .footer-top {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .footer-brand,
  .footer-links {
    padding: 18px;
  }
}
