:root {
    --primary: #2c3e50;
    --accent: #b8960c;
    --bg: #fdfcfb;
    --white: #ffffff;
}

body {
    font-family: 'Vazirmatn', sans-serif;
    background-color: var(--bg);
    margin: 0;
    padding: 20px;
    display: flex;
    justify-content: center;
}

/* ===== Main Card ===== */
.main-card {
    width: 100%;
    max-width: 900px;
    background: var(--white);
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    overflow: hidden;
    border: 1px solid #eee;
}

/* ===== HERO HEADER ===== */
header {
    background: linear-gradient(160deg, #fff8f3 0%, #ffffff 60%, #fff3eb 100%);
    border-bottom: 1px solid #eee;
    padding: 50px 20px 40px;
    text-align: center;
}

.hero-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

.header-img {
    width: 100%;
    max-width: 160px;
    height: auto;
    display: block;
}

.hero-slogan {
    font-size: 2.6rem;
    font-weight: 700;
    color: #b8960c;
    margin: 8px 0 0;
    text-shadow: 1px 1px 4px rgba(184,150,12,0.1);
}

.hero-sub {
    font-size: 1rem;
    color: #888;
    font-weight: 400;
    margin: 0;
    max-width: 480px;
    line-height: 1.7;
}

.hero-cta {
    display: inline-block;
    margin-top: 8px;
    padding: 13px 32px;
    background: linear-gradient(135deg, #b8960c, #c9a227);
    color: #fff;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 700;
    font-size: 1rem;
    box-shadow: 0 4px 15px rgba(184,150,12,0.3);
    transition: all 0.3s ease;
}

.hero-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(184,150,12,0.4);
}

/* ===== Tab Navigation ===== */
.tab-nav {
    display: flex;
    overflow-x: auto;
    background: #f8f9fa;
    border-bottom: 1px solid #eee;
    scrollbar-width: none;
}

.tab-nav::-webkit-scrollbar { display: none; }

.tab-btn {
    padding: 15px 25px;
    border: none;
    background: transparent;
    font-family: 'Vazirmatn', sans-serif;
    font-size: 1rem;
    font-weight: 400;
    cursor: pointer;
    color: #7f8c8d;
    transition: all 0.3s ease;
    white-space: nowrap;
    position: relative;
    text-decoration: none;
    display: inline-block;
}

.tab-btn:hover {
    color: var(--accent);
    background: #fff;
}

.tab-btn.active {
    color: var(--accent);
    font-weight: 700;
    background: #fff;
}

.tab-btn.active::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 20%;
    width: 60%;
    height: 3px;
    background: linear-gradient(to right, #b8960c, #c9a227);
    border-radius: 10px;
}

/* ===== Tab Content ===== */
.tab-pane {
    display: none;
    padding: 40px;
    line-height: 2;
    animation: fadeIn 0.4s ease;
}

.tab-pane.active {
    display: block !important;
}

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

/* ===== Typography ===== */
.tab-pane h2 {
    font-size: 1.8rem;
    color: var(--primary);
    margin-bottom: 20px;
    padding-bottom: 12px;
    font-weight: 700;
    position: relative;
    display: inline-block;
    width: auto;
    border-right: 5px solid var(--accent);
    padding-right: 15px;
}

.tab-pane h2::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 80px;
    height: 3px;
    background: linear-gradient(to left, var(--accent), transparent);
    border-radius: 10px;
}

.eng-title {
    color: #b8960c;
    font-weight: 400;
    margin-right: 10px;
    opacity: 0.75;
    font-size: 0.9em;
}

.section-sub {
    color: var(--primary);
    font-size: 1.2rem;
    margin: 30px 0 12px;
    font-weight: 700;
}

ul { padding-right: 20px; }
li { margin-bottom: 12px; }

/* ===== Content Boxes ===== */
.highlight-box {
    background: #fff5eb;
    border-right: 4px solid #c9a227;
    padding: 20px;
    margin: 20px 0;
    border-radius: 0 8px 8px 0;
    font-style: italic;
    line-height: 1.8;
}

.manifesto-box {
    background: #f0f7ff;
    border-right: 4px solid #2980b9;
    padding: 20px;
    margin: 20px 0;
    border-radius: 0 8px 8px 0;
    line-height: 1.9;
}

.quote-card {
    background: #fdf6ec;
    border: 1px solid #f0d9b5;
    border-right: 5px solid var(--accent);
    padding: 20px 25px;
    margin: 25px 0;
    border-radius: 0 12px 12px 0;
    font-style: italic;
    color: #555;
    font-size: 1.05rem;
}

.section-divider {
    border: none;
    border-top: 1px solid #eee;
    margin: 40px 0;
}

/* ===== Maslow Image ===== */
.maslow-img {
    width: 100%;
    max-width: 450px;
    height: auto;
    display: block;
    margin: 25px auto;
    border-radius: 12px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/* ===== CTA Banner ===== */
.cta-banner {
    background: linear-gradient(135deg, #fff3eb, #fff8f3);
    border: 1px solid #fde8d5;
    border-radius: 16px;
    padding: 30px;
    text-align: center;
    margin-top: 30px;
}

.cta-text {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--primary);
    margin: 0 0 15px;
}

.cta-btn {
    display: inline-block;
    padding: 12px 32px;
    background: linear-gradient(135deg, #b8960c, #c9a227);
    color: #fff;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 700;
    font-size: 1rem;
    box-shadow: 0 4px 15px rgba(184,150,12,0.25);
    transition: all 0.3s ease;
}

.cta-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(184,150,12,0.35);
}

/* ===== Value Cards (About tab) ===== */
.card-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin: 20px 0;
}

.value-card {
    background: #fff8f3;
    border: 1px solid #fde8d5;
    border-radius: 16px;
    padding: 25px 20px;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.value-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 25px rgba(184,150,12,0.12);
}

.value-icon { font-size: 2rem; margin-bottom: 10px; }

.value-card h3 {
    color: var(--primary);
    margin: 0 0 10px;
    font-size: 1.05rem;
}

.value-card p {
    font-size: 0.88rem;
    color: #666;
    line-height: 1.7;
    margin: 0;
}

/* ===== About Founder ===== */
.about-founder {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    background: #f8f9fa;
    border-radius: 16px;
    padding: 25px;
    margin: 25px 0;
}

.founder-icon { font-size: 2.5rem; flex-shrink: 0; }
.founder-text h3 { margin: 0 0 8px; color: var(--primary); }
.founder-text p  { margin: 0; color: #555; line-height: 1.8; }

/* ===== Sources Grid (About tab) ===== */
.sources-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin-top: 15px;
}

.source-item {
    background: #fff8f3;
    border: 1px solid #fde8d5;
    border-radius: 10px;
    padding: 12px 16px;
    font-size: 0.93rem;
    color: #444;
    line-height: 1.6;
}

/* ===== Journey Steps ===== */
.journey-steps {
    display: flex;
    flex-direction: column;
    gap: 18px;
    margin: 25px 0;
}

.step-card {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    padding: 20px;
    background: #fdfcfb;
    border: 1px solid #eee;
    border-radius: 16px;
    transition: box-shadow 0.3s;
}

.step-card:hover { box-shadow: 0 4px 15px rgba(0,0,0,0.07); }

.step-num {
    background: linear-gradient(135deg, #b8960c, #c9a227);
    color: #fff;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.step-content h3 { margin: 0 0 6px; color: var(--primary); font-size: 1.05rem; }
.step-content p  { margin: 0; color: #555; line-height: 1.8; }

/* ===== Join Tab ===== */
.join-questions {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
    margin: 25px 0;
}

.join-q {
    background: #fff8f3;
    border: 1px solid #fde8d5;
    border-radius: 12px;
    padding: 16px;
    font-size: 0.93rem;
    color: #444;
    line-height: 1.6;
}

.join-social {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
    margin-top: 20px;
}

.join-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 22px 10px;
    border-radius: 16px;
    text-decoration: none;
    color: #fff;
    transition: all 0.3s ease;
    gap: 8px;
}

.join-link:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.18);
}

.join-link i     { font-size: 1.8rem; }
.join-link span  { font-weight: 700; font-size: 1rem; }
.join-link small { font-size: 0.78rem; opacity: 0.85; }

.join-link.telegram  { background: #0088cc; }
.join-link.youtube   { background: #ff0000; }
.join-link.instagram { background: linear-gradient(135deg, #833ab4, #e1306c, #f77737); }
.join-link.tiktok    { background: #010101; }
.join-link.facebook  { background: #1877f2; }

.slogan-join {
    text-align: center;
    font-size: 2rem;
    font-weight: 700;
    color: #b8960c;
    margin-top: 45px;
    text-shadow: 1px 1px 4px rgba(184,150,12,0.1);
}

/* ===== Info Link Box ===== */
.info-link-box {
    background: #f0f7ff;
    border-right: 4px solid #2980b9;
    padding: 14px 18px;
    border-radius: 0 10px 10px 0;
    font-size: 0.95rem;
    color: #444;
    line-height: 1.8;
}

.info-link-box i {
    color: #2980b9;
    margin-left: 6px;
}

.info-link-box a {
    color: #b8960c;
    font-weight: 700;
    text-decoration: none;
    margin-right: 4px;
}

.info-link-box a:hover {
    text-decoration: underline;
}

/* ===== Meditation / Audio Tab ===== */
.audio-card {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px;
    background: #f8f9fa;
    border: 1px solid #eee;
    border-radius: 16px;
    padding: 25px;
    margin: 25px 0;
}

.audio-icon { font-size: 2.5rem; flex-shrink: 0; }

.audio-info { flex: 1; min-width: 150px; }
.audio-title { margin: 0 0 5px; color: var(--primary); font-size: 1.1rem; font-weight: 700; }
.audio-desc  { margin: 0; color: #888; font-size: 0.9rem; }

.meditation-tips {
    background: #f8f9fa;
    border-radius: 16px;
    padding: 25px;
    margin: 25px 0;
}

.tip-item {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin-bottom: 18px;
}

.tip-item:last-child { margin-bottom: 0; }

.tip-num {
    background: linear-gradient(135deg, #b8960c, #c9a227);
    color: #fff;
    min-width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.9rem;
    flex-shrink: 0;
    margin-top: 4px;
}

.tip-item p {
    margin: 0;
    color: #444;
    line-height: 1.8;
    font-size: 0.97rem;
}


    width: 100%;
    margin-top: 15px;
    border-radius: 50px;
    accent-color: #b8960c;
}

.contact-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
    margin-top: 15px;
}

.contact-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 25px 15px;
    background: #fff8f3;
    border: 1px solid #eddfc0;
    border-radius: 16px;
    text-decoration: none;
    color: var(--primary);
    transition: all 0.3s ease;
    text-align: center;
}

.contact-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(184,150,12,0.15);
    border-color: var(--accent);
}

.contact-card i {
    font-size: 2rem;
    color: var(--accent);
}

.contact-label {
    font-weight: 700;
    font-size: 1rem;
}

.contact-card small {
    font-size: 0.82rem;
    color: #888;
    direction: ltr;
}

@media (max-width: 500px) {
    .contact-grid { grid-template-columns: 1fr; }
}

/* ===== Manifesto Sub-Nav ===== */
.manifesto-nav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, #fffdf5, #fff8e8);
    border: 1px solid #eddfc0;
    border-right: 4px solid var(--accent);
    border-radius: 0 14px 14px 0;
    padding: 14px 18px;
    margin-bottom: 30px;
}

.manifesto-nav-label {
    font-weight: 700;
    color: var(--primary);
    font-size: 0.9rem;
    margin-left: 6px;
    white-space: nowrap;
}

.manifesto-nav-label i {
    color: var(--accent);
    margin-left: 5px;
}

.manifesto-nav a {
    text-decoration: none;
    color: #555;
    font-size: 0.88rem;
    padding: 5px 12px;
    background: #fff;
    border: 1px solid #e0d4a8;
    border-radius: 50px;
    transition: all 0.25s ease;
    white-space: nowrap;
}

.manifesto-nav a:hover {
    background: var(--accent);
    color: #fff;
    border-color: var(--accent);
    transform: translateY(-1px);
}

@media (max-width: 600px) {
    .manifesto-nav { gap: 6px; padding: 12px 14px; }
    .manifesto-nav a { font-size: 0.82rem; padding: 4px 10px; }
}

/* ===== FAQ ===== */
.faq-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 15px;
}

.faq-item {
    border: 1px solid #eddfc0;
    border-radius: 12px;
    overflow: hidden;
}

.faq-q {
    width: 100%;
    background: #fff8f3;
    border: none;
    padding: 16px 20px;
    font-family: 'Vazirmatn', sans-serif;
    font-size: 0.97rem;
    font-weight: 700;
    color: var(--primary);
    cursor: pointer;
    text-align: right;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    transition: background 0.2s ease;
    line-height: 1.7;
}

.faq-q:hover { background: #fff0e0; }

.faq-icon {
    flex-shrink: 0;
    color: var(--accent);
    transition: transform 0.3s ease;
    font-size: 0.85rem;
}

.faq-icon.rotated { transform: rotate(180deg); }

.faq-a {
    display: none;
    padding: 16px 20px;
    background: #fff;
    color: #444;
    font-size: 0.95rem;
    line-height: 1.9;
    border-top: 1px solid #eddfc0;
}

.faq-a.open { display: block; }

/* ===== Community Tab ===== */
.community-img-wrap {
    margin: 25px 0;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 6px 20px rgba(0,0,0,0.1);
}

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

.contest-card {
    background: linear-gradient(135deg, #fff8f3, #fff3eb);
    border: 1px solid #fde8d5;
    border-right: 5px solid var(--accent);
    border-radius: 0 16px 16px 0;
    padding: 25px;
    margin: 25px 0;
}

.contest-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 15px;
}

.contest-badge {
    background: linear-gradient(135deg, #b8960c, #c9a227);
    color: #fff;
    padding: 4px 14px;
    border-radius: 50px;
    font-size: 0.85rem;
    font-weight: 700;
    white-space: nowrap;
}

.contest-header h3 {
    margin: 0;
    color: var(--primary);
    font-size: 1.1rem;
}

.contest-socials {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

.contest-socials a {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 8px 18px;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 50px;
    text-decoration: none;
    color: #333;
    font-size: 0.9rem;
    transition: all 0.3s ease;
    box-shadow: 0 2px 5px rgba(0,0,0,0.04);
}

.contest-socials a:hover {
    border-color: #b8960c;
    color: #b8960c;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(184,150,12,0.12);
}

/* ===== Footer ===== */
footer {
    padding: 30px;
    text-align: center;
    color: #999;
    font-size: 0.85rem;
    border-top: 1px solid #eee;
}

/* ===== Responsive ===== */
@media (max-width: 600px) {
    body { padding: 10px; }
    .tab-pane { padding: 25px 20px; }
    .hero-slogan { font-size: 2rem; }
    .card-grid { grid-template-columns: 1fr; }
    .sources-grid { grid-template-columns: 1fr; }
    .join-questions { grid-template-columns: 1fr; }
    .join-social { grid-template-columns: 1fr 1fr; }
    .about-founder { flex-direction: column; }
}

/* ===== beliefs.php ===== */
.beliefs-hero{text-align:center;padding:48px 20px 36px;background:linear-gradient(160deg,#fdf8ee 0%,#fff9f0 60%,#fdf3d8 100%);border-bottom:1px solid rgba(201,162,39,.15);position:relative;overflow:hidden;}
.beliefs-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 0%,rgba(201,162,39,.12) 0%,transparent 70%);}
.beliefs-icon{font-size:3.2rem;display:block;margin-bottom:16px;filter:drop-shadow(0 4px 16px rgba(201,162,39,.4));animation:breathe 4s ease-in-out infinite;position:relative;}
@keyframes breathe{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.06);opacity:.85}}
.beliefs-hero h1{font-size:clamp(1.5rem,4vw,2.2rem);font-weight:900;color:#1a1208;position:relative;margin-bottom:12px;}
.beliefs-hero p{color:#666;font-size:1rem;max-width:500px;margin:0 auto;line-height:1.7;position:relative;}
.quotes-section{max-width:700px;margin:48px auto 0;padding:0 16px;}
.quotes-title{text-align:center;font-size:1.1rem;font-weight:700;color:#3d2b0e;margin-bottom:28px;display:flex;align-items:center;gap:12px;justify-content:center;}
.quotes-title::before,.quotes-title::after{content:'';flex:1;height:1px;background:linear-gradient(to right,transparent,rgba(201,162,39,.4));max-width:80px;}
.quotes-title::after{background:linear-gradient(to left,transparent,rgba(201,162,39,.4));}
.belief-quote{background:#fffdf7;border-radius:16px;padding:22px 24px 22px 28px;margin-bottom:16px;border:1px solid rgba(201,162,39,.15);border-right:4px solid #c9a227;box-shadow:0 4px 20px rgba(0,0,0,.06);font-size:.95rem;line-height:1.8;color:#333;transition:transform .2s,box-shadow .2s;position:relative;}
.belief-quote:hover{transform:translateX(-4px);box-shadow:0 8px 30px rgba(0,0,0,.1);}
.belief-quote::before{content:'"';position:absolute;top:8px;right:16px;font-size:3.5rem;color:rgba(201,162,39,.15);font-family:Georgia,serif;line-height:1;}
.category-tag{display:inline-block;font-size:.68rem;font-weight:700;color:#c9a227;background:rgba(201,162,39,.1);padding:2px 10px;border-radius:50px;margin-bottom:8px;letter-spacing:.5px;}
.download-section{max-width:560px;margin:48px auto 0;padding:0 16px 60px;text-align:center;}
.download-box{background:linear-gradient(135deg,#fffdf7,#fff8e8);border:2px dashed rgba(201,162,39,.35);border-radius:20px;padding:36px 28px;transition:border-color .2s,box-shadow .2s;}
.download-box:hover{border-color:rgba(201,162,39,.6);box-shadow:0 8px 30px rgba(201,162,39,.1);}
.download-icon{font-size:2.8rem;margin-bottom:14px;display:block;}
.download-box h3{font-size:1.05rem;font-weight:700;color:#1a1208;margin-bottom:8px;}
.download-box p{font-size:.85rem;color:#888;margin-bottom:22px;line-height:1.6;}
.download-btn{display:inline-flex;align-items:center;gap:10px;background:linear-gradient(135deg,#c9a227,#e8c96a);color:#1a1208;font-weight:700;font-size:.95rem;padding:14px 32px;border-radius:50px;text-decoration:none;box-shadow:0 6px 20px rgba(201,162,39,.35);transition:transform .2s,box-shadow .2s;font-family:'Vazirmatn',sans-serif;}
.download-btn:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(201,162,39,.45);}
.file-meta{margin-top:14px;font-size:.75rem;color:#bbb;display:flex;align-items:center;justify-content:center;gap:16px;}
.file-meta span{display:flex;align-items:center;gap:5px;}

/* ===== Shortcut Card (meditation → beliefs) ===== */
.shortcut-card{display:flex;align-items:center;gap:16px;background:linear-gradient(135deg,#fffdf7,#fff8e8);border:1px solid rgba(201,162,39,.25);border-right:4px solid #c9a227;border-radius:16px;padding:20px 22px;margin-top:32px;text-decoration:none;transition:transform .2s,box-shadow .2s;color:inherit;}
.shortcut-card:hover{transform:translateY(-3px);box-shadow:0 10px 30px rgba(201,162,39,.15);}
.shortcut-icon{font-size:2.2rem;flex-shrink:0;}
.shortcut-text h4{font-size:1rem;font-weight:700;color:#1a1208;margin-bottom:4px;}
.shortcut-text p{font-size:.82rem;color:#888;line-height:1.5;}
.shortcut-arrow{margin-right:auto;color:#c9a227;font-size:1.1rem;}

/* ===== resources.php ===== */
.res-hero{text-align:center;padding:44px 20px 32px;background:linear-gradient(160deg,#fdf8ee,#fff9f0,#fdf3d8);border-bottom:1px solid rgba(201,162,39,.15);position:relative;overflow:hidden;}
.res-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 0%,rgba(201,162,39,.1) 0%,transparent 70%);}
.res-hero-icon{font-size:2.8rem;display:block;margin-bottom:12px;position:relative;}
.res-hero h1{font-size:clamp(1.5rem,4vw,2.2rem);font-weight:900;color:#1a1208;position:relative;margin-bottom:10px;}
.res-hero p{color:#777;font-size:.95rem;max-width:480px;margin:0 auto;line-height:1.7;position:relative;}

.res-grid{max-width:900px;margin:40px auto 60px;padding:0 16px;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:32px;}

.res-card{background:#fffdf7;border-radius:20px;overflow:hidden;box-shadow:0 8px 40px rgba(0,0,0,.1);border:1px solid rgba(201,162,39,.18);transition:transform .25s,box-shadow .25s;}
.res-card:hover{transform:translateY(-5px);box-shadow:0 16px 50px rgba(0,0,0,.15);}

/* Cover 9:16 */
.res-cover{width:100%;aspect-ratio:9/16;max-height:320px;overflow:hidden;position:relative;background:linear-gradient(135deg,#1a1208,#2d1f0a);}
.res-cover img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block;transition:transform .4s;}
.res-card:hover .res-cover img{transform:scale(1.04);}
.res-cover-fallback{position:absolute;inset:0;display:none;align-items:center;justify-content:center;font-size:4rem;color:rgba(201,162,39,.3);}
.res-cover.no-img .res-cover-fallback{display:flex;}
.res-cover-badge{position:absolute;top:14px;left:14px;background:rgba(201,162,39,.9);color:#1a1208;font-size:.72rem;font-weight:800;padding:4px 10px;border-radius:50px;letter-spacing:1px;}

/* Body */
.res-body{padding:20px 20px 18px;}
.res-title-en{font-size:.72rem;font-weight:700;color:rgba(201,162,39,.7);letter-spacing:2px;text-transform:uppercase;margin-bottom:6px;}
.res-title{font-size:1.15rem;font-weight:800;color:#1a1208;margin-bottom:16px;line-height:1.4;}

/* Quotes */
.res-quotes{display:flex;flex-direction:column;gap:10px;margin-bottom:20px;}
.res-quote{font-size:.85rem;line-height:1.7;color:#444;padding:10px 14px 10px 10px;border-right:3px solid rgba(201,162,39,.5);background:rgba(201,162,39,.04);border-radius:0 8px 8px 0;position:relative;}
.res-quote-mark{color:rgba(201,162,39,.35);font-size:1.8rem;font-family:Georgia,serif;line-height:0;vertical-align:middle;margin-left:3px;}

/* Footer */
/* .res-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:14px;border-top:1px solid rgba(201,162,39,.12);} */
.res-meta{display:flex;gap:12px;flex-wrap:wrap;}
.res-meta span{font-size:.75rem;color:#aaa;display:flex;align-items:center;gap:4px;}
.res-meta i{color:rgba(201,162,39,.6);}
.res-download-btn{display:inline-flex;align-items:center;gap:7px;background:linear-gradient(135deg,#c9a227,#e8c96a);color:#1a1208;font-weight:700;font-size:.88rem;padding:10px 20px;border-radius:50px;text-decoration:none;box-shadow:0 4px 16px rgba(201,162,39,.3);transition:transform .2s,box-shadow .2s;white-space:nowrap;font-family:'Vazirmatn',sans-serif;}
.res-download-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(201,162,39,.4);}

@media(max-width:500px){.res-grid{grid-template-columns:1fr;}}

/* Footer & Actions */
.res-footer {
    display: flex;
    flex-direction: column; /* بۆ مۆبایل سەرەتا بە ستوونی بێت */
    gap: 15px;
    padding-top: 14px;
    border-top: 1px solid rgba(201,162,39,0.12);
}

.res-meta {
    display: flex;
    gap: 12px;
    color: #777;
    font-size: 0.8rem;
}



/* Base Button Style */
.res-btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
}

/* Read Button - Light Style */
.res-read-btn {
    background: rgba(201,162,39,0.08);
    color: #c9a227;
    border: 1px solid rgba(201,162,39,0.2);
}

.res-read-btn:hover {
    background: rgba(201,162,39,0.15);
    transform: translateY(-2px);
}

/* Download Button - Dark/Primary Style */
.res-download-btn {
    background: linear-gradient(135deg, #c9a227 0%, #a6851f 100%);
    color: #fff !important;
    border: none;
}

.res-download-btn:hover {
    box-shadow: 0 4px 12px rgba(201,162,39,0.3);
    transform: translateY(-2px);
}

/* Responsive Tablet/Desktop */
@media (min-width: 480px) {
    .res-footer {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
    .res-actions {
        width: auto;
        min-width: 220px;
    }
}