/* YANIV PERETZ LAW FIRM — draft B: "מגזין לילה" — 3.11.2026
   Night palette of the original draft + the editorial language of the article series.
   Loaded after style.css with <body class="mag">. */
@import url('https://fonts.googleapis.com/css2?family=Frank+Ruhl+Libre:wght@400;500;700;900&family=Heebo:wght@300;400;500;700&display=swap');

body.mag{
  --font-display:'Frank Ruhl Libre',Georgia,serif;
  --font-body:'Heebo',system-ui,sans-serif;
  --gold:#F2B33D; --navy:#0E2440; --link:#8FD3F5;
  font-size:18px;line-height:1.7
}
body.mag h1,body.mag h2,body.mag h3{font-family:var(--font-display);font-weight:700;letter-spacing:0}
body.mag .hero h1,body.mag .page-hero h1{font-weight:900;line-height:1.06;letter-spacing:-.01em}
body.mag .site-header{border-bottom:2px solid var(--gold)}
body.mag .site-header .brand{flex:none}
body.mag .brand span{font-weight:700;white-space:nowrap}
body.mag .site-header .stamp{flex:none;margin-inline-start:12px;font-family:var(--font-body)}
@media (max-width:1480px){body.mag .site-header .stamp{display:none}}
@media (max-width:1400px){body.mag .site-header .wrap{gap:18px}body.mag .nav a{padding-inline:8px}}
body.mag .sec-head{border-top:2px solid rgba(238,242,248,.55);padding-top:14px}
body.mag .sec-head h2{font-size:clamp(1.9rem,3.6vw,2.9rem)}
body.mag .tag{font-family:var(--font-body);font-weight:700;letter-spacing:.12em;color:var(--gold)}
body.mag .stat b,body.mag .minigrid b,body.mag .facts b,body.mag .courts li b{font-weight:900}
body.mag .svc,body.mag .step,body.mag .clip{border-radius:0}

/* ---- guides & articles: dark magazine page instead of the cream sheet ---- */
body.mag.paper{background:var(--ink);color:var(--text)}
body.mag.paper ::selection{background:var(--gold);color:var(--ink)}
body.mag.paper .site-header{background:linear-gradient(to bottom,rgba(7,11,20,.94),rgba(7,11,20,.8))}
body.mag.paper .page-hero{min-height:52vh}
body.mag.paper .page-hero .hero-veil{background:linear-gradient(to top,var(--ink) 4%,rgba(7,11,20,.6) 60%,rgba(7,11,20,.4))}
body.mag .prose article,body.mag.paper .prose article{background:var(--ink-2);border:1px solid var(--rule);border-top:4px solid var(--gold);box-shadow:none;border-radius:0;padding:clamp(26px,4vw,52px) clamp(20px,3.4vw,48px);font-family:var(--font-body);font-size:1.08rem;line-height:1.85;color:var(--text)}
body.mag.paper .prose article::before{display:none}
body.mag .prose article p,body.mag.paper .prose article p,body.mag.paper .longform p{color:var(--text-2);max-width:68ch}
body.mag .prose article h2,body.mag.paper .prose article h2{font-family:var(--font-display);font-weight:700;font-size:clamp(1.5rem,2.4vw,1.95rem);color:var(--text);text-decoration:none;margin:44px 0 12px;padding-top:14px;border-top:1px solid var(--rule)}
body.mag .prose article h3,body.mag.paper .prose article h3{font-family:var(--font-display);color:var(--text)}
body.mag .prose article a,body.mag.paper .prose article a{color:var(--link);text-decoration-color:rgba(143,211,245,.45)}
body.mag.paper .prose article blockquote{background:var(--ink-3);border-inline-start:3px solid var(--gold);color:var(--text)}
body.mag.paper .list-check li{color:var(--text-2);border-color:var(--rule)}
body.mag.paper .list-check li::before{background:var(--gold)}
body.mag.paper details{border-color:var(--rule)}
body.mag.paper summary{color:var(--text)}
body.mag.paper summary::after{color:var(--gold)}
body.mag.paper details p{color:var(--text-2)}
body.mag.paper .note,body.mag.paper .longform .note,body.mag .note{background:var(--ink-3);color:var(--text-2)}
body.mag.paper .longform .indent{border-color:var(--rule)}
body.mag.paper .aside .card-call{background:var(--ink-2);border-color:var(--rule)}
body.mag.paper .aside .card-call p{color:var(--text-2)}
body.mag.paper footer{border-top-color:var(--rule);color:var(--text-3)}
body.mag.paper footer a{color:var(--text-2)}
body.mag.paper footer .foot-brand{color:var(--text)}
body.mag.paper footer .legal{border-top-color:var(--rule)}
body.mag.paper .social a{border-color:var(--rule);color:var(--text-2)}
body.mag.paper .a11y-btn{background:var(--glass)}
@media (max-width:900px){body.mag.paper .prose{margin-top:0}body.mag .prose article,body.mag.paper .prose article{padding:26px 18px}}

/* drop cap after the answer box + CTA */
body.mag .longform>.inline-cta+p::first-letter,
body.mag .longform>.inline-cta+*+p::first-letter{font-family:var(--font-display);font-weight:900;float:right;font-size:3.6em;line-height:.85;margin:.06em 0 0 .12em;color:var(--gold)}

/* answer box + inline CTA */
body.mag .answer-box,body.mag.paper .answer-box{background:rgba(242,179,61,.07);border:0;border-inline-start:4px solid var(--gold);border-radius:0}
body.mag .answer-box h2,body.mag.paper .answer-box h2{font-family:var(--font-display)!important;color:var(--text)!important;border:0!important;padding:0!important;margin:0 0 8px!important;font-size:1.3rem!important}
body.mag .answer-box p,body.mag.paper .answer-box p{color:var(--text-2)!important}
body.mag .inline-cta,body.mag.paper .inline-cta{background:var(--navy);border:1px solid var(--rule);border-radius:0}
body.mag .inline-cta p,body.mag.paper .inline-cta p{color:var(--text)!important}
body.mag .prose article .inline-cta a.btn-amber{color:var(--ink)}
body.mag .prose article .inline-cta a.btn-ghost{color:var(--text)}

/* pull quote */
.pull{margin:38px 0;padding:22px 0 18px;border-top:3px solid var(--gold);border-bottom:1px solid var(--rule)}
.pull p{font-family:var(--font-display)!important;font-weight:700;font-size:clamp(1.45rem,2.6vw,2.05rem)!important;line-height:1.35!important;color:var(--text)!important;margin:0!important;max-width:none!important}
.pull p::before{content:"״";color:var(--gold);margin-inline-end:.08em}
.pull cite{display:block;margin-top:10px;font-style:normal;font-size:.85rem;color:var(--text-3)}

/* "לוח המשחק" */
.gameboard{margin:40px 0;background:var(--ink);border:1px solid var(--rule);border-top:4px solid var(--gold);padding:24px clamp(18px,3vw,30px)}
.gameboard .gb-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 16px;margin-bottom:6px}
.gameboard h2{margin:0!important;padding:0!important;border:0!important;font-size:1.5rem!important}
.gameboard .gb-note{font-size:.82rem;color:var(--text-3)}
.gameboard>p{margin:6px 0 16px!important;color:var(--text-2)!important}
.gb-players{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:0 0 16px;padding:0;list-style:none}
.gb-players li{background:var(--ink-3);border:1px solid var(--rule);padding:14px 16px;font-size:.95rem;line-height:1.55;color:var(--text-2)}
.gb-players li b{display:block;font-family:var(--font-display);font-size:1.12rem;margin-bottom:4px;color:var(--text)}
.gb-players li small{display:block;color:var(--text-3);font-size:.84rem;margin-top:6px}
.gb-gap{font-size:.97rem;color:var(--text-2)!important;margin:0 0 14px!important;padding-inline-start:14px;border-inline-start:2px dashed var(--text-3)}
.gb-gap b{color:var(--text)}
.gb-move{display:flex;gap:14px;align-items:flex-start;background:var(--navy);color:var(--text);padding:16px 18px}
.gb-move .gb-mark{flex:none;font-family:var(--font-display);font-weight:900;font-size:.8rem;letter-spacing:.08em;background:var(--gold);color:var(--ink);padding:4px 8px;margin-top:3px}
.gb-move p{margin:0!important;color:var(--text)!important;max-width:none!important;font-size:1rem}
@media (max-width:700px){.gb-move{flex-direction:column;gap:8px}}
@media print{body.mag .site-header,body.mag footer,body.mag .inline-cta,body.mag .callbar{display:none}}
/* homepage: big live clock + night line (3.11.2026) */
.bigclock{display:flex;flex-direction:column;align-items:flex-start;margin-bottom:6px}
.bigclock .num{font-family:var(--font-display);font-weight:900;font-size:clamp(4.2rem,11vw,8.6rem);line-height:.9;color:#fff;letter-spacing:.02em;text-shadow:0 10px 40px rgba(0,0,0,.6)}
.bigclock small{display:inline-flex;align-items:center;gap:10px;margin-top:10px;font-size:.92rem;letter-spacing:.12em;color:var(--text-2)}
.bigclock small i{width:10px;height:10px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 6px rgba(242,179,61,.18)}
.night-line{font-family:var(--font-display);font-weight:700;font-size:clamp(1.55rem,3.1vw,2.4rem);line-height:1.2;color:#fff;margin:14px 0 22px;padding-bottom:16px;border-bottom:1px solid var(--rule)}
.night-line b{color:var(--gold)}
body.mag .hero-copy h1{font-size:clamp(2rem,4.2vw,3.4rem)}
@media (prefers-reduced-motion:reduce){.bigclock small i{box-shadow:none}}

/* ===== הלילה + סירנה: שטיפת אור כחול-אדום איטית בפתיחה (ללא הבהוב; מחזור 6 שניות) ===== */
.hero .siren-wash{position:absolute;inset:0;z-index:-1;pointer-events:none;mix-blend-mode:screen;
  background:radial-gradient(55% 80% at 0% 55%,rgba(224,40,40,.55),transparent 62%),radial-gradient(55% 80% at 100% 45%,rgba(40,110,255,.42),transparent 62%);
  animation:sirenWash 6s ease-in-out infinite alternate}
@keyframes sirenWash{from{opacity:.18;transform:translateX(-3%)}to{opacity:.7;transform:translateX(3%)}}
.hero.siren-off .siren-wash{animation:none;opacity:0;transition:opacity .6s}
.siren-toggle{position:absolute;top:18px;inset-inline-end:18px;z-index:2;background:rgba(7,11,20,.72);color:#EEF2F8;border:1px solid rgba(255,255,255,.28);border-radius:999px;padding:8px 14px;font:inherit;font-size:.85rem;cursor:pointer}
.siren-toggle:hover{border-color:#F2B33D;color:#F2B33D}
@media (prefers-reduced-motion:reduce){.hero .siren-wash{animation:none;opacity:.3}}
html.a11y-motion .hero .siren-wash{animation:none;opacity:.3}
@media (max-width:900px){.siren-toggle{top:12px}}
/* ===== מספרים רצים בלבד ===== */
.runstrip{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:40px 0 6px;border-block:1px solid rgba(43,168,230,.22)}
.runstrip div{padding:22px 16px;border-inline-start:1px solid rgba(43,168,230,.22);text-align:center}
.runstrip div:first-child{border-inline-start:0}
.runstrip b{display:block;font-family:'Frank Ruhl Libre',serif;font-weight:700;font-size:clamp(2.2rem,4.6vw,3.4rem);color:#F2B33D;line-height:1}
.runstrip span{display:block;margin-top:6px;color:#B9C4D6;font-weight:600}
.runsource{font-size:.85rem;color:#8A98B0;text-align:center;margin:0}

/* ===== שעון ממוסגר ===== */
.bigclock.framed{display:inline-flex;flex-direction:column;align-items:center;gap:6px;padding:18px 34px 14px;border:2px solid #F2B33D;border-radius:6px;background:rgba(7,11,20,.55);box-shadow:0 0 0 6px rgba(242,179,61,.10),0 20px 50px -20px rgba(0,0,0,.8);margin-bottom:22px}
.bigclock.framed .clock-cap{font-size:.9rem;letter-spacing:.18em;color:#F2B33D;font-weight:600;margin:0}
.bigclock.framed .num{font-size:clamp(3.6rem,8vw,6.2rem);line-height:1;color:#FFFFFF;font-variant-numeric:tabular-nums}

/* 3.11 – white text legibility: heavier weight, brighter tone, soft halo over images */
body.mag{--text:#FFFFFF;--text-2:#E4EAF3;--text-3:#BCC7D8}
body.mag p,body.mag li,body.mag dd,body.mag figcaption,body.mag .lede,body.mag details p{font-weight:500}
body.mag .step p,body.mag .sec-head p,body.mag .hero-copy .lede{color:#F1F4F9!important;font-weight:500}
body.mag .hero p,body.mag .hero .lede,body.mag .hero h1,body.mag .night-line{text-shadow:0 1px 2px rgba(0,0,0,.85),0 0 18px rgba(0,0,0,.55)}
body.mag .nav a{color:#E9EEF6;font-weight:700}
body.mag footer,body.mag footer a{color:#D5DDE9}

/* 3.11b – hero centred, larger headline; larger paginated press band */
body.mag .hero-copy{text-align:center}
body.mag .hero-copy .lede{margin-inline:auto}
body.mag .hero-copy .actions{justify-content:center}
body.mag .hero-copy .night-line{margin-inline:auto}
body.mag .hero-copy h1{font-size:clamp(2.2rem,3.9vw,3.7rem);line-height:1.1}
body.mag .hero-copy h1 span:first-child{white-space:nowrap}
@media (max-width:520px){body.mag .hero-copy h1 span:first-child{white-space:normal}}
body.mag .hero-copy h1 .hot{font-size:.74em;margin-top:.16em}
body.mag .hero-copy h1 .tail{display:block;font-size:.62em;color:#fff;margin-top:.18em}
.pressband .wrap{max-width:1380px}
.pressband .clips-row{grid-template-columns:repeat(3,1fr);gap:22px}
.pressband .clip{aspect-ratio:4/3}
.pressband .clip-outlet{font-size:1rem;padding:7px 14px}
.clip-page[hidden]{display:none}
.clip-pager{display:flex;justify-content:center;gap:10px;margin-top:26px}
.clip-pager[hidden]{display:none}
.clip-pager button{min-width:46px;height:46px;border:1px solid var(--rule);background:var(--ink-3);color:#fff;font:700 1.05rem var(--font-body);cursor:pointer}
.clip-pager button[aria-current="true"]{background:#F2B33D;color:#070B14;border-color:#F2B33D}
.clip-pager button:focus-visible{outline:3px solid #F2B33D;outline-offset:3px}
@media (max-width:820px){.pressband .clips-row{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.pressband .clips-row{grid-template-columns:1fr}}

/* 3.11c – hero creed, orange/white headings, 2-up press band */
body.mag .hero-copy h1 .tail em{font-style:normal;color:#F2B33D}
body.mag .hero-copy .creed{display:flex;flex-direction:column;gap:6px;margin:-12px auto 26px;font-family:var(--font-display);font-weight:700;font-size:clamp(1.05rem,1.6vw,1.3rem);color:#fff;line-height:1.35;text-shadow:0 1px 2px rgba(0,0,0,.85)}
body.mag .hero-copy .creed b{color:#F2B33D}
body.mag .hl{color:#F2B33D}
body.mag .flag .tag b{color:#F2B33D;font-weight:800}
.pressband .clips-row{grid-template-columns:repeat(2,1fr);gap:26px}
.pressband .clip{aspect-ratio:3/2}
.clip-pager{align-items:center}
.clip-pager button{padding:0 18px}
.clip-pager button:disabled{opacity:.35;cursor:default}
.clip-pager .pg-count{min-width:84px;text-align:center;color:#fff;font-weight:700;font-size:1.05rem}
.clip-pager .pg-count b{color:#F2B33D}
@media (max-width:620px){.pressband .clips-row{grid-template-columns:1fr}}

/* 3.11d – vertical timeline for long copy */
body.mag .timeline{grid-template-columns:1fr;padding-inline-start:38px;max-width:920px}
body.mag .timeline::before{inset-inline:auto;inset-inline-start:6px;top:0;bottom:0;width:1px;height:auto}
body.mag .step{padding:0 0 46px}
body.mag .step::before{top:5px;inset-inline-start:-38px}
body.mag .step h3{font-size:clamp(1.35rem,2.2vw,1.7rem)}
body.mag .step p{font-size:1.07rem;line-height:1.8;max-width:72ch}

/* 3.11e – dynamic hero: rotating scenes + lightning */
body.mag .night-line .scn{display:inline;color:#fff;font-weight:500;transition:opacity .45s ease,transform .45s ease;display:inline-block}
body.mag .night-line .scn.out{opacity:0;transform:translateY(8px)}
body.mag .night-line b{display:block;margin-top:8px;font-size:.82em}
body.mag .bigclock.framed .num{min-width:7.2ch;text-align:center}
.hero .bolt{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;mix-blend-mode:screen;
  background:radial-gradient(60% 45% at 70% 8%,rgba(210,230,255,.75),rgba(120,170,255,.25) 45%,transparent 70%)}
.hero .bolt.go{animation:bolt 1.1s ease-out 1}
@keyframes bolt{0%{opacity:0}6%{opacity:.55}12%{opacity:.05}22%{opacity:.35}40%{opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.hero .bolt{display:none}body.mag .night-line .scn{transition:none}}
html.a11y-motion .hero .bolt{display:none}
.hero.siren-off .bolt{display:none}

/* 3.11f – radio-static on running numbers */
body.mag .stat{position:relative}
body.mag .stat.in::after{content:"";position:absolute;inset:-8px;pointer-events:none;mix-blend-mode:screen;
  background:repeating-linear-gradient(0deg,rgba(220,235,255,.10) 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,rgba(242,179,61,.06) 0 2px,transparent 2px 7px);
  animation:radioStatic 1s steps(7) 1 forwards}
body.mag .stat.in .num{animation:radioTxt 1s steps(6) 1}
@keyframes radioStatic{0%{opacity:.95;transform:translateX(-3px)}15%{transform:translateX(3px)}30%{opacity:.7;transform:translateX(-2px)}55%{opacity:.4;transform:translateX(1px)}80%{opacity:.15}100%{opacity:0;transform:none}}
@keyframes radioTxt{0%{text-shadow:-3px 0 rgba(224,40,40,.8),3px 0 rgba(40,110,255,.8);filter:blur(1px)}40%{text-shadow:2px 0 rgba(224,40,40,.6),-2px 0 rgba(40,110,255,.6);filter:blur(.4px)}100%{text-shadow:none;filter:none}}
@media (prefers-reduced-motion:reduce){body.mag .stat.in::after{display:none}body.mag .stat.in .num{animation:none}}
html.a11y-motion body.mag .stat.in::after{display:none}
html.a11y-motion body.mag .stat.in .num{animation:none}

/* 3.11g – hero line colours: day-part orange, scenario white, closing gold with prominent "אני לצידך" */
body.mag .night-line [data-daypart]{color:#F2B33D}
body.mag .night-line .scn{color:#fff}
body.mag .night-line b.beside{color:#F2B33D;font-size:.8em;margin-top:10px}
body.mag .night-line b.beside strong{display:block;font-size:1.55em;font-weight:900;line-height:1.1;color:#F2B33D;letter-spacing:.01em;text-shadow:0 0 1px rgba(0,0,0,.9),0 2px 18px rgba(0,0,0,.7)}

/* 3.11h – only "אני לצידך" in orange; the rest of the closing line light */
body.mag .night-line b.beside{color:#F1F4F9;font-weight:600}
body.mag .night-line b.beside strong{color:#F2B33D}

/* 3.11i – colour rule: white = the situation, orange = my answer */
body.mag .night-line [data-daypart]{color:#C9D3E2;font-weight:500;font-size:.82em;display:block}
body.mag .night-line .scn{color:#fff;font-weight:700}
body.mag .hero-copy h1 .hot{color:#fff}
body.mag .hero-copy h1 .hot em{font-style:normal;color:#F2B33D}
body.mag .hero-copy h1 .tail{color:#fff}
body.mag .hero-copy h1 .tail em{color:#F2B33D}