:root{
      --primary:#0F4D3A; --primary-dark:#0a3528; --primary-light:#1a6b51;
      --accent:#C8A45C; --accent-light:#d9b97a; --accent-dark:#a8843f;
      --bg:#F4ECE0; --bg-alt:#EDE3D4; --bg-card:#FAF3E7;
      --text:#2A2A2A; --text-soft:#5C5048;
      --border-soft:#D4C8B5; --border-softer:#E5D9C5;

      --civ:#C8A45C; --imamat:#0F4D3A; --mosque:#3E7A5E; --tabyin:#7B4423;

      --font-display:'Sahel','Vazirmatn',system-ui,sans-serif;
      --font-body:'Estedad','Vazirmatn',system-ui,sans-serif;
      --font-accent:'Vazirmatn',serif;

      --container:1160px;
      --radius:18px;
    }

    *,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
    html{scroll-behavior:smooth;}
    body{
      font-family:var(--font-body);
      color:var(--text);
      background-color:var(--bg);
      background-image:
        radial-gradient(circle at 12% 8%, rgba(200,164,92,.10) 0%, transparent 42%),
        radial-gradient(circle at 88% 92%, rgba(15,77,58,.08) 0%, transparent 45%),
        url("../img/bg-body-about.webp");
      background-position:center, center, top center;
      background-size:auto, auto, cover;
      background-repeat:no-repeat;
      background-attachment:fixed;
      font-size:16.5px; line-height:1.85; direction:rtl;
      -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
      overflow-x:hidden;
    }
    a{color:inherit;text-decoration:none;}
    img{max-width:100%;height:auto;display:block;}

    .container{max-width:var(--container);margin:0 auto;padding:0 24px;}

    /* لوزیِ جداکننده */
    .divider-diamond{display:flex;align-items:center;justify-content:center;gap:14px;margin:8px 0;}
    .divider-diamond::before,.divider-diamond::after{content:'';height:1px;width:54px;background:linear-gradient(90deg,transparent,var(--accent),transparent);}
    .divider-diamond span{color:var(--accent);font-size:12px;transform:rotate(45deg);display:inline-block;}

    /* برچسبِ بالای هر بخش */
    .eyebrow{
      display:inline-flex;align-items:center;gap:9px;
      font-family:var(--font-display);font-size:12.5px;font-weight:600;
      letter-spacing:.02em;color:var(--accent-dark);
      text-transform:none;
    }
    .eyebrow::before{content:'';width:22px;height:1px;background:var(--accent);}

    /* ============ HEADER ============ */

    /* ============ هدر استاندارد سایت ============ */
    .header {
      position: fixed;
      top: 0; right: 0; left: 0;
      z-index: 100;
      background:
        linear-gradient(rgba(244,236,224,0.65), rgba(244,236,224,0.65)),
        url('../img/bg-header-search.png') top center / cover no-repeat,
        var(--bg);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      height: 110px;
      transition: box-shadow 0.3s ease, background 0.3s ease;
      border-bottom: 1px solid rgba(200, 164, 92, 0.3);
      box-shadow: 0 6px 22px -12px rgba(15, 77, 58, 0.22);
    }
    .header.scrolled {
      box-shadow: 0 2px 12px rgba(15, 77, 58, 0.06);
      border-bottom-color: rgba(200, 164, 92, 0.2);
    }
    .header-inner {
      max-width: var(--container);
      margin: 0 auto;
      padding: 0 32px;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 32px;
    }
    .header-logo img {
      height: 90px;
      width: auto;
      transition: transform 0.3s ease;
    }
    .header-logo:hover img { transform: scale(1.04); }

    .nav-main {
      display: flex;
      align-items: center;
      gap: 36px;
      list-style: none;
      white-space: nowrap;
    }
    .nav-main li { white-space: nowrap; }
    .nav-main a {
      font-size: 16px;
      font-weight: 500;
      color: var(--primary);
      padding: 8px 4px;
      position: relative;
      transition: color 0.25s ease;
    }
    .nav-main a::after {
      content: '';
      position: absolute;
      bottom: 0; right: 0;
      height: 2px;
      width: 0;
      background: var(--accent);
      transition: width 0.3s ease;
    }
    .nav-main a:hover { color: var(--accent-dark); }
    .nav-main a:hover::after { width: 100%; }

    .nav-dropdown { position: relative; }
    .nav-dropdown > a::before { content: '▾'; margin-left: 6px; font-size: 10px; }
    .dropdown-menu {
      position: absolute;
      top: calc(100% + 8px);
      right: 0;
      min-width: 240px;
      background: var(--bg-card);
      border: 1px solid var(--border-soft);
      border-top: 3px solid var(--accent);
      border-radius: 8px;
      box-shadow: 0 12px 40px rgba(15, 77, 58, 0.12);
      padding: 8px;
      opacity: 0;
      visibility: hidden;
      transform: translateY(-8px);
      transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
    }
    .nav-dropdown:hover .dropdown-menu {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
    }
    .dropdown-menu li { list-style: none; }
    .dropdown-menu a {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 10px 14px;
      font-size: 15px;
      border-radius: 6px;
      transition: background 0.2s ease;
    }
    .dropdown-menu a::after { display: none; }
    .dropdown-menu a:hover { background: var(--bg-alt); }
    .axis-dot {
      width: 8px; height: 8px;
      border-radius: 50%;
      flex-shrink: 0;
    }

    .search-btn {
      width: 42px; height: 42px;
      border-radius: 50%;
      border: 1px solid var(--border-soft);
      display: grid;
      place-items: center;
      color: var(--primary);
      transition: all 0.25s ease;
    }
    .search-btn:hover {
      background: var(--accent);
      color: var(--primary);
      border-color: var(--accent);
    }
    .search-btn svg { width: 18px; height: 18px; }

    /* همبرگر موبایل */
    .mobile-toggle { display: none; }
    /* ===== کادر جستجوی دائمی ===== */
    .site-search{ position:relative; }
    .search-box{ display:flex; align-items:center; gap:10px; width:clamp(240px,24vw,380px); height:52px; padding:0 20px;
      background:#FFFDF8; border:1.5px solid #E3D6BF; border-radius:30px; transition:border-color .2s, box-shadow .2s; }
    .search-box:focus-within{ border-color:var(--primary); box-shadow:0 8px 24px -12px rgba(15,77,58,.3); }
    .search-ic{ width:20px; height:20px; color:var(--primary); opacity:.7; flex:none; }
    .search-input{ flex:1; min-width:0; border:none; background:none; outline:none; font-family:inherit; font-size:15px; color:#2A2A2A; text-align:right; }
    .search-input::placeholder{ color:#A79B85; }
    .search-panel{ position:absolute; top:62px; inset-inline:0; background:#FDFAF3; border:1px solid #E8DCC6; border-radius:18px;
      box-shadow:0 26px 60px -18px rgba(15,77,58,.3); padding:16px; opacity:0; visibility:hidden; transform:translateY(-8px);
      transition:opacity .2s ease, transform .2s ease, visibility .2s; z-index:300; max-height:72vh; overflow-y:auto; }
    .site-search.open .search-panel{ opacity:1; visibility:visible; transform:translateY(0); }
    .sp-label{ font-family:var(--font-display); font-weight:800; font-size:12px; color:#B08D4B; margin:2px 4px 10px; letter-spacing:.02em; }
    .chips{ display:flex; flex-wrap:wrap; gap:8px; }
    .chip{ font-family:var(--font-display); font-weight:600; font-size:13.5px; color:var(--primary); background:#F4ECDE;
      border:1px solid #E3D6BF; border-radius:999px; padding:7px 15px; transition:all .18s; }
    .chip:hover{ background:var(--primary); color:#fff; border-color:var(--primary); }
    .sp-group{ margin-top:14px; } .sp-group:first-child{ margin-top:2px; }
    .sp-item{ display:flex; align-items:center; gap:10px; padding:9px 12px; border-radius:12px; text-decoration:none; color:#2A2A2A; font-size:14.5px; transition:background .15s; }
    .sp-item:hover{ background:#F1E9D9; }
    .sp-item .dot{ width:6px; height:6px; border-radius:50%; background:#C8A45C; flex:none; }
    .sp-item mark{ background:rgba(200,164,92,.4); color:inherit; border-radius:3px; padding:0 1px; }
    .search-foot{ display:flex; align-items:center; justify-content:space-between; margin-top:14px; padding-top:12px; border-top:1px solid #EBE0CC; }
    .see-all{ font-family:var(--font-display); font-weight:700; font-size:13.5px; color:var(--primary); text-decoration:none; }
    .see-all:hover{ text-decoration:underline; }
    .browse-all{ font-family:var(--font-display); font-weight:700; font-size:13px; color:#B08D4B; text-decoration:none; }
    .browse-all:hover{ color:var(--primary); }
    .sp-empty{ text-align:center; color:#A79B85; font-size:14px; padding:22px 10px; }

    /* ===== ریسپانسیو هدر استاندارد ===== */
    @media (max-width: 1024px) {
      .nav-main { gap: 20px; }
      .nav-main a { font-size: 15px; }
      .header-inner { gap: 20px; }
      .header-logo img { height: 76px; }
      .search-box{ width:clamp(200px,20vw,300px); }
    }
    @media (max-width: 768px) {
      .header { height: 86px; }
      .header-inner { padding: 0 20px; gap: 16px; }
      .header-logo img { height: 64px; }
      /* منوی کشویی مخفی می‌ماند (از همبرگر باز می‌شود) ولی جستجو همیشه در نوار بالا دیده می‌شود */
      .nav-main, .search-btn { display: none; }
      .site-search { display: block; flex: 1; min-width: 0; }
      .search-box { width: 100%; height: 46px; padding: 0 16px; }
      .search-input { font-size: 16px; }
      .search-panel { position: fixed; left: 12px; right: 12px; top: 80px; inset-inline: auto; }
      .mobile-toggle {
        display: grid;
        place-items: center;
        width: 42px; height: 42px;
        color: var(--primary);
      }
      .mobile-toggle svg { width: 22px; height: 22px; }
    }
    /* منوی موبایل (افزوده، بدون تغییر در دسکتاپ) */
    @media (max-width: 768px){
      .header.nav-open .nav-main{
        display:flex; position:absolute; top:100%; right:0; left:0; flex-direction:column;
        background:var(--bg-card); border-bottom:1px solid var(--border-soft);
        padding:14px 20px; gap:6px; box-shadow:0 14px 34px rgba(42,42,42,.12);
      }
      .header.nav-open .nav-main li{ width:100%; }
      .header.nav-open .dropdown-menu{ position:static; opacity:1; visibility:visible; transform:none;
        box-shadow:none; padding-right:14px; }
    }
    /* پوشش نامرئی برای بستن منوی موبایل با یک ضربه بیرون از نوار */
    .nav-overlay{ display:none; }
    @media (max-width: 768px){
      .header.nav-open .nav-overlay{
        display:block; position:fixed; inset:0; top:86px; z-index:90; background:transparent;
      }
    }


    .site-header{
      position:sticky;top:0;z-index:50;
      background:rgba(244,236,224,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
      border-bottom:1px solid var(--border-softer);
    }
    .site-header .inner{
      max-width:var(--container);margin:0 auto;padding:10px 32px;
      display:flex;align-items:center;justify-content:space-between;gap:24px;
    }
    .brand{display:flex;align-items:center;}
    .brand img{height:90px;width:auto;transition:transform .3s ease;}
    .brand:hover img{transform:scale(1.04);}
    .back-home{
      font-family:var(--font-display);font-size:13.5px;font-weight:600;color:var(--primary);
      display:inline-flex;align-items:center;gap:7px;padding:8px 15px;border-radius:100px;
      border:1px solid var(--border-soft);transition:.25s;
    }
    .back-home:hover{background:var(--primary);color:#fff;border-color:var(--primary);}

    /* ============ HERO ============ */
    .hero{padding:164px 0 40px;position:relative;}
    .botanical{position:absolute;pointer-events:none;z-index:0;color:var(--accent);}
    .botanical-a{top:-34px;left:-34px;width:132px;transform:rotate(-6deg);}
    .botanical-b{top:-20px;right:-30px;width:104px;transform:scaleX(-1) rotate(-4deg);}

    .hero-panel{
      position:relative;z-index:1;color:#F4ECE0;
      display:grid;grid-template-columns:340px 1fr;gap:52px;align-items:center;
      background:
        linear-gradient(150deg, rgba(11,44,33,.90), rgba(8,28,21,.95)),
        url("../img/hero-main.webp");
      background-size:cover;background-position:center;
      border:1px solid var(--accent);border-radius:26px;padding:44px 46px;
      box-shadow:0 40px 90px -46px rgba(8,28,21,.7), inset 0 0 130px 44px rgba(5,18,13,.55);
    }
    .hero-panel::before,.hero-panel::after{content:'';position:absolute;width:22px;height:22px;border:1.5px solid var(--accent-light);opacity:.8;}
    .hero-panel::before{top:12px;right:12px;border-bottom:none;border-left:none;}
    .hero-panel::after{bottom:12px;left:12px;border-top:none;border-right:none;}

    /* قابِ محرابی + شکستنِ کادر + هاله‌ی نور */
    .portrait-wrap{position:relative;z-index:2;margin:-56px 0 -30px;}
    .portrait-wrap::before{content:'';position:absolute;inset:-4% 2% 2% 2%;z-index:0;
      background:radial-gradient(closest-side, rgba(200,164,92,.42), transparent 72%);filter:blur(10px);}
    .mihrab-portrait{position:relative;z-index:1;display:block;width:100%;height:auto;
      filter:drop-shadow(0 26px 40px rgba(15,77,58,.45));}

    .hero-text .eyebrow{margin-bottom:16px;color:var(--accent-light);}
    .hero-text .eyebrow::before{background:var(--accent-light);}
    .hero-name{
      font-family:'Noto Nastaliq Urdu', var(--font-display);font-weight:700;
      color:var(--accent-light);
      font-size:clamp(46px,5.6vw,70px);line-height:1.7;padding:6px 4px 2px;position:relative;
      text-shadow:0 2px 18px rgba(0,0,0,.45), 0 0 1px rgba(200,164,92,.4);
    }
    .hero-flourish{display:flex;align-items:center;gap:12px;margin-top:6px;}
    .hero-flourish::before{content:'';height:1.5px;width:78px;background:linear-gradient(90deg,var(--accent),transparent);}
    .hero-flourish span{color:var(--accent);font-size:11px;transform:rotate(45deg);display:inline-block;}
    .hero-role{
      margin-top:16px;display:inline-block;font-family:var(--font-display);font-weight:600;
      font-size:14.5px;color:#F4ECE0;
      padding:7px 18px;border:1px solid rgba(200,164,92,.6);border-radius:100px;background:rgba(200,164,92,.12);
    }
    .hero-intro{
      margin-top:22px;max-width:32em;font-size:16.5px;line-height:2;color:rgba(244,236,224,.82);
    }
    .hero-intro .lead-q{color:var(--accent-light);font-weight:600;}
    .hero-text{position:relative;z-index:1;}
    .gereh{position:absolute;pointer-events:none;color:var(--accent);}
    .gereh-hero{z-index:0;width:320px;top:50%;left:10px;transform:translateY(-50%);opacity:.12;color:var(--accent-light);}

    /* ============ BENTO ============ */
    .bento{
      display:grid;grid-template-columns:repeat(12,1fr);gap:22px;
      padding:14px 0 10px;
    }
    .card{
      background:var(--bg-card);border:1px solid var(--border-softer);
      border-radius:var(--radius);padding:32px 30px;position:relative;
      transition:transform .3s ease, box-shadow .3s ease;
    }
    .card:hover{transform:translateY(-3px);box-shadow:0 18px 40px -26px rgba(15,77,58,.4);}
    /* لهجه‌های رنگیِ محورها + تنوعِ جنسِ کارت‌ها */
    .card.acc-imamat{border-top:3px solid var(--imamat);}

    /* ===== کارنامه: کارت هشت‌ضلعیِ کنج‌بریده ===== */
    .oct-card{
      position:relative;grid-column:span 5;align-self:stretch;
      background:var(--accent);padding:2px;transition:transform .3s ease;
      clip-path:polygon(24px 0, calc(100% - 24px) 0, 100% 24px, 100% calc(100% - 24px), calc(100% - 24px) 100%, 24px 100%, 0 calc(100% - 24px), 0 24px);
    }
    .oct-card:hover{transform:translateY(-3px);}
    .oct-inner{
      position:relative;height:100%;overflow:hidden;padding:34px 30px 32px;
      background:linear-gradient(180deg, rgba(200,164,92,.06), var(--bg-card));
      clip-path:polygon(22px 0, calc(100% - 22px) 0, 100% 22px, 100% calc(100% - 22px), calc(100% - 22px) 100%, 22px 100%, 0 calc(100% - 22px), 0 22px);
    }
    .oct-inner > *{position:relative;z-index:1;}
    .oct-card .eyebrow{color:var(--accent-dark);}
    .oct-card .eyebrow::before{background:var(--accent-dark);}
    .oct-card .card-title{color:var(--primary);}
    .doc-seal{position:absolute;top:18px;left:22px;width:56px;height:56px;opacity:.45;color:var(--accent-dark);transform:rotate(-8deg);z-index:0;pointer-events:none;}
    .field-org{margin-top:22px;}
    .field-org + .field-org{margin-top:24px;padding-top:22px;border-top:1px dashed var(--border-soft);}
    .fo-name{font-family:var(--font-display);font-weight:700;color:var(--primary);font-size:16px;display:block;}
    .fo-sub{font-size:12.5px;color:var(--accent-dark);font-weight:600;display:block;margin-top:2px;}
    .fo-desc{font-size:14px;color:var(--text-soft);line-height:1.7;display:block;margin-top:6px;}
    .ranks{margin-top:16px;}
    .rank{display:flex;align-items:center;gap:13px;padding:7px 0;position:relative;}
    .rank:not(:last-child)::after{content:'';position:absolute;right:17px;top:43px;height:14px;width:2px;
      background:linear-gradient(var(--imamat),var(--accent));opacity:.45;}
    .medal{flex:none;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;
      font-family:var(--font-display);font-weight:700;font-size:14px;position:relative;z-index:1;
      background:var(--bg-card);border:2px solid var(--imamat);color:var(--imamat);}
    .rank:nth-child(2) .medal{border-color:var(--accent-dark);color:var(--accent-dark);box-shadow:0 0 0 3px rgba(200,164,92,.12);}
    .rank:nth-child(3) .medal{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 5px 15px -4px rgba(200,164,92,.7);}
    .rk-label{font-family:var(--font-display);font-weight:600;font-size:14px;color:var(--primary);}
    .rank:nth-child(3) .rk-label{color:var(--accent-dark);}
    .card-title{
      font-family:var(--font-display);font-weight:700;color:var(--primary);
      font-size:20px;margin:14px 0 16px;
    }
    .card p{color:var(--text-soft);font-size:16px;}

    .col-7{grid-column:span 7;} .col-5{grid-column:span 5;}
    .col-12{grid-column:span 12;} .col-6{grid-column:span 6;}

    /* strong رنگی */
    .s-mosque{color:var(--mosque);font-weight:700;}
    .s-imamat{color:var(--imamat);font-weight:700;}
    .s-civ{color:var(--accent-dark);font-weight:700;}

    /* ===== بخش «من که هستم» ===== */
    .bio-card{position:relative;overflow:hidden;}
    .bio-card > *{position:relative;z-index:1;}
    .bio-manzumeh{position:absolute;top:24px;left:28px;width:38px;opacity:.55;color:var(--accent);z-index:1;}
    .bio-mosque-wm{position:absolute;bottom:-10px;left:-12px;width:236px;opacity:.05;color:var(--primary);z-index:0;pointer-events:none;}
    .bio-body{overflow:hidden;}
    .ascent{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;align-items:end;
      margin-top:24px;padding-top:22px;border-top:1px dashed var(--border-soft);}
    .ascent-step{text-align:center;padding:13px 8px;border-radius:12px;background:var(--bg);
      border:1px solid var(--border-softer);border-top:2px solid var(--asc);transition:transform .25s ease;}
    .ascent-step:hover{transform:translateY(-3px);}
    .ascent-step .as-dot{width:9px;height:9px;border-radius:50%;margin:0 auto 8px;background:var(--asc);}
    .ascent-step .as-label{font-family:var(--font-display);font-weight:700;font-size:12.5px;color:var(--primary);line-height:1.5;}
    .ascent-step:nth-child(2){margin-bottom:13px;}
    .ascent-step:nth-child(3){margin-bottom:26px;}
    .bio-sign{margin-top:22px;text-align:left;font-family:'Noto Nastaliq Urdu',var(--font-display);
      font-size:26px;line-height:2.2;color:var(--accent-dark);opacity:.9;padding-left:6px;}

    /* کارنامه */

    /* ============ مسیر فکری ============ */
    .journey{
      grid-column:span 12;position:relative;overflow:hidden;color:#F4ECE0;
      background:linear-gradient(160deg, #1e1b16, #141109);
      border:1px solid rgba(200,164,92,.42);border-radius:var(--radius);
      padding:44px 34px 40px;box-shadow:0 30px 70px -46px rgba(0,0,0,.6);
    }
    .journey .card-title{color:var(--accent-light);}
    .journey .eyebrow{color:var(--accent-light);}
    .journey .eyebrow::before{background:var(--accent-light);}
    .journey .divider-diamond::before,.journey .divider-diamond::after{background:linear-gradient(90deg,transparent,var(--accent-light),transparent);}
    .journey-head{text-align:center;margin-bottom:34px;}
    .journey-head .card-title{margin:12px 0 0;font-size:23px;}
    .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative;}
    .steps::before{
      content:'';position:absolute;top:17px;right:11%;left:11%;height:2px;border-radius:2px;
      background:linear-gradient(to left, #A8843F, #46A588, #C08A55, #D9B97A);
      opacity:.55;
    }
    .step{position:relative;padding:0 16px;text-align:center;}
    .step .st-node{
      width:36px;height:36px;margin:0 auto 16px;border-radius:50%;
      background:rgba(14,12,9,.95);border:2px solid var(--sc,var(--accent-light));
      display:flex;align-items:center;justify-content:center;
      font-family:var(--font-display);font-weight:700;color:var(--sc,var(--accent-light));font-size:15px;
      position:relative;z-index:1;box-shadow:0 0 0 4px rgba(14,12,9,.9), 0 0 16px -2px var(--scg,transparent);
    }
    .step .st-role{font-family:var(--font-display);font-weight:700;color:var(--sc,var(--accent-light));font-size:16px;margin-bottom:8px;display:block;}
    .step .st-body{font-size:14px;line-height:1.75;color:rgba(244,236,224,.8);}
    .step .st-body .mentors{color:#F4ECE0;font-weight:500;}
    /* گام‌های چهاررنگ (عبور مسیر از چهار محور) */
    .step:nth-child(1){--sc:#A8843F;--scg:rgba(168,132,63,.5);}
    .step:nth-child(2){--sc:#46A588;--scg:rgba(70,165,136,.55);}
    .step:nth-child(3){--sc:#C08A55;--scg:rgba(192,138,85,.55);}
    .step:nth-child(4){--sc:#D9B97A;--scg:rgba(217,185,122,.6);}

    /* ============ کتاب‌ها ============ */
    .books-sec{grid-column:span 12;}
    .books-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:22px;}
    .books-head .card-title{margin:10px 0 0;}
    .books-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;}
    .book{
      display:flex;flex-direction:row;gap:22px;background:var(--bg-card);
      border:1px solid var(--border-softer);border-radius:var(--radius);
      padding:26px;position:relative;overflow:hidden;transition:.3s;
    }
    .book:hover{transform:translateY(-3px);box-shadow:0 18px 40px -26px rgba(15,77,58,.4);}
    .bk-cover{flex:none;width:128px;aspect-ratio:772/1021;border-radius:9px;overflow:hidden;
      background-size:cover;background-position:center;background-color:var(--bg-alt);align-self:flex-start;
      box-shadow:0 14px 30px -12px rgba(15,77,58,.55);border:1px solid rgba(200,164,92,.45);}
    .cover-karkard{background-image:url("../img/book-karkard-cover-sm.webp");}
    .cover-nafar-sevom{background-image:url("../img/nafar-sevom-cover.webp");display:block;}
    .bk-main{flex:1;min-width:0;display:flex;flex-direction:column;}
    .book .bk-badge{
      align-self:flex-start;font-family:var(--font-display);font-size:11.5px;font-weight:600;
      color:#fff;background:var(--bk,var(--accent));padding:4px 12px;border-radius:100px;margin-bottom:14px;
    }
    .book .bk-name{font-family:var(--font-display);font-weight:800;color:var(--primary);font-size:20px;line-height:1.35;}
    .book .bk-sub{color:var(--bk,var(--accent-dark));font-weight:600;font-size:13.5px;margin-top:7px;}
    .book .bk-pub{color:var(--text-soft);font-size:13px;margin-top:4px;}
    .book .bk-desc{color:var(--text-soft);font-size:14px;line-height:1.75;margin-top:12px;flex:1;}
    .book .bk-link{
      margin-top:18px;align-self:flex-start;display:inline-flex;align-items:center;gap:8px;
      font-family:var(--font-display);font-weight:600;font-size:14px;color:var(--bk,var(--primary));
      padding:9px 18px;border:1px solid var(--bk,var(--border-soft));border-radius:100px;transition:.25s;
    }
    .book .bk-link:hover{background:var(--bk,var(--primary));color:#fff;}
    .book .bk-link svg{width:15px;height:15px;}

    .books-progress{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:22px;}
    .book-soon{
      border:1px dashed var(--border-soft);border-radius:var(--radius);
      padding:22px 24px;background:transparent;display:flex;align-items:center;gap:16px;
    }
    .book-soon .bs-mark{flex:none;width:12px;height:12px;transform:rotate(45deg);border-radius:2px;background:var(--bk,var(--accent));opacity:.65;}
    .book-soon .bs-name{font-family:var(--font-display);font-weight:700;color:var(--primary);font-size:16px;}
    .book-soon .bs-tag{font-size:12.5px;color:var(--text-soft);margin-top:2px;}

    /* ============ ارتباط ============ */
    .contact-sec{grid-column:span 12;
      background:linear-gradient(180deg, rgba(200,164,92,.11), rgba(200,164,92,.03));
      border:1px solid rgba(200,164,92,.38);border-radius:var(--radius);padding:38px 34px;}
    .contact-head{text-align:center;margin-bottom:24px;}
    .contact-head .card-title{margin:12px 0 4px;}
    .contact-hint{font-size:13.5px;color:var(--text-soft);}
    .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;}
    .contact-btn{
      display:flex;align-items:center;gap:18px;padding:22px 26px;
      background:var(--bg-card);border:1px solid var(--border-softer);border-radius:var(--radius);
      transition:.3s;position:relative;
    }
    .contact-btn:hover{transform:translateY(-3px);border-color:var(--accent);box-shadow:0 18px 40px -26px rgba(15,77,58,.4);}
    .contact-btn .c-icon{flex:none;width:52px;height:52px;border-radius:50%;overflow:hidden;background:#0f1420;
      display:flex;align-items:center;justify-content:center;border:1px solid var(--border-soft);}
    .contact-btn .c-icon img{width:100%;height:100%;object-fit:cover;}
    .contact-btn .c-icon svg{width:100%;height:100%;display:block;}
    .contact-btn .c-info .c-name{font-family:var(--font-display);font-weight:700;color:var(--primary);font-size:16px;}
    .contact-btn .c-info .c-do{font-size:13.5px;color:var(--text-soft);margin-top:2px;display:flex;align-items:center;gap:6px;}
    .contact-btn .c-info .c-do::after{content:'←';color:var(--accent);transition:transform .25s;}
    .contact-btn:hover .c-info .c-do::after{transform:translateX(-4px);}

    /* ============ راهبرد طلبگی (مُهرِ پایانی) ============ */
    .seal{
      grid-column:span 12;margin-top:6px;
      background:
        radial-gradient(circle at 50% 0%, rgba(200,164,92,.14), transparent 60%),
        linear-gradient(160deg,var(--primary),var(--primary-dark));
      border:1px solid var(--primary-light);border-radius:var(--radius);
      padding:50px 34px 44px;text-align:center;position:relative;overflow:hidden;
    }
    .seal::before,.seal::after{content:'';position:absolute;width:60px;height:60px;border:1px solid rgba(200,164,92,.45);}
    .seal::before{top:16px;right:16px;border-bottom:none;border-left:none;}
    .seal::after{bottom:16px;left:16px;border-top:none;border-right:none;}
    .seal .seal-eyebrow{
      font-family:var(--font-display);font-weight:600;font-size:12.5px;color:var(--accent-light);
      letter-spacing:.06em;display:inline-block;padding:5px 16px;border:1px solid rgba(200,164,92,.4);border-radius:100px;
    }
    .seal .attrib{margin-top:24px;color:var(--accent-light);font-size:15px;font-weight:600;font-family:var(--font-display);}
    .seal .hadith{
      margin:16px auto 0;max-width:40em;color:#F6EFDF;font-size:clamp(19px,2.6vw,26px);
      line-height:2.05;font-weight:500;direction:rtl;
    }
    .seal .gloss{
      margin:26px auto 0;max-width:36em;color:rgba(246,239,223,.78);font-size:15px;line-height:1.9;
      padding-top:20px;border-top:1px solid rgba(200,164,92,.25);
    }
    .seal .src{margin-top:16px;font-size:12px;color:rgba(246,239,223,.55);}
    .seal .src a{color:var(--accent-light);border-bottom:1px dotted rgba(200,164,92,.5);}

    /* ============ FOOTER (هماهنگ با صفحه‌ی اصلی) ============ */
    .footer{
      position:relative;margin-top:46px;
      background-image:url("../img/footer-bg.webp");
      background-size:cover;background-position:center;
      color:#F4ECE0;padding:88px 0 30px;overflow:hidden;
    }
    .footer::before{content:'';position:absolute;inset:0;pointer-events:none;
      background:linear-gradient(180deg,rgba(12,26,19,.55),rgba(12,26,19,.42));}
    .footer-inner{position:relative;z-index:2;}
    .footer-brand{text-align:center;margin-bottom:56px;}
    .footer-brand .logo-wrap{
      width:116px;height:116px;margin:0 auto;border-radius:50%;
      background:rgba(244,236,224,.96);display:grid;place-items:center;
      border:1px solid rgba(200,164,92,.5);
      box-shadow:0 6px 24px rgba(0,0,0,.25), inset 0 0 0 6px rgba(200,164,92,.1);position:relative;}
    .footer-brand .logo-wrap::before{content:'';position:absolute;inset:-8px;border-radius:50%;border:1px solid rgba(200,164,92,.25);}
    .footer-brand .logo-wrap img{width:78px;height:78px;object-fit:contain;}
    .footer-brand h3{font-family:var(--font-display);font-size:22px;font-weight:700;margin-top:16px;color:#F4ECE0;text-shadow:0 2px 8px rgba(0,0,0,.8),0 1px 3px rgba(0,0,0,.9);}
    .footer-brand p{font-size:14px;color:rgba(244,236,224,.92);margin-top:8px;text-shadow:0 1px 4px rgba(0,0,0,.7);}
    .footer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:44px;margin-bottom:44px;}
    .footer-col h4{font-size:15px;font-weight:600;color:var(--accent-light);margin-bottom:18px;letter-spacing:.05em;text-shadow:0 2px 6px rgba(0,0,0,.8);}
    .footer-col ul{list-style:none;}
    .footer-col li{margin-bottom:10px;}
    .footer-col a{font-size:14.5px;color:rgba(244,236,224,.95);transition:color .25s ease;text-shadow:0 1px 4px rgba(0,0,0,.8);}
    .footer-col a:hover{color:var(--accent);}
    .footer-social{display:flex;flex-direction:column;gap:14px;margin-top:8px;}
    .social-btn{display:flex;align-items:center;gap:14px;padding:13px 16px;border-radius:12px;
      background:rgba(15,30,22,.45);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
      border:1px solid rgba(200,164,92,.4);transition:all .3s ease;}
    .social-btn .social-icon{width:42px;height:42px;border-radius:10px;overflow:hidden;background:#0f1420;display:grid;place-items:center;flex-shrink:0;transition:transform .3s ease;}
    .social-btn .social-icon img{width:100%;height:100%;object-fit:cover;}
    .social-btn .social-icon svg{width:100%;height:100%;display:block;}
    .social-btn .social-info{display:flex;flex-direction:column;gap:2px;line-height:1.3;}
    .social-btn .social-info .name{font-size:15px;font-weight:600;color:#F4ECE0;text-shadow:0 1px 4px rgba(0,0,0,.7);}
    .social-btn .social-info .handle{font-size:12px;color:rgba(244,236,224,.85);font-family:var(--font-accent);letter-spacing:.02em;direction:ltr;text-align:right;text-shadow:0 1px 3px rgba(0,0,0,.7);}
    .social-btn:hover{background:rgba(200,164,92,.16);border-color:var(--accent);transform:translateY(-2px);}
    .social-btn:hover .social-icon{transform:scale(1.06);}
    .social-btn:hover .social-info .name{color:var(--accent-light);}
    .footer-bottom{border-top:1px solid rgba(244,236,224,.25);padding-top:22px;text-align:center;font-size:13px;color:rgba(244,236,224,.85);line-height:1.8;text-shadow:0 1px 4px rgba(0,0,0,.8);}

    /* نشانه‌ی ورود */
    .enter-cue{position:relative;z-index:1;margin:24px auto 0;width:max-content;display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--accent-dark);animation:cueBounce 2.2s ease-in-out infinite;}
    .enter-cue .ec-diamond{font-size:9px;transform:rotate(45deg);color:var(--accent);}
    @keyframes cueBounce{0%,100%{transform:translateY(0);}50%{transform:translateY(6px);}}

    /* ============ reveal ============ */
    .js .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease;}
    .js .reveal.visible{opacity:1;transform:none;}

    /* ============ ریسپانسیو ============ */
    @media (max-width:900px){
      .hero{padding:122px 0 26px;}
      .hero-panel{grid-template-columns:1fr;gap:22px;justify-items:center;text-align:center;padding:44px 22px 30px;}
      .portrait-wrap{max-width:220px;width:100%;margin:-64px 0 6px;}
      .gereh-hero{left:50%;transform:translate(-50%,-50%);}
      .hero-intro{margin-inline:auto;}
      .hero-role{margin-top:16px;}
      .col-7,.col-5,.col-6{grid-column:span 12;}
      .oct-card{grid-column:span 12;}
      .brand img{height:64px;}
      .site-header .inner{padding:8px 20px;}
      .bk-cover{width:104px;}
      .steps{grid-template-columns:1fr;gap:26px;}
      .steps::before{display:none;}
      .step{text-align:right;display:grid;grid-template-columns:34px 1fr;gap:14px;align-items:start;padding:0;}
      .step .st-node{margin:0; grid-column:1; grid-row:1 / span 2;}
      .step .st-role{text-align:right; grid-column:2; grid-row:1;}
      .step .st-body{grid-column:2; grid-row:2; text-align:right;}
      .books-grid,.books-progress,.contact-grid{grid-template-columns:1fr;}
      .botanical{display:none;}
      .ascent{grid-template-columns:1fr;}
      .ascent-step{margin-bottom:0;}
      .footer-grid{grid-template-columns:repeat(2,1fr);gap:32px;}
    }
    @media (max-width:560px){
      .footer-grid{grid-template-columns:1fr;gap:28px;text-align:center;}
      .footer-social{align-items:center;}
    }
    @media (prefers-reduced-motion:reduce){
      .js .reveal{opacity:1;transform:none;transition:none;}
      .enter-cue{animation:none;}
      html{scroll-behavior:auto;}
    }

/* --- navbar single-line fix --- */
.nav-main{flex-wrap:nowrap}
.nav-main>li{flex:0 0 auto}
.nav-main a{white-space:nowrap}