/* (أُزيل خط Anton المضمّن — ما كان مستخدم وكان يضيف ٤٠٠ كيلوبايت لكل صفحة) */
  :root{
    --paper:#ffffff;
    --paper-deep:#f7f4ec;
    --paper-card:#fbfaf5;
    --ink:#1c1712;
    --ink-soft:#59503f;
    --ink-faint:#8a7d64;
    --title-color:#1c1712;
    --excerpt-color:#59503f;
    --line:#e6ded0;
    --accent:#7a1f2a;
    --accent-deep:#571620;
    --radius-card:2px;
    --maxw:1180px;
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;background:#ffffff !important;min-height:100%;}
  body{
    background:#ffffff !important;
    min-height:100vh;
    color:var(--ink);
    font-family:'IBM Plex Sans Arabic',sans-serif;
    overflow-x:hidden;
  }
  .kufi{font-family:'IBM Plex Sans Arabic',sans-serif;}
  .naskh{font-family:'IBM Plex Sans Arabic',sans-serif;}
  /* Anton has no Arabic glyphs — Arabic characters fall back automatically
     to Noto Naskh Arabic, while digits / Latin fragments render in Anton. */
  .anton{font-family:'IBM Plex Sans Arabic',sans-serif;}
  a{color:inherit;text-decoration:none;}
  img,svg{max-width:100%;display:block;}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px;}

  .grain{
    position:fixed;inset:0;pointer-events:none;z-index:1;opacity:.035;mix-blend-mode:multiply;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }
  /* ===== Nav ===== */
  header.main{position:sticky;top:0;z-index:40;background:var(--paper);border-bottom:1px solid var(--line);}
  nav{display:flex;align-items:center;justify-content:space-between;height:66px;}
  .logo{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:20px;font-weight:700;letter-spacing:-.4px;cursor:pointer;display:inline-flex;align-items:center;gap:9px;}
  .logo::before{content:'';width:9px;height:9px;background:var(--accent);border-radius:1px;flex:none;}
  .logo span{color:var(--accent);}
  .nav-links{display:flex;gap:24px;font-size:13.5px;font-weight:500;list-style:none;}
  .nav-links a{position:relative;padding:4px 0;color:var(--ink-soft);cursor:pointer;}
  .nav-links a:hover,.nav-links a.active{color:var(--ink);}
  .nav-links a::after{content:"";position:absolute;right:0;bottom:-2px;width:0;height:1px;background:var(--accent);transition:width .25s ease;}
  .nav-links a:hover::after,.nav-links a.active::after{width:100%;}
  .nav-actions{display:flex;align-items:center;gap:18px;}
  .icon-btn{background:none;border:none;cursor:pointer;color:var(--ink-soft);display:flex;align-items:center;padding:4px;}
  .icon-btn:hover{color:var(--accent);}
  .cta-btn{background:var(--ink);color:var(--paper);font-size:12.5px;font-weight:600;padding:8px 16px;border-radius:2px;border:1px solid var(--ink);white-space:nowrap;}
  .cta-btn:hover{background:var(--accent);border-color:var(--accent);}
  .burger{display:none;background:none;border:none;color:var(--ink);cursor:pointer;}
  .mobile-cta{display:none;}
  @media (max-width:900px){
    .nav-actions .cta-btn{display:none;}
    .burger{display:inline-flex;align-items:center;justify-content:center;}
    .nav-links{
      display:flex;flex-direction:column;gap:0;
      position:absolute;top:calc(100% + 1px);right:0;left:0;
      background:var(--paper);border-bottom:1px solid var(--line);
      padding:0 28px;z-index:50;
      max-height:0;overflow:hidden;opacity:0;visibility:hidden;
      transform:translateY(-6px);
      transition:max-height .38s cubic-bezier(.22,.9,.24,1), opacity .28s ease,
                 transform .32s ease, visibility 0s linear .38s, padding .38s ease;
      box-shadow:0 18px 40px rgba(28,23,18,.1);
    }
    .nav-links.mobile-open{
      max-height:640px; opacity:1; visibility:visible; transform:translateY(0);
      padding:8px 28px 20px;
      transition:max-height .42s cubic-bezier(.22,.9,.24,1), opacity .32s ease .05s,
                 transform .38s ease, padding .42s ease;
    }
    .nav-links li{border-bottom:1px solid var(--line);}
    .nav-links li:last-child{border-bottom:none;}
    .nav-links a{display:block;padding:16px 0;font-size:15.5px;}
    .mobile-cta{display:block;margin-top:14px;}
    .mobile-cta .cta-btn{display:inline-block;}
  }
  @media (min-width:901px){
    .burger{display:none;}
    .mobile-cta{display:none;}
  }

  /* ===== Section heading ===== */
  .section{padding:48px 0;border-bottom:1px solid var(--line);}
  .section:last-of-type{border-bottom:none;}
  .section-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:28px;gap:16px;flex-wrap:wrap;}
  .section-title{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:23px;font-weight:700;display:flex;align-items:baseline;gap:12px;}
  .section-title small{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:14px;font-weight:400;color:var(--ink-faint);}
  .section-eyebrow{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--ink-faint);margin-bottom:10px;letter-spacing:.3px;}
  .section-eyebrow .num{font-family:'IBM Plex Sans Arabic',sans-serif;color:var(--accent);font-size:13px;}
  .section-eyebrow .ln{width:28px;height:1px;background:var(--line);}
  .section-intro{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:14.5px;color:var(--ink-faint);max-width:540px;line-height:1.85;margin-top:8px;}

  /* headline hover-reveal underline — used across cards site-wide */
  .author-list-item h3,.interview-card h4,.author-card h4{
    position:relative;display:inline-block;transition:color .25s ease;
  }
  .author-list-item h3::after,.interview-card h4::after,.author-card h4::after{
    content:"";position:absolute;right:0;bottom:-2px;width:0;height:1px;background:var(--accent);transition:width .35s ease;
  }
  .author-list-item:hover h3,.interview-card:hover h4,.author-card:hover h4{color:var(--accent);}
  .author-list-item:hover h3::after,.interview-card:hover h4::after,.author-card:hover h4::after{width:100%;}

  /* alternating section rhythm */
  .experimental .section-title{letter-spacing:1px;}

  /* ===== Latest writings magazine grid ===== */

  /* صورة تعطّلت أو لم تصل — بديل أنيق بدل أيقونة الصورة المكسورة */
  .cover.img-fallback{background:var(--ink);}
  .cover.img-fallback img{display:none;}
  .mz-tagbox{align-self:flex-start;background:var(--accent);color:#fff;font-family:'IBM Plex Sans Arabic',sans-serif;
    font-size:11px;font-weight:600;padding:4px 12px;border-radius:2px;margin-bottom:10px;letter-spacing:.3px;}
  .mz-byline{font-size:12px;color:rgba(255,255,255,.78);font-weight:600;}

  /* ===== المقالات العادية المفردة — بدون حركة وبدون صورة الكاتب ===== */
  .mz-card{cursor:pointer;}
  .mz-card .cover{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--ink);}
  .mz-card .cover img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(45%) saturate(.7) brightness(.8) contrast(1.08);}
  .mz-card .cover .mz-tagbox{position:absolute;bottom:10px;right:10px;margin:0;padding:4px 10px;font-size:10px;}
  .mz-card h4{font-family:'IBM Plex Sans Arabic',sans-serif;font-weight:700;font-size:14px;line-height:1.4;margin:10px 0 5px;}
  .mz-card:hover h4{color:var(--accent);}
  .mz-card p{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:12.5px;color:var(--ink-soft);line-height:1.65;
    margin-bottom:8px;-webkit-line-clamp:2;line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;}
  .mz-card .mz-byline{color:var(--ink-faint);font-size:11.5px;}
  .mz-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}

  /* المسافة بين لوحة "أحدث المقالات" والشبكة التي تليها — صغيرة ومتناسقة بدل الفراغ الكبير */
  #writings{padding-top:28px;}


  /* ===== Authors ===== */
  .authors-row{display:flex;gap:24px;overflow-x:auto;padding-bottom:8px;scrollbar-width:thin;}
  .author-card{display:block;min-width:200px;flex:1;background:var(--paper-card);border:1px solid var(--line);padding:18px 16px;cursor:pointer;}
  .author-card:hover{border-color:var(--accent);}
  .avatar{width:44px;height:44px;border-radius:50%;background:var(--ink);color:var(--paper);display:flex;align-items:center;justify-content:center;font-family:'IBM Plex Sans Arabic',sans-serif;font-size:16px;margin-bottom:12px;overflow:hidden;}
  .author-card h4{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:15.5px;margin-bottom:5px;}
  .author-card .role{font-size:12.5px;color:var(--accent);margin-bottom:12px;}
  .author-card p{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:13px;color:var(--ink-soft);line-height:1.6;margin-bottom:12px;}
  .author-card .stats{display:flex;gap:14px;font-size:12px;color:var(--ink-faint);border-top:1px solid var(--line);padding-top:12px;}

  /* ===== Books ===== */
  

  /* ===== Texts (poetic) teaser ===== */
  .texts-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
  .text-card{padding:24px 22px;border:1px solid var(--line);background:var(--paper-card);}
  .text-card .tag{font-size:12px;color:var(--accent);margin-bottom:18px;display:block;}
  .text-card p{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:16px;line-height:1.85;color:var(--ink);}
  .text-card .who{margin-top:22px;font-size:13px;color:var(--ink-faint);}

  /* ===== Interviews ===== */
  .interview-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
  .interview-card{display:grid;grid-template-columns:92px 1fr;gap:16px;border:1px solid var(--line);padding:18px;background:var(--paper-card);}
  .interview-card .avatar{width:100%;height:92px;border-radius:2px;font-size:20px;margin-bottom:0;}
  .interview-card h4{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:16px;margin-bottom:6px;}
  .interview-card p.q{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:13.5px;color:var(--ink-soft);line-height:1.65;}

  /* ===== Archive teaser ===== */

  /* ===== Experimental section — deliberately breaks the grid ===== */
  .experimental{background:var(--ink);color:var(--paper);}
  .experimental .section-eyebrow{color:var(--ash,#8a7d64);}
  .experimental .section-eyebrow .ln{background:rgba(242,234,217,.25);}
  .experimental .section-title{color:var(--paper);}
  .experimental .section-title small{color:rgba(242,234,217,.5);}
  .experimental .exp-intro{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:15px;color:rgba(242,234,217,.65);max-width:560px;line-height:1.9;margin-top:6px;}
  .exp-piece{margin-top:28px;}
  .exp-piece-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px;flex-wrap:wrap;gap:8px;}
  .exp-author{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:15px;color:var(--paper);}
  .exp-template-label{font-size:12px;color:rgba(242,234,217,.5);}

  /* ===== Poetry dice — شريط داكن احترافي متناسق مع لوحة المقالات تحته، بمساحة صغيرة قبلها ===== */
  .dice-mini{background:var(--paper);padding:14px 0;border-bottom:1px solid var(--line);}
  .dice-mini-area{display:flex;align-items:center;gap:18px;}
  .dice-stage{
    perspective:700px;flex:0 0 auto;width:44px;height:44px;
    display:flex;align-items:center;justify-content:center;position:relative;
  }
  .dice-cube{
    position:relative;width:34px;height:34px;transform-style:preserve-3d;cursor:pointer;
    transform:rotateX(-20deg) rotateY(32deg);
    transition:transform 1.2s cubic-bezier(.22,.9,.24,1);
  }
  .dice-cube.rolling{transition:transform 1.35s cubic-bezier(.13,.86,.2,1);}
  .dice-stage:hover .dice-cube:not(.rolling){transform:rotateX(-26deg) rotateY(44deg);}
  .dice-face{
    position:absolute;inset:0;width:34px;height:34px;
    background:var(--paper-card);
    border:1px solid var(--line);border-radius:5px;
    box-shadow:inset 0 0 0 1px rgba(28,23,18,.04),0 1px 2px rgba(28,23,18,.08);
    display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);padding:5px;
  }
  .f-front{transform:translateZ(17px);}
  .f-back{transform:rotateY(180deg) translateZ(17px);}
  .f-right{transform:rotateY(90deg) translateZ(17px);}
  .f-left{transform:rotateY(-90deg) translateZ(17px);}
  .f-top{transform:rotateX(90deg) translateZ(17px);}
  .f-bottom{transform:rotateX(-90deg) translateZ(17px);}
  .f-top{filter:brightness(1.03);}
  .f-bottom,.f-left,.f-back{filter:brightness(.97);}
  .pip{
    width:4px;height:4px;border-radius:50%;place-self:center;
    background:var(--ink-faint);
  }
  .f-front .pip,.f-right .pip,.f-bottom .pip{
    background:var(--accent);
  }
  .pos-a{grid-area:1/1;} .pos-c{grid-area:1/3;} .pos-d{grid-area:2/1;}
  .pos-e{grid-area:2/2;} .pos-f{grid-area:2/3;} .pos-g{grid-area:3/1;} .pos-i{grid-area:3/3;}
  .dice-quote{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:14px;line-height:1.5;color:var(--ink-soft);
    opacity:0;transform:translateX(-14px);transition:opacity .5s ease,transform .5s ease;}
  .dice-quote.show{opacity:1;transform:translateX(0);}

  #page-home,#page-author,#page-article{transition:opacity .3s ease,transform .3s ease;opacity:1;transform:translateY(0);}
  #page-home.page-leaving,#page-author.page-leaving,#page-article.page-leaving{opacity:0;transform:translateY(10px);}

  .exp-stage{min-height:220px;position:relative;border:1px solid rgba(242,234,217,.15);padding:24px;overflow:hidden;}
  .exp-line{color:var(--paper);font-family:'IBM Plex Sans Arabic',sans-serif;}

  /* عمودي */
  .exp-stage[data-template="vertical"]{display:flex;flex-direction:row-reverse;align-items:flex-start;gap:22px;height:220px;}
  .exp-stage[data-template="vertical"] .exp-line{writing-mode:vertical-rl;font-size:17px;line-height:1.9;opacity:.92;}
  .exp-stage[data-template="vertical"] .exp-line:nth-child(2){color:var(--accent);}

  /* أفقي */
  .exp-stage[data-template="horizontal"] .exp-line{display:block;font-size:clamp(1.1rem,3.4vw,2.2rem);line-height:1.4;margin:4px 0;}
  .exp-stage[data-template="horizontal"] .exp-line:nth-child(1){opacity:.55;}
  .exp-stage[data-template="horizontal"] .exp-line:nth-child(2){color:var(--accent);margin-right:40px;}
  .exp-stage[data-template="horizontal"] .exp-line:nth-child(3){opacity:.8;margin-right:60px;font-size:clamp(.85rem,2.2vw,1.4rem);}

  /* متراكب */
  .exp-stage[data-template="stack"]{height:220px;}
  .exp-stage[data-template="stack"] .exp-line{position:absolute;font-size:1.6rem;}
  .exp-stage[data-template="stack"] .exp-line:nth-child(1){top:15%;right:8%;opacity:.85;}
  .exp-stage[data-template="stack"] .exp-line:nth-child(2){top:42%;right:26%;opacity:.5;color:var(--accent);font-size:2rem;}
  .exp-stage[data-template="stack"] .exp-line:nth-child(3){bottom:12%;right:14%;opacity:.7;font-size:1.25rem;}

  /* متحرك */
  .exp-stage[data-template="motion"] .exp-line{display:block;font-size:1.45rem;margin:8px 0;opacity:0;transform:translateY(14px);animation:expIn 1.3s ease forwards;}
  .exp-stage[data-template="motion"] .exp-line:nth-child(1){animation-delay:.1s;}
  .exp-stage[data-template="motion"] .exp-line:nth-child(2){animation-delay:.55s;color:var(--accent);}
  .exp-stage[data-template="motion"] .exp-line:nth-child(3){animation-delay:1s;}
  @keyframes expIn{to{opacity:1;transform:translateY(0);}}

  @media (max-width:700px){
    .exp-stage[data-template="vertical"]{height:240px;}
    .exp-stage[data-template="stack"]{height:240px;}
    .exp-stage{padding:22px;}
  }

  /* ===== Footer ===== */
  footer{padding:44px 0 28px;}
  .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px;margin-bottom:32px;}
  .footer-brand .logo{margin-bottom:14px;}
  .footer-brand p{font-family:'IBM Plex Sans Arabic',sans-serif;color:var(--ink-soft);font-size:14.5px;line-height:1.8;max-width:280px;}
  .footer-col h5{font-size:13px;color:var(--ink-faint);margin-bottom:16px;font-weight:600;}
  .footer-col ul{list-style:none;display:flex;flex-direction:column;gap:11px;}
  .footer-col a{font-size:14px;color:var(--ink-soft);}
  .footer-col a:hover{color:var(--accent);}
  .footer-bottom{border-top:1px solid var(--line);padding-top:26px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;}
  .footer-bottom .tagline{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:14px;color:var(--ink-faint);}
  .footer-bottom .copy{font-size:12.5px;color:var(--ink-faint);}

  /* ===== Article reader page ===== */
  .article-hero{padding:36px 0 28px;border-bottom:1px solid var(--line);}
  .article-crumb{font-size:13px;color:var(--ink-faint);margin-bottom:22px;}
  .article-crumb a{cursor:pointer;color:var(--ink-soft);}
  .article-crumb a:hover{color:var(--accent);}
  .article-cat{font-size:12px;color:var(--accent);display:block;margin-bottom:16px;}
  .article-title{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:clamp(1.4rem,3.2vw,2.1rem);line-height:1.4;max-width:760px;color:var(--title-color);}
  .article-meta{display:flex;gap:18px;margin-top:24px;font-size:13px;color:var(--ink-faint);flex-wrap:wrap;}
  .article-meta .author-link{cursor:pointer;color:var(--ink-soft);}
  .article-meta .author-link:hover{color:var(--accent);}
  .article-body{max-width:680px;margin:0 auto;padding:30px 16px;}
  .article-body p{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:15px;line-height:1.85;color:var(--ink);margin-bottom:18px;}
  .article-body p.lede{font-size:16px;color:var(--excerpt-color);}


  /* ===== Author profile page ===== */
  .author-hero{padding:44px 0 36px;border-bottom:1px solid var(--line);}
  .author-hero .wrap{display:grid;grid-template-columns:112px 1fr;gap:24px;align-items:center;}
  .author-hero h1{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:clamp(1.6rem,3vw,2.3rem);margin-bottom:8px;}
  .author-hero .role{font-size:15px;color:var(--accent);margin-bottom:18px;}
  .author-hero .bio{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:14.5px;line-height:1.75;color:var(--ink-soft);max-width:640px;margin-bottom:18px;}
  .author-stats{display:flex;gap:34px;flex-wrap:wrap;}
  .author-stats .num{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:22px;color:var(--ink);line-height:1;}
  .author-stats .lbl{font-size:12.5px;color:var(--ink-faint);margin-top:6px;}
  .btn-copy-profile{
    display:inline-flex; align-items:center; gap:8px; margin-top:22px;
    padding:9px 16px; border:1px solid var(--line); border-radius:2px;
    background:transparent; color:var(--ink-soft); font-family:'IBM Plex Sans Arabic',sans-serif;
    font-size:13.5px; cursor:pointer; transition:all .2s ease;
  }
  .btn-copy-profile:hover{ border-color:var(--accent); color:var(--accent); }
  .author-list{display:flex;flex-direction:column;}
  .author-list-item{display:grid;grid-template-columns:1fr auto;gap:16px;padding:18px 0;border-bottom:1px solid var(--line);align-items:start;}
  .author-list-item:first-child{padding-top:0;}
  .author-list-item .tag{font-size:12px;color:var(--accent);margin-bottom:8px;display:block;}
  .author-list-item h3{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:17px;margin-bottom:6px;line-height:1.45;}
  .author-list-item p{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:13.5px;color:var(--ink-soft);line-height:1.65;max-width:600px;}
  .author-list-item .when{font-size:12.5px;color:var(--ink-faint);white-space:nowrap;padding-top:4px;}

  /* ===== mobile ===== */
  @media (max-width:900px){
    .nav-actions .cta-btn{display:none;}
    .burger{display:block;}
    .mz-grid{grid-template-columns:repeat(2,1fr);}
    .texts-grid,.interview-grid{grid-template-columns:1fr;}
    .footer-grid{grid-template-columns:1fr 1fr;gap:32px;}
    .interview-card{grid-template-columns:80px 1fr;}
    .interview-card .avatar{height:80px;}
    .author-hero{padding:44px 0 40px;}
    .author-hero .wrap{grid-template-columns:1fr;text-align:center;}
    .author-stats{justify-content:center;}
    .btn-copy-profile{margin-left:auto;margin-right:auto;}
    .author-list-item{grid-template-columns:1fr;}
  }
  @media (max-width:560px){
    .wrap{padding:0 18px;}
    .mz-grid{grid-template-columns:1fr;}
    .footer-grid{grid-template-columns:1fr;}
    .section{padding:36px 0;}

    /* تصغير عام لعناصر قائمة المقالات على الجوال — كانت تبين كبيرة جدًا بالتمرير */
    .feed-item{ padding:24px 0; }
    .feed-cover{ margin-bottom:14px; aspect-ratio:16/10; }
    .feed-title{ font-size:15.5px; margin-bottom:6px; }
    .feed-excerpt{ font-size:14px; line-height:1.75; margin-bottom:12px; }
    .feed-eyebrow{ font-size:12px; margin-bottom:6px; }
    .feed-avatar{ width:26px; height:26px; }
    .feed-author-name{ font-size:13px; }
    .article-title{ font-size:19px !important; }
  }
  /* ============================================================
     أنماط واجهات الأقسام — كل قسم له طابع بصري مختلف تمامًا
     ============================================================ */

  /* ---- بانر واحد كبير (مقالات) : صورة واحدة كاملة العرض ---- */

  /* ---- بانر نصّي/شعري (شعر وقصة قصيرة) : بلا صور، ورقي الطابع ---- */
  .quote-hero{background:var(--paper-deep);border-bottom:1px solid var(--line);padding:44px 0;position:relative;overflow:hidden;}
  .quote-hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.22;filter:grayscale(45%) saturate(.75) brightness(.85) contrast(1.05);z-index:0;}
  .quote-hero-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg, var(--paper-deep) 0%, rgba(247,244,236,.55) 45%, var(--paper-deep) 100%);}
  .quote-hero .ghost-mark{position:absolute;top:-10px;left:-6px;font-size:min(30vw,300px);font-weight:700;color:var(--ink);opacity:.035;line-height:1;user-select:none;white-space:nowrap;z-index:1;}
  .quote-hero-inner{position:relative;z-index:2;max-width:760px;}
  .quote-hero q{display:block;font-family:'IBM Plex Sans Arabic',sans-serif;font-weight:600;font-size:clamp(1.25rem,2.4vw,1.8rem);line-height:1.65;color:var(--ink);quotes:none;margin-bottom:14px;}
  .quote-hero cite{font-style:normal;font-size:14px;color:var(--ink-faint);}

  /* ---- بانر بورتريه (حوارات) : صورة شخصية كبيرة + اقتباس ---- */
  .portrait-hero{background:var(--ink);color:var(--paper);padding:36px 0;}
  .portrait-hero .wrap{display:grid;grid-template-columns:112px 1fr;gap:24px;align-items:center;}
  .portrait-hero .p-avatar{width:112px;height:112px;border-radius:50%;background:var(--accent);color:#fff;overflow:hidden;
    display:flex;align-items:center;justify-content:center;font-family:'IBM Plex Sans Arabic',sans-serif;font-size:28px;font-weight:700;flex:none;}
  .portrait-hero .p-avatar img{width:100%;height:100%;object-fit:cover;filter:grayscale(30%) saturate(.85) brightness(.95);}
  .portrait-hero h2{font-family:'IBM Plex Sans Arabic',sans-serif;font-weight:700;font-size:clamp(17px,2.2vw,23px);margin-bottom:8px;line-height:1.35;}
  .portrait-hero p{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:14.5px;line-height:1.8;color:rgba(242,234,217,.75);max-width:600px;}
  @media (max-width:700px){.portrait-hero .wrap{grid-template-columns:1fr;text-align:center;}.portrait-hero .p-avatar{margin:0 auto;}}

  /* ---- بانر فسيفساء (فوتوغراف) : شبكة صور متفاوتة الحجم ---- */
  .mosaic-hero{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,86px);gap:6px;margin-bottom:0;}
  .mosaic-hero a{position:relative;overflow:hidden;display:block;background:#000;}
  .mosaic-hero img{width:100%;height:100%;object-fit:cover;filter:grayscale(40%) saturate(.75) brightness(.8) contrast(1.08);}
  .mosaic-hero a:nth-child(1){grid-row:span 2;grid-column:span 2;}
  @media (max-width:700px){.mosaic-hero{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(3,90px);}
    .mosaic-hero a:nth-child(1){grid-column:span 2;grid-row:span 1;}}

  /* ---- شريط داكن (تجريب) : عنوان القسم فوق خلفية داكنة ---- */
  .dark-band-hero{background:var(--ink);color:var(--paper);padding:36px 0 30px;position:relative;overflow:hidden;}
  .dark-band-hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.28;filter:grayscale(50%) brightness(.6);z-index:0;}
  .dark-band-hero .wrap{position:relative;z-index:1;}
  .dark-band-hero .section-eyebrow{color:rgba(242,234,217,.55);}
  .dark-band-hero .section-title{color:var(--paper);}
  .dark-band-hero .section-title small{color:rgba(242,234,217,.55);}
  .dark-band-hero p{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:14.5px;line-height:1.85;color:rgba(242,234,217,.7);max-width:600px;margin-top:10px;}

  /* ---- بطاقات دخول الأقسام (الصفحة الرئيسية) ---- */
  .sections-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
  @media (max-width:900px){.sections-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:560px){.sections-grid{grid-template-columns:1fr;}}

  /* ---- شريط أدوات صغير: مسار التنقل (breadcrumb) للصفحات ---- */
  .page-crumb{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:13px;color:var(--ink-faint);padding:18px 0 0;}
  .page-crumb a{color:var(--ink-faint);}
  .page-crumb a:hover{color:var(--accent);}


/* بنية إضافية للبانر الرئيسي */
.main .wrap{position:relative}

/* ============================================================
   إصلاحات وتحسينات: نافذة البحث + حركة التمرير الديناميكية
   ============================================================ */

/* ---- نافذة البحث (كانت موجودة في الـHTML وJS لكن بلا أي تنسيق) ---- */
.search-modal{
  position:fixed; inset:0; z-index:200;
  display:flex; align-items:flex-start; justify-content:center;
  padding:12vh 20px 20px;
  opacity:0; visibility:hidden;
  transition:opacity .28s ease, visibility 0s linear .28s;
}
.search-modal.open{ opacity:1; visibility:visible; transition:opacity .28s ease; }
.search-backdrop{
  position:absolute; inset:0;
  background:rgba(20,16,12,.55);
  backdrop-filter:blur(3px);
}
body.search-lock{ overflow:hidden; }
.search-panel{
  position:relative; z-index:1;
  width:100%; max-width:600px;
  background:var(--paper); border:1px solid var(--line);
  border-radius:6px; box-shadow:0 24px 70px rgba(20,16,12,.28);
  transform:translateY(-16px) scale(.98); opacity:0;
  transition:transform .32s cubic-bezier(.22,.9,.24,1), opacity .28s ease;
  max-height:76vh; display:flex; flex-direction:column; overflow:hidden;
}
.search-modal.open .search-panel{ transform:translateY(0) scale(1); opacity:1; }
.search-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 20px; border-bottom:1px solid var(--line); flex:none;
}
.search-head h3{font-family:'IBM Plex Sans Arabic',sans-serif;font-size:16px;font-weight:700;}
.search-close{
  background:none; border:none; cursor:pointer; color:var(--ink-faint);
  font-size:22px; line-height:1; padding:4px 8px; border-radius:4px;
  transition:color .2s ease, background .2s ease;
}
.search-close:hover{ color:var(--accent); background:var(--paper-deep); }
.search-form-wrap{ padding:14px 20px; border-bottom:1px solid var(--line); flex:none; }
.search-input{
  width:100%; border:1px solid var(--line); background:var(--paper-card);
  border-radius:4px; padding:12px 14px; font-size:15px;
  font-family:'IBM Plex Sans Arabic',sans-serif; color:var(--ink);
  outline:none; transition:border-color .2s ease;
}
.search-input:focus{ border-color:var(--accent); }
.search-input::placeholder{ color:var(--ink-faint); }
.search-results{ overflow-y:auto; padding:8px; }
.search-result-item{
  display:flex; align-items:flex-start; gap:12px;
  padding:12px 12px; border-radius:4px; cursor:pointer;
  transition:background .18s ease;
}
.search-result-item:hover,.search-result-item:focus{ background:var(--paper-deep); }
.search-result-item .sr-type{
  flex:none; font-size:11px; color:var(--accent);
  border:1px solid var(--line); border-radius:20px;
  padding:3px 10px; margin-top:2px; white-space:nowrap;
}
.search-result-item .sr-body{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.search-result-item .sr-body strong{
  font-family:'IBM Plex Sans Arabic',sans-serif; font-size:14.5px; color:var(--ink);
  font-weight:600;
}
.search-result-item .sr-body small{
  font-size:12.5px; color:var(--ink-faint); line-height:1.6;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.search-empty{ padding:30px 14px; text-align:center; color:var(--ink-faint); font-size:14px; }
@media (max-width:640px){
  .search-modal{ padding:8vh 12px 12px; }
  .search-panel{ max-height:82vh; }
}

/* ============================================================
   حركة التمرير: تكبير/تصغير وظهور تدريجي للبطاقات والإعلانات
   (reveal-el / in-view تُضاف عبر main.js بواسطة IntersectionObserver)
   ============================================================ */
.reveal-el{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .55s cubic-bezier(.16,.8,.24,1), transform .55s cubic-bezier(.16,.8,.24,1);
  will-change:transform, opacity;
}
.reveal-el.in-view{
  opacity:1;
  transform:translateY(0);
}
/* تدرّج بسيط في التوقيت داخل نفس الشبكة كي لا تظهر كل البطاقات دفعة واحدة */
.mz-grid > .reveal-el:nth-child(2){ transition-delay:.05s; }
.mz-grid > .reveal-el:nth-child(3){ transition-delay:.1s; }
.mz-grid > .reveal-el:nth-child(4){ transition-delay:.15s; }
.authors-row .reveal-el:nth-child(2){ transition-delay:.05s; }
.authors-row .reveal-el:nth-child(3){ transition-delay:.1s; }
.authors-row .reveal-el:nth-child(4){ transition-delay:.15s; }
.interview-grid > .reveal-el:nth-child(2){ transition-delay:.06s; }
.interview-grid > .reveal-el:nth-child(3){ transition-delay:.12s; }
.texts-grid > .reveal-el:nth-child(2){ transition-delay:.08s; }
.mosaic-hero .reveal-el:nth-child(2){ transition-delay:.05s; }
.mosaic-hero .reveal-el:nth-child(3){ transition-delay:.1s; }
.mosaic-hero .reveal-el:nth-child(4){ transition-delay:.15s; }

/* تكبير خفيف إضافي عند مرور المؤشر فوق البطاقات النشطة بصريًا — يعزز إحساس "الحياة" بالواجهة */
.mz-card.in-view:hover{
  transform:scale(1.018) translateY(-4px);
  transition:transform .35s cubic-bezier(.22,.9,.24,1);
}
.author-card.in-view:hover, .interview-card.in-view:hover{
  transform:scale(1.015) translateY(-3px);
  transition:transform .3s ease;
}

/* ---- شريط النرد + المقالات تحته: مسافة ودمج بصري أكثر أناقة ---- */
.dice-mini{ position:relative; border-bottom:none; padding:16px 0 20px; }
.dice-mini-area{ transition:transform .5s ease, opacity .5s ease; }
/* توهّج خفيف بلون الهوية حول النرد — يربطه بصريًا بألوان الكاروسيل تحته */
.dice-stage{ border-radius:50%; transition:box-shadow .4s ease; }
.dice-stage:hover{ box-shadow:0 0 0 10px rgba(122,31,42,.06); }

/* ---- دخول أنيق ومتزامن لكل "واجهات الأقسام" الترويجية عند تحميل الصفحة ---- */
@keyframes heroFadeUp{ from{ opacity:0; transform:translateY(16px);} to{ opacity:1; transform:translateY(0);} }
.mz-featured, .quote-hero-inner, .portrait-hero .wrap, .mosaic-hero,
.dark-band-hero .wrap{
  animation:heroFadeUp .7s .12s cubic-bezier(.22,.9,.24,1) both;
}

/* ---- بطاقات دليل الأقسام (sections.html) — كانت تستخدم أصنافًا بلا أي تنسيق ---- */
.section-cover{
  display:flex; align-items:center; justify-content:center; position:relative;
  background:linear-gradient(135deg, var(--paper-deep) 0%, var(--paper-card) 100%);
}
.section-cover-badge{
  font-family:'IBM Plex Sans Arabic',sans-serif; font-weight:700;
  font-size:32px; color:var(--line);
}
.official-head{ text-align:center; justify-content:center; }
.official-head > div{ margin:0 auto; }
.official-head .section-intro{ margin-left:auto; margin-right:auto; }

/* ---- تفعيل رابط القسم الحالي في القائمة ---- */
.nav-links a.nav-a.active{ color:var(--ink); }
.nav-links a.nav-a.active::after{ width:100%; }

/* احترام تفضيل تقليل الحركة لدى المستخدم */
@media (prefers-reduced-motion:reduce){
  .reveal-el, .search-panel, .search-modal, .dice-mini-area,
  .mz-card, .author-card, .interview-card{
    transition:none !important; animation:none !important;
  }
  .reveal-el{ opacity:1; transform:none; }
}

/* ---- إخفاء بصري مع الإبقاء على العنصر لقارئات الشاشة ومحركات البحث ---- */
.visually-hidden{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* ============================================================
   لمسات احترافية إضافية — نسخة أكثر نضجًا وتناسقًا
   ============================================================ */

/* ---- ظهور الصفحة تدريجيًا عند التحميل (بدون أي اعتماد على JS) ---- */
@keyframes pageFadeIn{ from{ opacity:0; transform:translateY(6px);} to{ opacity:1; transform:translateY(0);} }
body{ animation:pageFadeIn .6s cubic-bezier(.22,.9,.24,1); }

/* ---- ظل خفيف للهيدر عند التمرير — يضيف عمقًا احترافيًا ---- */
header.main{ transition:box-shadow .3s ease, border-color .3s ease; }
header.main.scrolled{ box-shadow:0 6px 24px rgba(28,23,18,.08); border-bottom-color:transparent; }

/* ---- محدد نصي وشريط تمرير بلون هوية الموقع ---- */
::selection{ background:var(--accent); color:#fff; }
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:var(--paper-deep); }
::-webkit-scrollbar-thumb{ background:#cabf9f; border-radius:20px; border:2px solid var(--paper-deep); }
::-webkit-scrollbar-thumb:hover{ background:var(--accent); }
html{ scrollbar-color:#cabf9f var(--paper-deep); }

/* ---- حالة تركيز واضحة عبر لوحة المفاتيح (وصولية احترافية) ---- */
a:focus-visible, button:focus-visible, input:focus-visible, [tabindex]:focus-visible{
  outline:2px solid var(--accent); outline-offset:3px; border-radius:2px;
}

/* ---- نرد الاقتباس: مظهر أكثر رقيًا وانسيابية أنعم ---- */
.dice-stage{ width:38px; height:38px; }
.dice-cube{
  width:28px; height:28px;
  transition:transform 1.4s cubic-bezier(.16,.9,.2,1.04);
}
.dice-cube.rolling{ transition:transform 1.5s cubic-bezier(.1,.85,.15,1.05); }
.dice-face{
  width:28px; height:28px;
  box-shadow:inset 0 0 0 1px rgba(28,23,18,.05), 0 2px 6px rgba(28,23,18,.12);
}
.f-front{transform:translateZ(14px);} .f-back{transform:rotateY(180deg) translateZ(14px);}
.f-right{transform:rotateY(90deg) translateZ(14px);} .f-left{transform:rotateY(-90deg) translateZ(14px);}
.f-top{transform:rotateX(90deg) translateZ(14px);} .f-bottom{transform:rotateX(-90deg) translateZ(14px);}
.dice-stage:hover .dice-cube:not(.rolling){
  transform:rotateX(-28deg) rotateY(48deg) scale(1.06);
}
/* خروج/دخول النص أنيق: تلاشٍ + انزياح + تمويه خفيف بدل الانزلاق الجانبي البسيط */
.dice-quote{
  font-family:'IBM Plex Sans Arabic',sans-serif;font-size:14px;line-height:1.6;color:var(--ink-soft);
  opacity:0; transform:translateY(6px) scale(.985); filter:blur(3px);
  transition:opacity .55s cubic-bezier(.22,.9,.24,1), transform .55s cubic-bezier(.22,.9,.24,1), filter .5s ease;
}
.dice-quote.show{ opacity:1; transform:translateY(0) scale(1); filter:blur(0); }

/* ---- شريط تقدّم القراءة (يظهر تلقائيًا في صفحة المقال فقط) ---- */
.reading-progress{
  position:fixed; top:0; right:0; left:0; height:3px; z-index:60;
  background:transparent; pointer-events:none;
}
.reading-progress > span{
  display:block; height:100%; width:0%; background:var(--accent);
  transition:width .12s linear;
}

/* ---- زر العودة إلى الأعلى ---- */
.back-to-top{
  position:fixed; bottom:22px; left:22px; z-index:70;
  width:40px; height:40px; border-radius:50%;
  background:var(--ink); color:var(--paper); border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 28px rgba(28,23,18,.25);
  opacity:0; visibility:hidden; transform:translateY(12px) scale(.9);
  transition:opacity .3s ease, transform .3s cubic-bezier(.22,.9,.24,1), background .2s ease, visibility 0s linear .3s;
}
.back-to-top.visible{
  opacity:1; visibility:visible; transform:translateY(0) scale(1);
  transition:opacity .3s ease, transform .3s cubic-bezier(.22,.9,.24,1), background .2s ease;
}
.back-to-top:hover{ background:var(--accent); }
.back-to-top svg{ width:18px; height:18px; }
@media (max-width:560px){ .back-to-top{ left:16px; bottom:18px; width:42px; height:42px; } }

/* ---- تنبيه سريع (Toast) — تأكيد نسخ الرابط وغيره ---- */
.site-toast{
  position:fixed; bottom:28px; left:50%; transform:translate(-50%, 14px);
  background:var(--ink); color:var(--paper); font-family:'IBM Plex Sans Arabic',sans-serif;
  font-size:13.5px; padding:12px 22px; border-radius:30px; z-index:80;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .28s ease, transform .28s cubic-bezier(.22,.9,.24,1), visibility 0s linear .28s;
  box-shadow:0 14px 34px rgba(28,23,18,.25);
  white-space:nowrap;
}
.site-toast.show{
  opacity:1; visibility:visible; transform:translate(-50%, 0);
  transition:opacity .28s ease, transform .28s cubic-bezier(.22,.9,.24,1);
}

/* ---- تصفح المقال السابق/التالي أسفل المقال ---- */
.article-pager{
  display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap;
  margin-top:6px; padding:22px 20px 0; border-top:1px solid var(--line);
}
.pager-link{
  flex:1; min-width:200px; display:flex; flex-direction:column; gap:6px;
  padding:14px 16px; border:1px solid var(--line); border-radius:4px;
  transition:border-color .2s ease, background .2s ease, transform .25s ease;
}
.pager-link:hover{ border-color:var(--accent); background:var(--paper-deep); transform:translateY(-2px); }
.pager-next{ text-align:left; align-items:flex-end; }
.pager-dir{ font-size:11.5px; color:var(--ink-faint); display:flex; align-items:center; gap:6px; }
.pager-dir svg{ width:13px; height:13px; }
.pager-title{
  font-family:'IBM Plex Sans Arabic',sans-serif; font-size:15.5px; font-weight:600;
  color:var(--ink); line-height:1.55;
}
@media (max-width:640px){ .pager-next{ text-align:right; align-items:flex-start; } }

/* الفقرة الافتتاحية: بدون أي زخرفة جانبية — نص عادي بعرض كامل، يميّزها فقط
   حجم الخط ولونها (مضبوطين بقسم .article-body p.lede بالأعلى). */

/* ---- تعويض ارتفاع الهيدر الثابت عند القفز لأي عنصر عبر رابط داخلي ---- */
[id]{ scroll-margin-top:104px; }

/* ---- زر مشاركة/نسخ رابط المقال ---- */
.article-share-btn{
  display:inline-flex; align-items:center; gap:6px;
  background:none; border:1px solid var(--line); color:var(--ink-soft);
  font-family:'IBM Plex Sans Arabic',sans-serif; font-size:12.5px;
  padding:6px 14px; border-radius:20px; cursor:pointer;
  transition:border-color .2s ease, color .2s ease, background .2s ease;
}
.article-share-btn:hover{ border-color:var(--accent); color:var(--accent); background:var(--paper-deep); }
.article-share-btn svg{ width:14px; height:14px; }

/* ---- قسم "مقالات ذات صلة" في نهاية صفحة المقال ---- */
.related-section{ background:var(--paper-deep); }
.related-section .section-title{ font-size:19px; }

/* ---- ظل ارتفاع أنعم على البطاقات عند التفاعل (يضيف عمقًا عالميًا للتصميم) ---- */
.mz-card, .author-card, .interview-card{ transition:box-shadow .35s ease, border-color .2s ease, transform .35s cubic-bezier(.22,.9,.24,1); }
.mz-card:hover{ box-shadow:0 20px 44px rgba(28,23,18,.1); }
.author-card:hover, .interview-card:hover{ box-shadow:0 16px 34px rgba(28,23,18,.09); border-color:var(--accent); }

@media (prefers-reduced-motion:reduce){
  body{ animation:none; }
  .dice-cube, .dice-quote, .back-to-top, .site-toast, .nav-links, header.main{ transition:none !important; }
  .mz-featured, .quote-hero-inner, .portrait-hero .wrap, .mosaic-hero,
  .dark-band-hero .wrap{ animation:none; }
}

/* ============================================================
   قائمة المقالات — عرض تحريري بعمود واحد بعرض كامل
   (مستوحى من إيقاع المجلات الرقمية: صورة، تصنيف، عنوان، ملخص، كاتب)
   ============================================================ */
.feed-list{ display:flex; flex-direction:column; }
.feed-item{
  padding:24px 0; border-bottom:1px solid var(--line); cursor:pointer;
}
.feed-item:first-child{ padding-top:4px; }
.feed-item:last-child{ border-bottom:none; padding-bottom:4px; }
.feed-cover{
  position:relative; width:100%; aspect-ratio:16/9; overflow:hidden;
  background:var(--ink); margin-bottom:14px;
}
.feed-cover img{
  width:100%; height:100%; object-fit:cover; display:block;
  filter:grayscale(35%) saturate(.8) brightness(.85) contrast(1.06);
  transition:transform 6s ease;
}
.feed-item:hover .feed-cover img{ transform:scale(1.045); }
.feed-eyebrow{
  display:block; font-family:'IBM Plex Sans Arabic',sans-serif;
  font-size:13px; font-weight:600; color:var(--accent); margin-bottom:10px;
}
.feed-title{
  font-family:'IBM Plex Sans Arabic',sans-serif; font-weight:700;
  font-size:clamp(16px, 2vw, 20px); line-height:1.45; color:var(--title-color);
  margin-bottom:9px; transition:color .2s ease; max-width:800px;
}
.feed-item:hover .feed-title{ color:var(--accent); }
.feed-excerpt{
  font-family:'IBM Plex Sans Arabic',sans-serif; font-size:13.5px; line-height:1.7;
  color:var(--excerpt-color); max-width:680px; margin-bottom:14px;
}
.feed-byline{ display:flex; align-items:center; gap:10px; }
.feed-avatar{
  width:32px; height:32px; border-radius:50%; background:var(--ink); color:var(--paper);
  display:flex; align-items:center; justify-content:center; flex:none; overflow:hidden;
  font-family:'IBM Plex Sans Arabic',sans-serif; font-size:12px; font-weight:600;
}
/* صورة الكاتب الشخصية (بدل الأحرف الأولى) عند توفّرها من لوحة التحكم */
.feed-avatar img, .avatar img{
  width:100%; height:100%; border-radius:50%; object-fit:cover; display:block;
}
.feed-author-name{ font-size:13.5px; color:var(--ink-soft); font-weight:500; }
@media (max-width:640px){
  .feed-item{ padding:28px 0; }
  .feed-cover{ margin-bottom:18px; }
}

/* ---- ديناميكية الصور أثناء التمرير: تقارب/تباعد ناعم + استجابة عند الضغط ----
   (القيمة الفعلية لـ transform تُحسب وتُحدَّث في main.js بحسب موضع كل صورة من مركز الشاشة) */
.feed-cover, .mz-card .cover, .mosaic-hero a, .mz-featured-media{
  transition:transform .15s linear;
  transform-origin:center center;
}
@media (prefers-reduced-motion:reduce){
  .feed-cover, .mz-card .cover, .mosaic-hero a, .mz-featured-media{
    transition:none !important; transform:none !important;
  }
}

/* ============================================================
   الواجهة الإعلانية — كاروسيل أبرز المقالات (نسخة مصقولة)
   شريحة واحدة كاملة العرض، تنقّل يدوي بالأسهم/اللمس، تبديل تلقائي،
   بلا أي عدّاد أو ترقيم — فقط صورة سينمائية، نص أنيق، ونقاط صغيرة
   ============================================================ */
.mz-featured{
  position:relative; width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw);
}
.mz-featured-viewport{
  position:relative; overflow:hidden; cursor:grab; touch-action:pan-y;
}
.mz-featured-viewport:active{ cursor:grabbing; }
.mz-featured-track{
  display:flex; direction:ltr; will-change:transform;
  transition:transform .65s cubic-bezier(.22,.9,.24,1);
}
.mz-featured-slide{
  flex:0 0 100%; min-width:100%; position:relative; overflow:hidden;
  aspect-ratio:30/13; max-height:340px; cursor:pointer; background:#000;
}
.mz-featured-media{ position:absolute; inset:0; }
.mz-featured-media img{
  width:100%; height:100%; object-fit:cover; display:block;
  filter:grayscale(35%) saturate(.8) brightness(.78) contrast(1.08);
  animation:mzFeaturedZoom 10s ease-in-out infinite alternate;
}
@keyframes mzFeaturedZoom{
  from{ transform:scale(1); }
  to{ transform:scale(1.07); }
}
.mz-featured-slide::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(10,8,6,.05) 0%, rgba(10,8,6,.28) 45%, rgba(10,8,6,.93) 100%);
}
.mz-featured-content{
  position:absolute; inset:0; z-index:2; display:flex; flex-direction:column;
  justify-content:flex-end; padding:20px 26px;
}
.mz-featured-content .mz-tagbox{ align-self:flex-start; margin-bottom:12px; }
.mz-featured-content h2{
  font-family:'IBM Plex Sans Arabic',sans-serif; font-weight:700;
  font-size:clamp(16px, 2vw, 21px); line-height:1.35; color:#fff;
  max-width:680px; margin-bottom:7px;
}
.mz-featured-content .excerpt{
  font-family:'IBM Plex Sans Arabic',sans-serif; font-size:13.5px; line-height:1.75;
  color:rgba(255,255,255,.82); max-width:560px; margin-bottom:10px;
  -webkit-line-clamp:2; line-clamp:2; display:-webkit-box; -webkit-box-orient:vertical; overflow:hidden;
}
.mz-featured-content .mz-byline{ color:rgba(255,255,255,.8); font-size:12px; font-weight:600; }

/* ---- أسهم التنقّل ---- */
.mz-featured-arrow{
  position:absolute; top:50%; transform:translateY(-50%); z-index:3;
  width:32px; height:32px; border-radius:50%;
  background:rgba(15,12,9,.4); border:1px solid rgba(255,255,255,.25);
  color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer;
  backdrop-filter:blur(3px); transition:background .2s ease, transform .2s ease, border-color .2s ease;
}
.mz-featured-arrow:hover{ background:var(--accent); border-color:var(--accent); transform:translateY(-50%) scale(1.08); }
.mz-featured-arrow:active{ transform:translateY(-50%) scale(.94); }
.mz-featured-arrow-prev{ right:20px; }
.mz-featured-arrow-next{ left:20px; }

/* ---- نقاط التنقّل ---- */
.mz-featured-dots{
  position:absolute; bottom:16px; left:50%; transform:translateX(-50%); z-index:3;
  display:flex; gap:7px;
}
.mz-featured-dots span{
  width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.42); cursor:pointer;
  transition:width .25s ease, border-radius .25s ease, background .25s ease;
}
.mz-featured-dots span.active{ background:var(--accent); width:22px; border-radius:4px; }

/* ---- خط الهوية أعلى الكاروسيل — يربطه بصريًا بالنرد فوقه ---- */
.mz-featured::before{
  content:''; position:absolute; top:0; right:0; left:0; height:2px; z-index:4;
  background:linear-gradient(90deg, transparent 0%, var(--accent) 25%, var(--accent) 75%, transparent 100%);
  opacity:.55;
}

@media (max-width:700px){
  .mz-featured-slide{ aspect-ratio:4/5; max-height:none; }
  .mz-featured-content{ padding:22px; }
  .mz-featured-arrow{ width:34px; height:34px; }
  .mz-featured-arrow-prev{ right:12px; }
  .mz-featured-arrow-next{ left:12px; }
}
@media (prefers-reduced-motion:reduce){
  .mz-featured-media img{ animation:none; }
  .mz-featured-track{ transition:none; }
}

/* ---- صورة غلاف المقال (تظهر أعلى المقال، بعد العنوان وقبل النص) ---- */
.article-cover{ max-width:680px; margin:24px auto 0; }
.article-cover img{
  width:100%; aspect-ratio:16/9; object-fit:cover; display:block; border-radius:2px;
}
@media (max-width:640px){ .article-cover{ margin-top:14px; } }

/* ---- عنوان فرعي داخل نص المقالة (يقسّم المقالة الطويلة لأجزاء واضحة) ---- */
.article-subheading{
  font-family:'IBM Plex Sans Arabic',sans-serif; font-weight:700;
  font-size:16.5px; line-height:1.45; color:var(--ink); margin:22px 0 2px;
}
@media (max-width:640px){ .article-subheading{ font-size:15.5px; margin:18px 0 2px; } }

/* ---- عناصر داخل نص المقالة: صورة داخلية + اقتباس مميز (pull-quote) ---- */
.article-inline-image{
  margin:32px 0;
}
.article-inline-image img{
  width:100%; display:block; border-radius:2px;
}
.article-inline-image figcaption{
  margin-top:10px; font-size:13px; color:var(--ink-faint);
  font-family:'IBM Plex Sans Arabic',sans-serif; line-height:1.6;
}
/* ==========================================================
   ١٠ أشكال جاهزة للاقتباس المميز — يختار الأدمن الشكل من لوحة التحكم
   عند إضافة الاقتباس، وكل شكل له صنف pq-style-1 إلى pq-style-10
   ========================================================== */
.article-pullquote{
  margin:26px 0; position:relative;
}
.article-pullquote p{
  font-family:'IBM Plex Sans Arabic',sans-serif; font-weight:700;
  font-size:17px; line-height:1.5; color:var(--ink); margin:0;
}
.article-pullquote cite{
  display:block; margin-top:12px; font-style:normal;
  font-size:12.5px; color:var(--ink-faint); font-family:'IBM Plex Sans Arabic',sans-serif;
}
@media (max-width:640px){ .article-pullquote p{ font-size:15px; } }

/* ١) كلاسيكي متوسط — علامة تنصيص كبيرة أعلى النص، كل شي بالنص */
.pq-style-1{ text-align:center; padding:6px 0; }
.pq-style-1::before{
  content:'"'; display:block; font-family:Georgia,serif; font-weight:700;
  font-size:32px; line-height:1; color:var(--accent); margin-bottom:2px;
}
@media (max-width:640px){ .pq-style-1::before{ font-size:26px; } }

/* ٢) خط جانبي كلاسيكي — شريط لوني بجهة البداية، محاذاة يمين */
.pq-style-2{ text-align:right; border-right:4px solid var(--accent); padding:4px 22px; }

/* ٣) صندوق بخلفية فاتحة وحواف مدوّرة */
.pq-style-3{
  background:var(--paper-card); border:1px solid var(--line); border-radius:8px;
  padding:26px 28px; text-align:right;
}

/* ٤) غامق معكوس — خلفية داكنة ونص أبيض، للتمييز البصري القوي */
.pq-style-4{ background:var(--ink); color:#fff; padding:32px 28px; border-radius:4px; text-align:center; }
.pq-style-4 p{ color:#fff !important; }
.pq-style-4 cite{ color:rgba(255,255,255,.6) !important; }

/* ٥) بسيط ومائل — بدون أي زخرفة، خط أصغر وهادئ */
.pq-style-5{ text-align:right; padding:4px 0; }
.pq-style-5 p{ font-style:italic; font-weight:400 !important; font-size:19px !important; color:var(--ink-soft) !important; }

/* ٦) علامتا تنصيص بالطرفين حول النص مباشرة */
.pq-style-6{ text-align:center; padding:8px 0; }
.pq-style-6 p::before{ content:'" '; color:var(--accent); font-weight:700; }
.pq-style-6 p::after{ content:' "'; color:var(--accent); font-weight:700; }

/* ٧) خط سفلي عريض تحت النص */
.pq-style-7{ text-align:center; border-bottom:3px solid var(--accent); padding:8px 0 24px; }

/* ٨) تمييز بلون العلامة (النص نفسه بلون accent بدل الأسود) */
.pq-style-8{ text-align:right; padding:4px 0; }
.pq-style-8 p{ color:var(--accent) !important; }

/* ٩) رمز دائري أعلى النص (بدل علامة تنصيص مسطّحة) */
.pq-style-9{ text-align:center; padding:4px 0; }
.pq-style-9::before{
  content:'"'; display:inline-flex; align-items:center; justify-content:center;
  width:48px; height:48px; border-radius:50%; background:var(--accent); color:#fff;
  font-size:24px; font-family:Georgia,serif; margin-bottom:14px;
}

/* ١٠) وسم "اقتباس" أعلى يمين النص */
.pq-style-10{ text-align:right; position:relative; padding:30px 0 4px; }
.pq-style-10::before{
  content:'مميز'; position:absolute; top:0; right:0; background:var(--accent); color:#fff;
  font-size:11px; padding:3px 10px; border-radius:2px; font-family:'IBM Plex Sans Arabic',sans-serif;
}

/* ===== إضافات القالب الموحّد للأقسام ===== */
.experimental .section-intro{color:rgba(242,234,217,.65);}
.experimental .feed-item,.experimental .exp-piece{color:var(--paper);}
.exp-piece:focus-visible,.feed-item:focus-visible,.interview-card:focus-visible{outline:2px solid var(--accent);outline-offset:4px;}
#portraitHero{cursor:pointer;}
/* الصور داخل المقالة بقياس موحّد 16:9 (حتى الصور القديمة المرفوعة قبل التوحيد) */
.article-inline-image img{aspect-ratio:16/9;object-fit:cover;height:auto;}

/* ===== النسخة النهائية: تحسينات عامة ===== */
/* أي صورة تعطّلت: خلفية هادئة بدل أيقونة الصورة المكسورة */
.feed-cover.img-fallback, .mz-featured-media.img-fallback, .mosaic-hero a.img-fallback,
.p-avatar.img-fallback{ background:var(--paper-deep); }
.feed-avatar.img-fallback, .avatar.img-fallback{ background:var(--ink); }

/* إطار تركيز واضح للتنقل بلوحة المفاتيح (بدون ما يظهر عند النقر بالماوس) */
a:focus-visible, button:focus-visible, [role="link"]:focus-visible, [role="button"]:focus-visible,
input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline:2px solid var(--accent); outline-offset:3px;
}

/* احترام إعداد "تقليل الحركة" بالجهاز */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *, *::before, *::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}

/* الطباعة: المقال فقط بدون القوائم والأزرار */
@media print{
  header.main, footer, .search-modal, .back-to-top, .reading-progress, .article-share-btn,
  .article-pager, .related-section, .grain, .site-toast{ display:none !important; }
  .article-body{ max-width:100% !important; }
}

/* رابط عنوان البطاقة (SEO): يبان مثل العنوان تمامًا */
a.card-link{ color:inherit; text-decoration:none; }
a.card-link:hover{ text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px; }

/* العناوين الرئيسية (h1) بنفس شكلها السابق تمامًا */
h1.section-title{ margin:0; }
