/* עמוד "בקרוב" עם טיימר (עדי, 9.10): בלי ברווז, רחוק ממראה האתר. ביצה מונפשת, "משהו בוקע פה בעוד...", וספירה משמאל לימין.
   גרסה כהה כברירת מחדל; <body data-v="light"> מחליף לבהירה */
@font-face { font-family: 'Futurism'; src: url(../fonts/Futurism-Light.woff2) format('woff2'); font-weight: 300; }
@font-face { font-family: 'Futurism'; src: url(../fonts/Futurism-Bold.woff2) format('woff2'); font-weight: 700; }
:root { --ink: #FCFCFC; --bg: #3D3D3B; --y: #FCC402; --line: rgba(252,252,252,.35); --egg: #FCC402; --lead: #FCC402; --u: min(calc(min(100vw, 2560px) / 1325), calc(100svh / 760));   /* גם לפי הגובה, כדי שבמסך רחב ונמוך הביצה לא תעלה על הלוגו */ }
body[data-v="light"] { --ink: #3D3D3B; --bg: #FCFCFC; --line: #3D3D3B; --egg: #3D3D3B; --lead: #3D3D3B; }
* { box-sizing: border-box; margin: 0; }
body { background: var(--bg); color: var(--ink); font-family: 'Futurism', Arial, sans-serif; font-weight: 300; }
.pg { min-height: 100svh; display: grid; grid-template-rows: auto 1fr auto; justify-items: center; padding: calc(50 * var(--u)); overflow: hidden; }
.logo img { width: calc(150 * var(--u)); display: block; }
body:not([data-v="light"]) .logo img { filter: brightness(0) invert(1); }
.mid { position: relative; top: calc(-45 * var(--u)); align-self: center; display: grid; justify-items: center; gap: calc(25 * var(--u)); text-align: center; }

/* הביצה: אותו קו דק; החצי העליון נפתח ונסגר, וכל הביצה מתנדנדת */
.egg { width: calc(130 * var(--u)); margin-top: 0; height: auto; color: var(--egg); overflow: visible; transform-origin: 50% 92%; animation: wob 5s ease-in-out infinite; }
.egg * { fill: none; stroke: currentColor; stroke-width: .3; stroke-linecap: round; stroke-linejoin: round; }
.egg .top { transform-box: view-box; transform-origin: 20% 50%; animation: lid 5s ease-in-out infinite; }
@keyframes wob { 0%, 30%, 100% { transform: rotate(0); } 36% { transform: rotate(-8deg); } 44% { transform: rotate(6deg); } 52% { transform: rotate(-3deg); } 58% { transform: rotate(0); } }
@keyframes lid { 0%, 58%, 100% { transform: none; } 68%, 86% { transform: translateY(-1.6px) rotate(-9deg); } }
body[data-open] .egg, body[data-open] .egg .top { animation: none; }
body[data-open] .egg .top { transform: translateY(-1.6px) rotate(-9deg); }

.lead { font-size: calc(50 * var(--u) * var(--a11y-fs, 1)); line-height: 1.2; color: var(--lead); font-weight: 700; }

/* הטיימר: שורה אחת במסגרת דקה, נקודתיים בין היחידות */
.count { display: flex; direction: ltr;   /* מספרים תמיד משמאל לימין: ימים, שעות, דקות, שניות */ align-items: flex-start; border: 1px solid var(--line); border-radius: 999px; padding: calc(25 * var(--u)) calc(50 * var(--u)); }
.count div { display: grid; justify-items: center; gap: calc(5 * var(--u)); min-width: calc(130 * var(--u)); }
.count b { font-weight: 700; font-size: calc(90 * var(--u) * var(--a11y-fs, 1)); line-height: 1; font-variant-numeric: tabular-nums; direction: ltr; }
.count span { font-size: calc(25 * var(--u) * var(--a11y-fs, 1)); }
.count i { font-style: normal; font-weight: 700; font-size: calc(90 * var(--u) * var(--a11y-fs, 1)); line-height: .9; color: var(--y); animation: blink 1s steps(1) infinite; }
@keyframes blink { 50% { opacity: .25; } }
body[data-open] .count i { animation: none; }

.contact { display: flex; gap: calc(150 * var(--u)); font-size: calc(25 * var(--u) * var(--a11y-fs, 1)); direction: ltr; }
.contact a { display: inline-flex; align-items: center; gap: calc(12 * var(--u)); }
.contact img { width: calc(25 * var(--u)); height: calc(25 * var(--u)); }
body:not([data-v="light"]) .contact img { filter: brightness(0) invert(1); }
.contact a { color: inherit; text-decoration: none; }
@media (prefers-reduced-motion: reduce) { .egg, .egg .top, .count i { animation: none !important; } }
html.a11y-still .egg, html.a11y-still .egg .top, html.a11y-still .count i { animation: none !important; }
@media (max-width: 1024px) and (orientation: portrait), (max-width: 767px) {
  .mid { top: 0; }
  :root { --u: calc(100vw / 390); }
  .pg { padding: calc(25 * var(--u)) calc(25 * var(--u)) calc(50 * var(--u)); }
  .logo img { width: calc(100 * var(--u)); }
  .egg { width: calc(95 * var(--u)); margin-top: 0; }
  .contact img { width: calc(20 * var(--u)); height: calc(20 * var(--u)); }
  .lead { font-size: calc(24 * var(--u) * var(--a11y-fs, 1)); }
  .count { padding: calc(15 * var(--u)) calc(20 * var(--u)); }
  .count div { min-width: calc(62 * var(--u)); gap: calc(5 * var(--u)); }
  .count b, .count i { font-size: calc(40 * var(--u) * var(--a11y-fs, 1)); } .count span { font-size: calc(16 * var(--u) * var(--a11y-fs, 1)); }
  .contact { flex-direction: column; gap: calc(10 * var(--u)); font-size: calc(20 * var(--u) * var(--a11y-fs, 1)); align-items: center; }
}
/* הגרסה הבהירה: קו הביצה כהה, האור שבפנים נשאר צהוב */
.contact a:focus-visible, .logo:focus-visible { outline: 2px solid var(--y); outline-offset: 3px; }
.float-btns { position: fixed; z-index: 50; left: 20px; bottom: 20px; }
.float-btn { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--line); cursor: pointer; box-shadow: 0 4px 14px rgba(0,0,0,.12); background: #3D3D3B; color: #fff; }
.float-btn svg { width: 52%; height: 52%; }
@media (max-width: 1024px) and (orientation: portrait), (max-width: 767px) { .pg { padding-bottom: calc(90 * var(--u)); } }   /* מקום לכפתור הנגישות מתחת לפרטי הקשר */


/* הביצה (בחירת עדי, 9.10): צהובה מלאה עם קו כהה */
body[data-v="light"] .egg path { fill: var(--y); }