/* home.css — modern homepage (sample, Nov 2026). Loaded after theme.css; uses the design variables of A/B/C × light/dark. */
main.home{max-width:none;padding:0}
header.site:has(+ main.home){border-bottom:0}
.hm-wrap{max-width:1180px;margin:0 auto;padding:0 22px}
/* hero */
.hm-hero{background:var(--hdr-bg);color:var(--hdr-ink);position:relative;padding:64px 0 96px;text-align:center}
.hm-hero:before{overflow:hidden}
.hm-hero:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.55;
 background:radial-gradient(900px 340px at 50% -40px,color-mix(in srgb,var(--gold) 24%,transparent),transparent 70%),
 repeating-linear-gradient(135deg,color-mix(in srgb,var(--hdr-sub) 7%,transparent) 0 1px,transparent 1px 22px)}
.hm-hero:after{content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:min(1180px,100%);height:1px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--gold) 70%,transparent),transparent)}
.hm-hero .hm-wrap{position:relative}
.hm-eyebrow{font-family:var(--ui);font-size:calc(15px*var(--fs));color:var(--hdr-sub);font-weight:500}
.hm-title{font-family:var(--hfont);font-size:calc(68px*var(--fs));line-height:1.1;margin:.12em 0 .1em;color:var(--hdr-brand);font-weight:700;border:0;padding:0}
.hm-title:after{display:none!important}
.hm-by{margin:0 0 30px;color:color-mix(in srgb,var(--hdr-ink) 82%,transparent);font-size:calc(17px*var(--fs))}
.hm-search{position:relative;z-index:5;max-width:760px;margin:0 auto;display:flex;align-items:center;background:var(--field);border-radius:16px;
 box-shadow:0 10px 40px rgba(0,0,0,.22),0 0 0 1px color-mix(in srgb,var(--gold) 45%,transparent);text-align:right}
.hm-search:focus-within{box-shadow:0 10px 40px rgba(0,0,0,.22),0 0 0 3px color-mix(in srgb,var(--gold) 75%,transparent)}
.hm-sicon{display:flex;padding:0 20px 0 6px;color:var(--muted)}
.hm-sicon .ic{width:24px;height:24px}
.hm-search input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font-family:var(--ui);font-size:calc(20px*var(--fs));padding:20px 4px;height:auto}
.hm-search input::-webkit-search-cancel-button{display:none}
.hm-sbtn{margin:8px;border:0;border-radius:11px;padding:0 26px;height:48px;background:var(--accent);color:var(--card);font-family:var(--ui);font-size:calc(17px*var(--fs));font-weight:600;cursor:pointer}
html[data-theme=dark] .hm-sbtn{color:#0e1420}
.hm-sbtn:hover{filter:brightness(1.08)}
.hm-sug{position:absolute;top:calc(100% + 8px);right:0;left:0;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:14px;box-shadow:0 18px 50px rgba(0,0,0,.22);padding:8px;z-index:30;max-height:min(70vh,520px);overflow:auto;text-align:right}
.hm-sg{font-family:var(--ui);font-size:12.5px;color:var(--muted);padding:10px 12px 4px}
.hm-opt{display:flex;justify-content:space-between;gap:14px;align-items:baseline;padding:9px 12px;border-radius:9px;color:var(--ink);text-decoration:none!important}
.hm-opt .m{font-size:calc(17px*var(--fs))}.hm-opt .s{font-family:var(--ui);font-size:13.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:45%}
.hm-opt .yr,.hm-opt .lat{font-family:var(--ui);font-size:13px;color:var(--muted);margin-inline-start:6px}
.hm-opt:hover,.hm-opt.on{background:var(--chipbg)}
.hm-all{border-top:1px solid var(--line);margin-top:6px;border-radius:0 0 9px 9px;color:var(--accent);font-family:var(--ui);font-size:15px;justify-content:center}
.hm-try{margin-top:18px;font-family:var(--ui);font-size:calc(14.5px*var(--fs));display:flex;gap:8px;justify-content:center;flex-wrap:wrap;align-items:center;color:color-mix(in srgb,var(--hdr-ink) 75%,transparent)}
.hm-try a{color:var(--hdr-ink);border:1px solid color-mix(in srgb,var(--hdr-ink) 30%,transparent);border-radius:999px;padding:4px 14px;text-decoration:none}
.hm-try a:hover{background:var(--hdr-hover)}
.hm-try a.hm-adv{border:0;color:var(--hdr-sub)}
/* stats */
.hm-stats{display:grid;grid-template-columns:repeat(4,1fr);margin:-52px auto 0;position:relative;z-index:2;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow),0 8px 30px rgba(20,30,50,.08);overflow:hidden}
.hm-stats div{padding:20px 12px;text-align:center;border-inline-start:1px solid var(--line)}
.hm-stats div:first-child{border-inline-start:0}
.hm-stats span{display:block;font-family:var(--ui);font-size:calc(14px*var(--fs));color:var(--muted)}
.hm-stats b{display:block;font-family:var(--ui);font-size:calc(32px*var(--fs));font-weight:700;color:var(--accent);line-height:1.2;font-variant-numeric:tabular-nums}
/* sections */
.hm-body{padding-top:14px;padding-bottom:56px}
.hm-sec{margin-top:52px}
.hm-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:18px}
.hm-head h2{margin:0;font-size:calc(27px*var(--fs))}
.hm-more{font-family:var(--ui);font-size:calc(15px*var(--fs));white-space:nowrap}
.hm-more.sm{font-size:13.5px;margin-inline-start:auto}
/* volumes */
.hm-vols{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.hm-vol{position:relative;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px 18px 16px;color:var(--ink);text-decoration:none!important;transition:transform .18s ease,box-shadow .18s ease,border-color .18s;box-shadow:var(--shadow);min-height:150px}
.hm-vol:before{content:"";position:absolute;inset-inline:18px;top:0;height:3px;border-radius:0 0 3px 3px;background:var(--gold);opacity:.85}
.hm-vol:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--gold) 60%,var(--line));box-shadow:0 10px 26px rgba(20,30,50,.12)}
.hm-vlbl{order:-1;font-family:var(--ui);font-size:13px;color:var(--muted);}
.hm-vnum{font-family:var(--hfont);font-size:calc(44px*var(--fs));line-height:1.1;color:var(--accent);font-weight:700}
.hm-vsub{font-size:calc(17px*var(--fs));font-weight:600;margin-top:4px}
.hm-vrng{font-family:var(--ui);font-size:13.5px;color:var(--ink2)}
.hm-vcnt{margin-top:auto;padding-top:10px;display:flex;flex-direction:column;line-height:1.5;font-family:var(--ui);font-size:13px;color:var(--muted)}
/* letters */
.hm-abc{display:grid;grid-template-columns:repeat(22,1fr);gap:6px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px;box-shadow:var(--shadow)}
.hm-abc a,.hm-abc .dis{display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:10px;padding:8px 0 6px;text-decoration:none!important;color:var(--ink);transition:background .15s,color .15s}
.hm-abc b{font-family:var(--hfont);font-size:calc(25px*var(--fs));line-height:1.1;font-weight:700}
.hm-abc small{font-family:var(--ui);font-size:11.5px;color:var(--muted)}
.hm-abc a:hover{background:var(--accent);color:var(--card)}.hm-abc a:hover small{color:inherit;opacity:.8}
.hm-abc .dis{opacity:.35}
/* duo */
.hm-duo{display:grid;grid-template-columns:1.6fr 1fr;gap:18px}
.hm-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px 22px;box-shadow:var(--shadow)}
.hm-ctop{display:flex;align-items:center;gap:8px;font-family:var(--ui);font-size:14px;color:var(--muted);margin-bottom:12px}
.hm-ctop .ic.sm{width:18px;height:18px;color:var(--gold)}
.hm-again{margin-inline-start:auto;font-family:var(--ui);font-size:14px;border:1px solid var(--line);background:var(--chipbg);color:var(--ink);border-radius:999px;padding:5px 14px;cursor:pointer}
.hm-again:hover{border-color:var(--gold)}
a.hm-again{text-decoration:none;display:inline-flex;align-items:center}
.hm-again+.hm-again{margin-inline-start:0}
.hm-again,.hm-ctop>span{white-space:nowrap}
.hm-rand .hm-ctop{flex-wrap:wrap;row-gap:8px}
.hm-fname{font-family:var(--hfont);font-size:calc(28px*var(--fs));font-weight:700;color:var(--ink);margin-inline-end:10px}
.hm-randbody .lat{font-family:var(--ui);font-size:14px;color:var(--muted)}
.hm-randbody .plist{margin:12px 0 10px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:6px 28px;list-style:none}
.hm-randbody .plist li{break-inside:avoid}
.hm-randbody.fade{animation:hmfade .35s ease}
.hm-today #ytoday{margin:0 0 14px;line-height:1.75}
.hm-rlink{display:inline-flex;align-items:center;gap:6px;font-family:var(--ui);font-size:15px;border:1px solid var(--line);border-radius:999px;padding:6px 14px}
.hm-rlink .ic{width:16px;height:16px}
/* tools */
.hm-tools{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.hm-tool{display:flex;gap:14px;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;color:var(--ink);text-decoration:none!important;transition:transform .18s ease,box-shadow .18s,border-color .18s;box-shadow:var(--shadow)}
.hm-tool:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 45%,var(--line));box-shadow:0 10px 24px rgba(20,30,50,.1)}
.hm-tic{flex:none;width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--accent) 10%,var(--card));color:var(--accent)}
.hm-tool b{display:block;font-size:calc(17.5px*var(--fs))}
.hm-tool small{display:block;font-family:var(--ui);font-size:calc(13.5px*var(--fs));color:var(--muted);line-height:1.45;margin-top:2px}
.ic{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
/* featured */
.hm-feat{display:grid;grid-template-columns:repeat(2,1fr);gap:12px 18px}
.hm-person{min-width:0;display:flex;gap:14px;align-items:center;padding:12px 14px;border-radius:12px;color:var(--ink);text-decoration:none!important;border:1px solid transparent;transition:background .15s,border-color .15s}
.hm-person:hover{background:var(--card);border-color:var(--line)}
.hm-av{flex:none;width:56px;height:56px;border-radius:50%;overflow:hidden;background:var(--chipbg);border:1px solid var(--line);display:flex;align-items:center;justify-content:center}
.hm-av img{width:100%;height:100%;object-fit:cover}
.hm-mono{font-family:var(--hfont);font-size:24px;color:var(--gold);font-weight:700}
.hm-pt{min-width:0;flex:1}.hm-pt b{display:block;font-size:calc(18px*var(--fs))}
.hm-pt .yr{display:block;font-family:var(--ui);font-size:13.5px;color:var(--muted)}
.hm-pt small{display:block;font-family:var(--ui);font-size:13.5px;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hm-about .notice{font-size:calc(16px*var(--fs));line-height:1.8}
/* motion */
@keyframes hmfade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){
 .hm-hero .hm-wrap>*{animation:hmfade .6s ease both}
 .hm-hero .hm-title{animation-delay:.05s}.hm-hero .hm-by{animation-delay:.1s}.hm-hero .hm-search{animation-delay:.15s}.hm-hero .hm-try{animation-delay:.2s}
 .hm-stats{animation:hmfade .6s .25s ease both}
}
@media (prefers-reduced-motion:reduce){.hm-vol,.hm-tool{transition:none}.hm-vol:hover,.hm-tool:hover{transform:none}}
/* Design C: quiet hero on a light band */
html[data-design=c] .hm-hero{background:var(--paper2);color:var(--ink)}
html[data-design=c] .hm-hero:before{opacity:.25}
html[data-design=c] .hm-title{color:var(--ink);font-weight:800;letter-spacing:-.01em}
html[data-design=c] .hm-eyebrow{color:var(--accent)}
html[data-design=c] .hm-by{color:var(--ink2)}
html[data-design=c] .hm-search{box-shadow:0 4px 18px rgba(0,0,0,.06),0 0 0 1px var(--line);border-radius:999px}
html[data-design=c] .hm-search:focus-within{box-shadow:0 4px 18px rgba(0,0,0,.06),0 0 0 2px var(--accent)}
html[data-design=c] .hm-sbtn{border-radius:999px}
html[data-design=c] .hm-try{color:var(--muted)}html[data-design=c] .hm-try a{color:var(--ink);border-color:var(--line);background:var(--card)}html[data-design=c] .hm-try a.hm-adv{color:var(--accent);background:none}
html[data-design=c] .hm-stats,html[data-design=c] .hm-vol,html[data-design=c] .hm-tool,html[data-design=c] .hm-card,html[data-design=c] .hm-abc{box-shadow:none}
html[data-design=c] .hm-vol:before{display:none}
html[data-design=c] .hm-head h2:after{display:none}
/* Design A: framed, warmer */
html[data-design=a] .hm-title{text-shadow:0 1px 0 rgba(0,0,0,.25)}
html[data-design=a] .hm-vol,html[data-design=a] .hm-tool,html[data-design=a] .hm-card,html[data-design=a] .hm-abc,html[data-design=a] .hm-stats{border-color:var(--softline)}
/* tablet */
@media (max-width:1100px){.hm-vols{grid-template-columns:repeat(3,1fr)}.hm-tools{grid-template-columns:repeat(2,1fr)}.hm-abc{grid-template-columns:repeat(11,1fr)}}
/* phone */
@media (max-width:700px){
 .hm-wrap{padding:0 14px}
 .hm-hero{padding:36px 0 78px}
 .hm-title{font-size:calc(44px*var(--fs))}
 .hm-eyebrow{font-size:13px;}
 .hm-by{font-size:15px;margin-bottom:20px}
 .hm-search{border-radius:14px}
 .hm-sicon{padding:0 14px 0 2px}
 .hm-search input{font-size:17px;padding:15px 2px}
 .hm-sbtn{display:none}
 .hm-try{font-size:13.5px;gap:6px}.hm-try>span{width:100%}
 .hm-stats{grid-template-columns:repeat(2,1fr);margin-top:-46px}
 .hm-stats div:nth-child(3){border-inline-start:0}
 .hm-stats div:nth-child(n+3){border-top:1px solid var(--line)}
 .hm-stats div{padding:14px 8px}.hm-stats b{font-size:calc(26px*var(--fs))}
 .hm-sec{margin-top:38px}
 .hm-head h2{font-size:calc(22px*var(--fs))}
 .hm-vols{grid-template-columns:repeat(2,1fr);gap:10px}
 .hm-vol{min-height:0;padding:14px}
 .hm-vnum{font-size:calc(36px*var(--fs))}
 .hm-abc{grid-template-columns:repeat(6,1fr);padding:8px;gap:4px}
 .hm-duo{grid-template-columns:1fr}
 .hm-randbody .plist{grid-template-columns:1fr}
 .hm-tools{grid-template-columns:1fr 1fr;gap:10px}
 .hm-tool{flex-direction:column;gap:8px;padding:14px 12px}
 .hm-tic{width:40px;height:40px}
 .hm-tool small{font-size:12.5px}
 .hm-feat{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;margin:0 -14px;padding:2px 14px 10px;scrollbar-width:none}
 .hm-feat::-webkit-scrollbar{display:none}
 .hm-person{flex:0 0 78%;scroll-snap-align:start;background:var(--card);border-color:var(--line);padding:12px}
 .hm-opt{flex-direction:column;gap:0}.hm-opt .s{max-width:100%}
}

/* היום בלוח: name + its short description, one line each */
.hm-today #ytoday .yt-lbl{display:block;margin-top:4px;color:var(--muted);font-size:.92em}
.hm-today #ytoday .yt-list{display:block;margin:6px 0 0}
.hm-today #ytoday .yt-i{display:block;min-width:0;padding:7px 0;border-top:1px solid var(--softline,var(--line));line-height:1.45}
.hm-today #ytoday .yt-i:first-child{border-top:0;padding-top:2px}
.hm-today #ytoday .yt-n{display:block}
.hm-today #ytoday .yt-n .yr{color:var(--muted);font-size:.9em}
.hm-today #ytoday .yt-d{display:block;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--muted);font-size:.86em;line-height:1.5;margin-top:1px}
.hm-today #ytoday .yt-more{display:inline-block;margin-top:6px;font-size:.92em}
.hm-duo>.hm-card{min-width:0}
