/* mh-azer */
/* 29LT Azer was removed on 14 Sep 2026 — the site had no licence for it, and
   self-hosting put the commercial files on a public path. IBM Plex Sans Arabic
   (SIL Open Font License) carries the whole site now: it was already the
   heading face, it is already WOFF2, and it has seven real weights. */
:root{--mh-display:var(--wp--preset--font-family--ibm-plex-sans-arabic),system-ui,sans-serif}
/* end mh-azer */
/* Alkalami — display face for the مِمّا قرأت writer names. Arabic subset only
   (~16 KB). Served from Google's CDN; self-host it later if we drop that dependency. */
@font-face{font-family:'Alkalami';font-style:normal;font-weight:400;font-display:swap;
 src:url(https://fonts.gstatic.com/s/alkalami/v8/zOL_4pfDmqRL95WXi6eJycFuuehGsOs.woff2) format('woff2');
 unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
:root{--mh-names:'Alkalami',serif}
/* the footer site title was still on the theme's default face */
.wp-block-site-title a{font-family:var(--mh-display);font-weight:700;line-height:1.55}
/* mh-icons */
:root{
 --ic-info:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%279%27%2F%3E%3Cpath%20d%3D%27M12%2011v5%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%277.6%27%20r%3D%27.6%27%20fill%3D%27black%27%20stroke%3D%27none%27%2F%3E%3C%2Fsvg%3E");
 --ic-prev:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M15%205l-7%207%207%207%27%2F%3E%3C%2Fsvg%3E");
 --ic-next:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M9%205l7%207-7%207%27%2F%3E%3C%2Fsvg%3E");
 --ic-list:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%206h16M4%2012h16M4%2018h10%27%2F%3E%3C%2Fsvg%3E");
 --ic-book:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%205.5A1.5%201.5%200%200%201%205.5%204H19v14H5.5A1.5%201.5%200%200%200%204%2019.5z%27%2F%3E%3Cpath%20d%3D%27M4%2019.5A1.5%201.5%200%200%201%205.5%2018H19v2H5.5A1.5%201.5%200%200%201%204%2019.5z%27%2F%3E%3C%2Fsvg%3E");
 --ic-up:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%2019V6%27%2F%3E%3Cpath%20d%3D%27M5.5%2012.5L12%206l6.5%206.5%27%2F%3E%3C%2Fsvg%3E");
 --ic-zoom:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2711%27%20cy%3D%2711%27%20r%3D%276.5%27%2F%3E%3Cpath%20d%3D%27M16%2016l4.5%204.5%27%2F%3E%3Cpath%20d%3D%27M11%208.6v4.8M8.6%2011h4.8%27%2F%3E%3C%2Fsvg%3E");
}
/* end mh-icons */
/* mh-paper  ——  the sheet: colour in --mh-paper, tooth in --mh-grain */
:root{--mh-paper:#f8f4ea;
 --mh-grain:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27400%27%20height%3D%27400%27%3E%3Cfilter%20id%3D%27n%27%20x%3D%270%27%20y%3D%270%27%20width%3D%27100%25%27%20height%3D%27100%25%27%20color-interpolation-filters%3D%27sRGB%27%3E%3CfeTurbulence%20type%3D%27fractalNoise%27%20baseFrequency%3D%270.75%27%20numOctaves%3D%273%27%20stitchTiles%3D%27stitch%27%20seed%3D%277%27%20result%3D%27f%27%2F%3E%3CfeTurbulence%20type%3D%27fractalNoise%27%20baseFrequency%3D%270.012%27%20numOctaves%3D%272%27%20stitchTiles%3D%27stitch%27%20seed%3D%2711%27%20result%3D%27m%27%2F%3E%3CfeComposite%20in%3D%27f%27%20in2%3D%27m%27%20operator%3D%27arithmetic%27%20k1%3D%270%27%20k2%3D%270.65%27%20k3%3D%270.35%27%20k4%3D%270%27%2F%3E%3CfeColorMatrix%20type%3D%27matrix%27%20values%3D%270%200%200%200%200.239%200%200%200%200%200.212%200%200%200%200%200.173%200.3333%200.3333%200.3333%200%200%27%2F%3E%3CfeComponentTransfer%3E%3CfeFuncA%20type%3D%27linear%27%20slope%3D%270.21%27%20intercept%3D%27-0.078%27%2F%3E%3C%2FfeComponentTransfer%3E%3C%2Ffilter%3E%3Crect%20width%3D%27400%27%20height%3D%27400%27%20filter%3D%27url(%23n)%27%2F%3E%3C%2Fsvg%3E");
 --mh-grain-lite:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27400%27%20height%3D%27400%27%3E%3Cfilter%20id%3D%27n%27%20x%3D%270%27%20y%3D%270%27%20width%3D%27100%25%27%20height%3D%27100%25%27%20color-interpolation-filters%3D%27sRGB%27%3E%3CfeTurbulence%20type%3D%27fractalNoise%27%20baseFrequency%3D%270.75%27%20numOctaves%3D%273%27%20stitchTiles%3D%27stitch%27%20seed%3D%273%27%20result%3D%27f%27%2F%3E%3CfeTurbulence%20type%3D%27fractalNoise%27%20baseFrequency%3D%270.012%27%20numOctaves%3D%272%27%20stitchTiles%3D%27stitch%27%20seed%3D%2719%27%20result%3D%27m%27%2F%3E%3CfeComposite%20in%3D%27f%27%20in2%3D%27m%27%20operator%3D%27arithmetic%27%20k1%3D%270%27%20k2%3D%270.65%27%20k3%3D%270.35%27%20k4%3D%270%27%2F%3E%3CfeColorMatrix%20type%3D%27matrix%27%20values%3D%270%200%200%200%201%200%200%200%200%201%200%200%200%200%201%200.3333%200.3333%200.3333%200%200%27%2F%3E%3CfeComponentTransfer%3E%3CfeFuncA%20type%3D%27linear%27%20slope%3D%270.14%27%20intercept%3D%27-0.052%27%2F%3E%3C%2FfeComponentTransfer%3E%3C%2Ffilter%3E%3Crect%20width%3D%27400%27%20height%3D%27400%27%20filter%3D%27url(%23n)%27%2F%3E%3C%2Fsvg%3E");
 --mh-grain-burn:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27400%27%20height%3D%27400%27%3E%3Cfilter%20id%3D%27n%27%20x%3D%270%27%20y%3D%270%27%20width%3D%27100%25%27%20height%3D%27100%25%27%20color-interpolation-filters%3D%27sRGB%27%3E%3CfeTurbulence%20type%3D%27fractalNoise%27%20baseFrequency%3D%270.75%27%20numOctaves%3D%273%27%20stitchTiles%3D%27stitch%27%20seed%3D%2723%27%20result%3D%27f%27%2F%3E%3CfeTurbulence%20type%3D%27fractalNoise%27%20baseFrequency%3D%270.012%27%20numOctaves%3D%272%27%20stitchTiles%3D%27stitch%27%20seed%3D%2731%27%20result%3D%27m%27%2F%3E%3CfeComposite%20in%3D%27f%27%20in2%3D%27m%27%20operator%3D%27arithmetic%27%20k1%3D%270%27%20k2%3D%270.65%27%20k3%3D%270.35%27%20k4%3D%270%27%2F%3E%3CfeColorMatrix%20type%3D%27matrix%27%20values%3D%270%200%200%200%200.239%200%200%200%200%200.212%200%200%200%200%200.173%200.3333%200.3333%200.3333%200%200%27%2F%3E%3CfeComponentTransfer%3E%3CfeFuncA%20type%3D%27linear%27%20slope%3D%270.21%27%20intercept%3D%27-0.078%27%2F%3E%3C%2FfeComponentTransfer%3E%3C%2Ffilter%3E%3Crect%20width%3D%27400%27%20height%3D%27400%27%20filter%3D%27url(%23n)%27%2F%3E%3C%2Fsvg%3E");
 --mh-grain-size:400px 400px;
 --mh-grain-tex:var(--mh-grain);
 --mh-tex-lt:var(--mh-grain-burn),var(--mh-grain);
 --mh-tex-dk:var(--mh-grain-burn),var(--mh-grain-lite);
 --mh-tex-bm:color-burn,normal;
 --mh-sheet:var(--mh-grain) repeat 0 0 / var(--mh-grain-size) var(--mh-paper)}
.wp-site-blocks > *{margin-block-start:0}
html{background:var(--mh-paper)}
body{background:var(--mh-sheet);position:relative;min-height:100vh}
header.wp-block-template-part > .wp-block-group.has-background,
.mh-train.mh-train{
 background-image:var(--mh-grain);background-size:var(--mh-grain-size);background-repeat:repeat}
/* end mh-paper */
/* mh-straps  ——  ADJUST THE FOUR NUMBERS BELOW */
.mh-hero__shot, .mh-feat__shot{
 --v-w:   clamp(10px, 1.4vw, 22px);   /* vertical strap thickness       */
 --v-top: 5%;                          /* how far below the photo top     */
 --h-h:   clamp(12px, 2vw, 30px);     /* horizontal strap thickness      */
 --h-gap: 3%;                          /* gap before the photo's far edge */
}
/* end mh-straps */
/* mh-body */
body{font-size:16px}
@media (max-width:900px){body{font-size:19px}}
/* end mh-body */
/* imported Wix content is raw HTML, so the theme's image rule never reaches it */
.wp-block-post-content img,
.wp-block-post-content iframe,
.wp-block-post-content video,
.wp-block-post-content table { max-width:100%; height:auto; }
.wp-block-post-content table { display:block; overflow-x:auto; }
.wp-block-post-content pre { overflow-x:auto; }

/* ===== hero ===== */
.mh-hero{position:relative;background:var(--mh-sheet);overflow:hidden}
.mh-hero__in{--shotH:clamp(620px, 78vh, 860px);
 max-width:1400px;margin:0 auto;position:relative;
 min-height:calc(var(--shotH) + 20px);display:flow-root}
.mh-hero__shot{--v:clamp(10px, 1.4vw, 22px);--h:clamp(12px, 2vw, 30px);position:absolute;inset-block-start:0;inset-inline-start:0;width:66%;height:var(--shotH);
 background-color:#f0ede4;background-image:var(--mh-hero-img,none);
 background-size:cover;background-position:50% 34%;background-repeat:no-repeat}
.mh-hero__shot::before{content:"";position:absolute;
 inset-block-start:var(--v-top);inset-block-end:0;
 inset-inline-end:calc(-1 * var(--v-w));width:var(--v-w);
 background:#a793ac;z-index:0}
.mh-hero__shot::after{content:"";position:absolute;
 inset-block-start:calc(100% - var(--h-h) / 2);height:var(--h-h);
 inset-inline-start:var(--h-gap);inset-inline-end:calc(-1 * var(--v-w));
 background:#a793ac;z-index:0}
.mh-hero__pitch{position:relative;z-index:5;margin-inline-start:auto;
 margin-top:calc(var(--shotH) * .47);
 width:min(624px,92%);background:var(--mh-sheet);padding:74px 52px 90px 56px}
.mh-hero__pitch h1{font-size:clamp(30px,1.78rem + 2.14vw,46px);line-height:1.85;margin:0 0 22px}
.mh-hero__pitch p{font-size:clamp(15px,0.89rem + 0.36vw,17px);line-height:1.75;color:#585350;margin:0 0 16px}
.mh-hero__pitch a{color:#4a6375;text-decoration:underline;text-underline-offset:3px}
@media (max-width:1000px){
 .mh-hero__in{min-height:0}
 .mh-hero__shot{position:relative;width:100%;height:58vh;min-height:380px;max-height:560px}
 .mh-hero__shot::before{display:none}
 .mh-hero__shot::after{inset-block-start:auto;inset-block-end:0;
  inset-inline-start:auto;inset-inline-end:0;width:12%;height:14px;z-index:4}
 .mh-hero__pitch{margin:-46px 0 0 auto;width:88%;padding:34px 22px 56px 26px}
}
.mh-hero__pitch .mh-hero__lines{
 font-size:clamp(17px,0.93rem + 0.62vw,23px);
 line-height:1.75;color:#585350;margin:0}
/* mh-hero-words */
.mh-hero__pitch p.mh-hero__name{
 font-family:var(--wp--preset--font-family--lalezar),sans-serif;
 font-size:clamp(34px, 1.51rem + 2.76vw, 52px);line-height:1.55;
 color:#2b2825;margin:0 0 14px;font-weight:400}
.mh-hero__pitch h1.mh-hero__h1{font-family:var(--mh-display);
 font-size:clamp(16px, 0.85rem + 0.62vw, 21px);line-height:1.85;
 margin:0 0 clamp(40px, 4vw, 76px);
 font-weight:400;color:var(--ink-3)}
.mh-hero__pitch .mh-hero__lines{
 font-size:clamp(28px, 1.25rem + 2.05vw, 43px);line-height:1.55;
 color:#2b2825;margin:0}
.mh-hero__pitch .mh-hl{padding:.02em .22em .1em;border-radius:2px;
 box-decoration-break:clone;-webkit-box-decoration-break:clone}
.mh-hero__pitch .mh-hl--cream{background:#e6dfcb;color:#2b2825}
.mh-hero__pitch .mh-hl--grey{background:#dedbd4;color:#2b2825}
.mh-hero__pitch .mh-hl--inv{background:#1f1c1a;color:#f8f4ea}
.mh-hero__pitch .mh-it{font-style:italic;font-synthesis:style}
/* end mh-hero-words */
/* mh-hero-img */
.mh-hero__shot>img{position:absolute;inset:0;z-index:1;width:100%;height:100%;
 object-fit:cover;object-position:50% 34%;display:block;margin:0;max-width:none}
/* end mh-hero-img */
/* mh-feat */
.mh-feat{background:var(--mh-sheet);padding-block:var(--sp-xl) clamp(56px, 7vw, 128px)}
.mh-feat__in{max-width:1400px;margin:0 auto;padding-inline:clamp(20px, 3vw, 40px);
 display:grid;grid-template-columns:minmax(0,1.8fr) minmax(0,1fr);
 gap:clamp(32px, 5vw, 104px);align-items:start}
.mh-feat__story{position:relative;display:flow-root}
.mh-feat__shot{--v:clamp(10px, 1.4vw, 22px);--h:clamp(12px, 2vw, 30px);display:block;position:relative;width:85%;margin-inline-end:auto;
 aspect-ratio:16/9;background:#e6e3de;background-size:cover;background-position:50% 40%}
.mh-feat__shot::before{content:"";position:absolute;
 inset-block-start:var(--v-top);inset-block-end:0;
 inset-inline-end:calc(-1 * var(--v-w));width:var(--v-w);
 background:#a793ac;z-index:0}
.mh-feat__shot::after{content:"";position:absolute;
 inset-block-start:calc(100% - var(--h-h) / 2);height:var(--h-h);
 inset-inline-start:var(--h-gap);inset-inline-end:calc(-1 * var(--v-w));
 background:#a793ac;z-index:0}
.mh-feat__panel{position:relative;z-index:3;background:var(--mh-sheet);
 width:76%;margin-inline-start:auto;margin-top:-52px;
 padding-block-start:clamp(26px, 3vw, 44px);
 padding-inline-start:clamp(26px, 3vw, 46px)}
.mh-feat .mh-kicker{font-family:var(--mh-display);font-size:13px;font-weight:700;line-height:1.55;color:var(--ink-3);margin:0 0 var(--sp-xs)}
.mh-feat__title{font-family:var(--mh-display);
 font-size:clamp(28px, 1.34rem + 1.78vw, 41px);line-height:1.85;font-weight:700;margin:0 0 22px}
.mh-feat__title a{color:#4a6375;text-decoration:none}
.mh-feat__title a:hover{text-decoration:underline;text-underline-offset:6px}
.mh-feat__dek{font-size:clamp(17px, 0.93rem + 0.22vw, 19px);line-height:1.9;color:var(--ink-2);margin:0}
.mh-feat__aside{padding-block-start:clamp(0px, 2vw, 40px)}
.mh-feat__h{font-family:var(--mh-display);
 font-size:clamp(27px, 1.2rem + 1.34vw, 32px);font-weight:700;color:#2b2825;
 margin:0 0 var(--sp-m);line-height:1.85}
.mh-feat__blurb{font-size:clamp(17px, 0.93rem + 0.22vw, 19px);line-height:1.9;color:var(--ink-2);margin:0 0 var(--sp-l)}
.mh-btn-outline{display:inline-block;border:1px solid #a793ac;color:var(--ink-2);
 background:transparent;text-decoration:none;font-family:var(--mh-display);font-weight:700;
 font-size:16px;line-height:1.55;padding:14px 34px;transition:background .18s, color .18s}
.mh-btn-outline:hover,.mh-btn-outline:focus-visible{background:#a793ac;color:#2b2825}
/* these four actions sit at the far side of their column — the LEFT in RTL,
   i.e. the end of the line, where the eye lands after reading. */
.mh-feat__aside .mh-btn-outline,
.mh-bp__panel .mh-btn-outline,
.mh-qr__more .mh-btn-outline,
.mh-qr__fold>summary{margin-inline-start:auto;margin-inline-end:0;width:fit-content}
.mh-feat__aside .mh-btn-outline,
.mh-bp__panel .mh-btn-outline,
.mh-qr__more .mh-btn-outline{display:block}
.mh-qr__fold>summary{display:flex}
@media (max-width:900px){
 .mh-feat__in{grid-template-columns:1fr;gap:clamp(56px, 14vw, 100px)}
 .mh-feat__shot{width:100%;aspect-ratio:1.86}
  .mh-feat__panel{width:76%;margin-top:-7vw;
  padding-block-start:clamp(16px, 3.6vw, 24px);
  padding-inline-start:clamp(20px, 6vw, 32px)}
 .mh-feat__title{font-size:clamp(27px, 6.14vw, 36px)}
}
/* end mh-feat */
/* mh-feat-img */
.mh-feat__shot>img{position:absolute;inset:0;z-index:1;width:100%;height:100%;
 object-fit:cover;object-position:50% 42%;display:block;margin:0;max-width:none}
/* end mh-feat-img */
/* mh-sub */
.mh-sub{margin-top:clamp(28px, 3.4vw, 46px)}
.mh-hero__pitch p.mh-sub__label, .mh-sub__label{font-family:var(--mh-display);font-size:13px;font-weight:700;line-height:1.55;
 color:var(--ink-2);margin:0 0 var(--sp-s)}
.mh-sub__form{display:flex;flex-wrap:wrap;gap:0;max-width:520px}
.mh-sub__input{flex:1 1 240px;min-width:0;font:inherit;
 font-size:clamp(16px, 0.89rem + 0.18vw, 16px);color:#2b2825;
 background:#fff;border:1px solid #c9c4bd;border-radius:0;
 padding:14px 16px;outline-offset:2px}
.mh-sub__input::placeholder{color:#8a847e}
.mh-sub__input:focus-visible{border-color:#a793ac;outline:2px solid #a793ac}
.mh-sub__btn{flex:0 0 auto;font:inherit;font-family:var(--mh-display);font-weight:700;
 font-size:16px;line-height:1.55;
 color:#2b2825;background:#a793ac;border:1px solid #a793ac;border-radius:0;
 padding:14px 34px;cursor:pointer;transition:background .18s, color .18s}
.mh-sub__btn:hover,.mh-sub__btn:focus-visible{background:#2b2825;border-color:#2b2825;color:#f8f4ea}
.mh-sub__note{margin:12px 0 0;font-size:13px;color:var(--ink-3)}
@media (max-width:560px){
 .mh-sub__form{display:grid;grid-template-columns:1fr;gap:10px}
 .mh-sub__btn{padding:14px 20px}
}
/* end mh-sub */
/* mh-paper-apply */
.mh-hero.mh-hero,.mh-feat.mh-feat{background-color:transparent;background-image:none}
.mh-hero__pitch.mh-hero__pitch,.mh-feat__panel.mh-feat__panel{
 background-color:var(--mh-paper);background-image:var(--mh-grain);
 background-size:var(--mh-grain-size);background-repeat:repeat}
/* end mh-paper-apply */
/* mh-rules */
:root{--ink-1:#2b2825;--ink-2:#44403c;--ink-3:#6b6560;
 --sp-xs:14px;--sp-s:24px;--sp-m:clamp(26px,2.6vw,32px);--sp-l:clamp(36px,3.6vw,48px);--sp-xl:clamp(60px,7vw,104px)}
/* a hairline between sections — an anchor for the eye. All four align to the
   same 1400px container and gutter, so they read as one page grid rather than
   four unrelated lines. The hero has none: it sits under the header already. */
.mh-feat,.mh-cards,.mh-bookpromo,.mh-qiraat{position:relative}
.mh-feat::before,.mh-bookpromo::before,.mh-qiraat::before{
 content:"";position:absolute;inset-block-start:0;height:1px;pointer-events:none;
 background:#e0dbd1;
 inset-inline-start:max(clamp(20px,3vw,40px), calc(50% - 700px));
 inset-inline-end:max(clamp(20px,3vw,40px), calc(50% - 700px))}
/* end mh-rules */
/* mh-cards */
.mh-cards{padding-block:clamp(10px, 1vw, 24px) clamp(56px, 7vw, 120px)}
.mh-cards__in{max-width:1400px;margin:0 auto;padding-inline:clamp(20px, 3vw, 40px)}
.mh-cards__label{font-family:var(--mh-display);
 font-size:clamp(27px, 1.2rem + 1.34vw, 32px);font-weight:700;color:#2b2825;
 line-height:1.55;margin:0 0 var(--sp-m)}
.mh-cards .wp-block-post-template{display:grid;gap:clamp(30px, 3.4vw, 56px);
 grid-template-columns:repeat(3, minmax(0,1fr));margin:0;padding:0;list-style:none}
.mh-card{display:flow-root}
.mh-card__shot{position:relative;width:100%;aspect-ratio:16/9;background:#e6e3de;overflow:hidden}
.mh-card__shot .wp-block-post-featured-image{position:absolute;inset:0;margin:0;height:100%}
.mh-card__shot img{width:100%;height:100%;object-fit:cover;display:block;max-width:none}
.mh-card h3.mh-card__title{font-family:var(--mh-display);
 font-size:clamp(22px, 1.02rem + 0.98vw, 25px);line-height:1.9;font-weight:700;
 margin:var(--sp-s) 0 var(--sp-xs)}
.mh-card__title a{color:#4a6375;text-decoration:none}
.mh-card__title a:hover{text-decoration:underline;text-underline-offset:5px}
.mh-card .mh-card__dek{font-size:clamp(17px, 0.93rem + 0.22vw, 19px);line-height:1.9;color:var(--ink-2);margin:0}
@media (max-width:900px){
 .mh-cards .wp-block-post-template{grid-template-columns:1fr;gap:clamp(40px, 8vw, 56px)}
}
/* end mh-cards */
/* mh-bookpromo */
.mh-bookpromo{padding-block:var(--sp-xl) clamp(46px,6vw,104px)}
.mh-bp__in{max-width:1080px;margin:0 auto;padding-inline:clamp(20px,3vw,40px);
 display:grid;grid-template-columns:minmax(0,auto) minmax(0,1fr);
 gap:clamp(30px,5vw,84px);align-items:center}

/* the cover, with a solid block set behind and offset toward the text */
.mh-bp__shot{position:relative;display:block;width:clamp(196px, 27vw, 330px);
 justify-self:center;line-height:0}
.mh-bp__shot::before{content:"";position:absolute;inset:0;z-index:0;
 background:#a793ac;translate:-22px 22px}
.mh-bp__shot img{position:relative;z-index:1;display:block;width:100%;height:auto;margin:0;
 border:1px solid rgba(30,42,85,.10)}

.mh-bp__panel{max-width:none}
.mh-bp__h{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(27px, 1.2rem + 1.34vw, 32px);color:#2b2825;
 margin:0 0 var(--sp-m);line-height:1.85}
.mh-bp__h a{color:inherit;text-decoration:none;border-block-end:2px solid transparent}
.mh-bp__h a:hover{border-block-end-color:#a793ac}
.mh-bp__p{font-size:clamp(17px, 0.93rem + 0.22vw, 19px);line-height:1.9;color:var(--ink-2);
 margin:0 0 var(--sp-m)}
.mh-bp__p:last-of-type{margin-block-end:var(--sp-l)}

@media (max-width:900px){
 .mh-bp__in{grid-template-columns:1fr;gap:clamp(28px,6vw,44px)}
 .mh-bp__shot{width:min(58vw, 260px);justify-self:start}
 .mh-bp__shot::before{translate:-16px 16px}
 .mh-bp__panel{max-width:none}
}
/* end mh-bookpromo */
/* mh-qiraat */
/* Cards follow claude/04_DESIGN_DECISIONS.md §3-§6: coloured ground with a paired
   type colour, name band 19%, portrait in an arch-family frame (border-radius only —
   clip-path polygons were tried and rejected), then كيف + the rest of the title.
   Sizing is by container query so blocks keep their places at any card size. */
.mh-qiraat{padding-block:var(--sp-xl) clamp(56px,7vw,120px)}
.mh-qr__in{max-width:1400px;margin:0 auto;padding-inline:clamp(20px,3vw,40px)}
.mh-qr__h{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(27px, 1.2rem + 1.34vw, 32px);color:#2b2825;margin:0 0 16px;line-height:1.85}
.mh-qr__blurb{font-size:clamp(17px, 0.93rem + 0.22vw, 19px);line-height:1.9;color:#3f3b38;
 margin:0 0 clamp(26px,3vw,42px);max-width:62ch}
.mh-qr__more{margin:var(--sp-l) 0 0}


/* the lede: why this section exists. Text leads (right in RTL), a typographic
   plate sits opposite with a solid block offset behind it toward the page edge.
   The plate is set type, not an image — مِمّا قرأت has no artwork and inventing
   decorative imagery is the thing we are avoiding. */
.mh-qr__lede{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);
 gap:clamp(28px,4.5vw,72px);align-items:start;margin-block-end:var(--sp-xl)}
.mh-qr__ledetext h2{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(27px, 1.2rem + 1.34vw, 32px);color:#2b2825;line-height:1.85;margin:0 0 var(--sp-m)}
.mh-qr__ledetext p{font-size:clamp(17px, 0.93rem + 0.22vw, 19px);line-height:1.9;
 color:var(--ink-2);margin:0 0 var(--sp-m)}

.mh-qr__fold{margin-block-start:var(--sp-m)}
.mh-qr__fold>summary{display:flex;width:fit-content;margin-inline-start:auto;align-items:center;gap:.55em;cursor:pointer;
 list-style:none;font-family:var(--mh-display);font-weight:700;font-size:16px;line-height:1.55;
 color:#3f3b38;background:transparent;border:1px solid #a793ac;padding:14px 34px;user-select:none;
 transition:background .18s, color .18s}
.mh-qr__fold>summary::-webkit-details-marker{display:none}
.mh-qr__fold>summary::after{content:"";width:15px;height:15px;background:currentColor;
 -webkit-mask:var(--ic-next) center/contain no-repeat;mask:var(--ic-next) center/contain no-repeat;
 transform:rotate(90deg)}
.mh-qr__fold[open]>summary::after{transform:rotate(-90deg)}
.mh-qr__fold>summary:hover,.mh-qr__fold>summary:focus-visible{background:#a793ac;color:#2b2825}
.mh-qr__fold[open]>summary{margin-block-end:var(--sp-m)}

.mh-qr__plate{position:relative;align-self:start}
.mh-qr__plate::before{content:"";position:absolute;inset:0;background:#a793ac;
 z-index:0;translate:-22px 22px}
.mh-qr__plateface{position:relative;z-index:1;background:#3f4d59;color:#cfe0c4;
 aspect-ratio:16/10;display:grid;place-content:center;gap:.02em;text-align:center;
 font-family:var(--mh-names);font-weight:400;letter-spacing:normal;
 font-size:clamp(36px, 1.25rem + 4.27vw, 85px);line-height:1.85;
 padding-block-end:.16em}
.mh-qr__plateface span{display:block}

.mh-qr__label{font-family:var(--mh-display);font-weight:700;font-size:13px;line-height:1.55;
 color:var(--ink-3);margin:0 0 var(--sp-s)}

@media (max-width:900px){
 .mh-qr__lede{grid-template-columns:1fr;gap:clamp(26px,6vw,40px)}
 .mh-qr__plate{order:-1}
 .mh-qr__plate::before{translate:-14px 14px}
}
.mh-qr__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,32px)}
.mh-qr__card{container-type:inline-size;position:relative;
 aspect-ratio:7/12;border-radius:14px;overflow:hidden;
 background:var(--g,#3f4d59);color:var(--t,#cfe0c4);text-decoration:none;
 display:flex;flex-direction:column;align-items:center;justify-content:space-between;
 padding:8.5% 8% 10.5%;cursor:pointer;-webkit-tap-highlight-color:transparent;
 box-shadow:0 2px 5px rgba(43,40,37,.12), 0 8px 18px rgba(43,40,37,.09);
 transition:transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s cubic-bezier(.2,.7,.2,1)}
.mh-qr__card:hover,.mh-qr__card.press{transform:translateY(-9px);
 box-shadow:0 5px 12px rgba(43,40,37,.18), 0 30px 58px rgba(43,40,37,.30)}
.mh-qr__card.press{transform:translateY(-5px)}

/* light from above, weight at the bottom, and the paper tooth — the coloured
   ground reads as printed stock rather than a flat swatch */
.mh-qr__card::before,.mh-qr__card::after{content:"";position:absolute;inset:0;
 pointer-events:none;border-radius:inherit}
.mh-qr__card::before{z-index:0;background-image:
 radial-gradient(125% 90% at 50% -12%,rgba(255,255,255,.11),rgba(255,255,255,0) 60%),
 radial-gradient(140% 100% at 50% 112%,rgba(0,0,0,.22),rgba(0,0,0,0) 66%)}
.mh-qr__card::after{z-index:1;background-image:var(--mh-grain-lite);background-size:var(--mh-grain-size);
 opacity:1}
.mh-qr__card > *{position:relative;z-index:2}

.mh-qr__card .mh-qr__who{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;
 align-items:center;justify-content:center;text-align:center;overflow:hidden;
 width:100%;height:21%;flex:0 0 auto;color:var(--t);
 font-family:var(--mh-names);font-weight:400;font-size:13.5cqw;line-height:1.18}

.mh-qr__card .mh-qr__frame{width:60%;max-height:56%;flex:0 0 auto;line-height:0;
 transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.mh-qr__card:hover .mh-qr__frame{transform:scale(1.03)}
.mh-qr__frame figure,.mh-qr__frame .wp-block-post-featured-image{margin:0;height:100%;width:100%;background:rgba(0,0,0,.10)}
.mh-qr__frame img{display:block;width:100%;height:100%;margin:0;
 object-fit:cover;object-position:center 32%}

.mh-qr__card .mh-qr__foot{width:100%;flex:0 0 auto;text-align:center;color:var(--t)}
.mh-qr__card .mh-qr__kicker{display:block;font-size:5.6cqw;font-weight:700;opacity:.82;margin-block-end:.5em}
.mh-qr__card .mh-qr__t,.mh-qr__card .mh-qr__ttl{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;
 overflow:hidden;font-family:var(--mh-display);font-weight:700;
 font-size:6.6cqw;line-height:1.3;color:var(--t);margin:0}
.mh-qr__card .mh-qr__ttl a{color:inherit;text-decoration:none}

/* Frame shapes. An earlier note here rejected clip-path outright because such
   shapes "cannot take a shadow" — that was wrong: put the shadow on the frame
   wrapper as a drop-shadow filter and the clip on its child, and an angular
   silhouette casts a correct shadow of its own outline. The family is no longer
   arches only: arches, circle, oval, octagon, hexagon, stepped, keyhole,
   chamfer, bracket and scallop. */
.mh-qr__frame{filter:drop-shadow(0 10px 20px rgba(0,0,0,.28))}
.mh-qr__frame > *{width:100%;height:100%;margin:0;display:block;overflow:hidden}

/* curved — border-radius */
.mh-qr__fr0{aspect-ratio:3/4}  .mh-qr__fr0 > *{border-radius:50% 50% 5px 5px / 34% 34% 5px 5px}
.mh-qr__fr1{aspect-ratio:1/1}  .mh-qr__fr1 > *{border-radius:50%}
.mh-qr__fr2{aspect-ratio:2/3}  .mh-qr__fr2 > *{border-radius:50% 50% 6px 6px / 62% 62% 6px 6px}
.mh-qr__fr3{aspect-ratio:4/5}  .mh-qr__fr3 > *{border-radius:4px}
.mh-qr__fr4{aspect-ratio:3/4}  .mh-qr__fr4 > *{border-radius:48%/40%}
.mh-qr__fr5{aspect-ratio:3/4}  .mh-qr__fr5 > *{border-radius:50% 50% 44% 44% / 42% 42% 20% 20%}
.mh-qr__fr6{aspect-ratio:4/5}  .mh-qr__fr6 > *{border-radius:24%}
.mh-qr__fr7{aspect-ratio:2/3}  .mh-qr__fr7 > *{border-radius:50% 50% 50% 50% / 26% 26% 26% 26%}
.mh-qr__fr8{aspect-ratio:3/4}  .mh-qr__fr8 > *{border-radius:5px 5px 50% 50% / 5px 5px 34% 34%}
.mh-qr__fr9{aspect-ratio:2/3}  .mh-qr__fr9 > *{border-radius:50% 50% 0 0 / 30% 30% 0 0}
.mh-qr__fr10{aspect-ratio:5/7} .mh-qr__fr10 > *{border-radius:50% 50% 10% 10% / 44% 44% 6% 6%}

/* angular — clip-path */
.mh-qr__fr11{aspect-ratio:3/4}
.mh-qr__fr11 > *{clip-path:polygon(24% 0,76% 0,100% 13%,100% 87%,76% 100%,24% 100%,0 87%,0 13%)}
.mh-qr__fr12{aspect-ratio:3/4}
.mh-qr__fr12 > *{clip-path:polygon(50% 0,100% 15%,100% 85%,50% 100%,0 85%,0 15%)}
.mh-qr__fr13{aspect-ratio:3/4}
.mh-qr__fr13 > *{clip-path:polygon(26% 0,74% 0,74% 5%,87% 5%,87% 12%,100% 12%,100% 100%,0 100%,0 12%,13% 12%,13% 5%,26% 5%)}
.mh-qr__fr14{aspect-ratio:4/5}
.mh-qr__fr14 > *{clip-path:polygon(0 9%,9% 0,91% 0,100% 9%,100% 100%,0 100%)}
.mh-qr__fr15{aspect-ratio:2/3}
.mh-qr__fr15 > *{clip-path:polygon(50% 0,100% 26%,100% 100%,0 100%,0 26%)}

/* bracket silhouettes — the shapes border-radius cannot make */
.mh-qr__fr16{aspect-ratio:10/13}
.mh-qr__fr16 > *{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 130' preserveAspectRatio='none'%3E%3Cpath d='M50 0C30 0 18 10 18 22 18 32 6 34 6 46L6 108C6 120 18 122 18 130L82 130C82 122 94 120 94 108L94 46C94 34 82 32 82 22 82 10 70 0 50 0Z' fill='%23000'/%3E%3C/svg%3E") center/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 130' preserveAspectRatio='none'%3E%3Cpath d='M50 0C30 0 18 10 18 22 18 32 6 34 6 46L6 108C6 120 18 122 18 130L82 130C82 122 94 120 94 108L94 46C94 34 82 32 82 22 82 10 70 0 50 0Z' fill='%23000'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.mh-qr__fr17{aspect-ratio:10/13}
.mh-qr__fr17 > *{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 130' preserveAspectRatio='none'%3E%3Cpath d='M4 28C4 12 22 4 34 12 42 17 58 17 66 12 78 4 96 12 96 28L96 126C96 128 94 130 92 130L8 130C6 130 4 128 4 126Z' fill='%23000'/%3E%3C/svg%3E") center/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 130' preserveAspectRatio='none'%3E%3Cpath d='M4 28C4 12 22 4 34 12 42 17 58 17 66 12 78 4 96 12 96 28L96 126C96 128 94 130 92 130L8 130C6 130 4 128 4 126Z' fill='%23000'/%3E%3C/svg%3E") center/100% 100% no-repeat}

@media (max-width:1000px){
 .mh-qr__grid{grid-template-columns:repeat(2,1fr);gap:clamp(14px,2vw,24px)}
}
/* One column below 700px. The prototype used two, but its titles were short
   placeholders; the real ones run to 40 characters. At two columns a phone card
   is ~175px wide, and since every size inside the card is a share of the card,
   that put the title at 11px and «كيف» at 7px. One column restores the card to
   roughly its desktop width, and the whole scale comes back with it. */
@media (max-width:700px){
 .mh-qr__grid{grid-template-columns:1fr;gap:18px}
}
@media (max-width:700px){
 /* a two-column card is ~175px wide: name band, portrait, kicker and a
    three-line title do not all fit at that size, so the band and the frame
    give room back to the title, which is the part that has to be readable. */
 .mh-qr__card{padding:7% 7% 8%}
 .mh-qr__card .mh-qr__who{height:18%}
 .mh-qr__card .mh-qr__frame{max-height:50%}
 .mh-qr__card .mh-qr__kicker{font-size:4.8cqw;margin-block-end:.35em}
 .mh-qr__card .mh-qr__t,.mh-qr__card .mh-qr__ttl{-webkit-line-clamp:2;font-size:7.4cqw;line-height:1.28}
}
/* end mh-qiraat */
/* mh-wall */
/* The wall IS the مِمّا قرأت page. Same card as the home row — one definition,
   two places. Type, ink and spacing come from the home-page system, not from the
   prototype's placeholder Amiri/Plex. */
.mh-wall{padding-block:var(--sp-xl)}
.mh-wall__in,.mh-wall .wp-block-query{max-width:1400px;margin-inline:auto;
 padding-inline:clamp(20px,3vw,40px)}
.mh-wall__head{margin-block-end:clamp(30px,4vw,54px)}
h1.mh-wall__h{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(30px, 1.25rem + 2.49vw, 50px);line-height:1.85;color:var(--ink-1);
 margin:0 0 var(--sp-s)}
.mh-wall__dek{font-size:clamp(17px, 0.93rem + 0.22vw, 19px);line-height:1.9;
 color:var(--ink-2);margin:0;max-width:52ch}
/* the query loop wraps every card in an li element; it must not add a box of its own */
.mh-wall__grid{list-style:none;padding:0;margin:0;grid-template-columns:repeat(4,1fr)}
@media (max-width:1200px){ .mh-wall__grid{grid-template-columns:repeat(3,1fr)} }
@media (max-width:1000px){ .mh-wall__grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:640px){ .mh-wall__grid{grid-template-columns:1fr} }
.mh-wall__grid > li{margin:0;padding:0;list-style:none}
.mh-wall .wp-block-query-pagination{margin-block-start:var(--sp-xl)}
/* end mh-wall */
/* mh-ov */
/* The card is the post, folded. Tapping it does not navigate: the post layer
   rises over the wall and becomes the article, while the background layer —
   the colour and the writer's name — stays fixed behind it. Esc, the close
   button or the back gesture folds it back into its place in the wall.
   All vertical placement derives from the name band, never guessed. */
:root{--nameBand:clamp(150px,24vh,290px);--namePad:20vh;--archH:196px;--archLift:64px}

.mh-ov{position:fixed;z-index:100;overflow:hidden;display:none;border-radius:14px;
 will-change:top,left,width,height}
.mh-ov.live{display:block}
.mh-ov.opened{overflow-y:auto;overscroll-behavior:contain}

.mh-ov__ground{position:absolute;inset:0;pointer-events:none;background:var(--g,#3f4d59);color:var(--t,#cfe0c4)}
.mh-ov.opened .mh-ov__ground{position:fixed}
.mh-ov__ground::before,.mh-ov__ground::after{content:"";position:absolute;inset:0;pointer-events:none}
.mh-ov__ground::before{background-image:
 radial-gradient(125% 90% at 50% -12%,rgba(255,255,255,.11),rgba(255,255,255,0) 60%),
 radial-gradient(140% 100% at 50% 112%,rgba(0,0,0,.22),rgba(0,0,0,0) 66%)}
.mh-ov__ground::after{background-image:var(--mh-grain-lite);background-size:var(--mh-grain-size);
 opacity:1}
.mh-ov__name{position:relative;z-index:2;box-sizing:border-box;
 width:100%;max-width:100%;margin:0 auto;overflow:hidden;
 padding:var(--namePad) 3vw 0;height:calc(var(--nameBand) + var(--namePad));
 display:flex;align-items:flex-start;justify-content:center;text-align:center}
.mh-ov__who{font-family:var(--mh-names);font-weight:400;color:var(--t);
 font-size:clamp(30px, 1.07rem + 3.92vw, 82px);line-height:1.5;white-space:nowrap;
 text-shadow:0 3px 0 rgba(0,0,0,.10)}

.mh-ov__flow{position:relative;z-index:2;width:100vw;pointer-events:none}
.mh-ov__sheet{pointer-events:auto}
.mh-ov__sheet{position:relative;background:var(--mh-paper);
 width:clamp(320px, 62vw, 880px);max-width:92vw;
 margin:calc(var(--nameBand) + var(--namePad) + 104px) auto clamp(150px,26vh,300px);
 border-radius:18px;
 box-shadow:0 40px 100px rgba(0,0,0,.34), 0 8px 22px rgba(0,0,0,.18);
 transform:translateY(52px);opacity:0;
 transition:transform .55s cubic-bezier(.2,.72,.2,1), opacity .42s}
.mh-ov.opened .mh-ov__sheet{transform:none;opacity:1}
.mh-ov__inner{position:relative;z-index:2;padding:0 8% 74px;
 display:flex;flex-direction:column;align-items:center}

.mh-ov__inner .mh-qr__frame{height:var(--archH);width:auto;max-height:none;flex-shrink:0;
 margin-top:calc(-1 * var(--archLift));filter:drop-shadow(0 10px 22px rgba(0,0,0,.30))}
.mh-ov__inner .mh-qr__frame img{width:100%;height:100%;object-fit:cover;object-position:center 32%}

.mh-ov__kicker{font-family:var(--mh-display);font-weight:700;font-size:13px;line-height:1.55;
 color:var(--ink-3);margin:var(--sp-m) 0 var(--sp-xs);text-align:center}
.mh-ov__title{font-family:var(--mh-display);font-weight:700;text-align:center;
 font-size:clamp(25px, 1.07rem + 1.96vw, 41px);line-height:1.85;color:var(--ink-1);margin:0}
.mh-ov__meta{display:flex;gap:.9em;justify-content:center;flex-wrap:wrap;width:100%;
 font-size:13px;line-height:1.55;color:var(--ink-3);margin-block-start:var(--sp-s);
 padding-block-end:var(--sp-m);border-block-end:1px solid #e0dbd1}
.mh-ov__body{width:100%;margin-block-start:var(--sp-l)}

.mh-ov__close{position:fixed;top:20px;left:20px;z-index:120;width:44px;height:44px;
 border-radius:50%;border:1px solid rgba(255,255,255,.4);
 background:rgba(20,18,14,.42);backdrop-filter:blur(6px);
 color:#fff;font-size:17px;line-height:1;cursor:pointer;display:none;
 align-items:center;justify-content:center}
.mh-ov.live ~ .mh-ov__close{display:flex}
body.mh-ov-open{overflow:hidden}

@media (max-width:700px){
 :root{--nameBand:clamp(92px,16vh,170px);--namePad:7vh;--archH:146px;--archLift:48px}
 .mh-ov__sheet{width:100%;max-width:none;border-radius:14px;
  margin:calc(var(--nameBand) + var(--namePad) + 76px) 0 clamp(100px,18vh,190px);
  box-shadow:0 20px 54px rgba(0,0,0,.32), 0 5px 14px rgba(0,0,0,.18)}
 .mh-ov__name{padding:var(--namePad) 8% 0}
 .mh-ov__inner{padding:0 22px 66px}
}
/* end mh-ov */
/* mh-post */
.mh-post{--col:660px;--rail:clamp(148px, 15vw, 196px);--gut:clamp(18px, 3vw, 40px);
 padding-block:clamp(34px,4.5vw,64px) var(--sp-xl)}
.mh-post__in{max-width:1180px;margin-inline:auto;
 padding-inline:var(--gut);
 display:grid;grid-template-columns:minmax(0, var(--rail)) minmax(0, var(--col));
 gap:clamp(20px, 3.2vw, 46px);justify-content:center}
.mh-post__rail,.mh-post__col{min-width:0}
.mh-post__cat,.mh-post__by{overflow-wrap:anywhere}
.mh-post__rail{border-inline-end:1px solid #e0dbd1;
 padding-inline-end:clamp(20px, 2.4vw, 32px);
 padding-block-end:var(--sp-m)}
.mh-post__cat{font-family:var(--mh-display);font-weight:700;
 font-size:17px;line-height:1.55;margin:0}
.mh-post__cat a{color:#4a6375;text-decoration:none;border-block-end:1px solid transparent}
.mh-post__cat a:hover{border-block-end-color:#4a6375}
.mh-post__by{font-family:var(--mh-display);font-weight:700;
 font-size:15px;line-height:1.55;color:#4a6375;
 margin:clamp(26px,3vw,38px) 0 0;padding-block-start:var(--sp-xs);
 border-block-start:1px solid var(--ink-1)}
.mh-post__rail .mh-post__meta{display:contents}
.mh-post__date,.mh-post__len{font-size:12px;line-height:1.6;color:var(--ink-3);margin:6px 0 0}
.mh-post__date time{color:inherit}
h1.mh-post__title{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(28px, 1.16rem + 2.31vw, 45px);line-height:1.9;color:var(--ink-1);
 margin:0 0 var(--sp-m);letter-spacing:0}
.mh-post__body p{font-size:clamp(17px, 0.93rem + 0.22vw, 19px);line-height:1.9;
 color:var(--ink-2);margin:0 0 var(--sp-m)}
.mh-post__body > p:first-of-type{font-size:clamp(19px, 0.98rem + 0.45vw, 22px);line-height:1.7;
 font-weight:500;color:var(--ink-1);margin-block-end:var(--sp-l)}
.mh-post__body > h2{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(23px, 1.07rem + 1.07vw, 30px);line-height:1.85;color:var(--ink-1);
 margin:var(--sp-xl) 0 var(--sp-m)}
.mh-post__body > h3{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(19px, 0.93rem + 0.53vw, 22px);line-height:1.85;color:#4a6375;
 margin:var(--sp-l) 0 var(--sp-s)}
/* theme.json emits «:root :where(.wp-block-quote){border-width:0 0 0 2px}» — a
 PHYSICAL left border. Ours was set with the LOGICAL border-inline-start, which in
 RTL is the RIGHT edge, so the two landed on opposite sides of the quote: a 2px
 black line at the left and a 3px lavender one at the right. Reset the shorthand
 first, then draw the one we want. Padding is logical for the same reason. */
.mh-post__body blockquote{border:0;margin:var(--sp-l) 0;
 padding:0;padding-inline-start:clamp(16px,2vw,24px);
 border-inline-start:3px solid #a793ac}
.mh-post__body blockquote p{font-size:clamp(15px, 0.82rem + 0.22vw, 17px);line-height:1.9;
 color:#4a4643;margin-block-end:.8em}
.mh-post__body blockquote p:last-child{margin-block-end:0}
.mh-post__body blockquote cite{display:block;font-style:normal;font-size:13px;
 color:var(--ink-3);margin-block-start:.8em}
.mh-post__body figure,.mh-post__body .wp-block-image{margin:var(--sp-l) 0;max-width:100%}
.mh-post__body figure img,.mh-post__body img{display:block;width:100%;height:auto;margin:0}
.mh-post__body figcaption{position:relative;font-size:12px;line-height:1.6;color:var(--ink-3);
 margin-block-start:10px;padding-block-start:9px;padding-inline-start:22px;
 border-block-start:1px solid #e0dbd1;text-align:start}
.mh-post__body figcaption::before{content:"";position:absolute;
 inset-inline-start:0;inset-block-start:11px;width:15px;height:15px;
 background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%236b6560'%3E%3Cpath d='M9 3l-1.5 2H4a2 2 0 0 0-2 2v11a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-3.5L15 3H9zm3 5.5A4.5 4.5 0 1 1 7.5 13 4.5 4.5 0 0 1 12 8.5zm0 2A2.5 2.5 0 1 0 14.5 13 2.5 2.5 0 0 0 12 10.5z'/%3E%3C/svg%3E") center/contain no-repeat;opacity:.75}
.mh-post__body ul,.mh-post__body ol{margin:0 0 var(--sp-m);padding-inline-start:1.4em}
.mh-post__body li{font-size:clamp(17px, 0.93rem + 0.22vw, 19px);line-height:1.9;
 color:var(--ink-2);margin-block:.4em}
.mh-post__body a{color:#4a6375;text-decoration:none;
 border-block-end:1px solid #d8d3cb;transition:border-color .15s}
.mh-post__body a:hover{border-block-end-color:#4a6375}
.mh-post__foot{margin-block-start:var(--sp-xl);padding-block-start:clamp(24px,3vw,34px);
 border-block-start:1px solid #e0dbd1}
.mh-post__taglabel{font-family:var(--mh-display);font-weight:700;font-size:13px;line-height:1.55;
 color:var(--ink-3);margin:0 0 var(--sp-s)}
/* 41 of 64 posts carry no tags; without them the foot must not open an empty band */
.mh-post__foot--notags{padding-block-start:0;border-block-start:0;margin-block-start:0}
.mh-post__foot--notags .mh-rel{margin-block-start:var(--sp-xl)}
.mh-post__tags{display:flex;flex-wrap:wrap;gap:10px;margin:0}
.mh-post__tags a{display:inline-block;font-size:14px;line-height:1.55;color:var(--ink-2);
 text-decoration:none;border:1px solid #ddd8d0;padding:8px 16px}
.mh-post__tags a:hover{border-color:#a793ac;background:rgba(167,147,172,.14)}
.mh-post__nav{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2vw,24px);
 margin-block-start:var(--sp-xl);padding-block-start:clamp(24px,3vw,34px);
 border-block-start:1px solid #e0dbd1}
.mh-post__nav .wp-block-post-navigation-link{font-size:15px;line-height:1.55}
.mh-post__nav a{color:#4a6375;text-decoration:none}
.mh-post__nav a:hover{color:var(--ink-1)}
.mh-post__next{text-align:end}
@media (max-width:1040px){
 .mh-post__in{grid-template-columns:minmax(0, 1fr);justify-content:stretch;
  max-width:calc(var(--col) + 2 * var(--gut))}
 .mh-post__rail{border-inline-end:0;padding-inline-end:0;
  border-block-end:1px solid #e0dbd1;padding-block-end:clamp(16px,2.4vw,22px);
  margin-block-end:clamp(22px,3vw,30px);
  display:flex;flex-wrap:wrap;align-items:baseline;gap:0 14px}
 .mh-post__cat{flex:1 0 100%;font-size:15px}
 .mh-post__by{flex:0 0 auto;margin:10px 0 0;padding-block-start:0;border-block-start:0;font-size:14px}
 .mh-post__date,.mh-post__len{flex:0 0 auto;margin:10px 0 0}
 .mh-post__by::after,.mh-post__date::after{content:"";display:inline-block;width:1px;height:.9em;
  background:#ccc6bd;margin-inline-start:14px;vertical-align:-1px}
}
@media (max-width:700px){
 .mh-post__body figure,.mh-post__body .wp-block-image{
  margin-inline:calc(-1 * var(--gut));width:auto;max-width:none}
 .mh-post__body figcaption{margin-inline:0;
  padding-inline-start:calc(var(--gut) + 22px);padding-inline-end:var(--gut)}
 .mh-post__body figcaption::before{inset-inline-start:var(--gut)}
}
@media (max-width:600px){.mh-post__nav{grid-template-columns:1fr}.mh-post__next{text-align:start}}
/* end mh-post */
/* mh-rel */
/* the bridge between an essay and the readings that demonstrate it. Each row
   carries the post's own frame shape, so a related reading is recognisably the
   same object as its card on the wall. */
.mh-rel{margin-block-start:var(--sp-xl)}
.mh-rel__label{font-family:var(--mh-display);font-weight:700;font-size:13px;line-height:1.55;
 color:var(--ink-3);margin:0 0 var(--sp-s)}
.mh-rel__list{list-style:none;margin:0;padding:0;display:grid;gap:0}
.mh-rel__list li{margin:0;border-block-start:1px solid #e0dbd1}
.mh-rel__list li:last-child{border-block-end:1px solid #e0dbd1}
.mh-rel__list a{display:grid;grid-template-columns:84px minmax(0,1fr);
 gap:clamp(14px,2vw,22px);align-items:center;
 padding-block:clamp(16px,2vw,22px);text-decoration:none;border:0}
.mh-rel__thumb{display:block;width:84px;aspect-ratio:3/4;line-height:0;
 filter:drop-shadow(0 6px 12px rgba(43,40,37,.22))}
.mh-rel__thumb img{display:block;width:100%;height:100%;margin:0;
 object-fit:cover;object-position:center 32%}
.mh-rel__thumb--none{background:#ece7de}
.mh-rel__txt{display:block;min-width:0}
/* Alkalami carries tall ascenders and deep descenders: at 1.3 two wrapped lines
   collide into each other. It is a writer's name, so it is held to one line. */
.mh-rel__who{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;
 overflow:hidden;font-family:var(--mh-names);font-size:17px;line-height:1.55;
 color:var(--ink-3);margin-block-end:.28em}
/* on an ordinary article page this slot would hold an image caption, not a name */
.mh-post .mh-rel__who{display:none}
.mh-rel__t{display:block;font-family:var(--mh-display);font-weight:700;
 font-size:clamp(17px, 0.89rem + 0.45vw, 20px);line-height:1.85;color:var(--ink-1)}
.mh-rel__list a:hover .mh-rel__t{color:#4a6375}
/* On the wall and inside its overlay the frame shape IS the object: a reading
   keeps the same silhouette wherever it appears. On an ordinary article page
   there is no shape system to belong to, so the thumbnail is a plain rectangle,
   landscape like the pictures these posts actually carry. */
.mh-post .mh-rel__list a{grid-template-columns:116px minmax(0,1fr)}
.mh-post .mh-rel .mh-rel__thumb{width:116px;aspect-ratio:4/3;
 border-radius:0;clip-path:none;-webkit-mask:none;mask:none;filter:none}
/* the shapes are drawn on the picture itself, so the picture is what must be
   put back to a rectangle, not only its wrapper */
.mh-post .mh-rel .mh-rel__thumb > *{border-radius:0;clip-path:none;
 -webkit-mask:none;mask:none;width:100%;height:100%;overflow:hidden}
.mh-post .mh-rel .mh-rel__thumb img{object-position:center center}
@media (max-width:520px){
 .mh-rel__list a{grid-template-columns:64px minmax(0,1fr)}
 .mh-rel__thumb{width:64px}
 .mh-post .mh-rel__list a{grid-template-columns:92px minmax(0,1fr)}
 .mh-post .mh-rel .mh-rel__thumb{width:92px}
}
/* end mh-rel *//
/* mh-book */
.mh-book{--col:min(680px, 92vw);--ink:#2b2825;--soft:#585350;--rule:#ddd8d0}
.mh-book > *{max-width:var(--col);margin-inline:auto}
.mh-book p,
.mh-book li{font-size:clamp(17px, 0.93rem + 0.22vw, 19px);line-height:2.05;color:var(--ink)}
.mh-book ul{padding-inline-start:1.4em;margin-block:1.1em}
.mh-book li{margin-block:.5em}

/* cover */






.mh-book__imprint{border-block:1px solid var(--rule);padding-block:22px;margin-block:clamp(26px,4vw,44px)}
.mh-book__imprint p{font-size:13px !important;line-height:1.85 !important;color:var(--soft);margin:.15em 0 !important}



/* section headings */



.mh-book .mh-en{font-family:"IBM Plex Sans",system-ui,sans-serif;
 font-weight:400;font-size:0.55em;color:var(--soft);letter-spacing:.01em}
.mh-book .mh-kicker{font-size:13px !important;font-weight:700;color:#a793ac;
 margin:0 auto .2em !important;line-height:1.6 !important}

/* فهرس */









@media (min-width:900px){  }

/* author figures */









/* pull quotes in the running text */
.mh-book > blockquote.mh-pull{border:0;border-inline-start:3px solid #a793ac;
 margin-block:clamp(30px,3.6vw,48px);padding-inline-start:clamp(18px,2vw,28px)}
.mh-book > blockquote.mh-pull p{font-size:clamp(20px,0.98rem + 0.62vw,25px) !important;
 line-height:1.75 !important;color:var(--ink);margin:0}

/* diagrams and plates */
.mh-book img{height:auto;display:block;margin-inline:auto}
.mh-book p:has(> img){margin-block:clamp(28px,3.4vw,44px)}
/* end mh-book */
/* mh-backtoc */
.mh-backtoc{position:fixed;z-index:50;
 inset-block-end:clamp(16px, 2.4vw, 28px);inset-inline-start:clamp(16px, 2.4vw, 28px);
 max-width:none !important;margin:0 !important;
 font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;
 font-size:14px;font-weight:700;line-height:1;text-decoration:none;
 color:#2b2825;background:var(--mh-sheet);border:1px solid #a793ac;
 padding:12px 18px;box-shadow:0 2px 10px rgba(43,40,37,.10);
 transition:background .18s, color .18s}
.mh-backtoc:hover,.mh-backtoc:focus-visible{background:#a793ac;color:#2b2825}
.mh-backtoc[hidden]{display:none !important}
/* end mh-backtoc */
/* mh-chapters */
.mh-book{--col:min(680px, 92vw);--ink:#2b2825;--soft:#585350;--rule:#ddd8d0}
.mh-book > *{max-width:var(--col);margin-inline:auto}
.mh-book h1.mh-ch__title{font-family:var(--wp--preset--font-family--lalezar),sans-serif;
 font-weight:400;font-size:clamp(34px, 1.42rem + 3.03vw, 61px);line-height:1.85;color:var(--ink);
 margin:clamp(18px,3vw,44px) auto clamp(22px,2.6vw,34px);padding-block-end:.3em;
 border-block-end:2px solid #a793ac;text-align:start}
.mh-chtoc{margin-block:0 clamp(38px,5vw,64px);border-block-end:1px solid var(--rule);padding-block-end:clamp(22px,2.6vw,32px)}
.mh-chtoc ul{list-style:none;padding:0;margin:0;columns:1}
.mh-chtoc li{margin-block:.15em;break-inside:avoid}
.mh-chtoc a{font-size:clamp(15px,0.85rem + 0.18vw,17px);color:var(--soft);text-decoration:none;line-height:1.95;
 border-block-end:1px solid transparent}
.mh-chtoc a:hover{color:#4a6375;border-block-end-color:#a793ac}
@media (min-width:820px){ .mh-chtoc ul{columns:2;column-gap:44px} }

/* the first and last chapters carry an empty span placeholder where the
   missing السابق / التالي would be; it was opening a stray grid row. */
.mh-chnav > span{display:none}
.mh-chnav{display:grid;grid-template-columns:1fr auto 1fr;gap:clamp(14px,2vw,26px);align-items:start;
 margin-block:clamp(60px,7vw,100px) 0;padding-block-start:clamp(24px,3vw,36px);
 border-block-start:1px solid var(--rule)}
.mh-chnav a{text-decoration:none;font-size:clamp(14px,0.8rem + 0.18vw,16px);line-height:1.55;color:#4a6375}
.mh-chnav a:hover{color:#2b2825}
.mh-chnav span{display:block;font-size:12px;color:var(--soft);margin-block-end:.3em}
.mh-chnav__prev{text-align:start}
.mh-chnav__next{text-align:end;grid-column:3}
.mh-chnav__toc{align-self:center;border:1px solid #a793ac;padding:10px 18px;font-weight:700;color:#2b2825}
.mh-chnav__toc:hover{background:#a793ac}
@media (max-width:600px){
 .mh-chnav{grid-template-columns:1fr;text-align:start}
 .mh-chnav__next{grid-column:1;text-align:start}
 .mh-chnav__toc{justify-self:start}
}

/* master فهرس on the front page */





@media (min-width:900px){  }
/* end mh-chapters */
/* mh-book-title */
.page-id-88 .wp-block-post-title,
.page-id-554 .wp-block-post-title,.page-id-555 .wp-block-post-title,
.page-id-556 .wp-block-post-title,.page-id-557 .wp-block-post-title,
.page-id-558 .wp-block-post-title,.page-id-559 .wp-block-post-title,
.page-id-560 .wp-block-post-title{position:absolute;width:1px;height:1px;overflow:hidden;
 clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
/* end mh-book-title */
/* mh-parts */


.mh-parts{margin-block:0 clamp(34px,4vw,56px)}
.mh-parts ol{list-style:none;padding:0;margin:0}
.mh-parts li{border-block-end:1px solid var(--rule)}
.mh-parts li:first-child{border-block-start:1px solid var(--rule)}
.mh-parts a{display:block;text-decoration:none;padding-block:clamp(16px,2vw,22px)}
.mh-parts__t{display:block;font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;
 font-size:clamp(21px,0.98rem + 0.98vw,28px);color:#2b2825;line-height:1.85}
.mh-parts__m{display:block;font-size:13px;color:var(--soft);margin-block-start:.25em}
.mh-parts a:hover .mh-parts__t{color:#4a6375}
/* end mh-parts */
/* mh-images */
.mh-book figure{margin-block:clamp(30px,3.6vw,50px);margin-inline:auto}
.mh-book figcaption{font-size:13px;line-height:1.7;color:var(--soft);
 margin-block-start:.7em;text-align:start}

/* portraits: small, beside the argument — never life-size */
.mh-book figure.mh-portrait{width:min(200px, 42%);float:inline-start;
 margin:.4em 0 clamp(16px,2vw,26px) clamp(18px,2.4vw,32px);shape-outside:inset(0)}
.mh-book figure.mh-portrait img{width:100%;height:auto;display:block;filter:saturate(.05)}
.mh-book figure.mh-portrait figcaption{font-size:12px;margin-block-start:.5em}
@media (max-width:600px){
 .mh-book figure.mh-portrait{float:none;width:min(160px,50%);margin-inline:0 auto}
}

/* plates: things meant to be studied — capped, then opened full size */
.mh-book figure.mh-plate{width:100%;background:#fff;border:1px solid var(--rule);
 padding:clamp(10px,1.2vw,16px)}
.mh-book figure.mh-plate a{display:block;cursor:zoom-in}
.mh-book figure.mh-plate img{width:100%;height:auto;max-height:min(74vh, 620px);
 object-fit:contain;display:block;margin:0}
.mh-book figure.mh-plate figcaption{padding-inline:2px}
.mh-plate__hint{display:inline-block;font-size:12px;color:#4a6375;border-block-end:1px solid #a793ac;
 margin-inline-start:.5em}

/* everything else: contained, never taller than a screenful */
.mh-book figure.mh-inline img{width:100%;height:auto;max-height:min(56vh, 460px);
 object-fit:contain;display:block;margin:0}

.mh-book h2,.mh-book h3,
/* end mh-images */
/* mh-index */
.mh-ix{max-width:none !important;border-block-start:1px solid var(--rule);
 padding-block-start:clamp(34px,4vw,56px);margin-block:clamp(46px,5vw,74px) 0}
.mh-ix > h2{border:0 !important;padding:0 !important;
 margin:0 auto clamp(24px,2.8vw,36px) !important;max-width:var(--col)}
.mh-ix__list{list-style:none;margin:0 auto;padding:0;max-width:var(--col)}

/* one bordered block per part — head and sections live inside it together */
.mh-ix__item{margin-block:0 clamp(12px,1.4vw,18px);
 border:1px solid var(--rule);background:transparent;transition:border-color .18s}
.mh-ix__item:hover{border-color:#cdbfd1}
.mh-ix__head{display:block;text-decoration:none;
 padding:clamp(15px,1.8vw,20px) clamp(16px,2vw,22px)}
.mh-ix__n{display:inline-block;font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;
 font-size:12px;color:#a793ac;margin-inline-end:.7em;vertical-align:middle}
.mh-ix__t{font-family:var(--wp--preset--font-family--lalezar),sans-serif;
 font-size:clamp(20px,0.89rem + 0.89vw,26px);color:#2b2825;line-height:1.85;vertical-align:middle}
.mh-ix__head:hover .mh-ix__t{color:#4a6375}
.mh-ix__m{display:block;font-size:12px;color:var(--soft);margin-block-start:.45em}

.mh-ix__subs{list-style:none;margin:0;
 padding:clamp(12px,1.4vw,16px) clamp(16px,2vw,22px) clamp(14px,1.8vw,20px);
 border-block-start:1px solid #eceae5;background:rgba(255,255,255,.45);
 columns:1}
.mh-ix__subs li{margin:0;break-inside:avoid}
.mh-ix__subs a{display:block;font-size:clamp(14px,0.78rem + 0.18vw,15px);line-height:1.7;
 color:var(--soft);text-decoration:none;padding:5px 12px 5px 0;
 border-inline-start:2px solid transparent}
.mh-ix__subs a:hover{color:#2b2825;border-inline-start-color:#a793ac;background:#fff}
@media (min-width:700px){ .mh-ix__subs{columns:2;column-gap:26px} }

/* رابعاً and its three chapters: one group, visibly nested */
.mh-ix__item--group{padding-block-end:clamp(10px,1.2vw,14px)}
.mh-ix__group{list-style:none;margin:0;padding:0 clamp(14px,2vw,22px) 0}
.mh-ix__group > .mh-ix__item{margin-block:0 clamp(8px,1vw,12px);
 border-color:#e6e2da;background:rgba(255,255,255,.5)}
.mh-ix__group .mh-ix__t{font-size:clamp(17px,0.82rem + 0.62vw,21px)}
/* end mh-index */
/* mh-navreset */
/* navigation blocks must not inherit the book's reading typography */
.mh-ix li,.mh-ix p,.mh-bar li,.mh-bar p,.mh-parts li,.mh-parts p{
 font-size:inherit !important;line-height:1.45 !important;margin:0}
.mh-ix,.mh-bar,.mh-parts{line-height:1.55}
.mh-ix__head{line-height:1.55}
.mh-ix__subs a{line-height:1.65 !important}
.mh-bar__subs a,.mh-bar__chs a{line-height:1.55 !important}
/* end mh-navreset */
/* mh-type */
/* ————— the ladder: each rank differs in family, size, colour and weight ————— */

/* h1 — the chapter. Display face, largest, rule beneath. */
.mh-book h1.mh-ch__title{font-family:var(--wp--preset--font-family--lalezar),sans-serif;
 font-weight:400;font-size:clamp(32px, 1.34rem + 2.85vw, 55px);line-height:1.85;color:var(--ink);
 margin:clamp(14px,2.4vw,34px) auto clamp(30px,3.4vw,46px);padding-block-end:.28em;
 border-block-end:3px solid #2b2825;text-align:start;letter-spacing:0}

/* h2 — a main idea. Display face, numbered, generous air above. */
.mh-book > h2{counter-increment:sec;
 font-family:var(--wp--preset--font-family--lalezar),sans-serif;font-weight:400;
 font-size:clamp(24px, 1.02rem + 1.51vw, 36px);line-height:1.85;color:var(--ink);
 margin:clamp(64px,7vw,104px) auto clamp(16px,1.8vw,24px);
 padding-inline-start:0;position:relative;scroll-margin-top:74px}
.mh-book{counter-reset:sec}
.mh-book > h2::before{content:counter(sec,decimal-leading-zero);
 display:block;font-family:"IBM Plex Sans",system-ui,sans-serif;
 font-size:12px;font-weight:600;letter-spacing:.14em;color:#a793ac;
 margin-block-end:.5em}
.mh-book > h2::after{content:"";display:block;width:44px;height:3px;background:#a793ac;
 margin-block-start:.55em}

/* h3 — a supporting idea. Text face, bold, blue, no ornament. */
.mh-book > h3{font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;
 font-weight:700;font-size:clamp(19px, 0.85rem + 0.8vw, 24px);line-height:1.85;color:#4a6375;
 margin:clamp(38px,4vw,56px) auto clamp(10px,1.2vw,14px);scroll-margin-top:74px}

/* h4 — a labelled item inside a list of them. */
.mh-book > h4{font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;
 font-weight:700;font-size:clamp(16px,0.8rem + 0.31vw,19px);line-height:1.85;color:var(--ink);
 margin:clamp(26px,2.8vw,36px) auto .3em;padding-inline-start:16px;
 border-inline-start:3px solid #ddd8d0;scroll-margin-top:74px}

/* the English half of a bilingual heading steps back */
.mh-book .mh-en{font-family:"IBM Plex Sans",system-ui,sans-serif;font-weight:400;
 font-size:0.5em;color:var(--soft);letter-spacing:.01em;display:block;margin-block-start:.25em}

/* body */
.mh-book > p{font-size:clamp(17px, 0.93rem + 0.22vw, 19px);line-height:2.05;color:var(--ink);
 margin-block:0 1.15em}
.mh-book > ul,.mh-book > ol{margin-block:1.2em;padding-inline-start:0;list-style:none}
.mh-book > ul > li,.mh-book > ol > li{font-size:clamp(16px,0.89rem + 0.22vw,18px);line-height:1.95;
 color:var(--ink);margin-block:.55em;padding-inline-start:26px;position:relative}
.mh-book > ul > li::before{content:"";position:absolute;inset-inline-start:8px;inset-block-start:.85em;
 width:6px;height:6px;background:#a793ac;border-radius:50%}
.mh-book > ol{counter-reset:li}
.mh-book > ol > li{counter-increment:li}
.mh-book > ol > li::before{content:counter(li);position:absolute;inset-inline-start:0;
 inset-block-start:.35em;font-family:"IBM Plex Sans",system-ui,sans-serif;
 font-size:12px;font-weight:600;color:#a793ac}

/* ⓘ sidebars — editorial aside. blue register, tinted ground,
   deliberately NOT the violet of quoted voices. */
.mh-note{background:#eaf0f3;border:0;border-inline-start:4px solid #4a6375;
 padding:clamp(18px,2.2vw,26px) clamp(18px,2.2vw,28px);
 margin-block:clamp(32px,3.6vw,48px)}
.mh-note__label{display:flex;align-items:center;gap:.5em;
 font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;
 font-weight:700;font-size:13px !important;color:#3d566a;
 margin:0 0 .6em !important;line-height:1.4 !important}
.mh-note__label::before{content:"";flex:0 0 auto;width:17px;height:17px;background:#3d566a;
 -webkit-mask:var(--ic-info) center/contain no-repeat;mask:var(--ic-info) center/contain no-repeat}
.mh-note__p{font-size:clamp(15px,0.85rem + 0.18vw,17px) !important;line-height:1.9 !important;
 color:#33454f;margin-block:0 .8em !important}
.mh-note__p:last-child{margin-block-end:0 !important}
.mh-note ul,.mh-note ol{margin-block:.4em .8em !important}
.mh-note li{font-size:clamp(15px,0.85rem + 0.18vw,17px) !important;color:#33454f}
/* end mh-type */
/* mh-bar */
.mh-bar{position:sticky;inset-block-start:0;z-index:30;max-width:none !important;
 margin:0 0 clamp(24px,3vw,40px) !important;
 background:rgba(248,248,247,.94);backdrop-filter:saturate(1.4) blur(8px);
 border-block-end:1px solid var(--rule)}
.mh-bar__in{max-width:min(820px,94vw);margin-inline:auto;
 display:grid;grid-template-columns:46px 1fr 46px;align-items:stretch;gap:4px}

.mh-bar__arrow{display:grid;place-items:center;min-height:54px;text-decoration:none;
 color:#4a6375;border-radius:3px;transition:background .16s, color .16s}
.mh-bar__arrow::before{content:"";width:21px;height:21px;background:currentColor;
 -webkit-mask:var(--ic-next) center/contain no-repeat;mask:var(--ic-next) center/contain no-repeat}
.mh-bar__arrow:first-child::before{-webkit-mask-image:var(--ic-prev);mask-image:var(--ic-prev)}
.mh-bar__arrow:hover{background:#efece7;color:#2b2825}
.mh-bar__arrow.is-off{color:#d9d4cc;pointer-events:none}

.mh-bar__menu{min-width:0}
.mh-bar__menu summary{list-style:none;cursor:pointer;min-height:54px;
 display:flex;gap:.55em;align-items:center;justify-content:center;padding:0 10px;
 border-radius:3px;transition:background .16s}
.mh-bar__menu summary:hover{background:#efece7}
.mh-bar__menu summary::-webkit-details-marker{display:none}
.mh-bar__menu summary::before{content:"";flex:0 0 auto;width:19px;height:19px;background:#a793ac;
 -webkit-mask:var(--ic-list) center/contain no-repeat;mask:var(--ic-list) center/contain no-repeat}
.mh-bar__menu[open] summary{background:#efece7}
.mh-bar__n{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:11px;font-weight:600;
 letter-spacing:.1em;color:#a793ac;flex:0 0 auto}
.mh-bar__t{font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;
 font-size:clamp(14px,0.76rem + 0.4vw,18px);color:#2b2825;line-height:1.3;
 white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.mh-bar__panel{position:absolute;inset-inline:0;background:var(--mh-paper);
 border-block-end:1px solid var(--rule);box-shadow:0 14px 30px rgba(43,40,37,.12);
 max-height:min(72vh,620px);overflow-y:auto;
 padding:clamp(20px,2.6vw,30px) clamp(16px,3vw,40px) clamp(26px,3vw,34px)}
.mh-bar__label{display:flex;align-items:center;gap:.45em;
 font-family:"IBM Plex Sans",system-ui,sans-serif;
 font-size:11px !important;font-weight:600;color:#a793ac;
 margin:0 0 .9em !important;line-height:1.4 !important;text-transform:uppercase}
.mh-bar__subs,.mh-bar__chs{list-style:none;margin:0 0 clamp(20px,2.6vw,28px);padding:0}
.mh-bar__subs a,.mh-bar__chs a{display:flex;align-items:baseline;gap:.6em;text-decoration:none;
 color:var(--soft);font-size:14px;padding:9px 10px;border-radius:3px;transition:background .14s,color .14s}
.mh-bar__subs a:hover,.mh-bar__chs a:hover{color:#2b2825;background:#efece7}
.mh-bar__subs li{counter-increment:bn}
.mh-bar__subs{counter-reset:bn}
.mh-bar__subs a::before{content:counter(bn,decimal-leading-zero);flex:0 0 auto;
 font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:10px;font-weight:600;
 letter-spacing:.08em;color:#c4b4c8}
.mh-bar__chs span{flex:0 0 2.6em;font-family:"IBM Plex Sans",system-ui,sans-serif;
 font-size:10px;font-weight:600;color:#c4b4c8}
.mh-bar__chs li.is-sub a{padding-inline-start:26px}
.mh-bar__chs li.is-current a{color:#2b2825;font-weight:700;background:#efece7}
.mh-bar__front{display:inline-flex;align-items:center;gap:.5em;
 border:1px solid #a793ac;padding:11px 18px;border-radius:3px;
 text-decoration:none;color:#2b2825;font-weight:700;font-size:13px;transition:background .16s}
.mh-bar__front::before{content:"";width:17px;height:17px;background:currentColor;
 -webkit-mask:var(--ic-book) center/contain no-repeat;mask:var(--ic-book) center/contain no-repeat}
.mh-bar__front:hover{background:#a793ac}
@media (min-width:820px){
 .mh-bar__subs,.mh-bar__chs{columns:2;column-gap:30px}
 .mh-bar__subs li,.mh-bar__chs li{break-inside:avoid}
}
/* plate hint gets the zoom icon */
.mh-plate__hint{display:inline-flex;align-items:center;gap:.35em;border:0}
.mh-plate__hint::before{content:"";width:15px;height:15px;background:currentColor;
 -webkit-mask:var(--ic-zoom) center/contain no-repeat;mask:var(--ic-zoom) center/contain no-repeat}
/* end mh-bar */
/* mh-quotes */
/* running prose is 19-21px. quoted material steps DOWN a notch: it is someone
   else's voice, held at arm's length, not shouted. */

/* a line that is wholly a quotation */
.mh-book > p.mh-quote{font-size:clamp(15px, 0.82rem + 0.22vw, 17px) !important;line-height:1.9;
 color:#4a4643;font-style:normal;margin-block:clamp(26px,3vw,38px);
 padding-inline-start:clamp(16px,2vw,24px);border-inline-start:3px solid #a793ac}

/* the passage under examination — the point of this book */
.mh-book > p.mh-example__lead{color:var(--soft);font-size:13px !important;
 line-height:1.6 !important;margin-block:0 .55em !important}
.mh-book > p.mh-example{background:rgba(255,255,255,.72);border-inline-start:3px solid #d9d3ca;
 font-size:clamp(15px, 0.82rem + 0.22vw, 17px) !important;line-height:1.9;color:#4a4643;
 margin:0;padding:.7em clamp(16px,2vw,24px) .7em clamp(14px,1.6vw,20px)}
.mh-book > p.mh-example:first-of-type{padding-block-start:1.1em}
.mh-book > p.mh-example + p:not(.mh-example){margin-block-start:1.4em}
.mh-book > p.mh-example{border-block:0}
.mh-book > p:not(.mh-example) + p.mh-example{padding-block-start:1.2em;border-block-start:1px solid #e8e3da}
.mh-book > p.mh-example:has(+ :not(p.mh-example)){padding-block-end:1.2em;border-block-end:1px solid #e8e3da}

.mh-book > p q, .mh-book > p cite{font-style:normal}
/* end mh-quotes */
/* mh-fontfix */
.mh-bar__t{font-weight:700}


.mh-parts__t{font-weight:700}
.mh-ix__n{font-weight:600;letter-spacing:.08em}
/* end mh-fontfix */
/* mh-epigraph */
/* a writer's maxim: the words lead, the person is the footnote */
.mh-book figure.mh-figure{display:grid;
 grid-template-columns:clamp(74px,11vw,104px) 1fr;
 column-gap:clamp(16px,2.4vw,26px);align-items:start;
 margin-block:clamp(44px,5vw,72px);padding:0;
 border-block:1px solid var(--rule);padding-block:clamp(26px,3vw,38px)}
.mh-book figure.mh-figure img{grid-row:1 / span 2;width:100%;height:auto;aspect-ratio:1;
 object-fit:cover;border-radius:50%;filter:grayscale(1) contrast(1.04);display:block;margin:0}
.mh-book figure.mh-figure .mh-pull{grid-column:2;grid-row:1;margin:0;padding:0;border:0;max-width:none}
.mh-book figure.mh-figure .mh-pull p{position:relative;margin:0;
 font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;
 font-size:clamp(19px,0.93rem + 0.8vw,27px) !important;line-height:1.6 !important;
 font-weight:500;color:#2b2825;background:none;padding:0;text-wrap:balance}
.mh-book figure.mh-figure figcaption{grid-column:2;grid-row:2;margin:0;
 display:flex;flex-wrap:wrap;align-items:baseline;gap:.15em .7em;
 margin-block-start:clamp(12px,1.6vw,18px);padding-block-start:clamp(10px,1.2vw,14px);
 border-block-start:2px solid #a793ac;width:fit-content;max-width:100%}
.mh-figure__name{font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;
 font-weight:700;font-size:clamp(14px,0.8rem + 0.22vw,16px);color:#2b2825;line-height:1.55}
.mh-figure__dates{font-family:"IBM Plex Sans",system-ui,sans-serif;
 font-size:11px;letter-spacing:.06em;color:#a793ac;line-height:1.55}
.mh-figure__desc{flex:1 0 100%;font-size:13px;color:var(--soft);line-height:1.6}
@media (max-width:560px){
 .mh-book figure.mh-figure{grid-template-columns:1fr;row-gap:14px}
 .mh-book figure.mh-figure img{grid-row:auto;width:clamp(64px,18vw,84px)}
 .mh-book figure.mh-figure .mh-pull{grid-column:1;grid-row:2}
 .mh-book figure.mh-figure figcaption{grid-column:1;grid-row:3}
}
/* end mh-epigraph */
/* mh-cover */
.mh-cover{max-width:none !important;margin:0 auto !important;
 display:grid;justify-items:center;
 padding-block:clamp(22px,4vw,52px) clamp(34px,5vw,64px)}
.mh-cover img{display:block;margin:0;
 width:clamp(228px, 44vw, 408px);max-width:100%;height:auto;
 border:1px solid rgba(30,42,85,.10);
 box-shadow:0 1px 2px rgba(30,42,85,.07), 0 22px 44px -20px rgba(30,42,85,.34)}
.mh-book--front .mh-book__imprint{margin-block-start:clamp(30px,4vw,50px)}
@media (max-width:520px){.mh-cover img{width:min(70vw, 320px)}}
/* end mh-cover */
/* mh-start */
.mh-start{display:grid;grid-template-columns:1fr auto;align-items:center;gap:clamp(14px,2vw,22px);
 margin-block:clamp(44px,6vw,76px) 0 !important;padding:clamp(18px,2.4vw,26px) clamp(20px,2.6vw,30px);
 text-decoration:none;border:1px solid #a793ac;background:rgba(167,147,172,.09);
 transition:background .15s ease}
.mh-start:hover{background:rgba(167,147,172,.20)}
.mh-start__lab{display:block;font-size:12px;color:#585350;margin-block-end:.4em;
 font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;font-weight:400}
.mh-start__ttl{display:block;font-family:var(--wp--preset--font-family--lalezar),sans-serif;
 font-weight:400;font-size:clamp(20px, 0.89rem + 1.16vw, 27px);line-height:1.85;color:#2b2825}
.mh-start__ic{width:clamp(22px,2.4vw,28px);aspect-ratio:1;background:#2b2825;flex:none;
 -webkit-mask:var(--ic-next) center/contain no-repeat;mask:var(--ic-next) center/contain no-repeat;
 transform:scaleX(-1)}
.mh-start:hover .mh-start__ic{background:#4a6375}
/* end mh-start */
/* mh-taal */
.mh-taal{background:var(--mh-sheet);position:relative;padding-block:var(--sp-xl) clamp(56px, 7vw, 128px)}
.mh-taal::before{content:"";position:absolute;inset-block-start:0;height:1px;pointer-events:none;
 background:#e0dbd1;
 inset-inline-start:max(clamp(20px,3vw,40px), calc(50% - 700px));
 inset-inline-end:max(clamp(20px,3vw,40px), calc(50% - 700px))}
.mh-tl__in{max-width:1400px;margin:0 auto;padding-inline:clamp(20px, 3vw, 40px)}
.mh-tl__head{margin-bottom:var(--sp-l)}
.mh-tl__h{font-family:var(--mh-display);
 font-size:clamp(27px, 1.2rem + 1.34vw, 32px);font-weight:700;color:var(--ink-1);
 line-height:1.85;margin:0}
.mh-tl__more{margin:var(--sp-l) 0 0}
.mh-tl__more .mh-btn-outline{display:block;width:fit-content;
 margin-inline-start:auto;margin-inline-end:0}
.mh-tl__lead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);
 gap:clamp(32px, 5vw, 88px);align-items:center}
.mh-tl__shot{--off:clamp(14px, 1.6vw, 26px);position:relative;width:100%;
 aspect-ratio:5/4}
.mh-tl__shot::before{content:"";position:absolute;z-index:0;
 inset-block-start:var(--off);inset-block-end:calc(-1 * var(--off));
 inset-inline-start:var(--off);inset-inline-end:calc(-1 * var(--off));
 background:#47605c}
.mh-tl__shot .wp-block-post-featured-image{position:absolute;z-index:1;inset:0;margin:0;height:100%;background:#e6e3de}
.mh-tl__shot img{width:100%;height:100%;object-fit:cover;display:block;max-width:none}
.mh-taal .mh-kicker{font-family:var(--mh-display);font-size:13px;font-weight:700;
 line-height:1.55;color:var(--ink-3);margin:0 0 var(--sp-xs)}
.mh-taal h2.mh-tl__t{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(28px, 1.34rem + 1.78vw, 41px);line-height:1.85;margin:0 0 22px}
.mh-tl__t a{color:#4a6375;text-decoration:none}
.mh-tl__t a:hover{text-decoration:underline;text-underline-offset:6px}
.mh-taal .mh-tl__maxim{font-size:clamp(17px, 0.93rem + 0.22vw, 19px);line-height:1.9;
 color:var(--ink-2);margin:0}
.mh-tl__label{font-family:var(--mh-display);font-size:13px;font-weight:700;
 line-height:1.55;color:var(--ink-3);margin:var(--sp-xl) 0 var(--sp-l)}
.mh-taal .mh-tl__grid{display:grid;grid-template-columns:repeat(3, minmax(0,1fr));
 gap:clamp(30px, 3.4vw, 56px);margin:0;padding:0;list-style:none}
.mh-taal .mh-tl__grid > *{display:flex;margin:0}
.mh-tl__item{flex:1;display:flex;flex-direction:column}
.mh-tl__ishot{position:relative;width:100%;aspect-ratio:16/9;
 background:#e6e3de;overflow:hidden;margin-bottom:var(--sp-s)}
.mh-tl__ishot .wp-block-post-featured-image{position:absolute;inset:0;margin:0;height:100%}
.mh-tl__ishot img{width:100%;height:100%;object-fit:cover;display:block;max-width:none}
.mh-taal h3.mh-tl__it{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(22px, 1.02rem + 0.98vw, 25px);line-height:1.85;margin:0 0 var(--sp-xs)}
.mh-tl__it a{color:#4a6375;text-decoration:none}
.mh-tl__it a:hover{text-decoration:underline;text-underline-offset:5px}
.mh-taal .mh-tl__m{font-size:clamp(17px, 0.93rem + 0.22vw, 19px);line-height:1.9;
 color:var(--ink-2);margin:0}
.mh-taal .wp-block-post-excerpt__more-text{display:none}
@media (max-width:900px){
 .mh-tl__lead{grid-template-columns:1fr;gap:clamp(40px, 9vw, 64px)}
 .mh-tl__shot{aspect-ratio:16/10;width:88%;margin-inline-end:auto}
 .mh-taal h2.mh-tl__t{font-size:clamp(27px, 6.14vw, 36px)}
 .mh-taal .mh-tl__grid{grid-template-columns:1fr;gap:clamp(40px, 8vw, 56px)}
}
/* end mh-taal */
/* mh-land */
.mh-land{--acc:#4a6375;--gut:clamp(18px, 3vw, 40px);background:var(--mh-sheet);
 padding-block:clamp(34px,4.5vw,64px) var(--sp-xl)}
.mh-land--kataba{--acc:#8c5a4a}
.mh-land--taallama{--acc:#47605c}
.mh-land__in{max-width:1400px;margin-inline:auto;padding-inline:var(--gut)}
.mh-land__top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.75fr);
 gap:clamp(32px, 5vw, 96px);align-items:start}
h1.mh-land__h{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(30px, 1.34rem + 2.14vw, 46px);line-height:1.85;color:var(--ink-1);
 margin:0 0 var(--sp-m)}
.mh-land__index{display:flex;flex-direction:column;align-items:flex-start;gap:0;
 border-block-start:1px solid var(--ink-1);padding-block-start:var(--sp-xs)}
.mh-land__index a{font-family:var(--mh-display);font-weight:700;font-size:16px;line-height:1.55;
 color:var(--ink-2);text-decoration:none;padding-block:10px;
 display:flex;align-items:center;gap:.5em;width:100%;
 border-block-end:1px solid #e0dbd1}
.mh-land__index a:last-child{border-block-end:0}
.mh-land__index a::after{content:"";width:13px;height:13px;margin-inline-start:auto;
 background:currentColor;-webkit-mask:var(--ic-next) center/contain no-repeat;
 mask:var(--ic-next) center/contain no-repeat;opacity:.5;
 transform:scaleX(-1);transition:opacity .15s, translate .15s}
.mh-land__index a:hover{color:var(--acc)}
.mh-land__index a:hover::after{opacity:1;translate:-4px 0}
/* the newest piece: the photograph, a block of the section colour showing along
   its outer edge, and the words on paper stepping over its inner corner —
   the panel leans back toward the column that names the archive. */
.mh-land__lead{position:relative;display:flow-root}
.mh-land__shot{--off:clamp(12px, 1.4vw, 22px);position:relative;
 width:86%;margin-inline-start:auto;margin-inline-end:0;aspect-ratio:16/10}
.mh-land__shot::before{content:"";position:absolute;z-index:0;
 inset-block-start:var(--off);inset-block-end:calc(-1 * var(--off));
 inset-inline-start:var(--off);inset-inline-end:calc(-1 * var(--off));
 background:var(--acc)}
.mh-land__panel{position:relative;z-index:3;
 background-color:var(--mh-paper, #f8f4ea);background-image:var(--mh-grain, none);
 background-size:var(--mh-grain-size);
 width:78%;margin-inline-start:0;margin-inline-end:auto;
 margin-block-start:clamp(-92px, -5vw, -48px);
 padding-block-start:clamp(22px, 2.6vw, 36px);
 padding-inline-end:clamp(22px, 2.6vw, 38px)}
.mh-land__shot .wp-block-post-featured-image{position:absolute;z-index:1;inset:0;margin:0;height:100%;background:#e6e3de}
.mh-land__shot img{width:100%;height:100%;object-fit:cover;display:block;max-width:none}
.mh-land .mh-kicker{font-family:var(--mh-display);font-size:13px;font-weight:700;
 line-height:1.55;color:var(--ink-3);margin:0 0 var(--sp-xs)}
.mh-land h2.mh-land__leadt{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(24px, 1.16rem + 1.34vw, 34px);line-height:1.85;margin:0 0 var(--sp-s)}
.mh-land__leadt a{color:var(--acc);text-decoration:none}
.mh-land__leadt a:hover{text-decoration:underline;text-underline-offset:6px}
.mh-land .mh-land__leadd{font-size:clamp(16px, 0.89rem + 0.18vw, 18px);line-height:1.85;
 color:var(--ink-2);margin:0}
.mh-land__band{margin-block:var(--sp-xl);padding-block:clamp(44px,5vw,72px);
 background:#efeeea}
.mh-land__bandlabel{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(19px, 0.93rem + 0.62vw, 22px);line-height:1.55;color:var(--ink-1);
 margin:0 0 var(--sp-l)}
.mh-land .mh-land__two{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));
 gap:clamp(28px, 3.4vw, 56px);margin:0;padding:0;list-style:none}
.mh-land .mh-land__two > *{display:flex;margin:0}
a.mh-land__pick{display:block;text-decoration:none;color:inherit}
a.mh-land__pick .mh-land__thumb{display:block}
.mh-land__pick{flex:1;display:flex;flex-direction:column}
.mh-land .mh-land__grid{display:grid;grid-template-columns:repeat(3, minmax(0,1fr));
 gap:clamp(30px,3.4vw,56px) clamp(24px,2.6vw,44px);margin:0;padding:0;list-style:none}
.mh-land .mh-land__grid > *{display:flex;margin:0}
.mh-land__cell{flex:1;display:flex;flex-direction:column}
.mh-land__gridlabel{font-family:var(--mh-display);font-weight:700;font-size:13px;
 line-height:1.55;color:var(--ink-3);margin:0 0 var(--sp-l)}
.mh-land__thumb{position:relative;width:100%;aspect-ratio:16/9;
 background:#e6e3de;overflow:hidden;margin-block-end:var(--sp-s)}
.mh-land__thumb .wp-block-post-featured-image{position:absolute;inset:0;margin:0;height:100%}
.mh-land__thumb img{width:100%;height:100%;object-fit:cover;display:block;max-width:none;
 transition:scale .45s cubic-bezier(.2,.7,.2,1)}
.mh-land__cell:hover .mh-land__thumb img,
.mh-land__pick:hover .mh-land__thumb img{scale:1.035}
.mh-land h3.mh-land__t{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(17px, 0.89rem + 0.4vw, 20px);line-height:1.85;margin:0}
.mh-land__t a{color:var(--ink-1);text-decoration:none;
 border-block-end:1px solid transparent}
.mh-land__t a:hover{color:var(--acc);border-block-end-color:var(--acc)}
.mh-land .mh-land__d{font-size:15px;line-height:1.8;color:var(--ink-2);
 margin:var(--sp-xs) 0 0}
.mh-land__note{margin-block-start:var(--sp-xl);padding-block-start:clamp(24px,3vw,34px);
 border-block-start:1px solid #e0dbd1;
 display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--sp-s) var(--sp-m)}
.mh-land__note p{font-size:clamp(16px, 0.89rem + 0.18vw, 18px);line-height:1.8;
 color:var(--ink-2);margin:0}
.mh-land__note .mh-btn-outline{margin-inline-start:auto}
@media (max-width:1100px){
 .mh-land .mh-land__grid{grid-template-columns:repeat(2, minmax(0,1fr))}
}
@media (max-width:900px){
 .mh-land__top{grid-template-columns:1fr;gap:clamp(36px,6vw,56px)}
 .mh-land__shot{width:92%}
 .mh-land__panel{width:84%;margin-block-start:clamp(-64px,-7vw,-36px)}
 .mh-land__shot{aspect-ratio:16/10}
 .mh-land__index{max-width:460px}
}
@media (max-width:620px){
 .mh-land .mh-land__two,
 .mh-land .mh-land__grid{grid-template-columns:1fr;gap:clamp(34px,7vw,48px)}
 .mh-land__note .mh-btn-outline{margin-inline-start:0}
}
/* end mh-land */
/* mh-about */
.mh-about{--gut:clamp(18px, 3vw, 40px);--col:min(680px, 100%);
 background:var(--mh-sheet);padding-block:0 var(--sp-xl)}
.mh-about__in{max-width:1180px;margin-inline:auto;padding-inline:var(--gut)}
.mh-about__col{max-width:var(--col);margin-inline:auto}
.mh-about__open{padding-block:clamp(54px,7vw,110px) clamp(46px,6vw,88px)}
.mh-about__kicker{font-family:var(--mh-display);font-weight:700;font-size:13px;
 line-height:1.55;color:var(--ink-3);margin:0 0 clamp(22px,3vw,34px)}
.mh-about__q{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(30px, 1.25rem + 3.03vw, 59px);line-height:1.85;color:var(--ink-1);
 margin:0 0 clamp(26px,3vw,40px);text-wrap:balance}
.mh-about__qs{font-size:clamp(18px, 0.93rem + 0.45vw, 22px);line-height:1.75;
 color:var(--ink-3);margin:0;max-width:30em}
.mh-about__qs span{display:block}
.mh-about__qs span + span{margin-block-start:.5em}
.mh-about__hard{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(19px, 0.93rem + 0.53vw, 24px);line-height:1.55;color:var(--ink-1);
 margin:clamp(32px,4vw,52px) 0 0;padding-block-start:clamp(20px,2.4vw,28px);
 border-block-start:1px solid var(--ink-1);width:fit-content}
.mh-about__label{font-family:var(--mh-display);font-weight:700;font-size:13px;
 line-height:1.55;color:var(--ink-3);margin:0 0 var(--sp-m)}
.mh-about p.mh-about__p{font-size:clamp(17px, 0.93rem + 0.22vw, 19px);line-height:1.9;
 color:var(--ink-2);margin:0 0 var(--sp-m)}
.mh-about p.mh-about__lead{font-size:clamp(19px, 0.98rem + 0.45vw, 22px);line-height:1.7;
 font-weight:500;color:var(--ink-1);margin:0 0 var(--sp-l)}
.mh-about h2.mh-about__h{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(23px, 1.07rem + 1.07vw, 30px);line-height:1.85;color:var(--ink-1);
 margin:var(--sp-xl) 0 var(--sp-m)}
.mh-about__band{background:#1e2f33;color:#e6dac2;
 margin-block:clamp(56px,7vw,110px);padding-block:clamp(54px,7vw,104px)}
.mh-about__bandin{max-width:1180px;margin-inline:auto;padding-inline:var(--gut);
 display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.55fr);
 gap:clamp(30px,4vw,72px);align-items:start}
.mh-about__face{position:relative;width:100%;aspect-ratio:4/5;overflow:hidden;
 background:#16242a}
.mh-about__face img{width:100%;height:100%;object-fit:cover;display:block;margin:0;max-width:none}
.mh-about__facecap{font-size:12px;line-height:1.7;color:#9fb0ab;
 margin:var(--sp-xs) 0 0}
.mh-about__frame{font-size:clamp(16px, 0.89rem + 0.22vw, 19px);line-height:1.85;
 color:#bfc9c0;margin:0 0 clamp(26px,3vw,40px)}
.mh-about__pull{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(22px, 1.07rem + 1.34vw, 36px);line-height:1.55;color:#e8c979;
 margin:0 0 clamp(24px,3vw,36px);text-wrap:balance}
.mh-about__quote{font-size:clamp(15px, 0.82rem + 0.27vw, 17px);line-height:2;
 color:#cfc6b2;margin:0;
 padding-inline-start:clamp(16px,1.8vw,24px);
 border-inline-start:2px solid rgba(232,201,121,.5)}
.mh-about__src{font-family:var(--mh-display);font-weight:700;font-size:13px;
 line-height:1.6;color:#8fa39d;margin:var(--sp-s) 0 0;
 padding-inline-start:clamp(16px,1.8vw,24px)}
.mh-about__turn{padding-block:clamp(10px,2vw,26px) clamp(56px,7vw,104px)}
.mh-about__turnline{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(24px, 1.16rem + 1.78vw, 41px);line-height:1.55;color:var(--ink-1);
 margin:0;max-width:18em;text-wrap:balance}
.mh-about__ways{margin-block-start:clamp(56px,7vw,104px);
 padding-block-start:clamp(30px,3.4vw,44px);border-block-start:1px solid #e0dbd1}
.mh-about__waysh{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(23px, 1.07rem + 1.07vw, 30px);line-height:1.55;color:var(--ink-1);
 margin:0 0 clamp(30px,3.4vw,48px)}
.mh-about__way{display:grid;grid-template-columns:auto minmax(0,1fr);
 gap:clamp(18px,2.4vw,40px);align-items:start;
 padding-block:clamp(26px,3vw,38px);border-block-end:1px solid #e0dbd1;
 text-decoration:none;color:inherit}
.mh-about__way:first-of-type{border-block-start:1px solid #e0dbd1}
.mh-about__n{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(15px,0.8rem + 0.27vw,17px);line-height:1.55;color:var(--wc, #4a6375);
 padding-block-start:.35em;min-width:2.2em}
.mh-about__wt{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(21px, 1.02rem + 0.89vw, 28px);line-height:1.55;color:var(--ink-1);
 margin:0 0 .45em;display:flex;align-items:baseline;gap:.5em}
.mh-about__wt::after{content:"";width:14px;height:14px;flex:0 0 auto;
 background:currentColor;-webkit-mask:var(--ic-next) center/contain no-repeat;
 mask:var(--ic-next) center/contain no-repeat;
 transform:scaleX(-1);opacity:0;transition:opacity .18s, translate .18s}
.mh-about__way:hover .mh-about__wt{color:var(--wc, #4a6375)}
.mh-about__way:hover .mh-about__wt::after{opacity:1;translate:-5px 0}
.mh-about__wd{font-size:clamp(16px, 0.89rem + 0.18vw, 18px);line-height:1.85;
 color:var(--ink-2);margin:0}
@media (max-width:900px){
 .mh-about__bandin{grid-template-columns:1fr;gap:clamp(30px,6vw,44px)}
 .mh-about__face{aspect-ratio:16/11;width:100%}
}
@media (max-width:620px){
 .mh-about__way{grid-template-columns:1fr;gap:6px}
 .mh-about__n{padding-block-start:0}
}
/* end mh-about */
/* mh-vol */
.mh-vol{--gut:clamp(18px, 3vw, 40px);--col:min(720px, 100%);
 --acc:#8f3a2a;--parch:#ece7dc;--rule:#d9d2c4;
 background-color:var(--mh-paper, #f8f4ea);background-image:var(--mh-grain, none);
 background-size:var(--mh-grain-size);background-repeat:repeat;
 padding-block:0 var(--sp-xl)}
.mh-vol__in{max-width:1180px;margin-inline:auto;padding-inline:var(--gut)}
.mh-vol__col{max-width:var(--col);margin-inline:auto}
/* the contents page is a table, not prose: it takes the whole container */
.mh-vol__wide{max-width:100%}
.mh-vol__wide h2.mh-vol__h{max-width:var(--col);margin-inline:auto}
.mh-vol__hero{position:relative;background:#140f0a;color:#f0e6d8;overflow:hidden}
.mh-vol__shot{position:absolute;inset:0}
.mh-vol__shot img{width:100%;height:100%;object-fit:cover;object-position:50% 58%;
 display:block;margin:0;max-width:none}
.mh-vol__veil{position:absolute;inset:0;
 background:linear-gradient(to bottom, rgba(12,9,6,.40) 0%, rgba(12,9,6,.66) 46%, rgba(12,9,6,.93) 100%)}
.mh-vol__heroin{position:relative;z-index:2;max-width:1180px;margin-inline:auto;
 padding-inline:var(--gut);
 padding-block:clamp(64px,8vw,112px);
 display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr);
 gap:clamp(34px,5vw,90px);align-items:center}
.mh-vol__cover{position:relative;width:100%;max-width:376px;
 margin-inline-start:auto;margin-inline-end:0;aspect-ratio:1706/2560;
 box-shadow:0 2px 6px rgba(0,0,0,.45), 0 26px 60px rgba(0,0,0,.55),
  0 60px 120px rgba(0,0,0,.35)}
.mh-vol__cover img{width:100%;height:100%;object-fit:cover;display:block;margin:0;max-width:none}
.mh-vol__cover::after{content:"";position:absolute;inset-block:0;
 inset-inline-end:0;width:5px;
 background:linear-gradient(to left, rgba(0,0,0,.34), rgba(0,0,0,0));
 pointer-events:none}
.mh-vol__words{min-width:0}
.mh-vol__kicker{font-family:var(--mh-display);font-weight:700;font-size:13px;
 line-height:1.55;color:#d8b877;margin:0 0 clamp(14px,1.8vw,20px)}
h1.mh-vol__t{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(32px, 1.34rem + 2.67vw, 53px);line-height:1.85;color:#f6ece0;
 margin:0 0 clamp(10px,1.2vw,14px);text-wrap:balance}
.mh-vol__tagline{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(17px, 0.89rem + 0.45vw, 21px);line-height:1.55;color:#c9a97a;
 margin:0 0 clamp(18px,2.2vw,26px)}
.mh-vol__sub{font-size:clamp(16px, 0.89rem + 0.27vw, 19px);line-height:1.8;
 color:#cdbfab;margin:0 0 clamp(26px,3vw,38px);max-width:32em}
.mh-vol__cta{display:inline-flex;align-items:center;gap:.6em;
 background:var(--acc);color:#fbf4e8;text-decoration:none;
 font-family:var(--mh-display);font-weight:700;
 font-size:clamp(15px,0.85rem + 0.22vw,17px);line-height:1.55;
 padding:15px 34px;transition:background .18s, translate .18s}
.mh-vol__cta::after{content:"";width:13px;height:13px;background:currentColor;
 -webkit-mask:var(--ic-next) center/contain no-repeat;
 mask:var(--ic-next) center/contain no-repeat;transform:scaleX(-1)}
.mh-vol__cta:hover{background:#a8462f}
.mh-vol__cap{font-size:12px;line-height:1.7;color:#9c8a73;margin:clamp(22px,2.6vw,30px) 0 0}
.mh-vol__facts{background:#241a13;color:#c2ac91}
.mh-vol__factsin{max-width:1180px;margin-inline:auto;padding-inline:var(--gut);
 display:flex;flex-wrap:wrap;gap:0 clamp(22px,3vw,54px);
 padding-block:clamp(16px,2vw,22px);
 font-family:var(--mh-display);font-weight:700;font-size:13px;line-height:2.2}
.mh-vol__facts b{color:#e4d3ba;font-weight:700}
.mh-vol__facts span{white-space:nowrap}
.mh-vol__label{font-family:var(--mh-display);font-weight:700;font-size:13px;
 line-height:1.55;color:var(--ink-3);margin:0 0 var(--sp-m)}
.mh-vol__sect{padding-block:clamp(52px,6.5vw,96px) 0}
.mh-vol p.mh-vol__p{font-size:clamp(17px, 0.93rem + 0.22vw, 19px);line-height:1.9;
 color:var(--ink-2);margin:0 0 var(--sp-m)}
.mh-vol p.mh-vol__lead{font-size:clamp(19px, 0.98rem + 0.45vw, 23px);line-height:1.7;
 font-weight:500;color:var(--ink-1);margin:0 0 var(--sp-l)}
.mh-vol h2.mh-vol__h{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(23px, 1.07rem + 1.07vw, 30px);line-height:1.85;color:var(--ink-1);
 margin:0 0 var(--sp-l)}
.mh-vol__band{margin-block:clamp(56px,7vw,104px) 0;background:var(--parch);
 padding-block:clamp(52px,6.5vw,96px)}
.mh-vol__bq{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(22px, 1.07rem + 1.51vw, 37px);line-height:1.55;color:#33261f;
 margin:0;padding-inline-start:clamp(18px,2vw,30px);
 border-inline-start:3px solid var(--acc);text-wrap:balance}
.mh-vol__toc{margin:0;padding:0;list-style:none;
 display:grid;grid-auto-flow:column;grid-template-rows:repeat(8, auto);
 column-gap:clamp(30px,4vw,76px);
 border-block-start:1px solid var(--rule)}
.mh-vol__ch{display:grid;grid-template-columns:auto minmax(0,1fr);
 gap:clamp(14px,1.6vw,22px);align-items:baseline;
 padding-block:clamp(16px,1.9vw,22px);border-block-end:1px solid var(--rule)}
.mh-vol__n{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(18px, 0.89rem + 0.53vw, 24px);line-height:1.55;color:var(--acc);
 font-variant-numeric:tabular-nums;opacity:.85}
.mh-vol__cht{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(17px, 0.89rem + 0.45vw, 20px);line-height:1.55;color:var(--ink-1);
 margin:0 0 .3em}
.mh-vol__why{font-size:14px;line-height:1.75;color:var(--ink-3);margin:0}
.mh-vol__outcome{margin:0;padding:0;list-style:none;
 display:grid;gap:clamp(20px,2.4vw,30px)}
.mh-vol__outcome li{display:grid;grid-template-columns:auto minmax(0,1fr);
 gap:clamp(14px,1.8vw,22px);align-items:start;
 font-size:clamp(16px, 0.89rem + 0.22vw, 19px);line-height:1.85;color:var(--ink-2)}
.mh-vol__outcome li::before{content:"";width:11px;height:11px;margin-block-start:.62em;
 background:var(--acc);flex:0 0 auto;
 clip-path:polygon(50% 0, 100% 50%, 50% 100%, 0 50%)}
.mh-vol__buy{margin-block-start:clamp(56px,7vw,104px);
 background:var(--parch);padding-block:clamp(52px,6.5vw,96px)}
.mh-vol__editions{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));
 gap:clamp(30px,4vw,72px);margin-block-start:var(--sp-l)}
.mh-vol__ed{font-family:var(--mh-display);font-weight:700;font-size:13px;line-height:1.55;
 color:var(--acc);margin:0 0 var(--sp-xs)}
.mh-vol__stores{display:grid;grid-template-columns:1fr;gap:0;margin:0;padding:0;
 list-style:none;border-block-start:1px solid #d3cbbb}
.mh-vol__store{display:flex;align-items:center;gap:.6em;
 padding-block:clamp(15px,1.7vw,19px);padding-inline-end:var(--sp-s);
 border-block-end:1px solid #d3cbbb;
 font-family:var(--mh-display);font-weight:700;
 font-size:clamp(15px,0.85rem + 0.18vw,17px);line-height:1.55;color:#4a4038;
 text-decoration:none;transition:color .15s}
.mh-vol__store::after{content:"";width:13px;height:13px;margin-inline-start:auto;
 background:currentColor;-webkit-mask:var(--ic-next) center/contain no-repeat;
 mask:var(--ic-next) center/contain no-repeat;
 transform:scaleX(-1);opacity:.4;transition:opacity .15s, translate .15s}
a.mh-vol__store:hover{color:var(--acc)}
a.mh-vol__store:hover::after{opacity:1;translate:-4px 0}
.mh-vol__isbn{font-size:12px;line-height:1.7;color:#7a6f62;
 margin:var(--sp-l) 0 0;font-variant-numeric:tabular-nums}
.mh-vol__sister{margin-block-start:clamp(48px,6vw,88px);
 padding-block-start:clamp(26px,3vw,36px);border-block-start:1px solid var(--rule);
 display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--sp-s) var(--sp-m)}
.mh-vol__sister p{font-size:clamp(16px, 0.89rem + 0.18vw, 18px);line-height:1.8;
 color:var(--ink-2);margin:0}
.mh-vol__sister .mh-btn-outline{margin-inline-start:auto}
@media (max-width:1000px){
 .mh-vol__toc{grid-auto-flow:row;grid-template-rows:none}
}
@media (max-width:820px){
 .mh-vol__heroin{grid-template-columns:1fr;gap:clamp(30px,6vw,44px);
  padding-block:clamp(44px,7vw,72px)}
 .mh-vol__cover{max-width:min(58vw, 260px);margin-inline:0}
}
@media (max-width:620px){
 .mh-vol__ch{grid-template-columns:auto minmax(0,1fr)}
 .mh-vol__editions{grid-template-columns:1fr;gap:clamp(30px,6vw,40px)}
 .mh-vol__sister .mh-btn-outline{margin-inline-start:0}
}
/* end mh-vol */
/* mh-train */
.mh-train{background:#eceaf0;padding-block:clamp(56px,7vw,110px)}
.mh-tr__in{max-width:1400px;margin-inline:auto;padding-inline:clamp(20px, 3vw, 40px);
 display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,.92fr);
 gap:clamp(28px, 3.4vw, 64px);align-items:center}
.mh-tr__book{display:block;position:relative;width:clamp(118px, 12vw, 168px);
 aspect-ratio:1706/2560;
 box-shadow:0 1px 4px rgba(43,40,37,.28), 0 14px 30px rgba(43,40,37,.26),
  0 34px 64px rgba(43,40,37,.16);
 transition:translate .25s cubic-bezier(.2,.7,.2,1), box-shadow .25s}
.mh-tr__book img{width:100%;height:100%;object-fit:cover;display:block;margin:0;max-width:none}
.mh-tr__book::after{content:"";position:absolute;inset-block:0;inset-inline-end:0;width:4px;
 background:linear-gradient(to left, rgba(0,0,0,.3), rgba(0,0,0,0));pointer-events:none}
.mh-tr__book:hover{translate:0 -5px;
 box-shadow:0 1px 4px rgba(43,40,37,.3), 0 20px 38px rgba(43,40,37,.3),
  0 44px 78px rgba(43,40,37,.18)}
.mh-tr__h{font-family:var(--mh-display);margin:0 0 clamp(22px,2.6vw,32px);
 font-size:clamp(28px, 1.25rem + 2.31vw, 48px);line-height:1.85;color:#4a3f57}
.mh-tr__h span{display:block}
.mh-tr__h .t1{font-weight:400}
.mh-tr__h .t2{font-weight:700}
.mh-tr__dek{font-size:clamp(17px, 0.93rem + 0.22vw, 19px);line-height:1.9;
 color:var(--ink-2);margin:0;max-width:32em}
.mh-tr__dek strong{font-weight:700;color:var(--ink-1)}
.mh-tr__dek a{color:#5f4c6b;text-decoration:none;border-block-end:1px solid #bfb0c6}
.mh-tr__dek a:hover{border-block-end-color:#5f4c6b}
.mh-tr__panel{background:var(--mh-sheet);padding:clamp(26px,3vw,40px)}
.mh-tr__label{font-family:var(--mh-display);font-weight:700;font-size:13px;
 line-height:1.55;color:var(--ink-3);margin:0 0 var(--sp-s)}
.mh-tr__list{margin:0 0 clamp(26px,3vw,36px);padding:0;list-style:none;
 display:grid;gap:14px}
.mh-tr__list li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.7em;
 font-size:clamp(15px, 0.85rem + 0.22vw, 17px);line-height:1.75;color:var(--ink-2)}
.mh-tr__list li::before{content:"";width:9px;height:9px;margin-block-start:.62em;
 background:#a793ac;clip-path:polygon(50% 0, 100% 50%, 50% 100%, 0 50%)}
.mh-tr__btn{display:flex;align-items:center;justify-content:center;gap:.6em;
 width:100%;box-sizing:border-box;background:#a793ac;color:#2b2825;text-decoration:none;
 font-family:var(--mh-display);font-weight:700;
 font-size:clamp(16px,0.89rem + 0.22vw,18px);line-height:1.55;
 padding:17px 28px;transition:background .18s}
.mh-tr__btn:hover{background:#9a85a0}
.mh-tr__note{font-size:12px;line-height:1.7;color:var(--ink-3);
 margin:var(--sp-xs) 0 0;text-align:center}
.mh-tr__who{font-size:13px;line-height:1.7;margin:var(--sp-s) 0 0;text-align:center}
.mh-tr__who a{color:var(--ink-2);text-decoration:none;
 border-block-end:1px solid #c3b4c8;transition:color .15s, border-color .15s}
.mh-tr__who a:hover{color:#5f4c6b;border-block-end-color:#5f4c6b}
@media (max-width:1100px){
 .mh-tr__in{grid-template-columns:auto minmax(0,1fr);
  row-gap:clamp(30px,4vw,44px)}
 .mh-tr__panel{grid-column:1 / -1}
}
@media (max-width:620px){
 .mh-tr__in{grid-template-columns:1fr;gap:clamp(26px,5vw,36px)}
}
/* end mh-train */
/* mh-say */
.mh-say{--gut:clamp(18px, 3vw, 40px);--acc:#8a7391;
 background-color:var(--mh-paper, #f8f4ea);background-image:var(--mh-grain, none);
 background-size:var(--mh-grain-size);background-repeat:repeat;
 padding-block:clamp(56px,9vw,130px) clamp(70px,10vw,150px)}
.mh-say__in{max-width:1040px;margin-inline:auto;padding-inline:var(--gut)}
.mh-say__kicker{font-family:var(--mh-display);font-weight:700;font-size:13px;
 line-height:1.55;color:var(--ink-3);margin:0 0 clamp(22px,3vw,34px)}
h1.mh-say__h{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(28px, 1.25rem + 2.49vw, 50px);line-height:1.85;color:var(--ink-1);
 margin:0 0 clamp(44px,6vw,88px);max-width:16em;text-wrap:balance}
.mh-say__rows{margin:0;padding:0;list-style:none;border-block-start:1px solid #ddd8d0}
.mh-say__row{display:block;text-decoration:none;color:inherit;
 padding-block:clamp(26px,3.4vw,44px);border-block-end:1px solid #ddd8d0}
.mh-say__lbl{font-family:var(--mh-display);font-weight:700;font-size:13px;
 line-height:1.55;color:var(--ink-3);margin:0 0 clamp(10px,1.2vw,14px);
 display:block;transition:color .16s}
.mh-say__val{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(20px, 0.98rem + 1.69vw, 41px);line-height:1.55;color:var(--ink-1);
 margin:0;display:flex;align-items:center;gap:.45em;
 overflow-wrap:anywhere;transition:color .16s}
.mh-say__val::after{content:"";width:.44em;height:.44em;flex:0 0 auto;
 background:currentColor;-webkit-mask:var(--ic-next) center/contain no-repeat;
 mask:var(--ic-next) center/contain no-repeat;transform:scaleX(-1);
 opacity:0;transition:opacity .18s, translate .18s}
.mh-say__row:hover .mh-say__val{color:var(--acc)}
.mh-say__row:hover .mh-say__lbl{color:var(--acc)}
.mh-say__row:hover .mh-say__val::after{opacity:1;translate:-.22em 0}
.mh-say__alt{font-size:14px;line-height:1.7;color:var(--ink-3);margin:clamp(12px,1.4vw,16px) 0 0}
.mh-say__alt a{color:var(--ink-2);text-decoration:none;border-block-end:1px solid #ccc5ba}
.mh-say__alt a:hover{color:var(--acc);border-block-end-color:var(--acc)}
.mh-say__back{margin-block-start:clamp(44px,6vw,80px);
 display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--sp-s) var(--sp-m)}
.mh-say__back p{font-size:clamp(16px, 0.89rem + 0.18vw, 18px);line-height:1.8;color:var(--ink-2);margin:0}
.mh-say__back .mh-btn-outline{margin-inline-start:auto}
@media (max-width:620px){
 .mh-say__back .mh-btn-outline{margin-inline-start:0}
}
/* end mh-say */
/* mh-cv */
.mh-cv{--face:var(--wp--preset--font-family--ibm-plex-sans-arabic), system-ui, sans-serif;
 --ink:#1e2f33;--gold:#e8c979;--acc:#4a6375;
 --gut:clamp(18px, 3vw, 40px);--rule:#e0dbd1;
 direction:ltr;text-align:left;font-family:var(--face);
 background-color:var(--mh-paper, #f8f4ea);background-image:var(--mh-grain, none);
 background-size:var(--mh-grain-size);background-repeat:repeat;
 padding-block:0 var(--sp-xl)}
.mh-cv__in{max-width:1160px;margin-inline:auto;padding-inline:var(--gut)}
.mh-cv__sect{padding-block:clamp(50px,6vw,92px) 0}
.mh-cv h2.mh-cv__h{font-family:var(--face);font-weight:700;
 font-size:clamp(12px,0.71rem + 0.18vw,13px);line-height:1.85;color:var(--ink-3);
 letter-spacing:.14em;text-transform:uppercase;
 margin:0 0 clamp(26px,3vw,40px);padding-block-end:var(--sp-xs);
 border-block-end:1px solid var(--rule)}
.mh-cv__hero{background:var(--ink);color:#e6dac2}
.mh-cv__heroin{max-width:1160px;margin-inline:auto;padding-inline:var(--gut);
 padding-block:clamp(56px,7vw,104px);
 display:grid;grid-template-columns:minmax(0,1fr) auto;
 gap:clamp(32px,4.5vw,80px);align-items:center}
.mh-cv__who{font-weight:700;font-size:clamp(13px,0.8rem + 0.22vw,15px);line-height:1.5;
 color:var(--gold);margin:0 0 clamp(18px,2.2vw,26px);letter-spacing:.04em}
h1.mh-cv__claim{font-family:var(--face);font-weight:700;
 font-size:clamp(27px, 1.16rem + 2.31vw, 46px);line-height:1.85;color:#fbf6ec;
 margin:0 0 clamp(20px,2.4vw,30px);letter-spacing:-.02em;max-width:17em;
 text-wrap:balance}
.mh-cv__role{font-size:clamp(14px,0.85rem + 0.27vw,17px);line-height:1.7;
 color:#a9bbb4;margin:0 0 clamp(26px,3vw,38px);max-width:34em}
.mh-cv__cta{display:inline-flex;align-items:center;gap:.55em;
 background:var(--gold);color:#22180a;text-decoration:none;
 font-family:var(--face);font-weight:700;
 font-size:clamp(14px,0.85rem + 0.18vw,16px);line-height:1.55;
 padding:14px 30px;transition:background .18s}
.mh-cv__cta:hover{background:#f0d894}
.mh-cv__face{width:clamp(132px, 16vw, 210px);aspect-ratio:1;overflow:hidden;
 background:#16242a;flex:0 0 auto;
 box-shadow:0 3px 10px rgba(0,0,0,.4), 0 26px 56px rgba(0,0,0,.45)}
.mh-cv__face img{width:100%;height:100%;object-fit:cover;object-position:50% 22%;
 display:block;margin:0;max-width:none}
.mh-cv__figs{display:grid;grid-template-columns:repeat(3, minmax(0,1fr));
 gap:0;max-width:1160px;margin:0 auto;padding-inline:var(--gut)}
.mh-cv__figwrap{background:var(--ink)}
.mh-cv__fig{background:var(--mh-sheet);padding:clamp(22px,2.6vw,34px) clamp(20px,2.4vw,32px);
 border-left:1px solid var(--rule)}
.mh-cv__fig:first-child{border-left:0}
.mh-cv__n{font-weight:700;font-size:clamp(24px, 1.07rem + 1.6vw, 39px);line-height:1.55;
 color:var(--ink);margin:0 0 .34em;letter-spacing:-.025em}
.mh-cv__figp{font-size:13px;line-height:1.75;color:var(--ink-2);margin:0}
.mh-cv__rooms{padding-block:clamp(34px,4vw,54px);border-block-end:1px solid var(--rule)}
.mh-cv__roomlbl{font-weight:700;font-size:12px;line-height:1.55;color:var(--ink-3);
 letter-spacing:.14em;text-transform:uppercase;margin:0 0 clamp(18px,2.2vw,26px)}
.mh-cv__roomrow{display:flex;flex-wrap:wrap;align-items:baseline;
 gap:clamp(14px,1.8vw,26px) clamp(20px,2.6vw,44px);margin:0;padding:0;list-style:none}
.mh-cv__roomrow li{font-weight:700;font-size:clamp(15px,0.85rem + 0.62vw,23px);
 line-height:1.55;color:var(--ink-1);letter-spacing:-.01em;white-space:nowrap}
.mh-cv__roomrow li + li::before{content:"";display:inline-block;
 width:5px;height:5px;background:var(--gold);border-radius:50%;
 margin-right:clamp(20px,2.6vw,44px);vertical-align:.28em}
.mh-cv__summary{font-size:clamp(16px, 0.89rem + 0.27vw, 19px);line-height:1.8;
 color:var(--ink-2);margin:0;max-width:60ch}
.mh-cv__grid2{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));
 gap:clamp(26px,3.2vw,52px)}
.mh-cv h3.mh-cv__t{font-family:var(--face);font-weight:700;
 font-size:clamp(16px,0.89rem + 0.31vw,19px);line-height:1.85;color:var(--ink-1);
 margin:0 0 .4em}
.mh-cv__p{font-size:14px;line-height:1.8;color:var(--ink-2);margin:0}
.mh-cv__jobs{margin:0;padding:0;list-style:none;border-block-start:1px solid var(--rule)}
.mh-cv__job{display:grid;grid-template-columns:auto minmax(0,1fr);
 gap:clamp(20px,3vw,56px);
 padding-block:clamp(24px,3vw,38px);border-block-end:1px solid var(--rule)}
.mh-cv__yr{font-weight:700;font-size:13px;line-height:1.6;color:var(--acc);
 font-variant-numeric:tabular-nums;white-space:nowrap;min-width:6.8em;
 padding-block-start:.42em}
.mh-cv__org{font-family:var(--face);font-weight:700;
 font-size:clamp(18px,0.89rem + 0.71vw,24px);line-height:1.55;color:var(--ink-1);
 margin:0 0 .18em;letter-spacing:-.012em}
.mh-cv__pos{font-size:13px;line-height:1.6;color:var(--acc);font-weight:700;
 margin:0 0 .8em;letter-spacing:.02em}
.mh-cv__job .mh-cv__p{max-width:58ch}
.mh-cv__books{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));
 gap:clamp(28px,3.4vw,60px)}
.mh-cv__book{display:grid;grid-template-columns:auto minmax(0,1fr);
 gap:clamp(16px,2vw,26px);align-items:start;text-decoration:none;color:inherit}
.mh-cv__cover{width:clamp(88px,9vw,120px);position:relative;flex:0 0 auto;
 box-shadow:0 1px 4px rgba(43,40,37,.24), 0 12px 26px rgba(43,40,37,.2);
 transition:translate .22s cubic-bezier(.2,.7,.2,1)}
.mh-cv__cover img{width:100%;height:auto;display:block;margin:0}
.mh-cv__cover::after{content:"";position:absolute;inset-block:0;right:0;width:4px;
 background:linear-gradient(to left, rgba(0,0,0,.28), rgba(0,0,0,0));pointer-events:none}
.mh-cv__book:hover .mh-cv__cover{translate:0 -4px}
.mh-cv__book:hover .mh-cv__t{color:var(--acc)}
.mh-cv__meta{font-size:13px;line-height:1.7;color:var(--ink-3);margin:.5em 0 0}
.mh-cv__list{margin:0;padding:0;list-style:none;border-block-start:1px solid var(--rule)}
.mh-cv__li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.5em;
 align-items:baseline;padding-block:clamp(13px,1.5vw,18px);
 border-block-end:1px solid var(--rule)}
.mh-cv__li b{font-weight:700;font-size:clamp(14px,0.85rem + 0.18vw,16px);color:var(--ink-1)}
.mh-cv__li span{font-size:13px;color:var(--ink-3);text-align:right;white-space:nowrap}
.mh-cv__facts{display:grid;grid-template-columns:repeat(3, minmax(0,1fr));
 gap:clamp(26px,3.2vw,52px)}
.mh-cv__lbl{font-weight:700;font-size:12px;line-height:1.55;color:var(--ink-3);
 letter-spacing:.12em;text-transform:uppercase;margin:0 0 .7em}
.mh-cv__end{background:var(--ink);color:#e6dac2;
 margin-block-start:clamp(56px,7vw,104px);
 padding-block:clamp(50px,6vw,92px)}
.mh-cv__endh{font-family:var(--face);font-weight:700;
 font-size:clamp(21px, 1.02rem + 1.34vw, 34px);line-height:1.55;color:#fbf6ec;
 margin:0 0 clamp(22px,2.6vw,32px);max-width:20em;letter-spacing:-.015em}
.mh-cv__mail{font-weight:700;font-size:clamp(17px, 0.89rem + 0.98vw, 28px);line-height:1.55;
 color:var(--gold);text-decoration:none;display:inline-block;
 letter-spacing:-.01em;border-bottom:1px solid rgba(232,201,121,.35);
 transition:border-color .16s}
.mh-cv__mail:hover{border-bottom-color:var(--gold)}
.mh-cv__also{font-size:14px;line-height:1.8;color:#93a69f;margin:clamp(16px,2vw,24px) 0 0}
.mh-cv__also a{color:#c4d2cb;text-decoration:none;border-bottom:1px solid rgba(196,210,203,.32)}
.mh-cv__also a:hover{color:var(--gold);border-bottom-color:var(--gold)}
@media (max-width:860px){
 .mh-cv__heroin{grid-template-columns:1fr;gap:clamp(26px,4vw,36px)}
 .mh-cv__face{order:-1}
 .mh-cv__figs{grid-template-columns:1fr}
 .mh-cv__fig{border-left:0;border-top:1px solid var(--rule)}
 .mh-cv__fig:first-child{border-top:0}
 .mh-cv__facts{grid-template-columns:1fr;gap:clamp(24px,4vw,32px)}
 .mh-cv__grid2,.mh-cv__books{grid-template-columns:1fr}
}
@media (max-width:620px){
 .mh-cv__job{grid-template-columns:1fr;gap:5px}
 .mh-cv__yr{padding-block-start:0}
 .mh-cv__li{grid-template-columns:1fr;gap:.2em}
 .mh-cv__li span{text-align:left}
 .mh-cv__roomrow{flex-direction:column;gap:10px}
 .mh-cv__roomrow li + li::before{display:none}
}
/* end mh-cv */
/* mh-foot */
.mh-foot{background-color:#1e2f33;background-image:var(--mh-grain-lite);
 background-size:var(--mh-grain-size);background-repeat:repeat;
 padding-block:clamp(48px,6vw,86px) clamp(26px,3vw,40px)}
.mh-foot__in{max-width:1400px;margin-inline:auto;padding-inline:clamp(20px, 3vw, 40px)}
.mh-foot__top{display:grid;grid-template-columns:minmax(0,1fr) auto;
 gap:clamp(28px,4vw,72px);align-items:start}
.mh-foot__mark .wp-block-site-logo img{width:clamp(78px,8vw,104px);height:auto;display:block;
 filter:brightness(0) invert(1);opacity:.92}
.mh-foot .wp-block-site-title{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(19px,0.93rem + 0.62vw,23px);line-height:1.55;margin:var(--sp-xs) 0 0}
.mh-foot .wp-block-site-title a{color:#f8f4ea;text-decoration:none}
.mh-foot .wp-block-site-tagline{font-size:14px;line-height:1.7;
 color:rgba(248,244,234,.58);margin:.4em 0 0}
.mh-foot__links{display:flex;flex-wrap:wrap;gap:clamp(14px,1.8vw,26px) clamp(22px,3vw,44px);
 margin:0;padding:0;list-style:none;justify-content:flex-end}
.mh-foot__links a{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(14px,0.85rem + 0.18vw,16px);line-height:1.55;
 color:rgba(248,244,234,.88);text-decoration:none;
 border-block-end:1px solid transparent;
 transition:color .15s, border-color .15s}
.mh-foot__links a:hover{color:#e8c979;border-block-end-color:#e8c979}
.mh-foot__bar{margin-block-start:clamp(34px,4vw,60px);
 padding-block-start:clamp(16px,2vw,22px);
 border-block-start:1px solid rgba(248,244,234,.16);
 direction:ltr;text-align:center}
.mh-foot__bar p{font-size:12px;line-height:1.7;color:rgba(248,244,234,.5);margin:0}
.mh-foot__bar a{color:rgba(248,244,234,.68);text-decoration:none;
 border-block-end:1px solid rgba(248,244,234,.28)}
.mh-foot__bar a:hover{color:#e8c979;border-block-end-color:#e8c979}
@media (max-width:760px){
 .mh-foot__top{grid-template-columns:1fr;gap:clamp(26px,5vw,36px)}
 .mh-foot__links{justify-content:flex-start}
}
/* end mh-foot */
/* mh-en */
.mh-post--en{direction:ltr;
 --mh-display:var(--wp--preset--font-family--ibm-plex-sans-arabic),"Helvetica Neue",Arial,sans-serif;
 font-family:var(--mh-display)}
.mh-post--en h1.mh-post__title{font-size:clamp(27px, 1.07rem + 2.14vw, 41px);
 line-height:1.14;letter-spacing:-.015em}
.mh-post--en .mh-post__body p,
.mh-post--en .mh-post__body li{font-size:clamp(15px, 0.85rem + 0.2vw, 17px);line-height:1.68}
.mh-post--en .mh-post__body > p:first-of-type{font-size:clamp(15px, 0.85rem + 0.2vw, 17px);
 line-height:1.68;font-weight:400;color:var(--ink-2);margin-block-end:var(--sp-m)}
.mh-post--en .mh-post__body > p.mh-post__lead{font-size:clamp(17px, 0.89rem + 0.45vw, 20px);
 line-height:1.5;font-weight:400;color:var(--ink-1);margin-block-end:var(--sp-l)}
.mh-post--en .mh-post__body > p.mh-post__lead em{font-style:normal}
.mh-post--en .mh-post__body > h2{font-size:clamp(20px, 0.98rem + 0.89vw, 27px);
 line-height:1.22;letter-spacing:-.01em}
.mh-post--en .mh-post__body > h3{font-size:clamp(17px, 0.87rem + 0.45vw, 20px);line-height:1.3}
.mh-post--en .mh-post__body blockquote p{font-size:clamp(14px, 0.78rem + 0.18vw, 15px);line-height:1.72}
.mh-post--en .mh-post__cat{font-size:12px;line-height:1.5;letter-spacing:.08em;
 text-transform:uppercase;color:var(--ink-3)}
.mh-post--en .mh-post__by{font-size:14px}
.mh-post--en .mh-post__date,.mh-post--en .mh-post__len{font-size:12px}
.mh-post--en .mh-post__foot,.mh-post--en .mh-post__nav{display:none}
.mh-post__cross{display:inline-block;margin-block-start:clamp(20px,2.4vw,28px);
 font-size:14px;line-height:1.55;padding:10px 22px}
.mh-post__cross--ar{font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),system-ui,sans-serif;direction:rtl}
.mh-post__cross--en{font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),"Helvetica Neue",Arial,sans-serif;direction:ltr;letter-spacing:.02em}
.mh-alt{display:block;text-decoration:none;color:inherit;
 margin-block-start:var(--sp-xl);padding-block-start:clamp(24px,3vw,34px);
 border-block-start:1px solid #e0dbd1}
.mh-alt__k{display:flex;align-items:center;gap:.4em;font-weight:700;font-size:13px;
 line-height:1.55;color:var(--ink-3);margin:0 0 var(--sp-s);transition:color .16s}
.mh-alt__k::after{content:"";width:.62em;height:.62em;flex:0 0 auto;
 background:currentColor;-webkit-mask:var(--ic-next) center/contain no-repeat;
 mask:var(--ic-next) center/contain no-repeat;transform:scaleX(-1);
 opacity:0;transition:opacity .18s, translate .18s}
.mh-alt:hover .mh-alt__k{color:#4a6375}
.mh-alt:hover .mh-alt__k::after{opacity:1;translate:-.24em 0}
.mh-post--en .mh-alt__k::after{transform:none}
.mh-post--en .mh-alt:hover .mh-alt__k::after{translate:.24em 0}
.mh-alt__t{display:block;margin:0;font-weight:700;
 font-size:clamp(20px, 0.93rem + 0.89vw, 27px);line-height:1.85;color:var(--ink-1);
 transition:color .16s}
.mh-alt:hover .mh-alt__t{color:#4a6375}
.mh-alt__t--ar{direction:rtl;text-align:left;font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),system-ui,sans-serif}
.mh-alt__t--en{direction:ltr;text-align:right;font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),"Helvetica Neue",Arial,sans-serif;
 font-size:clamp(18px, 0.87rem + 0.8vw, 24px);line-height:1.25;letter-spacing:-.01em}
@media (max-width:1040px){
 .mh-post__cross{flex:0 0 auto;margin:14px 0 0}
}
/* end mh-en */


/* mh-deck */
@media (max-width:700px){
 /* a thrown card must not widen the document */
 .mh-qiraat{overflow-x:clip}
 .mh-qr__grid.mh-qr__pile{position:relative;display:block;gap:0;
  width:min(84%, 320px);margin-inline:auto;aspect-ratio:7/12;
  touch-action:pan-y;-webkit-user-select:none;user-select:none}
 .mh-qr__pile > .mh-qr__card{position:absolute;inset:0;touch-action:pan-y;
  transform-origin:50% 60%;backface-visibility:hidden;
  transition:transform .42s cubic-bezier(.2,.7,.2,1), opacity .28s;
  box-shadow:0 1px 3px rgba(43,40,37,.18), 0 10px 22px rgba(43,40,37,.22),
   0 28px 54px rgba(43,40,37,.17)}
 .mh-qr__pile.is-drag > .mh-qr__card{transition:none}
 .mh-qr__pile > .mh-qr__card:hover,
 .mh-qr__pile > .mh-qr__card.press{box-shadow:0 1px 3px rgba(43,40,37,.18),
  0 10px 22px rgba(43,40,37,.22), 0 28px 54px rgba(43,40,37,.17)}
 .mh-qr__pile .mh-qr__card .mh-qr__who{height:15%}
 .mh-qr__count{display:block;text-align:center;direction:rtl;
  font-family:var(--mh-display);font-weight:700;font-size:12px;line-height:1.55;
  color:var(--ink-3);margin:clamp(24px,3.6vw,32px) 0 0}
}
@media (min-width:701px){.mh-qr__count{display:none}}
/* end mh-deck */
/* mh-exp */
.mh-post__body details.mh-exp{margin:var(--sp-m) 0;padding:0}
.mh-exp > summary{display:flex;align-items:baseline;gap:.5em;width:fit-content;
 cursor:pointer;list-style:none;user-select:none;
 font-family:var(--mh-display);font-weight:700;
 font-size:clamp(14px, 0.8rem + 0.18vw, 15px);line-height:1.6;
 color:#4a6375;padding-block:4px 5px;gap:.42em;
 border-block-end:1px solid #ddd5c4;
 transition:color .16s, border-color .16s}
.mh-exp > summary::-webkit-details-marker{display:none}
.mh-exp > summary::before{content:"";flex:0 0 auto;align-self:center;
 width:1.55em;height:1.55em;background:currentColor;
 -webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%2710.6%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.5%27%2F%3E%3Cpath%20d%3D%27M7.4%209.8h9.2L12%2015.6z%27%20fill%3D%27black%27%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;
 mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%2710.6%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.5%27%2F%3E%3Cpath%20d%3D%27M7.4%209.8h9.2L12%2015.6z%27%20fill%3D%27black%27%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;
 transition:transform .24s cubic-bezier(.2,.7,.2,1)}
.mh-exp[open] > summary::before{transform:rotate(180deg)}
.mh-exp > summary:hover,.mh-exp > summary:focus-visible{
 color:var(--ink-1);border-block-end-color:var(--ink-1)}
.mh-exp > summary:focus{outline:none}
.mh-exp > summary:focus-visible{outline:2px solid #8a7391;outline-offset:5px}
.mh-exp__b{margin-block-start:var(--sp-s);
 padding:clamp(18px,2.4vw,26px) clamp(18px,2.4vw,26px);
 background-color:#ece7dc;background-image:var(--mh-grain);
 background-size:var(--mh-grain-size);background-repeat:repeat;
 border-inline-start:2px solid #d9d2c4}
.mh-post__body .mh-exp__b p{font-family:var(--mh-display);font-weight:200;
 font-size:clamp(16px, 0.89rem + 0.22vw, 18px);
 line-height:1.9;color:#3a3734;margin:0 0 .9em}
.mh-post__body .mh-exp__b p:last-child{margin-block-end:0}
/* end mh-exp */
/* mh-qrp */
.mh-post--qr{padding-block-start:0}
.mh-qrp{position:relative;text-align:center;
 margin-block-end:clamp(34px,4.4vw,58px)}
.mh-qrp__band{position:relative;overflow:hidden;
 background:var(--g,#3f4d59);color:var(--t,#cfe0c4);
 padding:clamp(36px,5vw,72px) 6vw clamp(66px,8vw,108px)}
.mh-qrp__band::before,.mh-qrp__band::after{content:"";position:absolute;inset:0;
 pointer-events:none}
.mh-qrp__band::before{background-image:
 radial-gradient(125% 90% at 50% -12%,rgba(255,255,255,.11),rgba(255,255,255,0) 60%),
 radial-gradient(140% 100% at 50% 112%,rgba(0,0,0,.22),rgba(0,0,0,0) 66%)}
.mh-qrp__band::after{background-image:var(--mh-grain-lite);
 background-size:var(--mh-grain-size);background-repeat:repeat}
.mh-qrp__who{position:relative;z-index:2;margin:0;
 font-family:var(--mh-names);font-weight:400;color:var(--t,#cfe0c4);
 font-size:clamp(27px, 0.98rem + 3.03vw, 61px);line-height:1.5;
 text-wrap:balance;text-shadow:0 3px 0 rgba(0,0,0,.10)}
.mh-qrp .mh-qr__frame{display:block;position:relative;z-index:3;
 height:clamp(148px, 19vw, 208px);width:auto;max-height:none;
 margin:calc(-1 * clamp(52px, 6.4vw, 86px)) auto 0;
 filter:drop-shadow(0 10px 22px rgba(0,0,0,.30))}
.mh-qrp .mh-qr__frame > *{width:100%;height:100%;margin:0;display:block;overflow:hidden}
.mh-qrp .mh-qr__frame img{width:100%;height:100%;object-fit:cover;
 object-position:center 32%;margin:0;max-width:none}
@media (max-width:700px){
 .mh-qrp__band{padding:clamp(30px,6vw,44px) 5vw clamp(56px,10vw,74px)}
}
/* end mh-qrp */
/* mh-tex2  ——  the double blend, as writingexamples.com does it: the same
   noise carried twice, once normally and once through color-burn. Burn deepens
   the tooth where the ground is dark and leaves it alone where the ground is
   light, which is how paper behaves under light; one layer cannot do both.
   Measured over the twelve مِمّا قرأت grounds: visible texture rises from
   sd 0.42–1.52 to sd 1.55–1.94. On the cream paper it measured 2.01 -> 2.31,
   i.e. nothing you would see, so the paper deliberately keeps one layer. */
.mh-qr__card,.mh-ov__ground,.mh-qrp__band{
 background-image:var(--mh-tex-dk);
 background-size:var(--mh-grain-size);background-repeat:repeat;
 background-blend-mode:var(--mh-tex-bm)}
.mh-qr__card::after,.mh-ov__ground::after,.mh-qrp__band::after{background-image:none}
.mh-foot{background-image:var(--mh-tex-dk);background-blend-mode:var(--mh-tex-bm)}
/* the panels that were flat paint until now — measured bare at sd 0.00.
   Dark grounds take the white tile + burn; light grounds take the ink tile
   + burn, which is what the cream paper already carries. */
.mh-about__band,.mh-vol__hero,.mh-vol__facts,.mh-qr__plateface{
 background-image:var(--mh-tex-dk);
 background-size:var(--mh-grain-size);background-repeat:repeat;
 background-blend-mode:var(--mh-tex-bm)}
.mh-land__band,.mh-note{
 background-image:var(--mh-tex-lt);
 background-size:var(--mh-grain-size);background-repeat:repeat;
 background-blend-mode:var(--mh-tex-bm)}
/* end mh-tex2 */
/* mh-read2  ——  the book's reading fix, 13 Sep 2026.
   Three faults, all measured on ثانياً. عشر نصائح عامة before changing anything:
   (a) the paragraph gap was 23px against a 41px line — SMALLER than one line —
       so 79 paragraphs averaging 63 characters never grouped into blocks and the
       column read as one continuous grey field;
   (b) the chapter-end nav gave its only button shape to «الفهرس», the least used
       of the three, while «السابق» and «التالي» had padding:0, no border, no
       background and no hover — a tap target the size of the glyphs themselves;
   (c) .mh-bar__label rendered at 21px instead of its declared 12px, because
       mh-navreset's `.mh-bar p{font-size:inherit !important}` (0,2,0) outranks
       `.mh-bar__label` (0,1,0). */

.mh-book > p{margin-block:0 1.55em}
.mh-book > ul,.mh-book > ol{margin-block:1.5em}
.mh-book > h2{margin-block-end:clamp(20px,2.2vw,28px)}
.mh-book > h2 + p:not(.mh-ask):not(.mh-credit):not(.mh-example):not(.mh-example__lead):not(.mh-quote),
.mh-book > p.mh-ch__meta + p{font-size:clamp(18px, 0.96rem + 0.34vw, 20px);line-height:1.85;
 color:#1f1c1a;margin-block-end:1.5em}

.mh-bar{background:rgba(248,244,234,.94)}
.mh-bar p.mh-bar__label{font-size:11px !important;line-height:1.4 !important;
 margin:0 0 .9em !important}
.mh-bar__prog{position:absolute;inset-block-end:-1px;inset-inline-start:0;
 height:2px;width:0;background:#a793ac;pointer-events:none}

.mh-chnav{display:grid;grid-template-columns:1fr auto;align-items:center;
 column-gap:clamp(16px,2vw,28px);row-gap:clamp(20px,2.4vw,28px);
 margin-block:clamp(64px,7vw,104px) 0;padding-block-start:clamp(26px,3vw,38px);
 border-block-start:1px solid var(--rule)}
.mh-chnav a.mh-chnav__next{grid-column:1 / -1;order:-1;
 display:block;position:relative;text-align:start;
 padding:clamp(20px,2.6vw,28px) clamp(20px,2.6vw,30px);
 padding-inline-end:clamp(58px,6.5vw,78px);
 border:1px solid #a793ac;background:rgba(167,147,172,.09);
 font-family:var(--wp--preset--font-family--lalezar),sans-serif;font-weight:400;
 font-size:clamp(20px, 0.89rem + 1.16vw, 27px);line-height:1.55;color:#2b2825;
 transition:background .15s ease}
.mh-chnav a.mh-chnav__next:hover,.mh-chnav a.mh-chnav__next:focus-visible{background:rgba(167,147,172,.20);color:#2b2825}
.mh-chnav a.mh-chnav__next:focus-visible{outline:2px solid #8a7391;outline-offset:4px}
.mh-chnav a.mh-chnav__next > span{display:block;
 font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;
 font-weight:400;font-size:12px;line-height:1.55;color:var(--soft);margin-block-end:.45em}
.mh-chnav a.mh-chnav__next::after{content:"";position:absolute;
 inset-inline-end:clamp(20px,2.6vw,30px);inset-block-start:50%;
 width:clamp(22px,2.4vw,28px);aspect-ratio:1;background:#2b2825;
 -webkit-mask:var(--ic-next) center/contain no-repeat;
 mask:var(--ic-next) center/contain no-repeat;
 transform:translateY(-50%) scaleX(-1);transition:background .15s ease}
.mh-chnav a.mh-chnav__next:hover::after{background:#4a6375}
.mh-chnav a.mh-chnav__prev,.mh-chnav a.mh-chnav__toc{display:inline-flex;align-items:center;
 flex-wrap:wrap;gap:.5em;min-height:44px;
 border:0 !important;padding:0 !important;background:none !important;
 font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;
 font-weight:400 !important;font-size:clamp(13px,0.76rem + 0.18vw,15px);
 line-height:1.55;color:#4a6375;transition:color .15s ease}
.mh-chnav a.mh-chnav__prev::before,.mh-chnav a.mh-chnav__toc::before{content:"";flex:0 0 auto;
 width:17px;height:17px;background:currentColor}
.mh-chnav a.mh-chnav__prev::before{-webkit-mask:var(--ic-prev) center/contain no-repeat;
 mask:var(--ic-prev) center/contain no-repeat}
.mh-chnav a.mh-chnav__toc::before{-webkit-mask:var(--ic-book) center/contain no-repeat;
 mask:var(--ic-book) center/contain no-repeat}
.mh-chnav a.mh-chnav__prev:hover,.mh-chnav a.mh-chnav__toc:hover{color:#2b2825}
.mh-chnav a.mh-chnav__prev > span{display:inline !important;flex:0 0 auto;
 font-size:12px;font-weight:700;color:#a793ac;margin:0 !important}
.mh-chnav a.mh-chnav__toc{grid-column:2;justify-self:end;white-space:nowrap}
@media (max-width:600px){
 .mh-chnav{grid-template-columns:1fr;row-gap:clamp(16px,4vw,22px)}
 .mh-chnav a.mh-chnav__toc{grid-column:1;justify-self:start}
}

/* how long this chapter is — the same signal the article pages already give */
.mh-book h1.mh-ch__title:has(+ p.mh-ch__meta){margin-block-end:clamp(12px,1.4vw,18px)}
.mh-book > p.mh-ch__meta{font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;
 font-size:12px !important;line-height:1.5 !important;color:var(--soft);
 margin:0 auto clamp(32px,3.6vw,48px) !important}

/* a link inside the reading column — the blue register, since a cross-reference
   is the author speaking, not a quoted voice. Violet is reserved for quotation. */
.mh-book > p a,.mh-book > ul a,.mh-book > ol a{color:#4a6375;text-decoration:none;
 border-block-end:1px solid #bcc9d2;
 transition:color .15s ease,border-color .15s ease}
.mh-book > p a:hover,.mh-book > ul a:hover,.mh-book > ol a:hover{color:#2b2825;border-block-end-color:#2b2825}

/* mh-credit —— where a specimen came from. The book was setting each source,
   prize and publication date as its own full-size body paragraph: three
   paragraphs and ~150px of page for one credit line, and a newspaper's name
   reading like a sentence of the author's own. One small line now, carried on
   the specimen's own ground so it reads as its caption. */
.mh-book > p.mh-credit{background:rgba(255,255,255,.72);
 border-inline-start:3px solid #d9d3ca;border-block-end:1px solid #e8e3da;
 font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;
 font-size:12px !important;line-height:1.75 !important;color:var(--soft);
 margin:0 0 clamp(30px,3.4vw,44px) !important;
 padding:.15em clamp(16px,2vw,24px) 1.05em clamp(14px,1.6vw,20px)}
.mh-book > p.mh-example:has(+ p.mh-credit){padding-block-end:.4em;border-block-end:0}
.mh-book > p.mh-quote:has(+ p.mh-credit){margin-block-end:0}

/* mh-ask —— «أسئلة متعلقة». Fifteen of these carry the whole method of ثالثاً,
   and every one was running as ordinary body text, invisible as a device. The
   blue register, because this is the author prompting the reader, not a quoted
   voice; tighter than a full ⓘ note because it repeats under every heading. */
.mh-book > p.mh-ask{font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;
 font-size:clamp(14px,0.8rem + 0.18vw,16px) !important;line-height:1.8 !important;
 color:#33454f;background:#eaf0f3;border-inline-start:3px solid #4a6375;
 margin:0 0 clamp(26px,3vw,38px) !important;
 padding:.7em clamp(15px,1.8vw,22px)}

/* a portrait carries a name, dates and a line of who this was. In تحرير المضمون
   that data was an h2 heading plus three body paragraphs, so two writers were taking
   numbered sections of the chapter and appearing in its navigation. */
.mh-book figure.mh-portrait figcaption span{display:block}
.mh-book figure.mh-portrait figcaption .mh-figure__name{font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;
 font-weight:700;font-size:14px;line-height:1.55;color:var(--ink)}
.mh-book figure.mh-portrait figcaption .mh-figure__dates{font-family:"IBM Plex Sans",system-ui,sans-serif;
 font-size:11px;letter-spacing:.04em;color:#a793ac;margin-block-start:.2em}
.mh-book figure.mh-portrait figcaption .mh-figure__desc{margin-block-start:.4em;
 font-size:12px;line-height:1.6;color:var(--soft)}

/* section headings in the site's own display face, not Lalezar. Azer Bold is
   narrower and lighter than Lalezar at the same size, so the size and the
   line-height are nudged to hold the same weight on the page. */
.mh-book > h2{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(23px, 0.98rem + 1.42vw, 34px);line-height:1.85;letter-spacing:0}

/* the boxes — specimen, ⓘ note, «أسئلة متعلقة», credit — set in the light weight,
   the same face and weight the Expander already uses. Thin needs a little more
   size and a little more ink than the 400 it replaces, or it goes faint on a
   tinted ground. */
.mh-book > p.mh-example,
.mh-book > p.mh-ask,
.mh-book .mh-note__p,
.mh-book .mh-note li,
.mh-book > p.mh-credit{font-family:var(--mh-display) !important;font-weight:200 !important}
.mh-book > p.mh-example{font-size:clamp(16px, 0.87rem + 0.25vw, 18px) !important;
 line-height:1.95;color:#3a3734}
.mh-book > p.mh-ask{font-size:clamp(15px,0.85rem + 0.18vw,16px) !important;
 line-height:1.9 !important;color:#2f414b}
.mh-book .mh-note__p,.mh-book .mh-note li{font-size:clamp(16px,0.89rem + 0.22vw,17px) !important;
 line-height:1.95 !important;color:#2d3f49}
.mh-book > p.mh-credit{font-size:13px !important;line-height:1.8 !important;color:#5b5651}

/* the kicker («النصيحة الأولى») belongs to the heading BELOW it. It was carrying
   only 3px of bottom margin while the h2 carried 64px of top margin, a 1px rule
   and 34px of padding — so the label sat 99px and a rule away from its own
   heading, and glued to the previous section's last paragraph. The section's
   whole opening apparatus moves to the kicker; the heading follows it tight. */
.mh-book > p.mh-kicker{margin-block:clamp(64px,7vw,104px) .35em !important;
 padding-block-start:clamp(34px,4vw,56px);
 border-block-start:1px solid var(--rule)}
.mh-book > p.mh-kicker + h2{margin-block-start:0;padding-block-start:0;border-block-start:0}
/* where a kicker already names the section («النصيحة الأولى»), the 01 counter
   beneath it says the same thing in digits. The counter stays in the chapters
   that have no kicker, where it does real work. */
.mh-book > p.mh-kicker + h2::before{display:none}
.mh-book > p.mh-kicker + h2{padding-block-start:.1em}
/* end mh-read2 */
/* mh-sheet  ——  a long chapter is read ON a page, not on the desk.
   The textured paper stays as the ground; the reading column now sits on a
   flat, slightly lighter sheet with no tooth at all under the type. Drawn as
   a pseudo-element so nothing in the layout moves and the sticky bar, which
   lives inside .mh-book, keeps its own full width. Chapters only — page 88 is
   a cover and an index, not a long read. */
.mh-book:not(.mh-book--front){--pad:clamp(20px,3.4vw,56px);position:relative;z-index:0}
.mh-book:not(.mh-book--front)::before{content:"";position:absolute;z-index:-1;
 inset-block:0;inset-inline:calc(-1 * var(--pad));
 background:#fdfbf5;pointer-events:none}
/* end mh-sheet */
/* mh-arc —— «الخط الدرامي لرحلة بطل القصة». Rashad's own interactive diagram,
   inlined rather than iframed so the book carries no dependency on another
   host. Palette brought into the book's own: the #ffe680 fill and #9f9
   baseline read as a foreign object on cream paper. Below 720px the figure
   scrolls sideways inside its own box — at 344px the rotated labels would
   render at about 6px and be unreadable. */
.mh-book > figure.mh-arc{margin:clamp(30px,3.6vw,48px) auto clamp(34px,4vw,56px);padding:0}
.mh-arc__scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;direction:ltr;
 border:1px solid #e4ded3;background:#fdfbf5}
.mh-arc svg{display:block;width:100%;height:auto;min-width:720px}
.mh-arc__edge{font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;font-size:20px;font-weight:700;fill:#2b2825}
.mh-arc__lab{font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;font-size:17px;font-weight:700;fill:#4a4643}
.mh-arc__dot{fill:#2b2825;cursor:grab}
.mh-arc__dot:active{cursor:grabbing}
.mh-arc__bar{display:flex;gap:10px;flex-wrap:wrap;margin-block-start:14px}
.mh-arc__btn{font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;font-size:13px;font-weight:400;color:#4a6375;
 background:none;border:1px solid #a793ac;border-radius:0;padding:10px 17px;
 min-height:44px;cursor:pointer;transition:background .15s ease,color .15s ease}
.mh-arc__btn:hover{background:rgba(167,147,172,.18);color:#2b2825}
.mh-arc__btn:focus-visible{outline:2px solid #8a7391;outline-offset:3px}
.mh-arc__panel[hidden]{display:none}
.mh-arc__panel{margin-block-start:12px;padding:14px clamp(14px,1.8vw,20px);
 background:#f3efe6;border:1px solid #e4ded3;
 display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:2px 18px}
.mh-arc__panel label{display:flex;align-items:center;gap:.5em;cursor:pointer;
 font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;font-size:13px;line-height:1.55;color:#4a4643;min-height:34px}
.mh-arc__panel input{accent-color:#a793ac;inline-size:16px;block-size:16px;flex:0 0 auto}
.mh-book > figure.mh-arc figcaption{font-family:var(--wp--preset--font-family--ibm-plex-sans-arabic),sans-serif;font-size:12px;line-height:1.7;
 color:var(--soft);margin-block-start:12px;text-align:start}
/* end mh-arc */
/* mh-train-h —— «تدريبٌ فرديّ» is the lead-in, «على سرد القصة» is the heading.
   Both were set at the same size and separated only by weight, so the first
   line read as a truncated half of the title rather than as its lead-in. */
.mh-tr__h .t1{font-size:0.5em;font-weight:400;line-height:1.85;margin-block-end:.06em}
/* end mh-train-h */

/* mh-postsheet  ——  the same principle as mh-sheet, applied to the ordinary
   post. The title and the article column sit on a flat, slightly lighter
   sheet with no tooth under the type; the grained paper stays as the ground
   and keeps the side rail, the related list and the prev/next on the desk.
   Two pseudo-elements rather than one wrapper, so the template is untouched:
   each extends --padv past its own box, and since that always exceeds the
   32px gap between title and body, the two panels meet with no seam.
   Side padding is tighter than the book because the sticky meta rail sits
   only ~44px from the column at 1400px. */
.mh-post__title,.mh-post__body{--pad:clamp(18px,2.4vw,32px);--padv:clamp(24px,3vw,44px);
 position:relative;z-index:0}
.mh-post__title::before,.mh-post__body::before{content:"";position:absolute;z-index:-1;
 inset-block:calc(-1 * var(--padv));inset-inline:calc(-1 * var(--pad));
 background:#fdfbf5;pointer-events:none}
/* end mh-postsheet */

/* mh-idx  ——  «مِمّا كتبت» as an editorial index rather than a card grid.
   The block directly above (mh-feat) already does image + headline + standfirst
   at full width; repeating that shape three times made the page read as a
   template. Here the same posts are a ruled list: title at the start of the row,
   standfirst opposite it, a hairline between. No images — the pictures were of
   unrelated provenance (documentary collage, AI illustration, TV screengrab) and
   were being centre-cropped into one identical letterbox, which is what made the
   row look generic. The old mh-cards rules are left in place for rollback.
   Every selector is scoped under .mh-idx: theme.json emits
   «:root :where(.wp-block-post-title)» at the same (0,1,0) specificity but later
   in source order, so an unscoped .mh-idx__title loses the tie and renders 44px. */
.mh-idx{--rule:#ddd8d0;padding-block:clamp(10px,1vw,24px) clamp(56px,7vw,120px)}
.mh-idx .mh-idx__in{max-width:1400px;margin:0 auto;padding-inline:clamp(20px,3vw,40px)}
.mh-idx .mh-idx__head{display:flex;align-items:baseline;justify-content:space-between;
 gap:1.5em;padding-block-end:clamp(12px,1.2vw,18px);
 border-block-end:1px solid var(--rule)}
.mh-idx .mh-idx__label{font-family:var(--mh-display);font-weight:500;
 font-size:clamp(12px,0.64rem + 0.11vw,13px);letter-spacing:.14em;
 color:#6b655c;line-height:1.55;margin:0}
.mh-idx .mh-idx__all{font-family:var(--mh-display);font-weight:400;
 font-size:clamp(12px,0.64rem + 0.11vw,13px);letter-spacing:.02em;
 color:#5b5651;text-decoration:none;white-space:nowrap;
 border-block-end:1px solid #cfc7bb;padding-block-end:2px;
 transition:color .15s ease,border-color .15s ease}
.mh-idx .mh-idx__all:hover{color:#2b2825;border-block-end-color:#a793ac}
.mh-idx .wp-block-post-template{display:block;margin:0;padding:0;list-style:none}
.mh-idx .wp-block-post-template > li{margin:0 !important;padding:0;list-style:none}
.mh-idx .mh-idx__row{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.15fr);
 column-gap:clamp(28px,4.2vw,80px);align-items:start;
 padding-block:clamp(26px,3vw,42px);border-block-end:1px solid var(--rule)}
.mh-idx .wp-block-post-template > li:last-child .mh-idx__row{border-block-end:0;
 padding-block-end:0}
.mh-idx .mh-idx__title{margin:0 !important;font-family:var(--mh-display);font-weight:700;
 font-size:clamp(20px,0.89rem + 0.93vw,29px) !important;line-height:1.85;letter-spacing:0}
.mh-idx .mh-idx__title a{color:#272523;text-decoration:none;
 border-block-end:1px solid transparent;transition:border-color .15s ease}
.mh-idx .mh-idx__row:hover .mh-idx__title a{border-block-end-color:#a793ac}
.mh-idx .mh-idx__dek{margin:0 !important;font-family:var(--mh-display);font-weight:400;
 font-size:clamp(15px,0.8rem + 0.22vw,16px) !important;line-height:1.85 !important;
 color:#44403c}
@media (max-width:860px){
 .mh-idx .mh-idx__row{grid-template-columns:1fr;row-gap:.55em;
  padding-block:clamp(22px,5vw,30px)}
 .mh-idx .mh-idx__title{font-size:clamp(20px,4.63vw,24px) !important}
}
/* end mh-idx */

/* mh-cards2  ——  «مِمّا كتبت» reworked in place.
   The plate was 16/9 (1.78) while all four featured images in this category are
   landscape between 1.29 and 1.53, so every one was cropped top-and-bottom — the
   1.29 image lost 27% of its height. 4/3 (1.33) matches the material: the worst
   case now loses 13% of its WIDTH instead. 3/2 under 860px so a plate does not
   eat a phone screen.
   The label is deliberately NOT restyled. The homepage runs a two-tier system
   already: section headings at Azer Bold 30px/#2b2825 (.mh-feat__h «المقالات»,
   .mh-tl__h «مِمّا تعلّمت», «لماذا مِمّا قرأت؟») and kickers at Azer Bold 15px/#6b6560
   (.mh-kicker, .mh-tl__label, .mh-tr__label). «مِمّا كتبت» is a tier-one heading and
   the exact sibling of «مِمّا تعلّمت», so it keeps its 30px Bold. An earlier pass
   shrank it to 13px letter-spaced, which broke that pairing and invented a third
   label style the site does not have.
   «كل المقالات» is the one addition: nine posts live in the category, three are
   shown, and the block had no way through. It is set to the site small-text size
   so it sits under the heading rather than beside it as an equal. */
.mh-cards .mh-cards__head{display:flex;align-items:baseline;
 justify-content:space-between;gap:1.5em;
 margin-block-end:clamp(26px,3vw,42px)}
.mh-cards .mh-cards__head .mh-cards__label{margin:0}
.mh-cards .mh-cards__all{font-family:var(--mh-display);font-weight:500;
 font-size:13px;color:#5b5651;text-decoration:none;white-space:nowrap;
 border-block-end:1px solid #cfc7bb;padding-block-end:2px;
 transition:color .15s ease,border-color .15s ease}
.mh-cards .mh-cards__all:hover{color:#2b2825;border-block-end-color:#a793ac}
.mh-cards .mh-card__shot{aspect-ratio:4/3}
.mh-cards .mh-card__shot img{object-position:50% 45%}
.mh-cards .mh-card h3.mh-card__title{margin-block:clamp(16px,1.9vw,24px) 0}
@media (max-width:860px){
 .mh-cards .mh-card__shot{aspect-ratio:3/2}
}
/* end mh-cards2 */



/* mh-wall-2up  ——  the مِمّا قرأت wall (.mh-wall__grid) stepped 4 → 3 → 2 → 1
   columns, dropping to a single card per row at 640px. Thirty readings then ran
   to a 17,750px scroll on a 375px screen. Two per row on the phone instead.
   The cards size their own type in cqw (container query units), so halving the
   card width halves the type with it; the kicker and title are stepped back up
   so they stay readable at ~160px wide. */
@media (max-width:640px){
 .mh-wall__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px}
 .mh-wall__grid .mh-qr__card{padding:8% 7% 9%}
 .mh-wall__grid .mh-qr__card .mh-qr__kicker{font-size:5.6cqw}
 .mh-wall__grid .mh-qr__card .mh-qr__t,
 .mh-wall__grid .mh-qr__card .mh-qr__ttl{font-size:10.6cqw;line-height:1.26;
  -webkit-line-clamp:3}
 .mh-wall__grid .mh-qr__card .mh-qr__frame{max-height:44%}
 .mh-wall__grid .mh-qr__card .mh-qr__who{font-size:5.4cqw}
}
/* end mh-wall-2up */

/* mh-navcur  ——  the header nav carried no current-page state. WordPress already
   puts .current-menu-item on the item whose URL matches, so this only had to be
   drawn: the label goes to full ink and picks up a 2px accent rule beneath it.
   It marks the three section archives; a single article inside a section is not
   marked, because WordPress does not treat a post as "current" for its category
   link. */
header .wp-block-navigation .wp-block-navigation-item.current-menu-item > a,
header .wp-block-navigation .wp-block-navigation-item.current-menu-ancestor > a,
header .wp-block-navigation .wp-block-navigation-item.current_page_item > a{
 color:#2b2825;font-weight:700;
 border-block-end:2px solid #a793ac;padding-block-end:3px}
/* end mh-navcur */

/* mh-landnote  ——  the cross-link at the foot of a section page read as dead:
   the sentence sat at one end of a 1400px row and a pale outlined rectangle at
   the other, so the two never looked related and the button looked disabled
   (1px #a793ac on #f8f4ea is barely a line). Now the sentence is held to a
   readable measure and the action sits directly beside it, in full ink, with an
   arrow, and fills solid on hover. */
.mh-land__note{align-items:center;gap:clamp(14px,1.8vw,24px)}
.mh-land__note p{max-width:52ch}
.mh-land__note .mh-btn-outline{margin-inline-start:0;
 display:inline-flex;align-items:center;gap:.55em;white-space:nowrap;
 border-color:#2b2825;color:#2b2825;font-size:15px;padding:11px clamp(20px,2vw,26px)}
.mh-land__note .mh-btn-outline::after{content:"";width:.7em;aspect-ratio:1;
 background:currentColor;mask:var(--ic-next) center/contain no-repeat;
 transform:scaleX(-1)}
.mh-land__note .mh-btn-outline:hover,
.mh-land__note .mh-btn-outline:focus-visible{background:#2b2825;color:#f8f4ea}
@media (max-width:620px){
 .mh-land__note{gap:clamp(12px,3vw,18px)}
 .mh-land__note p{max-width:none}
}
/* end mh-landnote */

/* mh-say2  ——  تواصل. Measured at 1400px: the h1 was 56px and the email address
   44px, so a contact detail carried almost the weight of the invitation above it,
   and each row stood 185px tall to deliver one line — 415px of rows, 1,486px of
   page, for two facts. The values now sit at ~29px, clearly below the sentence
   and clearly above the labels, and the rows tighten. The list is also held to a
   reading measure so it reads as a short index under a wide headline rather than
   two lines adrift in a 1040px column. The full-width click target is kept: it
   is a big, easy tap on a phone. */
.mh-say .mh-say__val{font-size:clamp(18px,0.89rem + 0.76vw,26px);line-height:1.85}
.mh-say .mh-say__lbl{margin-block-end:clamp(5px,.6vw,8px)}
.mh-say .mh-say__row{padding-block:clamp(18px,2.1vw,28px)}
.mh-say .mh-say__rows,
.mh-say .mh-say__back{max-width:680px}
@media (max-width:620px){
 .mh-say .mh-say__rows,
 .mh-say .mh-say__back{max-width:none}
}
/* end mh-say2 */

/* mh-say3  ——  تواصل was correct but inert: a sentence and two lines of type on an
   empty field. Two additions, both from vocabulary the site already uses.
   (1) A portrait, in the offset-panel treatment used by .mh-land__shot and the
       homepage feature — the accent block sits behind and below the picture. On a
       contact page the face is editorial, not decoration: it says who answers.
   (2) A line icon in front of each label — envelope, handset, bubble — drawn as
       CSS masks so they take currentColor and turn accent on hover with the rest
       of the row. No icon font, no extra request.
   Desktop is two columns; under 820px the portrait becomes a wide band above the
   text, so the face is the first thing on a phone. */
.mh-say .mh-say__grid{display:grid;
 grid-template-columns:minmax(0,1fr) minmax(240px,.62fr);
 gap:clamp(30px,4.4vw,80px);align-items:start}
.mh-say .mh-say__figure{--off:clamp(10px,1.3vw,20px);margin:0}
/* The portrait is a cut-out: 42.5% of its pixels are fully transparent, so the
 accent block behind it was showing straight THROUGH the face rather than sitting
 behind the picture. The plate now carries its own light ground, the cut-out reads
 as a studio portrait on card, and the accent peeks out below and to the side as
 it does on .mh-land__shot. */
.mh-say .mh-say__plate{position:relative;display:block;z-index:0}
.mh-say .mh-say__plate::before{content:"";position:absolute;z-index:0;
 inset-block-start:var(--off);inset-block-end:calc(-1 * var(--off));
 inset-inline-start:var(--off);inset-inline-end:calc(-1 * var(--off));
 background:var(--acc)}
.mh-say .mh-say__plate img{position:relative;z-index:1;display:block;background:#e6e3de;
 width:100%;height:auto;max-width:none}
.mh-say .mh-say__figcap{font-size:12px;line-height:1.6;
 color:var(--ink-3);margin:calc(var(--off) + 12px) 0 0}
.mh-say .mh-say__lbl{display:flex;align-items:center;gap:.5em}
.mh-say .mh-say__lbl::before{content:"";width:1.15em;aspect-ratio:1;flex:0 0 auto;
 background:currentColor;mask-position:center;mask-size:contain;mask-repeat:no-repeat}
.mh-say .mh-say__row--mail .mh-say__lbl::before{mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%272.5%27%20y%3D%275%27%20width%3D%2719%27%20height%3D%2714%27%20rx%3D%272.5%27%2F%3E%3Cpath%20d%3D%27m3%207.5%209%205.5%209-5.5%27%2F%3E%3C%2Fsvg%3E")}
.mh-say .mh-say__row--tel .mh-say__lbl::before{mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M5.5%203.5h3.2l1.8%204.3-2.2%201.4a11.5%2011.5%200%200%200%205.5%205.5l1.4-2.2%204.3%201.8v3.2a1.8%201.8%200%200%201-1.9%201.8A16.4%2016.4%200%200%201%203.7%205.4%201.8%201.8%200%200%201%205.5%203.5z%27%2F%3E%3C%2Fsvg%3E")}
.mh-say .mh-say__alt{display:flex;align-items:center;gap:.5em}
.mh-say .mh-say__alt::before{content:"";width:1.05em;aspect-ratio:1;flex:0 0 auto;
 background:currentColor;mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M20.5%2011.7a8.5%208.5%200%200%201-12.4%207.5L3.5%2020.5l1.4-4.4a8.5%208.5%200%201%201%2015.6-4.4z%27%2F%3E%3C%2Fsvg%3E");
 mask-position:center;mask-size:contain;mask-repeat:no-repeat}
@media (max-width:820px){
 .mh-say .mh-say__grid{grid-template-columns:1fr;gap:clamp(26px,5vw,38px)}
 .mh-say .mh-say__figure{order:-1;--off:clamp(8px,2vw,14px)}
 .mh-say .mh-say__plate{max-width:min(100%,420px);margin-inline:0 auto}
}
/* end mh-say3 */

/* mh-ann  ——  the translator/editor annotations in «حياة في اثنتي عشرة دقيقة».
   They were plain paragraphs opening with ⓘ, so 24 commentaries sat in the same
   voice and weight as the story itself and the reader had to wade through them.
   Each is now a details element: the question or label is the summary, the commentary
   folds away beneath it. The ground is the same blue-grey the book already uses
   for its editorial asides (.mh-ask), so the annotation reads as a different
   voice from the story without introducing a new colour to the site. */
.mh-post__body details.mh-ann{background:#eaf0f3;
 border-inline-start:3px solid #4a6375;
 margin-block:clamp(26px,3vw,38px)}
.mh-post__body details.mh-ann > summary{list-style:none;cursor:pointer;
 display:flex;align-items:flex-start;gap:.62em;
 padding:clamp(13px,1.5vw,17px) clamp(15px,1.8vw,22px);
 font-family:var(--mh-display);font-weight:700;
 font-size:clamp(14px,0.8rem + 0.18vw,16px);line-height:1.55;color:#2f414b}
.mh-post__body details.mh-ann > summary::-webkit-details-marker{display:none}
.mh-post__body details.mh-ann > summary::before{content:"";width:1.12em;aspect-ratio:1;
 flex:0 0 auto;margin-block-start:.16em;background:currentColor;
 mask:var(--ic-info) center/contain no-repeat}
.mh-post__body details.mh-ann > summary::after{content:"";width:.78em;aspect-ratio:1;
 flex:0 0 auto;margin-inline-start:auto;margin-block-start:.3em;background:currentColor;
 mask:var(--ic-up) center/contain no-repeat;opacity:.65;
 transform:rotate(180deg);transition:transform .18s ease,opacity .18s ease}
.mh-post__body details.mh-ann[open] > summary::after{transform:rotate(0deg);opacity:1}
.mh-post__body details.mh-ann > summary:hover{color:#1f2f37}
.mh-post__body details.mh-ann .mh-ann__b{
 padding:0 clamp(15px,1.8vw,22px) clamp(15px,1.8vw,20px) clamp(15px,1.8vw,22px)}
.mh-post__body details.mh-ann .mh-ann__b p{margin:0;
 font-size:clamp(14px,0.78rem + 0.18vw,16px) !important;line-height:1.9 !important;
 color:#33454f}
/* end mh-ann */

/* mh-pull2  ——  the Pullquote block was unstyled and inherited badly: theme.json
   put xx-large/300 on the FIGURE while .mh-post__body p pulled the actual text
   down to 17px, so the quote rendered at body size; and our own
   «.mh-post__body blockquote» rule painted its lavender bar on it, making a pull
   quote look exactly like an ordinary quote. It now reads as a display quote:
   centred, Azer Bold, held between two hairlines, no side bar — so it is clearly
   a different object from the bar-quotes used for cited passages. */
.mh-post__body .wp-block-pullquote{margin-block:clamp(36px,4.6vw,62px);margin-inline:0;
 padding:clamp(24px,3vw,36px) 0;text-align:center;
 border-block:1px solid #ddd8d0}
.mh-post__body .wp-block-pullquote blockquote{border:0;margin:0;padding:0;
 max-width:32ch;margin-inline:auto}
.mh-post__body .wp-block-pullquote p{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(19px,0.89rem + 0.93vw,27px);line-height:1.55;
 color:#2b2825;margin:0;text-align:center}
.mh-post__body .wp-block-pullquote cite{display:block;font-family:var(--mh-display);
 font-weight:400;font-size:12px;letter-spacing:.04em;color:#6b6560;
 font-style:normal;margin-block-start:.9em}
/* end mh-pull2 */

/* mh-ovclose2  ——  the ✕ was a 44px translucent disc (42% black, 19px glyph) over
   artwork, so on a light portrait it nearly vanished. Solid ground, bigger glyph,
   a white ring and a shadow so it reads as a control against any card colour.
   .mh-ov also gets touch-action:pan-y so the sheet can be pulled aside to close
   without the browser claiming the horizontal gesture. */
.mh-ov{touch-action:pan-y}
.mh-ov__close{width:48px;height:48px;font-size:20px;
 background:rgba(24,21,17,.86);border:1.5px solid rgba(255,255,255,.9);
 box-shadow:0 2px 6px rgba(0,0,0,.28), 0 10px 26px rgba(0,0,0,.24)}
.mh-ov__close:hover,.mh-ov__close:focus-visible{background:#2b2825;
 border-color:#fff;transform:scale(1.04)}
/* end mh-ovclose2 */

/* mh-ovfade  ——  the ✕ lived outside the overlay, so it was still sitting there
   after the sheet had folded away. It now fades in and out with the sheet, and
   travels with it when the sheet is pulled aside. The selectors carry .mh-ov.live
   so they outweigh the display rule above rather than losing to it on source order. */
.mh-ov.live ~ .mh-ov__close{opacity:0;transform:scale(.82);
 transition:opacity .3s ease, transform .3s ease}
body.mh-ov-open .mh-ov.live ~ .mh-ov__close{opacity:1;transform:scale(1)}
body.mh-ov-open .mh-ov.live ~ .mh-ov__close:hover,
body.mh-ov-open .mh-ov.live ~ .mh-ov__close:focus-visible{transform:scale(1.04)}
@media (prefers-reduced-motion:reduce){
 .mh-ov.live ~ .mh-ov__close{transition:none}
}
/* end mh-ovfade */

/* mh-ovmore  ——  the readings at the end of an overlay article. They leave the
   paper: the sheet stops, the card's own ground shows through for a moment,
   and the readings sit on a band of paper of their own beneath it. The cards
   are the site's own مِمّا قرأت card, not a second card design — the end of a
   reading hands you the next one in the form you already know it by. */
.mh-ov__more{pointer-events:auto;position:relative;z-index:2;box-sizing:border-box;
 width:100vw;background:var(--mh-paper);
 padding:clamp(44px,6vh,86px) 4vw clamp(64px,10vh,130px)}
.mh-ov__more .mh-rel{margin-block-start:0}
.mh-ov__more .mh-rel__label{text-align:center;margin:0 0 clamp(26px,3vw,44px)}
.mh-rel__cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
 gap:clamp(14px,1.8vw,28px);max-width:1180px;margin-inline:auto}
@media (max-width:900px){
 .mh-rel__cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px}
}
/* end mh-ovmore */

/* mh-ovsub  ——  the pen, at the very end. Its own sheet of paper, with the
   readings continuing straight on from the cards above on the same sheet,
   with only air between them. The canvas covers the
   whole section and takes no clicks, so the field under it still works. */
.mh-ov__sub{position:relative;box-sizing:border-box;pointer-events:auto;z-index:2;
 width:100vw;background:var(--mh-paper);overflow:hidden;
 padding:clamp(8px,1.2vh,20px) 4vw clamp(64px,10vh,130px)}
.mh-sub2__ink{position:absolute;inset:0;width:100%;height:100%;
 pointer-events:none;z-index:0}
.mh-sub2{position:relative;z-index:1;max-width:620px;margin-inline:auto;text-align:center}
.mh-sub2 .mh-sub2__label{font-family:var(--mh-display);font-weight:700;font-size:13px;
 line-height:1.55;color:var(--ink-3);margin:0 0 var(--sp-xs)}
.mh-sub2__ttl{font-family:var(--mh-display);font-weight:700;
 font-size:clamp(21px,0.89rem + 1.34vw,34px);line-height:1.85;color:var(--ink-1);
 margin:0 0 clamp(22px,2.6vw,34px)}
.mh-sub2 .mh-sub__form{margin-inline:auto;justify-content:center}
.mh-sub2 .mh-sub__note{text-align:center}
/* end mh-ovsub */

/* mh-vox  ——  the readers, under the field. All three share one grid cell, so
   the block stands as tall as the longest of them and nothing on the page
   moves when they turn over; only opacity changes. The name is set in the
   face the site gives every other name. (Named mh-vox, not mh-quotes or
   mh-say2: both of those already mean something else in this file.) */
.mh-sub2 .mh-vox{display:grid;margin-block-start:clamp(32px,4.4vh,58px)}
.mh-vox__item{grid-area:1/1;margin:0;pointer-events:none;
 opacity:0;transition:opacity .75s ease;
 font-size:clamp(13px,0.8rem + 0.22vw,16px);line-height:1.75;color:var(--ink-2)}
.mh-vox__item.is-on{opacity:1}
.mh-vox__who{font-family:var(--mh-names);color:var(--ink-3);
 font-size:0.93em;margin-inline-start:.6em;white-space:nowrap}
@media (prefers-reduced-motion:reduce){
 .mh-vox__item{transition:none}
}
/* end mh-vox */
/* mh-barfix */
/* these three declarations used to be typed straight into the header markup,
   which made WordPress flag the nav group, the buttons wrapper and the تواصل
   button as invalid blocks — a block is validated by regenerating its markup
   from its attributes, and no attribute produces these. Same rendering, no warning. */
.mh-bar__navwrap,.mh-bar__cta{flex-shrink:0}
.mh-bar__cta .wp-block-button__link{white-space:nowrap}
/* end mh-barfix */