/* Home page sections (Oct 2026). Scoped to main.mlh; the live site.css keeps the header, hero, 7/10 cards, questions and footer. */
.mlh .mh-sec{padding-block:clamp(56px,7vw,104px)}
.mlh .mh-sec:has(> .wrap > .mh-head){padding-top:clamp(112px,12vw,176px)}
.mlh .mh-sec + .mh-sec:has(> .wrap > .mh-head){padding-top:clamp(56px,6vw,72px)}
.mlh .mh-h2{font-size:clamp(46px,6.4vw,92px);margin:0}
.mlh .mh-h2s{font-size:clamp(40px,5vw,72px)}
.mlh .mh-head{max-width:900px;display:grid;gap:28px}
.mlh .lead{font-size:clamp(19px,1.6vw,22px);line-height:1.55;margin:0}
/* bars reveal + yellow stroke under the named words */
.mlh .rtr-line{display:block;position:relative;width:fit-content;max-width:100%}
.mlh .rtr-tx{position:relative;z-index:1}
.mlh .rtr-bar{position:absolute;left:-.08em;right:-.08em;top:.04em;bottom:.08em;transform:scaleX(0);pointer-events:none}
.mlh .ulw{background:linear-gradient(var(--yellow),var(--yellow)) no-repeat 0 92%/0% 34%;transition:background-size 1.1s cubic-bezier(.2,.7,.2,1)}
.mlh .ul .ulw{background-size:100% 34%}
[dir="rtl"] .mlh .ulw{background-position:100% 92%}
/* three cards, lighter colours, icon tile half over the top */
.mlh .mh-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:64px 20px;margin-top:clamp(64px,7vw,88px)}
.mlh .mh-c{position:relative;border-radius:var(--r-lg);padding:68px 30px 30px;display:grid;gap:14px;align-content:start;color:var(--ink)}
.mlh .mh-c1{background:#FCFFC4}.mlh .mh-c2{background:var(--sky)}.mlh .mh-c3{background:#fff}
.mlh .mh-i{position:absolute;top:-38px;inset-inline-start:28px;width:76px;height:76px;padding:16px;background:#fff;color:var(--blue);border:1.5px solid var(--ink);border-radius:20px;box-shadow:0 4px 0 var(--ink);stroke-width:1.6}
.mlh .mh-c h3{font-size:clamp(34px,3vw,42px);margin:0}
.mlh .mh-c p{margin:0;font-size:16.5px;line-height:1.65}
.mlh .mh-q{font-weight:700;font-size:17px!important;line-height:1.5!important;padding-top:14px;border-top:1.5px solid color-mix(in srgb,var(--ink) 18%,transparent)}
.mlh .mh-src{margin-top:-6px!important;font-size:12px!important;font-weight:600;color:var(--muted)}
.mlh .draw *{stroke-dasharray:1;stroke-dashoffset:0}
.js .mlh .draw *{stroke-dashoffset:1;transition:stroke-dashoffset 1.2s cubic-bezier(.4,0,.2,1)}
.js .mlh .draw.on *{stroke-dashoffset:0}
@media (max-width:900px){.mlh .mh-cards{grid-template-columns:minmax(0,1fr)}}
/* Moshiach + the CNN clip */
/* Moshiach: heading and the two paragraphs in one box */
.mlh .mh-ms{background:var(--card);border-radius:var(--r-lg);padding:clamp(28px,5vw,64px);display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:28px clamp(32px,5vw,72px);align-items:start}
.mlh .mh-ms-tx{display:grid;gap:24px;max-width:62ch}
/* the CNN clip: its own box underneath, video beside the quote (stacked on phones) */
.mlh .mh-sec-cnn{padding-top:clamp(20px,2.4vw,32px)}
.mlh .mh-cnn{background:var(--card);border-radius:var(--r-lg);padding:clamp(20px,4vw,48px);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:28px clamp(28px,4vw,56px);align-items:center}
.mlh .mh-cnn-tx blockquote{margin:0}
.mlh .mh-ms-tx p{margin:0}
.mlh .mh-ms-q{margin:22px 0 0;font:700 clamp(20px,1.8vw,24px)/1.35 var(--f-body)}
.mlh .mh-ms-who{margin:10px 0 0;color:var(--blue);font-weight:600;font-size:15px}
.mlh .mk{color:inherit;background:linear-gradient(var(--yellow),var(--yellow)) no-repeat 0 88%/100% 46%;padding:0 .08em;transition:background-size 1.1s cubic-bezier(.2,.7,.2,1)}
.js .mlh .mk{background-size:0% 46%}
.js .mlh .mk.on{background-size:100% 46%}
@media (max-width:900px){.mlh .mh-ms,.mlh .mh-cnn{grid-template-columns:minmax(0,1fr)}}
/* chat */
.mlh .cx-in{background:var(--card);border-radius:var(--r-lg);padding:clamp(28px,5vw,56px) clamp(20px,4vw,48px);display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:32px clamp(32px,5vw,64px);align-items:start}
.mlh .cx-side{position:sticky;top:110px}
.mlh .cx-thread{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;min-width:0}
.mlh .cx-m{display:flex;flex-direction:column;max-width:min(560px,86%)}
.mlh .cx-us{align-self:flex-end;align-items:flex-end}
.mlh .cx-them{align-self:flex-start;align-items:flex-start;margin-block:10px}
.mlh .cx-b{margin:0;padding:14px 18px;font-size:16.5px;line-height:1.6;border-radius:22px}
.mlh .cx-us .cx-b{background:var(--sky);border-end-end-radius:6px}
.mlh .cx-them .cx-b{background:var(--ground);border-end-start-radius:6px;font-weight:600}
.mlh .cx-take .cx-b{background:var(--yellow)}
.mlh .cx-h{display:block;font-size:clamp(30px,2.6vw,38px);line-height:1;color:var(--blue);margin-bottom:8px}
.mlh .cx-take .cx-h{color:var(--ink)}
.mlh .cx-who{font:700 13px/1 var(--f-body);color:var(--muted);margin:6px 4px}
.mlh .cx-act{align-self:flex-end;margin-top:10px}
.mlh .cx-dots{display:none;gap:4px;padding:16px 18px;border-radius:22px;background:var(--ground)}
.mlh .cx-us .cx-dots{background:var(--sky)}
.mlh .cx-dots i{width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.45;animation:mhdot 1s infinite}
.mlh .cx-dots i:nth-child(2){animation-delay:.15s}.mlh .cx-dots i:nth-child(3){animation-delay:.3s}
@keyframes mhdot{0%,60%,100%{transform:none;opacity:.35}30%{transform:translateY(-4px);opacity:.8}}
.js .mlh .cx-m{opacity:0;transform:translateY(14px);transition:opacity .35s,transform .45s cubic-bezier(.22,1,.36,1)}
.js .mlh .cx-m.typing{opacity:1;transform:none}
.js .mlh .cx-m.typing .cx-b{display:none}
.js .mlh .cx-m.typing .cx-dots{display:inline-flex}
.js .mlh .cx-m.on{opacity:1;transform:none}
.mlh .cx-h.rtr .rtr-line:last-child .rtr-tx{background:linear-gradient(var(--yellow),var(--yellow)) no-repeat 0 92%/0% 34%;transition:background-size 1.1s cubic-bezier(.2,.7,.2,1)}
.mlh .cx-take .cx-h.rtr .rtr-line:last-child .rtr-tx{background-image:linear-gradient(#fff,#fff)}
.mlh .cx-h.rtr.ul .rtr-line:last-child .rtr-tx{background-size:100% 34%}
@media (max-width:900px){.mlh .cx-in{grid-template-columns:minmax(0,1fr)}.mlh .cx-side{position:static}.mlh .cx-m{max-width:92%}}
/* your part: the live 7/10 cards keep their own styles */
.mlh #take-action .doors{margin-top:clamp(40px,5vw,56px)}
/* Say it + Yechi on blue */
.mlh .mh-say{padding-top:clamp(112px,12vw,176px);margin-bottom:-16px}
.mlh .mh-sec-ye{padding-top:clamp(28px,3vw,40px)}
.mlh .mh-ye{background:var(--blue);color:#fff;border-radius:var(--r-lg);padding:clamp(40px,6vw,88px) clamp(20px,4vw,56px)}
.mlh .mh-ye-h{font:800 clamp(22px,2vw,28px)/1.3 var(--f-body);margin:0;color:#fff}
.mlh .mh-ye-sub{margin:8px 0 0;font-size:18px;color:#fff;max-width:56ch}
.mlh .mh-ye-y{font-size:clamp(52px,8vw,128px);line-height:.92;margin:32px 0 24px;color:#fff;text-align:start}
[dir="rtl"] .mlh .mh-ye-y{text-align:right}
.mlh .mh-ye-en{font-weight:700;font-size:19px;margin:0;color:#fff}
/* write to the Rebbe */
.mlh .mh-sec-wr{padding-block:clamp(24px,3vw,40px)}
.mlh .mh-wr{background:var(--card);border-radius:var(--r-lg);padding:clamp(24px,3vw,36px) clamp(20px,3.5vw,44px);display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:24px clamp(28px,3.5vw,48px);align-items:center}
.mlh .mh-pen{width:48px;height:48px;color:var(--blue);stroke-width:1.6;margin-inline:4px 8px}
.mlh .mh-wr-h{font:400 clamp(30px,3vw,40px)/1 var(--f-disp);text-transform:uppercase;margin:0}
.mlh .mh-wr-tx p{margin:6px 0 0}
@media (max-width:760px){.mlh .mh-wr{grid-template-columns:minmax(0,1fr)}.mlh .mh-wr .btn{justify-self:start}}
/* in-depth reading: a little larger, closer to the questions, more room before the footer */
.mlx-deep{padding-block:clamp(16px,2vw,24px) clamp(56px,6vw,88px)!important}
.mlx-deep .mlx-h{font-size:19px!important;margin-bottom:12px!important}
.mlx-deep ul{max-width:1000px!important;gap:12px!important}
.mlx-deep a{grid-template-columns:60px minmax(0,1fr)!important;padding:10px!important;gap:3px 14px!important}
.mlx-deep img{width:60px!important;height:60px!important}
.mlx-deep strong{font-size:16px!important}
.mlx-deep span{font-size:13.5px!important}
@media (prefers-reduced-motion:reduce){.mlh *{animation:none!important;transition:none!important}}
/* phones: the whole hero photo, nothing cropped (the Rebbe was cut off at 4:3.2) */
@media (max-width:900px){.hero-ph img{aspect-ratio:auto!important;height:auto!important;object-fit:contain!important}}
.mlh .mh-cnn-tx .mh-ms-q{margin:0;font-size:clamp(22px,2.4vw,32px);line-height:1.28;letter-spacing:-.01em}
/* review fixes */
.mlh .mh-ye-y{word-break:normal;overflow-wrap:normal;hyphens:none}
.mlh .mh-ye-y:lang(zh),.mlh .mh-ye-y[dir="ltr"]{line-height:.95}
[dir="rtl"] .mlh .mh-ye-y[dir="ltr"]{text-align:right}
[dir="rtl"] .mlh .mh-ye-y[dir="ltr"] .rtr-line{margin-left:auto}
[dir="rtl"] .mlh .cx-act .ic{transform:scaleX(-1)}
@media (max-width:560px){.mlh .mh-ye-y{font-size:clamp(40px,11.5vw,60px)}}
/* desktop hero: the wide crop (the width/height attributes had made it full height), framed on the Rebbe */
@media (min-width:901px){.hero-ph img{height:auto!important;aspect-ratio:21/8.5!important;object-fit:cover;object-position:55% 33%!important;max-height:min(460px,52vh)}}
