/* =====================================================================
   מגזין: משותף לארכיון ולמאמר (כרטיס, כריכה, "בקרוב", שורת פנייה)
   הכריכה: מילה אחת מהמאמר בקו מתאר, שמתמלאת בדיו מימין לשמאל כשהיא
   נכנסת למסך. אותו מוטיב כמו המילה "מגזין" בפתיחת הארכיון.
   ===================================================================== */
.lead{font-weight:400}
.mc{position:relative}
.mc-a{display:grid;gap:30px;border-radius:30px;color:var(--fg);-webkit-tap-highlight-color:transparent}
.mc-a:focus-visible{outline:2px solid var(--fg);outline-offset:10px;border-radius:30px}
.mc-cov{position:relative;container-type:inline-size;aspect-ratio:16/10;border-radius:28px;background:#000;color:#fff;overflow:clip;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);transition:scale .5s var(--soft)}
.dark .mc-cov{background:var(--card)}
.mc-ic{position:absolute;top:9%;right:7%;width:15%;max-width:84px;height:auto;opacity:.92}
.mc-w{position:absolute;bottom:3%;left:6%;font-weight:900;line-height:1.08;font-size:calc(var(--k,40) * 1cqw);white-space:nowrap;letter-spacing:-.01em;transition:transform .8s var(--soft)}
.mc-w span{display:block}
.mc-w .o{color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.6)}
.mc-w .f{position:absolute;top:0;left:0;color:#fff;clip-path:inset(0 0 0 100%);transition:clip-path 1.7s var(--soft)}
.ink .mc-w .f{clip-path:inset(0 0 0 0)}
.mc-cat{margin:0;font-size:18px;font-weight:700;color:var(--fg-72)}
.mc-t{margin:12px 0 0;font-weight:900;font-size:clamp(28px,2.2vw,42px);line-height:1.08;letter-spacing:-.005em;text-wrap:balance}
.mc-t span{background:linear-gradient(currentColor,currentColor) no-repeat 100% 100%/0% 2px;padding-bottom:2px;-webkit-box-decoration-break:clone;box-decoration-break:clone;transition:background-size .8s var(--soft)}
.mc-ex{margin:16px 0 0;font-size:19px;line-height:1.55;color:var(--fg-72);max-width:46ch;text-wrap:pretty}
.mc-meta{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:24px 0 0;font-size:18px;font-weight:700}
.mc-go{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--fg-50);transition:background-color .35s var(--ease),color .35s var(--ease),box-shadow .35s var(--ease),transform .5s var(--soft)}
.mc-go svg{width:18px;height:18px}
@media (hover:hover){
  .mc-a:hover .mc-t span{background-size:100% 2px}
  .mc-a:hover .mc-w{transform:translateY(-5%)}
  .mc-a:hover .mc-go{background:var(--fg);color:var(--bg);box-shadow:inset 0 0 0 1.5px var(--fg);transform:translateX(-6px)}
}
.mc-a:focus-visible .mc-go,.mc-a:active .mc-go{background:var(--fg);color:var(--bg);box-shadow:inset 0 0 0 1.5px var(--fg)}
.mc-a:active .mc-cov{scale:.985}

/* שורת פנייה: עדינה, בסוף העמוד */
.mz-cta{padding-block:120px}
.mz-cta .wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px 96px;align-items:end}
.mz-cta .h2{font-size:clamp(44px,4.4vw,84px)}
.mz-cta .lead{max-width:52ch;color:rgba(255,255,255,.8)}
.empty{margin:0;font-size:20px;font-weight:700}

@media (max-width:899px){
  .mc-a{gap:22px;text-align:center}
  .mc-ex{margin-inline:auto}
  .mc-meta{justify-content:center}
  .mz-cta{padding-block:96px}
  .mz-cta .wrap{grid-template-columns:1fr;text-align:center;justify-items:center}
  .mz-cta .h2{font-size:clamp(40px,11vw,60px)}
}
.rm .mc-w .f{clip-path:none}

/* =====================================================================
   הארכיון. רגע החתימה: המילה "מגזין" נכתבת בקו מתאר כשהעמוד נטען
   (stroke-dashoffset על טקסט SVG), ובגלילה הדיו ממלא אותה מימין לשמאל,
   בכיוון הכתיבה. כל כריכה של מאמר חוזרת על אותו מוטיב בקטן.
   ===================================================================== */
.mzh{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;padding:150px var(--gut) 56px;background:#000;color:#fff;overflow:clip}
.mzh-h1{position:relative;flex:1;display:flex;align-items:center;justify-content:center;margin:0;max-width:1792px;width:100%;margin-inline:auto}
.mzh-word{display:block;width:100%;height:auto;max-height:calc(100svh - 330px);overflow:visible;visibility:hidden}
.mzh-word.ready{visibility:visible}
.mzh-word text{font-family:Almoni,system-ui,sans-serif;font-weight:900;font-size:300px}
.w-o{fill:none;stroke:#fff;stroke-linejoin:round}
.w-f{fill:#fff;clip-path:inset(0 0 0 100%)}
.rm .w-f{clip-path:none}
.mzh-bar{display:flex;justify-content:space-between;align-items:center;gap:20px 32px;flex-wrap:wrap;max-width:1792px;width:100%;margin:44px auto 0;padding-top:28px;border-top:1px solid var(--fg-24)}
.mzf{display:flex;flex-wrap:wrap;gap:10px}
.mzf button{min-height:52px;padding:0 24px;border-radius:999px;box-shadow:inset 0 0 0 1.5px var(--fg-50);font-size:18px;font-weight:700;color:var(--fg);transition:background-color .35s var(--ease),color .35s var(--ease),box-shadow .35s var(--ease),scale .2s var(--ease);touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.mzf button[aria-pressed=true]{background:var(--fg);color:var(--bg);box-shadow:inset 0 0 0 1.5px var(--fg)}
@media (hover:hover){.mzf button[aria-pressed=false]:hover{box-shadow:inset 0 0 0 1.5px var(--fg)}}
.mzf button:focus-visible{outline:2px solid var(--fg);outline-offset:3px}
.mzf button:active{scale:.97}
.mzh-n{margin:0;font-size:18px;font-weight:700;color:var(--fg-72)}

/* הרשימה */
.mzl{padding-top:130px;min-height:60vh}
.mz-grid{display:block}
.mc-lead .mc-a{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(48px,5vw,104px);align-items:center}
.mc-lead .mc-cov{aspect-ratio:4/3}
.mc-lead .mc-t{font-size:clamp(42px,3.9vw,80px);line-height:1}
.mc-lead .mc-ex{font-size:clamp(20px,1.4vw,24px);max-width:40ch}
.mc-lead .mc-meta{margin-top:34px;justify-content:flex-start;gap:24px}
.mz-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:72px clamp(32px,3vw,56px);margin-top:150px;align-items:start}
.mz-cards .mc:nth-child(2n){margin-top:140px}
.mz-cards .mc-a{grid-template-rows:auto auto}
.mz-cards .mc-cov{order:-1}

/* בקרוב: הכריכה עדיין בקו מתאר, בלי דיו */
.soon{display:grid;grid-template-columns:auto minmax(0,1fr);gap:24px 56px;align-items:center;margin-top:140px;padding:44px 56px;border:1.5px dashed rgba(0,0,0,.32);border-radius:28px}
.soon-w{margin:0;font-weight:900;font-size:clamp(96px,8vw,160px);line-height:1;color:transparent;-webkit-text-stroke:1.5px #000}
.soon-pill{display:inline-flex;align-items:center;min-height:36px;padding:0 16px;border-radius:999px;box-shadow:inset 0 0 0 1.5px #000;font-size:16px;font-weight:700}
.soon-t{margin:16px 0 0;font-weight:900;font-size:clamp(28px,2.3vw,44px);line-height:1.08;text-wrap:balance}
.soon-c{margin:12px 0 0;font-size:18px;color:var(--fg-72)}

/* במצב סינון: שאר המאמרים כשורות */
.oth{margin-top:140px}
.oth-h{margin:0 0 28px;font-weight:900;font-size:clamp(32px,2.6vw,48px);line-height:1.05}
.oth ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--fg-24)}
.oth li{border-bottom:1px solid var(--fg-24)}
.oth a{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr) auto 52px;gap:32px;align-items:center;padding:30px 0;border-radius:6px}
.oth a:focus-visible{outline:2px solid #000;outline-offset:4px}
.oth .o-c{font-size:18px;font-weight:700;color:var(--fg-72)}
.oth .o-t{font-size:clamp(22px,1.7vw,30px);font-weight:900;line-height:1.15}
.oth .o-r{font-size:18px;color:var(--fg-72);white-space:nowrap}
@media (hover:hover){.oth a:hover .mc-go{background:#000;color:#fff;box-shadow:inset 0 0 0 1.5px #000;transform:translateX(-6px)}}
.oth a:focus-visible .mc-go,.oth a:active .mc-go{background:#000;color:#fff;box-shadow:inset 0 0 0 1.5px #000}

@media (max-width:1280px){
  .mc-lead .mc-a{gap:48px}
}
@media (max-width:1023px){
  .mc-lead .mc-a{grid-template-columns:1fr;gap:32px}
  .mc-lead .mc-cov{order:-1;aspect-ratio:16/10}
  .mz-cards{grid-template-columns:1fr;gap:96px;margin-top:110px}
  .mz-cards .mc:nth-child(2n){margin-top:0}
  .oth a{grid-template-columns:minmax(0,1fr) auto 52px;gap:8px 24px}
  .oth .o-c{grid-column:1/-1}
}
@media (max-width:899px){
  .mzh{min-height:auto;padding:136px 16px 40px}
  .mzh-h1{flex:none;padding:28px 0 8px}
  .mzh-word{max-height:none}
  .mzh-bar{flex-direction:column;justify-content:center;text-align:center;margin-top:32px;padding-top:24px}
  .mzf{justify-content:center}
  .mzf button{padding:0 20px}
  .mzl{padding-top:88px}
  .mc-lead .mc-t{font-size:clamp(34px,9.4vw,48px)}
  .mc-lead .mc-ex{font-size:19px;margin-inline:auto}
  .mc-lead .mc-meta{justify-content:center}
  .mz-cards{gap:80px;margin-top:88px}
  .soon{grid-template-columns:1fr;justify-items:center;text-align:center;margin-top:88px;padding:36px 22px}
  .soon-w{font-size:96px}
  .oth{margin-top:88px}
  .oth-h{text-align:center}
  .oth a{grid-template-columns:1fr;justify-items:center;text-align:center;gap:8px;padding:26px 0}
  .oth .o-r{order:3}
  .oth .mc-go{display:none}
}
