/* ==========================================================================
   פה ושם: השפה הגרפית של הלוגו (v6.3)
   נטען אחרון. צבעי הלוגו (כחול כהה, כחול, תכלת), גופן מעוגל ועבה כמו בלוגו,
   רקע קרם בהיר מאוד, הלוגו העברי באתר בעברית והאנגלי באתר באנגלית.
   ========================================================================== */
:root {
  --navy: #0a1c4f;
  --blue: #1458e8;
  --blue-hover: #0b35b5;
  --royal: #0b35b5;
  --sky: #3cb6f0;
  --sky-soft: #e8f3fd;
  --ink: #0d0d0f;
  --cream: #fdfcf8;

  --primary: var(--navy);
  --primary-light: var(--blue);
  --primary-dark: var(--navy);
  --accent: var(--blue);
  --accent-hover: var(--blue-hover);
  --gold-carto: var(--sky);
  --sand: var(--sky-soft);
  --bg-main: var(--cream);
  --text-main: #0d1b2e;
  --text-muted: #4f5d70;
  --border: #e6e8ec;
  --border-delicate: #eef0f3;

  --font-serif: 'Fredoka', 'Rubik', 'Assistant', system-ui, sans-serif;
  --font-carto: 'Fredoka', 'Rubik', system-ui, sans-serif;
  --font-hebrew: 'Rubik', 'Assistant', system-ui, -apple-system, sans-serif;
  --font-english: 'Rubik', 'Inter', system-ui, -apple-system, sans-serif;
  --shadow-card: 0 1px 2px rgba(6, 23, 46, .05), 0 6px 18px -10px rgba(6, 23, 46, .16);
  --shadow-lift: 0 2px 4px rgba(6, 23, 46, .06), 0 16px 30px -14px rgba(6, 23, 46, .24);
}

body { background-color: var(--cream); background-image: none; font-family: var(--font-hebrew); color: var(--text-main); }
html[lang="en"] body { font-family: var(--font-english); }

/* headings: the logo's rounded, heavy letterforms */
h1, h2, h3, .section-title, .hero-title, .modal-title, .tour-title, .article-title { font-family: var(--font-serif); letter-spacing: 0; }
.section-title, .hero-title { font-weight: 700; color: var(--navy); }
.hero-title .highlight { background: none; -webkit-background-clip: border-box; background-clip: border-box; -webkit-text-fill-color: var(--blue); color: var(--blue); }

/* section ornament: the light-blue rule under the logo */
.section-title::after { width: 64px; height: 5px; border-radius: 999px; background: var(--sky); margin-top: .65rem; }

/* ---------- header: the real logo, per language ---------- */
.header { background: rgba(253, 252, 248, .94); }
.brand { gap: 0; }
.brand-logo { display: block; height: 44px; width: auto; }
html[lang="en"] .brand-logo-he, html:not([lang="en"]) .brand-logo-en { display: none !important; }
.nav-link:hover, .nav-link.active { background: var(--sky-soft); color: var(--blue); }
.lang-btn { color: var(--navy); }
.btn-outline { border-color: #cfd6df; color: var(--navy); }
.btn-outline:hover { background: #fff; border-color: var(--sky); }
:focus-visible { outline-color: var(--sky); }
@media (max-width: 980px) { .brand-logo { height: 38px; } }

/* ---------- hero: cream, a touch of sky ---------- */
.hero { background: var(--cream); }
.hero::before { background-image: radial-gradient(circle at 82% 18%, rgba(71, 150, 200, .10) 0%, transparent 42%), radial-gradient(circle at 12% 88%, rgba(7, 82, 173, .05) 0%, transparent 40%); }
.hero-badge, .hero-badges span, .about-badge { background: #fff; border-color: var(--border); color: var(--navy); }

/* cards and surfaces stay white on the cream page */
.tour-card, .article-card, .review-card, .about-card, .shop-card, .modal-card { background: #fff; }

/* ---------- footer: navy with the light logo ---------- */
.footer { background: var(--navy); }
.footer-brand img { display: block; height: 78px; width: auto; margin-bottom: .9rem; }
.footer-contact, .footer-note { color: #b9c6d6; }
.footer-contact a { color: #eef3f9; text-decoration-color: rgba(238, 243, 249, .35); }
.footer-cta { background: var(--blue); }
.footer-cta:hover { background: #0a63cf; }
.footer-title { color: #fff; }
.footer-links a { color: #c9d4e2; }
.footer-links a:hover { color: #fff; }

/* misc accents that used warm tones */
.filter-btn.active, .filter-btn[aria-pressed="true"] { background: var(--navy); border-color: var(--navy); color: #fff; }
.region-card.region-empty .pin-tour-badge { background: #eef1f5; }
::selection { background: rgba(71, 150, 200, .25); }
html[lang="en"] .footer-brand .brand-logo-he, html:not([lang="en"]) .footer-brand .brand-logo-en { display: none; }

/* ---------- region description above the tours (regions.js) ---------- */
.region-intro { max-width: 860px; margin: 0 auto 2rem; padding: 1.4rem 1.6rem 1.2rem; background: #fff; border: 1px solid var(--border); border-inline-start: 5px solid var(--sky); border-radius: 14px; box-shadow: var(--shadow-card); }
.region-intro-title { font-family: var(--font-serif); font-size: 1.45rem; font-weight: 700; color: var(--blue); margin: 0 0 .6rem; }
.region-intro p { font-size: 1.02rem; line-height: 1.8; color: var(--text-main); text-align: justify; hyphens: auto; margin: 0; }
.region-intro p + p { margin-top: .75rem; }
@media (max-width: 640px) { .region-intro { padding: 1.1rem 1.1rem 1rem; } .region-intro p { text-align: start; font-size: .98rem; } }

/* hero card with no photos yet: show the logo */
.slideshow-empty { aspect-ratio: 4 / 3; display: grid; place-items: center; background: radial-gradient(circle at 70% 25%, rgba(71, 150, 200, .14), transparent 55%), var(--cream); border-radius: 3px; }
.slideshow-empty img { width: 78%; height: auto; }
.guide-slideshow-wrap .slideshow-empty { width: 100%; height: 100%; aspect-ratio: auto; }

/* ---------- portrait photos: whole photo on a blurred copy of itself (media-fit.js) ---------- */
.has-portrait { overflow: hidden; isolation: isolate; }
.has-portrait:not(.slideshow-slide) { position: relative; }
.has-portrait::before {
  content: ''; position: absolute; inset: -24px; z-index: 0; pointer-events: none;
  background: var(--fit-bg) center / cover no-repeat; filter: blur(22px) saturate(1.1) brightness(.82); transform: scale(1.08);
}
img.is-portrait { position: relative; z-index: 1; object-fit: contain !important; }
.tour-card:hover img.is-portrait { transform: scale(1.02); }
.meeting-note { display: block; margin-top: .25rem; font-size: .8rem; font-weight: 500; color: var(--text-muted); }

/* full tour description in the tour window */
.tour-full-desc { margin: 1rem 0 1.25rem; font-size: 1rem; line-height: 1.8; color: var(--text-main); }
.tour-full-desc p { margin: 0; text-align: justify; hyphens: auto; }
.tour-full-desc p + p { margin-top: .7rem; }
@media (max-width: 640px) { .tour-full-desc p { text-align: start; } }


/* ==========================================================================
   v7.0: הלוגו החדש. גל כחול במקום קו ישר מתחת לכותרות, ובסרגל העליון כפתורים
   אליפטיים מכחול בהיר ועד ל"תיאום סיור" השחור. כפתור השפה צמוד ללוגו.
   ========================================================================== */
.section-title::after {
  width: 120px; height: 16px; border-radius: 0; margin-top: .4rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 22'%3E%3Cpath d='M2 19 C 50 9 120 4 198 3 C 130 8 70 12 2 19 Z' fill='%231463f5'/%3E%3Cpath d='M60 15 C 110 10 150 9 196 9' stroke='%231463f5' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}
html[dir="rtl"] .section-title::after { transform: scaleX(-1); }

.brand-logo { height: 48px; }
.navbar { gap: .55rem; }
.brand { flex-shrink: 0; }
.nav-links { gap: .32rem; }
.nav-link, .lang-btn.nav-pill, .nav-cta {
  border-radius: 999px; font-weight: 700; font-size: 1.04rem; line-height: 1; padding: .62rem 1rem; border: 0;
  transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
}
.lang-btn.nav-pill { height: auto; background: #e3f1fd; color: var(--navy); margin-inline-start: .25rem; }
.nav-links > li:nth-child(1) .nav-link { background: #cfe6fb; color: var(--navy); }
.nav-links > li:nth-child(2) .nav-link { background: #a9d2f7; color: var(--navy); }
.nav-links > li:nth-child(3) .nav-link { background: #77b4f1; color: #06123a; }
.nav-links > li:nth-child(4) .nav-link { background: #3d8ae9; color: #fff; }
.nav-links > li:nth-child(5) .nav-link { background: #1458e8; color: #fff; }
.nav-links > li:nth-child(6) .nav-link { background: #0b35b5; color: #fff; }
.nav-links > li:nth-child(7) .nav-link { background: #0a1c4f; color: #fff; }
.nav-cta, .nav-menu-cta .btn { background: var(--ink) !important; color: #fff !important; border-color: var(--ink) !important; }
.nav-link:hover, .nav-link.active, .lang-btn.nav-pill:hover, .nav-cta:hover { filter: brightness(.94); transform: translateY(-1px); box-shadow: 0 4px 10px -6px rgba(10, 28, 79, .55); }
.nav-link.active { box-shadow: inset 0 0 0 2px rgba(10, 28, 79, .35); }
@media (max-width: 1240px) {
  .nav-link, .lang-btn.nav-pill, .nav-cta { font-size: .96rem; padding: .56rem .8rem; }
  .brand-logo { height: 42px; }
}
@media (max-width: 980px) {
  .brand-logo { height: 40px; }
  .lang-btn.nav-pill { font-size: .88rem; padding: .5rem .75rem; }
  .nav-links .nav-link { font-size: 1.08rem; padding: .8rem 1rem; border-radius: 999px; margin: .15rem 0; }
}

/* v7.0: the hero photo card is 10% bigger */
.hero-card { max-width: 440px; }
@media (max-width: 1024px) { .hero-card { max-width: 572px; } }
@media (max-width: 640px) { .hero-card { max-width: none; } }

/* v7.0: mobile header keeps the language pill beside the logo */
@media (max-width: 980px) {
  .lang-btn.nav-pill { margin-inline-start: .15rem; }
  .nav-actions { margin-inline-start: auto; }
}