/* الصفحة الرئيسية (النسخة ٢): ما أُضيف إلى «الصنعة» على هيئة الأصل — صيغة «وَرَق»، ومن ملفك إلى كتاب، وبطاقة الأسلوب، والرَّحل */

/* الصيغ الثلاث */
.fmt{display:flex;align-items:flex-end;gap:16px}
.fmt-f{position:relative;width:76px;height:98px;display:grid;place-items:end center;padding-bottom:12px;background:#fff;border-radius:2px;box-shadow:0 12px 22px -14px rgba(42,29,20,.6),0 0 0 1px rgba(42,29,20,.08);font-weight:700;font-size:15px;color:var(--ink);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%)}
.fmt-f::before{content:"";position:absolute;inset:20px 12px auto;height:4px;background:var(--fc);box-shadow:0 10px 0 -1px color-mix(in srgb,var(--fc) 40%,transparent),0 20px 0 -1px color-mix(in srgb,var(--fc) 40%,transparent)}
.fmt-f.pdf{--fc:#8B1A1A}.fmt-f.doc{--fc:#2B579A}
.fmt-f.wq{width:90px;height:112px;clip-path:none;background:none;box-shadow:none;place-items:center;padding:0;gap:4px;font-family:var(--display);font-size:19px;color:var(--rubric)}
.fmt-f.wq::before{content:none}
.fmt-f.wq img{width:58px;height:auto;filter:drop-shadow(0 8px 10px rgba(42,29,20,.25))}

/* من ملفك إلى كتاب */
.conv{display:flex;align-items:center;gap:16px}
.conv-in{display:grid;gap:8px}
.conv-in span{font-size:15px;font-weight:700;color:var(--ink);background:#fff;border:1px solid var(--gold);border-radius:2px;padding:4px 18px;text-align:center}
.conv-arr{width:70px;height:22px;fill:none;stroke:var(--gold-d);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.conv-out{width:92px;aspect-ratio:170/240;display:grid;align-content:center;justify-items:center;background:linear-gradient(120deg,rgba(255,255,255,.12),rgba(0,0,0,.18)),var(--p-btn);color:#E3C77A;border-radius:1px 3px 3px 1px;box-shadow:0 14px 24px -12px rgba(42,29,20,.7);position:relative}
.conv-out::before{content:"";position:absolute;inset:6px;border:1px solid currentColor;opacity:.8}
.conv-out b{font-family:var(--display);font-size:21px;line-height:1.4}
.conv-out small{font-size:12px}

/* القطعتان العريضتان: الشرح بجانب المثال */
.get.wide{grid-column:1 / -1;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:20px 48px;align-items:center;padding-top:44px;border-top:1px solid var(--line)}
.get.wide.rev .wide-txt{order:2}
.wide-txt{display:grid;gap:14px;justify-items:start;align-content:center}
.wide-txt h3{font-family:var(--display);font-weight:700;font-size:clamp(24px,2.2vw,30px);line-height:1.5;color:var(--rubric)}
.wide-txt > p{font-size:16.5px;line-height:1.85;color:var(--ink);max-width:38em}
.ticks{display:grid;gap:7px;margin-bottom:6px;font-size:15.5px;line-height:1.6;color:var(--ink)}
.ticks.two{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 24px}
.ticks li{display:flex;align-items:baseline;gap:12px}
.ticks li::before{content:"";flex:none;width:8px;height:8px;background:var(--gold);transform:rotate(45deg) translateY(-2px)}
.wide-fig{min-height:340px;flex-direction:column;flex-wrap:nowrap;gap:18px;text-decoration:none;color:var(--ink)}

/* بطاقة الأسلوب */
.card{--c:#6B1D2F;--g:#C5A059;position:relative;width:230px;aspect-ratio:1;display:grid;justify-items:center;align-content:center;gap:4px;padding:18px;text-align:center;background:var(--sheet);border:6px solid var(--c);border-radius:22px;box-shadow:0 26px 40px -24px rgba(42,29,20,.6);transition:border-color .45s}
.card::before{content:"";position:absolute;inset:7px;border:1px solid var(--g);border-radius:13px;pointer-events:none}
.card-k{font-size:12.5px;color:var(--muted);font-weight:700}
.card-n{font-family:var(--display);font-weight:700;font-size:32px;line-height:1.4;color:var(--c);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color .45s}
.card-s{font-family:var(--display);font-size:14.5px}
.card-d{display:flex;gap:10px;margin-top:4px}
.card-d i{width:11px;height:11px;transform:rotate(45deg)}
.card-d i:nth-child(1){background:var(--c)}.card-d i:nth-child(2){background:#8B1A1A}.card-d i:nth-child(3){background:#1F5E3B}.card-d i:nth-child(4){background:var(--g)}
.card-o{color:var(--g);font-size:18px;line-height:1.2}
.card-w{color:var(--c);font-size:20px;line-height:1;transition:color .45s}
.card-ctl{display:grid;justify-items:center;gap:8px;width:min(100%,300px)}
.card-ctl .fld{width:100%}

/* الرَّحل: ورقةٌ تُقلَّب عند المرور */
.rh-art{width:min(340px,90%);height:auto;overflow:visible}
.rh-leg-b{fill:var(--p-rubric-d)}
.rh-leg-f{fill:var(--p-rubric)}
.rh-arch path{stroke:var(--p-gold)}
.rh-key,.rh-dots{fill:var(--p-gold)}
.rh-gilt{fill:none;stroke:var(--p-gold);stroke-width:1.6}
.rh-lines,.rh-lines path{fill:none;stroke:#2A1D14;stroke-opacity:.22;stroke-width:1.3;stroke-linecap:round}
.rh-head{fill:none;stroke:var(--p-rubric);stroke-width:2.2;stroke-linecap:round}
.rh-turn{transform-box:view-box;transform-origin:180px 100px;opacity:0}
.rh-dots path{transform-box:fill-box;transform-origin:center}
.rahl-fig:hover .rh-turn,.rahl-fig:focus-visible .rh-turn{animation:rh-turn 2.8s var(--pen) infinite}
.rahl-fig:hover .rh-dots path{animation:rh-dot 1.8s ease-in-out infinite}
.rh-dots path:nth-child(2){animation-delay:.12s !important}.rh-dots path:nth-child(3){animation-delay:.24s !important}
.rh-dots path:nth-child(4){animation-delay:.36s !important}.rh-dots path:nth-child(5){animation-delay:.48s !important}
@keyframes rh-turn{0%{opacity:0;transform:scaleX(1)}8%{opacity:1;transform:scaleX(1)}18%{transform:scaleX(.96) skewY(-2deg)}50%{transform:scaleX(0) skewY(-7deg)}82%{transform:scaleX(-.97) skewY(-1deg)}90%{opacity:1;transform:scaleX(-1)}100%{opacity:0;transform:scaleX(-1)}}
@keyframes rh-dot{0%,60%,100%{transform:scale(1);filter:none}25%{transform:scale(1.35);filter:drop-shadow(0 0 3px rgba(197,160,89,.9))}}

@media (max-width:900px){
  .get.wide{grid-template-columns:minmax(0,1fr);padding-top:32px}
  .get.wide.rev .wide-txt{order:0}
  .wide-fig{min-height:300px}
}
@media (max-width:560px){.ticks.two{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.rh-turn,.rh-dots path{animation:none !important}}

/* الأمثلة: بطاقات الأساليب وأغلفةٌ حقيقية */
.s-card{width:132px;height:auto;border-radius:22%;box-shadow:0 14px 26px -14px rgba(42,29,20,.55);flex:none}
.s-cover{width:132px;height:auto;border-radius:2px 4px 4px 2px;box-shadow:0 18px 30px -16px rgba(42,29,20,.7);flex:none}
.cv-img{width:min(46%,170px);height:auto;border-radius:2px 5px 5px 2px;box-shadow:0 20px 32px -16px rgba(42,29,20,.7),0 0 0 1px rgba(0,0,0,.06);flex:none;transition:opacity .2s}
.cv-chips{display:flex;flex-direction:column;gap:6px;min-width:0}
.cv-chips button{font:700 14px/1.4 var(--ui);color:var(--ink);background:var(--sheet);border:1px solid var(--line);border-radius:999px;padding:6px 14px;cursor:pointer;text-align:start;transition:border-color .2s,color .2s}
.cv-chips button:hover{border-color:var(--gold-d)}
.cv-chips button.on{border-color:var(--rubric);color:var(--rubric);box-shadow:0 0 0 1px var(--rubric)}
@media (max-width:560px){.cv-chips{flex-direction:row;flex-wrap:wrap;justify-content:center}.cv-img{width:min(70%,200px)}}
/* «كما يخرجه ورّاق»: الصفحة الحقيقية من محرك التنضيد بأسلوب البطاقة (والمرسومة تحتها حتى تتمّ) */
.sheet.real{padding:0;overflow:hidden;background:#fff;clip-path:inset(0 0 0 var(--cut))}
.real-frame{position:absolute;top:0;left:0;border:0;transform-origin:0 0;pointer-events:none;background:#fff}
.real-img{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;-webkit-user-drag:none}
.sheet-box.has-real #sheetSet{visibility:hidden}
.sheet-box.pv-busy::after{content:"يُنضَّد…";position:absolute;z-index:5;bottom:10px;left:50%;translate:-50% 0;font:700 12.5px/1 var(--ui);color:var(--p-on,#fff);background:color-mix(in srgb,var(--p-btn,#6B1D2F) 88%,transparent);padding:7px 14px;border-radius:999px;box-shadow:0 6px 14px -6px rgba(0,0,0,.4);pointer-events:none}
.sheet-box.has-real .notes{opacity:.92}

/* (النسخة ٤) الأبواب الثلاثة: الكتب والأبحاث والمتون */
.kinds{padding-block:70px 20px}
.kinds-lead{margin-top:10px;font-size:17px;line-height:1.85;color:var(--muted);max-width:46em}
.kind-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px;margin-top:40px}
.kind{display:grid;gap:12px;align-content:start;justify-items:start;min-width:0}
.kind h3{font-family:var(--display);font-weight:700;font-size:26px;line-height:1.5;color:var(--rubric)}
.kind > p{font-size:15.5px;line-height:1.8;color:var(--ink)}
.kind .ticks{font-size:14.5px}
.kind .btn{margin-top:4px}
.kind-fig{width:100%;min-height:300px;padding:26px 18px}
.kd-page{width:min(62%,190px);height:auto;box-shadow:0 18px 30px -16px rgba(42,29,20,.6),0 0 0 1px rgba(42,29,20,.06);border-radius:1px}
.kd-sheet{background:#fff;box-shadow:0 18px 30px -16px rgba(42,29,20,.6),0 0 0 1px rgba(42,29,20,.06);border-radius:1px;aspect-ratio:170/240;font-family:var(--display);color:#1d1712}
.kd-rs{width:min(62%,190px);display:grid;align-content:space-between;justify-items:center;text-align:center;padding:14px 12px;font-size:9px;line-height:1.7}
.kd-rs small{color:#4a3a2e}
.kd-rs b{font-size:15px;line-height:1.5;font-weight:700;margin-top:6px}
.kd-rs span{font-size:10.5px;margin-top:-10px}
.kd-rs em{font-style:normal;color:#4a3a2e;border-block:1px solid #d9cdb4;padding:3px 8px}
.kd-rs i{font-style:normal;color:#4a3a2e}
.kd-spread{display:flex;gap:0;width:min(100%,300px);filter:drop-shadow(0 18px 18px rgba(42,29,20,.28))}
.kd-spread .kd-sheet{flex:1;box-shadow:none;padding:10px 9px;display:flex;flex-direction:column;gap:5px;font-size:9.5px;line-height:1.75}
.kd-spread .kd-sheet b{text-align:center;font-size:11px;color:var(--p-rubric,#6B1D2F);margin-bottom:2px}
.kd-mt{border-inline-end:1px solid #e3d9c6}
.kd-mt p{text-align:start}
.kd-mt p span{color:#8B1A1A;font-weight:700}
.kd-ln i{display:block;height:0;border-bottom:1px dashed #cfc3ad;margin-top:12px}
.wq-ticks{font-size:14.5px;margin-top:-4px}
@media (max-width:980px){.kind-cards{grid-template-columns:minmax(0,1fr);gap:44px}.kind-fig{min-height:260px}}