/* ==========================================================
   FRONT-DOOR PAGES (redesigned, Oct 2026): Torah PDF, Mishnah PDF,
   Hebrew Mishnah page and future redesigned pages.
   Colours and fonts come from palette.css — do not hard-code them here.
   ========================================================== */
@import url('palette.css');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:19px;scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--font-text);line-height:1.75;overflow-x:hidden}
a{color:var(--accent)}
.cz{font-family:var(--font-display)}
/* nav */
.site-nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.1rem 2rem;background:var(--bar);position:sticky;top:0;z-index:100}
.nav-logo{font-family:var(--font-display);font-size:1rem;font-weight:500;letter-spacing:.1em;color:var(--bg);text-decoration:none;text-transform:uppercase}
.nav-logo span{color:rgba(250,246,238,.7);font-weight:400}
.nav-links{display:flex;gap:2rem;list-style:none}
.nav-links a{font-family:var(--font-display);font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(250,246,238,.92);text-decoration:none;transition:color .2s}
.nav-links a:hover{color:var(--bg)}
@media (max-width:760px){.site-nav{flex-direction:column;align-items:flex-start;padding:.9rem 1.1rem}.nav-links{flex-wrap:wrap;gap:.4rem 1.2rem}}
/* hero */
.hero{padding:4.5rem 1.5rem 3.5rem;text-align:center;background:linear-gradient(180deg,var(--bg) 0%,var(--bg-2) 100%);position:relative;overflow:hidden}
.hero-inner{position:relative;z-index:1;max-width:700px;margin:0 auto}
.kicker{font-family:var(--font-display);font-size:.85rem;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:1.4rem}
.hero h1{font-family:var(--font-display);font-weight:400;font-size:clamp(1.8rem,4.6vw,3rem);line-height:1.15;letter-spacing:.02em;margin-bottom:.9rem}
.hero .sub{color:var(--ink-light);margin-bottom:1.6rem}
.hero .lead{font-size:1.05rem;line-height:1.85;color:var(--ink-mid);max-width:560px;margin:0 auto 2.2rem}
.btn{display:inline-block;font-family:var(--font-display);letter-spacing:.08em;text-decoration:none;border-radius:2px}
.btn-main{background:var(--accent);color:var(--bg);font-size:.95rem;padding:1.05rem 2.6rem;box-shadow:0 6px 22px rgba(var(--accent-rgb),.18)}
.btn-main:hover{background:var(--accent-dark)}
.alt{margin-top:1.1rem;font-size:.95rem;color:var(--ink-light)}
.alt a{text-decoration:none;border-bottom:1px solid var(--accent-rule)}
.fine{margin-top:.5rem;font-size:.9rem;color:var(--ink-faint)}
.ornament{display:block;margin-top:2.2rem;letter-spacing:.5em;color:rgba(var(--accent-rgb),.45)}
/* facts strip */
.strip{display:flex;justify-content:center;flex-wrap:wrap;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);background:var(--bg-2)}
.strip span{font-family:var(--font-display);font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-light);padding:.8rem 1.5rem;border-right:1px solid var(--rule)}
.strip span:last-child{border-right:0}
/* sections */
.section{max-width:760px;margin:0 auto;padding:3.5rem 1.5rem 0}
.wide{max-width:980px}
.label{font-family:var(--font-display);font-size:1.15rem;letter-spacing:.06em;text-transform:none;font-weight:500;color:var(--accent);display:flex;align-items:center;gap:1rem;margin-bottom:1.4rem}
.label::after{content:'';flex:1;height:1px;background:var(--accent-rule)}
.center-label{justify-content:center;color:var(--accent)}
.center-label::before{content:'';flex:1;height:1px;background:var(--rule)}
.center-label::after{background:var(--rule)}
.prose p{margin-bottom:1.15rem;color:var(--ink-mid);line-height:1.85}
/* featured card */
.featured{background:var(--bg);border:1px solid var(--accent-rule);border-left:4px solid var(--accent);padding:2.2rem 2.4rem;box-shadow:0 4px 20px rgba(var(--accent-rgb),.06)}
.featured h2{font-family:var(--font-display);font-weight:400;font-size:1.25rem;color:var(--accent);margin-bottom:1rem;line-height:1.35}
.featured p{color:var(--ink-mid);margin-bottom:1.3rem}
.six{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1fr);gap:8px;margin:0 0 1.5rem}
.six .h{font-family:var(--font-display);font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);padding:0 .2rem .2rem}
.six .r{font-family:var(--font-display);font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);align-self:center;padding-right:.4rem}
.six .c{background:var(--bg-2);border:.5px solid var(--accent-rule);padding:.7rem .9rem;font-size:.95rem;color:var(--ink-mid);line-height:1.35}
.six .c b{font-family:var(--font-display);font-weight:500;color:var(--accent);margin-right:.45rem}
.go{font-family:var(--font-display);font-size:.9rem;letter-spacing:.1em;text-transform:uppercase;text-decoration:none}
.then{margin-top:.7rem;font-size:.95rem;color:var(--ink-light)}
@media (max-width:640px){.featured{padding:1.4rem 1rem}.six{gap:6px}.six .r{font-size:.72rem;letter-spacing:0;padding-right:.1rem}.six .c{font-size:.85rem;padding:.5rem .5rem}.strip span{flex:1 1 45%;text-align:center;border-bottom:1px solid var(--rule)}}
/* cards */
.intro-p{text-align:center;max-width:640px;margin:0 auto 2rem;color:var(--ink-mid);line-height:1.85}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:12px}
.card{background:var(--bg-2);border:.5px solid var(--rule);padding:1.5rem 1.5rem 1.3rem}
.card .num{font-family:var(--font-display);font-size:.82rem;color:var(--ink-faint);letter-spacing:.12em;display:block;margin-bottom:.6rem}
.card h3{font-family:var(--font-display);font-weight:500;font-size:.95rem;color:var(--ink);margin-bottom:.5rem}
.card p{font-size:.95rem;line-height:1.6;color:var(--ink-mid)}
/* quotes */
.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px}
.quote{border-left:3px solid var(--accent);background:var(--bg-2);padding:1.3rem 1.5rem}
.quote blockquote{font-style:italic;color:var(--ink-mid);line-height:1.7;margin-bottom:.8rem}
.quote figcaption{font-size:.85rem;color:var(--ink-light)}
/* folds */
details{border-bottom:1px solid var(--rule)}
details summary{cursor:pointer;padding:.85rem 0;font-weight:500;color:var(--ink);list-style:none}
details summary::-webkit-details-marker{display:none}
details summary::before{content:'+';display:inline-block;width:1.3rem;color:var(--accent)}
details[open] summary::before{content:'\2212'}
details > *:not(summary){margin-left:1.3rem}
details p{margin-bottom:1rem;color:var(--ink-mid)}
details.more summary{font-family:var(--font-display);font-weight:400}
details h3{font-family:var(--font-display);font-weight:500;font-size:.95rem;margin:1.3rem 0 .5rem}
details h4{font-weight:500;margin:1rem 0 .4rem}
.final-table{border-collapse:collapse;width:100%;margin:.3rem 0 1rem}
.final-table th{text-align:left;font-weight:500;padding:.4rem .8rem .4rem 0;width:35%;color:var(--ink-light)}
.final-table td{padding:.4rem 0;border-bottom:1px solid var(--rule)}
.publication-note{background:var(--bg-2);padding:1rem 1.2rem;margin:1rem 0}
/* band */
.band{background:var(--accent);text-align:center;padding:4rem 1.5rem;margin-top:4rem}
.band .kicker{color:rgba(250,246,238,.85)}
.band h2{font-family:var(--font-display);font-weight:400;font-size:1.5rem;color:var(--bg);margin-bottom:.8rem}
.band p{color:rgba(250,246,238,.95);max-width:560px;margin:0 auto 1.8rem}
.band .btn-main{background:var(--bg);color:var(--accent);box-shadow:none}
.band .alt,.band .alt a{color:rgba(250,246,238,.95);border-color:rgba(250,246,238,.35)}
.footer{background:var(--footer-bg);padding:1.6rem 2.5rem;border-top:1px solid var(--rule);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.6rem 2rem;font-size:15px;line-height:1.5;color:var(--on-footer)}
.footer .ft-links{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem}
.footer a{color:var(--footer-link);text-decoration:none}
.footer a:hover{color:var(--accent)}

/* Mishnah additions */
.heb-card{direction:rtl;text-align:right;max-width:560px;margin:2rem auto 0;background:var(--bg);border:1px solid var(--accent-rule);border-right:4px solid var(--accent);padding:1.2rem 1.4rem;font-family:'Frank Ruehl CLM','David','SBL Hebrew','Times New Roman',serif}
.heb-card h2{font-size:1.25rem;font-weight:700;color:var(--accent);margin-bottom:.4rem}
.heb-card p{font-size:1.05rem;line-height:1.7;color:var(--ink-mid);margin-bottom:.8rem}
.heb-card .btn-main{font-family:inherit;font-size:1.05rem;padding:.7rem 1.6rem;letter-spacing:0}
.weave-wrap{overflow-x:auto;margin:0 0 1.3rem}
.weave{width:100%;border-collapse:collapse;font-family:'Frank Ruehl CLM','David','SBL Hebrew','Times New Roman',serif;font-size:1rem;line-height:1.75;text-align:center}
.weave th{background:var(--accent);color:var(--bg);font-weight:500;padding:.4rem;width:50%}
.weave td{border:1px solid var(--accent-rule);padding:.9rem .8rem;vertical-align:top;background:var(--bg)}
.weave td strong{display:block;font-family:var(--font-display);color:var(--accent);margin-bottom:.3rem}
.weave .horizontal1{color:#2563eb;font-weight:600}
.orders{width:100%;border-collapse:collapse;margin:.3rem 0 1rem}
.orders th{text-align:left;font-family:var(--font-display);font-weight:500;font-size:.85rem;color:var(--bg);background:var(--accent);padding:.5rem .8rem}
.orders td{padding:.55rem .8rem;border-bottom:1px solid var(--rule);color:var(--ink-mid)}
.orders tr:nth-child(even) td{background:var(--bg-2)}
.citation-box{background:var(--bg-2);padding:1rem 1.2rem;margin:1rem 0}
.series-navigation ul{margin:0 0 1rem 1.2rem}
.series-navigation li{margin-bottom:.4rem}
.chapter{max-width:1120px}.chapter .featured{padding:2rem 1.6rem}
.weave td{white-space:nowrap}
.scroll-hint{display:none;font-size:.85rem;color:var(--ink-light);margin:-.6rem 0 .8rem}
@media (max-width:640px){.weave{font-size:.8rem;line-height:1.6}.weave td{padding:.5rem .45rem}.scroll-hint{display:block}.orders td,.orders th{padding:.45rem .3rem;font-size:.8rem;letter-spacing:0}.orders th:last-child,.orders td:last-child{text-align:center}}

/* Hebrew pages (html lang=he) */
html[lang="he"] body{direction:rtl;font-family:var(--font-hebrew);font-size:1rem}
html[lang="he"] .nav-logo{font-family:var(--font-display);direction:ltr}
html[lang="he"] .nav-links a,html[lang="he"] .kicker,html[lang="he"] .label,html[lang="he"] .hero h1,html[lang="he"] .featured h2,html[lang="he"] .btn,html[lang="he"] .card h3,html[lang="he"] .card .num,html[lang="he"] .strip span,html[lang="he"] .go,html[lang="he"] .band h2,html[lang="he"] .band .kicker,html[lang="he"] .six-h,html[lang="he"] .orders th{font-family:var(--font-hebrew);letter-spacing:0;text-transform:none}
html[lang="he"] .nav-links a{font-size:.95rem}
html[lang="he"] .hero h1{font-weight:500;font-size:clamp(2.2rem,6vw,3.4rem)}
html[lang="he"] .kicker{font-size:1rem}
html[lang="he"] .label{font-size:1.3rem;font-weight:700}
html[lang="he"] .featured{border-left:1px solid var(--accent-rule);border-right:4px solid var(--accent)}
html[lang="he"] .featured h2{font-weight:700;font-size:1.35rem}
html[lang="he"] .btn{font-weight:500}
html[lang="he"] .btn-main{font-size:1.15rem}
html[lang="he"] .strip span{font-size:1rem;border-right:0;border-left:1px solid var(--rule)}
html[lang="he"] .strip span:last-child{border-left:0}
html[lang="he"] .card h3{font-size:1.1rem;font-weight:700}
html[lang="he"] .card .src{display:block;font-size:.9rem;color:var(--ink-light);margin-bottom:.5rem}
html[lang="he"] .card a,html[lang="he"] a.card{text-decoration:none;color:inherit;display:block}
html[lang="he"] a.card:hover{background:#fff}
html[lang="he"] a.card h3{color:var(--accent)}
html[lang="he"] a.card:hover h3{text-decoration:underline}
html[lang="he"] .go{font-size:1.05rem;font-weight:500}
html[lang="he"] .orders6{display:grid;grid-template-columns:auto repeat(3,minmax(0,1fr));gap:8px;margin:0 0 1.4rem;max-width:520px}
html[lang="he"] .orders6 .h{font-weight:700;color:var(--accent);text-align:center}
html[lang="he"] .orders6 .r{font-weight:700;color:var(--ink-faint);align-self:center;padding-left:.4rem}
html[lang="he"] .orders6 .c{background:var(--bg-2);border:.5px solid var(--accent-rule);padding:.6rem .7rem;text-align:center;line-height:1.35}
html[lang="he"] .orders6 .c small{display:block;color:var(--ink-light);font-size:.8rem}
html[lang="he"] .caption{font-size:.9rem;color:var(--ink-light);margin-bottom:1.3rem}
html[lang="he"] .quote figcaption{font-size:.95rem}
html[lang="he"] .footer{direction:rtl}
html[lang="he"] .chapter{max-width:1120px}
html[lang="he"] .weave td{white-space:nowrap}
@media (max-width:640px){html[lang="he"] .weave{font-size:.8rem}html[lang="he"] .weave td{padding:.5rem .45rem}html[lang="he"] .scroll-hint{display:block}}
html[lang="he"] .scroll-hint{display:none;font-size:.85rem;color:var(--ink-light);margin:-.6rem 0 .8rem}

/* SITE MENU — the same menu bar as every other page (rules copied from main.css, Oct 2026) */
header.site-header{background: linear-gradient(135deg, var(--sand) 0%, var(--sand-2) 100%);
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 1000;
    max-height: 80px;
    overflow: visible;}
@media (max-width: 1024px){
header.site-header{background: transparent !important;
        box-shadow: none !important;
        position: fixed !important;
        top: 10px;
        right: 10px;
        left: auto;
        width: auto;
        z-index: 1000;
        max-height: none;
        overflow: visible;}
}
.nav-row{display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 0.75rem;
    max-width: 1200px;
    margin: 0 auto;}
.nav-brand{font-weight: 600;
    font-size: 1.1rem;
    color: var(--ink);}
.nav-toggle{display: none;
    background: none;
    border: none;
    color: var(--ink);
    font-size: 1.6rem;
    cursor: pointer;
    padding: 0.25rem 0.5rem;
    line-height: 1;}
.nav-menu{list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 0.25rem;
    align-items: center;}
.nav-menu > li{position: relative;}
.nav-menu > li > a,
.nav-menu > li > button{display: block;
    padding: 0.75rem 1rem;
    color: var(--ink);
    text-decoration: none;
    background: none;
    border: none;
    font: inherit;
    cursor: pointer;
    white-space: nowrap;}
.nav-menu > li > a:hover,
.nav-menu > li > button:hover{background: rgba(44, 24, 16, 0.08);
    border-radius: 4px;}
.has-dropdown > button::after{content: " \25BE";
    font-size: 0.75em;
    opacity: 0.7;
    margin-inline-start: 0.25em;}
.submenu{list-style: none;
    padding: 0.4rem 0;
    margin: 0;
    background: #fff;
    color: var(--ink);
    border-radius: 4px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.2);
    min-width: 220px;
    position: absolute;
    top: 100%;
    inset-inline-start: 0;
    z-index: 1000;
    display: none;}
.submenu li a{display: block;
    padding: 0.5rem 1.25rem;
    color: var(--ink);
    text-decoration: none;
    white-space: nowrap;}
.submenu li a:hover{background: #f0ebe3;}
@media (hover: hover) and (pointer: fine){
.has-dropdown:hover .submenu{display: block;}
}
.has-dropdown.is-open > .submenu{display: block;}
@media (max-width: 768px), (max-height: 500px){
.nav-toggle{display: block;}
.nav-menu{display: none;
        position: fixed;
        inset-inline-start: 0;
        top: var(--site-header-height, 60px);
        width: 100vw;
        max-width: 100vw;
        max-height: calc(100vh - var(--site-header-height, 60px));
        overflow-y: auto;
        flex-direction: column;
        background: linear-gradient(135deg, var(--sand) 0%, var(--sand-2) 100%);
        padding: 0.5rem 0;
        z-index: 999;
        box-shadow: 0 4px 8px rgba(0,0,0,0.15);}
.nav-menu.is-open-menu{display: flex;}
.nav-menu > li{position: static;
        width: 100%;}
.nav-menu > li > a,
    .nav-menu > li > button{width: 100%;
        text-align: start;
        padding: 0.85rem 0.9rem;}
.submenu{position: static;
        background: rgba(44, 24, 16, 0.08);
        box-shadow: none;
        border-radius: 0;
        min-width: 0;
        padding: 0;
        color: var(--ink);}
.submenu li a{padding-inline-start: 2rem;
        padding-inline-end: 0.9rem;
        white-space: normal;
        word-break: keep-all;
        overflow-wrap: normal;}
.nav-row{max-width: none;
        padding: 0.5rem 0.75rem;}
}
@media (min-width: 1300px){
.site-header{font-size: 16px;}
.nav-row{padding: 8px 12px;}
.nav-brand{font-size: 17.6px;}
.nav-menu{gap: 4px;}
.nav-menu > li > a, .nav-menu > li > button{padding: 12px 16px;}
.submenu{padding: 6.4px 0;}
.submenu li a{padding: 8px 20px;}
}
header.site-header{background: var(--bar); box-shadow: 0 2px 8px rgba(0,0,0,.15); max-height: none;}
.nav-row{padding: 8px 12px;}
.nav-brand{font-family: var(--font-display); font-size: 17.6px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--on-bar);}
.nav-menu{gap: 4px;}
.nav-menu > li > a, .nav-menu > li > button{font-family: var(--font-display); text-transform: uppercase; letter-spacing: .06em;
  font-size: 13.5px; color: var(--on-bar); opacity: .93; padding: 12px 11px;}
html[lang="he"] .nav-menu > li > a, html[lang="he"] .nav-menu > li > button{font-family: var(--font-hebrew); font-size: 16px; letter-spacing: 0;}
.nav-menu > li > a:hover, .nav-menu > li > button:hover{background: rgba(250,246,238,.12); opacity: 1;}
.has-dropdown > button::after{color: var(--on-bar);}
.nav-toggle{color: var(--on-bar);}
.submenu{padding: 6px 0;}
.submenu li a{font-family: var(--font-text); color: var(--ink-mid); padding: 8px 20px;}
html[lang="he"] .submenu li a{font-family: var(--font-hebrew);}
@media (max-width: 1024px), (max-height: 500px){
header.site-header{background: var(--bar) !important; position: sticky !important; top: 0; left: 0; right: 0; width: auto;}
.nav-toggle{display: none;}
.nav-row{flex-direction: column; align-items: flex-start; gap: 4px;}
.nav-menu, .nav-menu.is-open-menu{display: flex; position: static; flex-direction: row; flex-wrap: wrap;
    width: auto; max-width: none; max-height: none; overflow: visible;
    background: none; box-shadow: none; padding: 0;}
.nav-menu > li{width: auto;}
.nav-menu > li > a, .nav-menu > li > button{width: auto; padding: 5px 9px; font-size: 13px; line-height: 1.4;}
html[lang="he"] .nav-menu > li > a, html[lang="he"] .nav-menu > li > button{font-size: 15px;}
.has-dropdown.is-open{flex-basis: 100%;}
.submenu{background: rgba(250,246,238,.95);}
}