/* ============================================================
   LogoCraft – style.css
   Built from Shopify Liquid blocks (exact CSS translated from Liquid)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Assistant:wght@300;400;500;600;700;800;900&display=swap');

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

:root {
  --blue:       #0057e7;
  --blue-d:     #003db5;
  --blue-l:     #e0eaff;
  --navy:       #004083;
  --text:       #222222;
  --text-m:     #444;
  --text-s:     #666;
  --border:     #e0e0e0;
  --white:      #fff;
  --bg:         #f8f9fa;
  --shadow:     0 4px 20px rgba(0,0,0,.10);
  --shadow-lg:  0 8px 32px rgba(0,0,0,.14);
  --radius:     12px;
  --tr:         .3s ease;
}

html  { direction:rtl; scroll-behavior:smooth; }
body  { font-family:'Assistant',sans-serif; color:var(--text); background:#fff; overflow-x:hidden; line-height:1.6; }
img {
  max-width: 100%; display: block;
  -webkit-user-drag: none; user-drag: none;
  -webkit-user-select: none; user-select: none;
  -webkit-touch-callout: none; /* ← מבטל תפריט "שמור תמונה" במובייל */
  pointer-events: none;        /* ← מונע לחיצה ו-tooltip */
}
/* תמונות שצריכות להיות לחיצות */
a img, .logo-link img { pointer-events: auto; }

.container   { max-width:1200px; margin:0 auto; padding:0 24px; }
.text-center { text-align:center; }

.btn {
  display:inline-flex; align-items:center; gap:8px;
  padding:13px 30px; border-radius:50px;
  font-family:'Assistant',sans-serif; font-size:1rem; font-weight:700;
  cursor:pointer; text-decoration:none; border:2px solid transparent;
  transition:all var(--tr);
}
.btn-primary { background:var(--blue); color:#fff; border-color:var(--blue); }
.btn-primary:hover { background:var(--blue-d); border-color:var(--blue-d); transform:translateY(-2px); box-shadow:0 6px 20px rgba(0,123,255,.35); }
.btn-outline  { background:transparent; color:var(--blue); border-color:var(--blue); }
.btn-outline:hover  { background:var(--blue); color:#fff; transform:translateY(-2px); }

/* ══════════════════════════
   HEADER – PILL
══════════════════════════ */
.site-header {
  position:sticky; top:0; z-index:1003;
  padding:10px 16px;
  background:transparent;
  pointer-events:none;
}
.header-pill {
  max-width:1160px; margin:0 auto;
  background:rgba(255,255,255,.97);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-radius:100px;
  padding:0 24px;
  display:flex; align-items:center; justify-content:space-between;
  direction:ltr;
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 2px 24px rgba(0,0,0,.07);
  pointer-events:all;
  height:84px;
  gap:16px;
}
/* Logo + Socials */
.header-left { display:flex; align-items:center; gap:18px; flex-shrink:0; }
.logo-link { display:flex; align-items:center; text-decoration:none; flex-shrink:0; }
.logo-link img { height:68px; width:auto; }
.header-socials { display:flex; align-items:center; gap:6px; }
.header-social-icon {
  width:32px; height:32px; border-radius:50%;
  background:#f3f4f6; display:flex; align-items:center; justify-content:center;
  color:#222; font-size:.9rem; text-decoration:none;
  transition:background .2s,color .2s;
}
.header-social-icon:hover { background:#e5e7eb; color:#0057e7; }
/* Nav */
.main-nav { display:flex; align-items:center; gap:0; direction:rtl; }
.nav-item { position:relative; }
.nav-link {
  display:flex; align-items:center; padding:8px 14px;
  font-size:.95rem; font-weight:600; color:#444; text-decoration:none;
  border-radius:8px; transition:color .2s,background .2s; white-space:nowrap;
  font-family:'Assistant',sans-serif;
}
.nav-link:hover,.nav-link.active { color:var(--blue); background:var(--blue-l); }
/* Dropdown */
.nav-dropdown-menu {
  display:none; position:absolute; top:calc(100% + 8px); right:0;
  background:#fff; border-radius:14px;
  box-shadow:0 12px 40px rgba(0,0,87,.13); min-width:230px;
  padding:8px 0; z-index:2000; border:1px solid rgba(0,87,231,.08);
  direction:rtl;
}
.nav-dropdown:hover .nav-dropdown-menu { display:block; }
.nav-dropdown-item {
  display:flex; align-items:center; gap:10px;
  padding:10px 18px; color:#333; font-size:.88rem; font-weight:600;
  text-decoration:none; transition:background .15s,color .15s;
  font-family:'Assistant',sans-serif;
}
.nav-dropdown-item:hover { background:#f0f5ff; color:var(--blue); }
.nav-dropdown-item i { width:16px; text-align:center; color:var(--blue); flex-shrink:0; }
.nav-arrow { font-size:.65rem; margin-right:5px; transition:transform .2s; display:inline-block; }
.nav-dropdown:hover .nav-arrow { transform:rotate(180deg); }
.nav-dropdown-sep { height:1px; background:#edf2ff; margin:5px 0; }
/* WhatsApp + Hamburger */
.header-right { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.header-whatsapp {
  display:flex; align-items:center; gap:7px;
  font-size:.9rem; font-weight:700; color:#0057e7;
  text-decoration:none; white-space:nowrap;
  background:rgba(0,87,231,.06); border-radius:50px;
  padding:7px 14px; transition:background .2s;
}
.header-whatsapp i { color:#25D366; font-size:1rem; }
.header-whatsapp:hover { background:rgba(0,87,231,.12); }
.hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:8px; background:none; border:none; position:relative; z-index:10; }
.hamburger span { display:block; width:24px; height:2px; background:var(--text); border-radius:2px; transition:all var(--tr); transform-origin:center; }
.hamburger.is-open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.hamburger.is-open span:nth-child(2) { opacity:0; transform:scaleX(0); }
.hamburger.is-open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
.mobile-menu {
  position:fixed;
  top:80px; left:0; right:0;
  background:#fff;
  z-index:1002;
  border-radius:0 0 20px 20px;
  box-shadow:0 8px 32px rgba(0,0,0,.14);
  overflow:hidden;
  max-height:0;
  transition:max-height .35s cubic-bezier(.4,0,.2,1);
  pointer-events:none;
  /* position:relative needed for absolute close btn */
}
.mobile-menu.open { max-height:80vh; overflow-y:auto; pointer-events:auto; }
.mobile-nav-section-title {
  padding:10px 24px 4px; font-size:.75rem; font-weight:800; color:#999;
  text-transform:uppercase; letter-spacing:.8px;
}
.mobile-menu-header { display:none; }
.mobile-menu-logo { display:none; }
.mobile-menu-close { display:none; }
.mobile-nav { list-style:none; padding:8px 0 12px; direction:rtl; }
.mobile-nav > li { border-bottom:1px solid #f0f0f0; }
.mobile-nav > li:last-child { border-bottom:none; }
.mobile-nav a { display:flex; align-items:center; gap:10px; padding:15px 24px; font-size:1rem; font-weight:700; color:#222; text-decoration:none; transition:background .18s, color .18s; }
.mobile-nav i { display:none; }
.mobile-nav a:hover { background:#f4f8ff; color:#0057e7; }
.mobile-nav a.active-link { color:#0057e7; font-weight:800; }
#menu-overlay { display:none; position:fixed; top:80px; left:0; right:0; bottom:0; background:rgba(0,0,0,.1); z-index:1001; opacity:0; transition:opacity .35s; cursor:pointer; }

/* ══════════════════════════
   BLOCK: ai_gen_block_1a93aef – HERO
   bg_top_color=#007bff 50% / bg_bottom_color=#fff 50%
   heading_font=serif, heading_size_desktop=56px, heading_color=#004083
   section_padding_top_desktop=80px, section_padding_bottom_desktop=80px
   scroll_speed=30s, image_width_desktop=400, image_height_desktop=280
══════════════════════════ */
.hero-section {
  position:relative;
  background:#ffffff;
  padding-top:80px; padding-bottom:80px;
}
.hero-bg-top {
  position:absolute; top:0; left:0; right:0; height:50%;
  background:#ffffff; z-index:0;
}
.hero-bg-bottom {
  position:absolute; bottom:0; left:0; right:0; height:50%;
  background:#ffffff; z-index:0;
}
.hero-content {
  position:relative; z-index:1; text-align:center;
  margin-bottom:60px;
}
.hero-title {
  font-family:Georgia,"Times New Roman",serif;
  font-size:56px; font-weight:400; color:#1a56db;
  line-height:1.2;
}
/* Carousel – direction:ltr forces correct left→right layout in RTL page */
.hero-carousel-wrap {
  position:relative; z-index:1;
  overflow:hidden;          /* clips horizontally only */
  direction:ltr;            /* override RTL so flex items go left→right */
}
.hero-carousel-track {
  display:flex; gap:20px; width:max-content;
  direction:ltr;            /* force left-to-right item order */
  animation:scroll-hero 30s linear infinite;
}
.hero-carousel-track:hover { animation-play-state:paused; }

/* Moves left by exactly (width + gap) × num_items to reach the duplicate set */
@keyframes scroll-hero {
  0%   { transform:translateX(0); }
  100% { transform:translateX(calc(-1 * (400px + 20px) * 7)); }
}
.hero-carousel-item {
  flex-shrink:0; width:400px; height:280px;
  border-radius:8px; overflow:hidden;
  box-shadow:0 4px 12px rgba(0,0,0,.20);
}
.hero-carousel-item img { width:100%; height:100%; object-fit:cover; display:block; }

/* ══════════════════════════
   BLOCK: ai_gen_block_ab5583f / ai_gen_block_2e1d810 – ANIMATED ARROWS
   arrow_size=40, arrow_color=#007bff, stroke_width=2,
   animation_duration=3s, 3 arrows staggered, padding_vertical=20
══════════════════════════ */
.arrows-section {
  display:flex; justify-content:center; align-items:center;
  padding:20px 0; width:100%;
}
.arrows-container {
  position:relative; width:40px; height:40px;
  display:flex; justify-content:center; align-items:center;
}
.arrow-el {
  position:absolute; width:40px; height:40px;
  opacity:0;
}
.arrow-el svg {
  width:100%; height:100%;
  stroke:#007bff; fill:none; stroke-width:2;
  stroke-linecap:round; stroke-linejoin:round;
}
.arrow-el:nth-child(1) { animation:arrowFloat 3s ease-in-out infinite 0s; }
.arrow-el:nth-child(2) { animation:arrowFloat 3s ease-in-out infinite 1s; }
.arrow-el:nth-child(3) { animation:arrowFloat 3s ease-in-out infinite 2s; }
@keyframes arrowFloat {
  0%   { opacity:0; transform:translateY(-20px); }
  20%  { opacity:1; }
  80%  { opacity:1; }
  100% { opacity:0; transform:translateY(20px); }
}
@media screen and (max-width:749px) {
  .arrows-container { width:32px; height:32px; }
  .arrow-el { width:32px; height:32px; }
}

/* ══════════════════════════
   BLOCK: ai_gen_block_eabfa2c – BAR TITLE  | text |
   font_size=32, font_weight=500, text_color=#222222
   bar_width=3, bar_height=35, bar_color=#007dff, bar_radius=3, gap=18
══════════════════════════ */
.bar-title-wrap {
  display:flex; align-items:center; justify-content:center;
  gap:18px; direction:rtl;
}
.bar-title-wrap.services-title { padding:0px 0 0px; }
.bar-title-wrap.clients-title  { padding:30px 0 30px; }
.bar-title-wrap::before,.bar-title-wrap::after {
  content:''; width:3px; border-radius:3px; flex-shrink:0;
}
.bar-title-wrap.services-title::before,
.bar-title-wrap.services-title::after { height:35px; background:#0057e7; }
.bar-title-wrap.clients-title::before,
.bar-title-wrap.clients-title::after  { height:35px; background:#0057e7; }
.bar-title-text {
  font-size:32px; font-weight:500; color:#222222; margin:0;
}

/* ══════════════════════════
   BLOCK: ai_gen_block_9d7e1fd – SERVICES LOTTIE GRID
   background_color=#fff, column_gap=28px (mobile:8px)
   4 columns, each: lottie circle (150×150 #2a3cff) + title below
══════════════════════════ */
.services-section { background:#fff; padding:4px 0 0; }
.services-container { max-width:1300px; margin:0 auto; padding:0 20px; }
.services-grid {
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:28px;
}
.services-column {
  display:flex; flex-direction:column;
  align-items:center; text-align:center;
}
.services-icon-wrapper { width:100%; margin-bottom:36px; }
/* The lottie HTML is inlined exactly as in the original embed code */

/* ══════════════════════════
   BLOCK: ai_gen_block_bf6b31c – ABOUT (RTL hero)
   max_width=1200, section_padding_top=0, section_padding_bottom=28
   headline_size=48, headline_color=#007bff
   logo_width=240, body_size=15, body_color=#121212
   hero_image border_radius=8
══════════════════════════ */
.about-section { padding:0 0 28px; background:#fff; }
.about-rtl-container {
  display:grid; grid-template-columns:1fr 1fr;
  gap:60px; max-width:1200px; margin:0 auto; padding:0 20px;
  align-items:center; direction:rtl;
}
.about-image-col { order:1; opacity:0; transform:translateX(-60px); transition:opacity .8s ease, transform .8s ease; }
.about-image-col.visible { opacity:1; transform:translateX(0); }
.about-text-col  { order:2; opacity:0; transform:translateX(60px); transition:opacity .8s ease .15s, transform .8s ease .15s; display:flex; flex-direction:column; align-items:center; text-align:center; }
.about-text-col.visible  { opacity:1; transform:translateX(0); }
.about-img-wrap { position:relative; width:100%; border-radius:8px; overflow:hidden; }
.about-img-wrap img { width:100%; height:auto; display:block; animation:floatY 7s ease-in-out infinite; }
@keyframes floatY { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-15px)} }
.about-headline {
  font-size:48px; font-weight:700; color:#007bff;
  margin:0; line-height:1.2; direction:rtl; text-align:center; width:100%;
}
.about-logo-wrap { margin-top:0; margin-bottom:12px; display:flex; align-items:center; justify-content:center; }
.about-logo-wrap img { width:240px; height:auto; display:block; }
.about-body { font-size:15px; color:#121212; line-height:1.8; direction:rtl; text-align:center; }
.about-body p { margin-bottom:4px; }

/* ══════════════════════════
   BLOCK: ai_gen_block_11cc01e – LOGO CAROUSEL
   animation_speed=15s, logo_width=180, logo_height=150, logo_spacing=20
   filter:grayscale(100%) -> grayscale(0%) on hover
══════════════════════════ */
.logo-carousel-section { display:block; width:100%; overflow:hidden; padding:40px 0; background:#fff; direction:ltr; }
.logo-carousel-wrapper { display:flex; width:max-content; animation:logoScroll 15s linear infinite; direction:ltr; }
.logo-carousel-section:hover .logo-carousel-wrapper { animation-play-state:paused; }
.logo-carousel-track { display:flex; gap:20px; padding:0 10px; direction:ltr; }
.logo-carousel-item {
  flex-shrink:0; width:180px; height:150px;
  display:flex; align-items:center; justify-content:center;
  transition:transform .3s ease;
}
.logo-carousel-item img {
  max-width:100%; max-height:100%; width:auto; height:auto;
  object-fit:contain; filter:grayscale(100%); transition:filter .3s ease, transform .3s ease;
}
.logo-carousel-item:hover img { filter:grayscale(0%); transform:scale(1.1); }
@keyframes logoScroll { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
@media screen and (max-width:749px) {
  .logo-carousel-item { width:126px; height:105px; }
}

/* ══════════════════════════
   BLOCK: ai_gen_block_0181d8b – FAQ
   section_bg_color=#fff, border_radius=16, padding=40, direction=rtl
   heading_font=mono, heading_size=42, heading_gradient=radial-gradient(...)
   item_bg_color=#f8f9fa, item_border_width=2, item_border_color=#e0e0e0
   item_active_border_color=#007bff, item_active_bg_color=#f2f2f2
   hover_effect=3d_lift, icon_size=40, icon_bg_color=#007bff
   icon_active_bg_color=#0056b3, icon_animation=rotate(360deg)
   toggle_icon=chevron, question_size=17, answer_size=15, answer_color=#555
══════════════════════════ */
.faq-outer { display:block; width:100%; padding:0; }
.faq-container {
  display:block; width:100%; max-width:100%; margin:0 auto;
  padding:40px; background:#fff; border-radius:16px; direction:rtl;
}
.faq-header { text-align:center; margin-bottom:40px; }
.faq-heading {
  font-family:"SF Mono",Menlo,Consolas,Monaco,"Liberation Mono","Lucida Console",monospace;
  font-weight:400; font-size:42px; color:#000; margin:0;
  background:linear-gradient(135deg, #0057e7 0%, #00c6ff 100%);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  background-clip:text;
}
.faq-items { display:flex; flex-direction:column; gap:15px; }
.faq-item {
  background:#f8f9fa; border:2px solid #e0e0e0; border-radius:12px;
  overflow:hidden; transition:all .4s cubic-bezier(.4,0,.2,1);
  box-shadow:0 4px 12px rgba(0,0,0,.065);
}
.faq-item.open { background:#f0f5ff; border-color:#0057e7; }
.faq-item:not(.open):hover { transform:translateY(-8px) rotateX(5deg); box-shadow:0 8px 18px rgba(0,0,0,.065); }
.faq-question {
  display:flex; align-items:center; justify-content:space-between;
  padding:20px; cursor:pointer; gap:16px; user-select:none;
  flex-direction:row-reverse;
}
.faq-question-content { display:flex; align-items:center; gap:16px; flex:1; flex-direction:row-reverse; }
.faq-icon-wrapper {
  width:40px; height:40px; display:flex; align-items:center; justify-content:center;
  background:#0057e7; border-radius:50%; flex-shrink:0; transition:all .4s ease;
}
.faq-item.open .faq-icon-wrapper { background:#003db5; transform:rotate(360deg); }
.faq-icon { width:24px; height:24px; stroke:#fff; fill:none; stroke-width:2; }
.faq-question-text { font-size:17px; font-weight:600; color:#000; text-align:right; flex:1; transition:color .3s; }
.faq-item.open .faq-question-text { color:#007bff; }
.faq-toggle-btn {
  width:30px; height:30px; border-radius:50%; background:#e0e0e0;
  display:flex; align-items:center; justify-content:center;
  color:#666; flex-shrink:0; transition:all .4s ease;
}
.faq-item.open .faq-toggle-btn { background:#007bff; color:#fff; transform:rotate(180deg); }
.faq-toggle-icon { width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:2.5; }
.faq-answer { max-height:0; overflow:hidden; transition:max-height .4s ease, padding .4s ease; padding:0 20px; }
.faq-item.open .faq-answer { max-height:500px; padding:0 20px 20px; }
.faq-answer-text { font-size:15px; color:#555; line-height:1.8; font-family:'Assistant',sans-serif; direction:rtl; text-align:right; }

/* ══════════════════════════
   BLOCK: ai_gen_block_e8be3e4 – COOKIE BANNER
   banner_style=bottom (slides from bottom)
   background_color=#fff, border_color=#e0e0e0
   accept_button_color=#007bff, reject: transparent+border #666
══════════════════════════ */
.cookie-banner-block {
  position:fixed; bottom:0; left:0; right:0; z-index:9999;
  background:#fff; color:#333;
  padding:20px; box-shadow:0 -4px 20px rgba(0,0,0,.15);
  transform:translateY(100%); transition:transform .5s cubic-bezier(.4,0,.2,1);
  border-top:1px solid #e0e0e0;
}
.cookie-banner-block.show { transform:translateY(0); }
.cookie-banner-block.hide { transform:translateY(100%); opacity:0; }
.cookie-banner-container {
  max-width:1200px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  gap:20px; flex-wrap:wrap;
}
.cookie-banner-content { flex:1; min-width:300px; }
.cookie-banner-title { font-size:18px; font-weight:600; margin:0 0 8px; color:#333; text-align:right; }
.cookie-banner-text  { font-size:14px; line-height:1.5; margin:0; color:#333; text-align:right; }
.cookie-banner-actions { display:flex; gap:12px; flex-wrap:wrap; align-items:center; }
.cookie-btn {
  padding:12px 24px; border:none; border-radius:6px; cursor:pointer;
  font-size:14px; font-weight:500; transition:all .3s ease;
  min-width:120px; position:relative; overflow:hidden;
}
.cookie-btn::before { content:''; position:absolute; top:50%; left:50%; width:0; height:0; background:rgba(255,255,255,.2); border-radius:50%; transform:translate(-50%,-50%); transition:width .6s, height .6s; }
.cookie-btn:hover::before { width:300px; height:300px; }
.cookie-btn-accept { background:#007bff; color:#fff; }
.cookie-btn-accept:hover { transform:scale(1.05); box-shadow:0 4px 15px rgba(0,0,0,.2); }
.cookie-btn-reject { background:rgba(0,0,0,0); color:#666; border:2px solid #666 !important; }
.cookie-btn-reject:hover { background:#f5f5f5; color:#333; }

/* ══════════════════════════
   BLOCK: ai_gen_block_4df9546 – HOW IT WORKS BADGE
   badge_gradient=#007dff, badge_text_color=#f1f1f1
   badge_font_size=24, badge_padding_vertical=8, badge_padding_horizontal=20
   badge_border_radius=24, section_background=#ffffff
   section_padding_top=16, section_padding_bottom=0, max_width=1000
══════════════════════════ */
.howit-section { display:block; width:100%; background:#fff; padding:16px 24px 0; }
.howit-container { max-width:1000px; margin:0 auto; display:flex; flex-direction:column; align-items:center; text-align:center; width:100%; }
.howit-badge {
  display:inline-block; background:#007dff; border-radius:24px;
  padding:8px 20px; margin-bottom:24px;
}
.howit-badge-text {
  color:#f1f1f1; font-family:Helvetica,Arial,sans-serif;
  font-weight:400; font-size:24px; margin:0; line-height:1.4;
}

/* ══════════════════════════
   BLOCK: ai_gen_block_72bd4f6 – MOBILE PORTRAIT (Explaining_the_idea.png)
   Only visible on mobile (display:none on desktop ≥750px)
══════════════════════════ */
.mobile-portrait { display:block; width:100%; position:relative; }
.mobile-portrait-wrapper { width:100%; position:relative; user-select:none; }
.mobile-portrait-img { width:100%; height:auto; display:block; pointer-events:none; }
@media screen and (min-width:750px) { .mobile-portrait { display:none; } }

/* ══════════════════════════
   BLOCK: ai_gen_block_8d36fa7 – FLOATING BANNER (process_2.png)
   animation_duration=7s, float_distance=15px
   Hidden on mobile (≤749px)
══════════════════════════ */
.floating-banner { display:block; width:100%; position:relative; overflow:hidden; }
.floating-banner-wrapper { width:100%; display:block; }
.floating-banner-img {
  width:100%; height:auto; display:block;
  user-select:none; pointer-events:none;
  animation:floatBanner 7s ease-in-out infinite;
}
@keyframes floatBanner { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-15px)} }
@media screen and (max-width:749px) { .floating-banner { display:none; } }

/* ══════════════════════════
   BLOCK: ai_gen_block_048573f – PORTFOLIO BADGE + SUBTITLE
   badge_gradient: #4f46e5 → #7c3aed, badge_border_radius=42
   badge_padding_vertical=16, badge_padding_horizontal=24, badge_font_size=18
   heading_font=serif, heading_size=36, heading_color=#000
   section_background=#ffffff, max_width=1000, spacing=24
   padding_top=20, padding_bottom=20
══════════════════════════ */
.portfolio-header-section {
  display:block; width:100%; background:#fff;
  text-align:center; padding:20px 24px 20px;
}
.portfolio-header-container { max-width:1000px; margin:0 auto; display:flex; flex-direction:column; align-items:center; gap:24px; }
.portfolio-header-badge {
  display:inline-block;
  background:linear-gradient(135deg,#3730d6,#6d28d9);
  color:#fff; padding:16px 24px; border-radius:42px;
  font-family:'Assistant',sans-serif; font-size:18px; font-weight:600;
}
.portfolio-header-heading {
  font-family:Georgia,"Times New Roman",serif;
  font-size:36px; font-weight:400; color:#000; margin:0;
}

/* ══════════════════════════
   BLOCK: ai_gen_block_87361e6 – BENTO GRID
   main_image: ROYAL_ZOO, grid_images: 4 small
   border_radius=16, shadow: 0 4px 20px rgba(0,0,0,.10)
   max_width=1100, section_padding=50, column_spacing=32, grid_spacing=12
   mobile: section_padding=16, spacing=12, border_radius=12
══════════════════════════ */
.bento-section { background:#fff; padding:50px 50px 50px; }
.bento-wrapper { max-width:1100px; margin:0 auto; }

/* בדיוק כמו באתר המקורי:
   עמודה שמאל (Royal Zoo) ~55% | עמודה ימין (4 תמונות 2×2) ~45%
   gap=32px בין העמודות, gap=12px בין הקטנות */
.bento-grid {
  display:grid;
  grid-template-columns:1.3fr 1fr;  /* ~56% / ~44% */
  gap:32px;
  align-items:stretch;
  min-height:500px;
}
.bento-main {
  border-radius:16px; overflow:hidden;
  box-shadow:0 4px 20px rgba(0,0,0,.10); position:relative;
  height:100%;
}
.bento-main img { width:100%; height:100%; object-fit:cover; display:block; }

/* 2×2 grid for the 4 small images – no explicit min-width/height, let grid decide */
.bento-right {
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:1fr 1fr;
  gap:12px;
}
.bento-small {
  border-radius:16px; overflow:hidden;
  box-shadow:0 4px 20px rgba(0,0,0,.10); position:relative;
  min-height:0; /* allow grid to shrink freely */
}
.bento-small img { width:100%; height:100%; object-fit:cover; display:block; }

/* Overlay מבוטל – ללא כהייה וטקסט */
.bento-overlay { display:none; }
.bento-cta { text-align:center; margin-top:32px; }

/* ══════════════════════════
   BLOCK: ai_gen_block_6af5ae3 – TESTIMONIALS BADGE + HEADING
   badge_gradient=linear-gradient(327deg,rgba(117,138,235,.92),...), badge_font_size=22
   badge_padding=8/24, badge_radius=26
   heading_font=serif, heading_size=40, heading_color=#000
   container_width=900, padding_top=16, padding_bottom=0
══════════════════════════ */
.reviews-header-section {
  display:block; width:100%; background:#fff;
  text-align:center; padding:16px 20px 0;
}
.reviews-header-container { max-width:900px; margin:0 auto; display:flex; flex-direction:column; align-items:center; gap:24px; }
.reviews-badge {
  display:inline-block; color:#fff;
  background:linear-gradient(327deg,#5b74ff,#0057e7 38%,#0044cc 76%,#0c0fee 99%);
  padding:8px 24px; border-radius:26px;
  font-family:Helvetica,Arial,sans-serif; font-size:22px;
}
.reviews-heading {
  font-family:Georgia,"Times New Roman",serif;
  font-size:40px; font-weight:400; color:#000; margin:0;
}

/* ══════════════════════════
   BLOCK: ai_gen_block_059c5ec – TESTIMONIALS AUTO-SCROLL CAROUSEL
   animation_speed=30s, card_min_width=350, card_max_width=450
   card_gap=16, logo_size=60, name_font_size=16, name_font_weight=600
   name_color=#000, review_font_size=14, review_color=#666
   bg=#fff, card_bg=#fff, card_border_radius=12, card_padding=20
   mobile: card_min_width=280, card_max_width=320, card_padding=16
══════════════════════════ */
.reviews-carousel-section { background:#fff; padding:60px 0; }
.reviews-carousel-wrap {
  overflow:hidden; direction:ltr;
  mask-image:linear-gradient(90deg,transparent 0%,#000 5%,#000 95%,transparent 100%);
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 5%,#000 95%,transparent 100%);
}
.reviews-carousel-track {
  display:flex; gap:16px; width:max-content; direction:ltr;
  animation:reviewsScroll 30s linear infinite;
  padding:20px 0 40px;
}
.reviews-carousel-track:hover { animation-play-state:paused; }
@keyframes reviewsScroll { from{transform:translateX(0)} to{transform:translateX(-50%)} }
.review-card {
  flex-shrink:0; width:350px; max-width:450px;
  background:#fff; border:1px solid #e0e0e0; border-radius:12px;
  padding:20px; box-shadow:0 2px 8px rgba(0,0,0,.06);
}
.review-card-top {
  display:flex; align-items:center; gap:12px;
  margin-bottom:8px; flex-direction:row-reverse;
}
.review-logo {
  width:60px; height:60px; border-radius:50%; overflow:hidden;
  border:1px solid #e0e0e0; flex-shrink:0; background:var(--bg);
  display:flex; align-items:center; justify-content:center;
}
.review-logo img { width:100%; height:100%; object-fit:contain; }
.review-name { font-size:16px; font-weight:600; color:#000; text-align:right; }
.review-stars { color:#f59e0b; font-size:13px; letter-spacing:1px; }
.review-text { font-size:14px; color:#666; line-height:1.6; direction:rtl; text-align:right; white-space:pre-line; }
@media screen and (max-width:749px) {
  .review-card { width:310px; max-width:360px; padding:20px; }
  .review-logo { width:50px; height:50px; }
  .review-name { font-size:15px; }
  .review-text { font-size:13px; }
}

/* ══════════════════════════
   BLOCK: ai_gen_block_66ef104 – CTA TEXT
   title_font=mono, title_size=34, title_color=#007dff
   body_size=20, body_color=#333, content_width=800, text_alignment=center
   highlight_bg_color=#007bff, highlight_text_color=#fff
   padding_top=16, padding_bottom=0, section_background=#fff
══════════════════════════ */
.cta-text-section { display:block; width:100%; background:#fff; padding:16px 20px 0; text-align:center; }
.cta-text-container { max-width:800px; margin:0 auto; }
.cta-text-title {
  font-family:"SF Mono",Menlo,Consolas,Monaco,"Liberation Mono","Lucida Console",monospace;
  font-size:34px; font-weight:400; color:#007dff; margin:0 0 20px;
}
.cta-text-body { font-size:20px; color:#333; line-height:1.6; }
.cta-text-body strong { background:#007bff; color:#fff; padding:0 4px; border-radius:3px; }

/* ══════════════════════════
   CONTACT FORM (Shopify contact-form section → HTML form)
   padding_top=0, padding_bottom=0
══════════════════════════ */
.contact-form-section { background:#fff; padding:40px 0 80px; }
.contact-form-wrap { max-width:900px; margin:0 auto; padding:0 20px; }
.contact-form { display:flex; flex-direction:column; gap:16px; }
.cf-row-2 { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.cf-field {
  width:100%; padding:14px 18px;
  border:1px solid var(--blue); border-radius:6px;
  font-family:'Assistant',sans-serif; font-size:1rem; color:var(--text);
  background:#fff; direction:rtl; text-align:right;
  transition:border-color var(--tr), box-shadow var(--tr); outline:none;
}
.cf-field::placeholder { color:var(--blue); opacity:.75; }
.cf-field:focus { border-color:var(--blue-d); box-shadow:0 0 0 3px rgba(0,123,255,.1); }
.cf-area { min-height:140px; resize:vertical; }
.cf-privacy-wrap { margin-bottom:14px; }
.cf-privacy-label {
  display:flex; align-items:center; gap:10px;
  font-family:'Assistant',sans-serif; font-size:0.9rem; color:#555;
  cursor:pointer; user-select:none;
}
.cf-privacy-check { display:none; }
.cf-check-box {
  width:22px; height:22px; flex-shrink:0;
  border:2px solid #d0d5dd; border-radius:6px;
  background:#fff; display:flex; align-items:center; justify-content:center;
  transition:border-color .2s, background .2s, box-shadow .2s;
  position:relative;
}
.cf-privacy-label:hover .cf-check-box {
  border-color:#0057e7; box-shadow:0 0 0 3px rgba(0,87,231,.1);
}
.cf-privacy-check:checked + .cf-check-box {
  background:#0057e7; border-color:#0057e7;
  animation:checkBounce .35s cubic-bezier(.34,1.56,.64,1);
}
.cf-check-box svg {
  width:13px; height:13px; overflow:visible;
}
.cf-check-box svg path {
  stroke:#fff; stroke-width:2.2;
  stroke-linecap:round; stroke-linejoin:round; fill:none;
  stroke-dasharray:22; stroke-dashoffset:22;
  transition:stroke-dashoffset .3s ease .05s;
}
.cf-privacy-check:checked + .cf-check-box svg path {
  stroke-dashoffset:0;
}
@keyframes checkBounce {
  0%   { transform:scale(1); }
  40%  { transform:scale(1.18); }
  70%  { transform:scale(.92); }
  100% { transform:scale(1); }
}
.cf-privacy-link {
  color:#0057e7; text-decoration:underline; font-weight:600;
}
.cf-privacy-link:hover { color:#003db3; }
.cf-submit-wrap { text-align:center; }
.cf-submit {
  display:inline-flex; align-items:center; gap:8px;
  padding:13px 36px; border-radius:50px;
  font-family:'Assistant',sans-serif; font-size:1rem; font-weight:700;
  background:var(--blue); color:#fff; border:none; cursor:pointer;
  transition:all var(--tr);
}
.cf-submit:hover { background:var(--blue-d); transform:translateY(-2px); box-shadow:0 6px 20px rgba(0,123,255,.35); }
.form-success { text-align:center; padding:48px 24px; color:var(--blue); display:none; }
.form-success .success-icon { font-size:3rem; margin-bottom:12px; }
.form-success h3 { font-size:1.4rem; font-weight:800; margin-bottom:8px; }

/* ── FOOTER ── */
.site-footer { background:#f0f0f0; padding:32px 0 0; }
.footer-card { background:#fff; border-radius:20px; border:1px solid #e5e5e5; box-shadow:0 2px 12px rgba(0,0,0,.06); padding:40px 40px 0; margin:0 24px; }
.footer-grid { display:grid; grid-template-columns:1fr 1.4fr 1fr; gap:40px; padding-bottom:40px; align-items:start; }
.footer-col h4 { font-size:1rem; font-weight:700; color:var(--text); margin-bottom:16px; }
.footer-col ul { list-style:none; display:flex; flex-direction:column; gap:10px; }
.footer-col ul li a { font-size:.92rem; color:var(--text-s); text-decoration:none; transition:color var(--tr); }
.footer-col ul li a:hover { color:var(--blue); }
.footer-brand { text-align:center; }
.footer-logo { height:70px; width:auto; margin:0 auto 14px; }
.footer-brand p { font-size:.88rem; color:var(--text-s); line-height:1.7; }
.footer-contact-col { display:flex; flex-direction:column; gap:12px; align-items:flex-start; }
.footer-contact-row { display:flex; align-items:center; gap:8px; flex-direction:row-reverse; font-size:.9rem; font-weight:600; color:var(--text-m); text-decoration:none; transition:color var(--tr); }
.footer-contact-row:hover { color:var(--blue); }
.footer-contact-row i { color:var(--text-m); }
.footer-contact-row.email-link { color:var(--text-m); }
.footer-contact-row.email-link i { color:var(--text-m); }
.footer-contact-row.email-link:hover { color:var(--blue); }
.footer-social { display:flex; gap:14px; margin-top:8px; }
.footer-social a { width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--text); font-size:1.1rem; text-decoration:none; transition:all var(--tr); }
.footer-social a:hover { color:var(--blue); transform:translateY(-2px); }
.footer-bottom { display:flex; align-items:center; justify-content:center; gap:32px; padding:14px 24px; font-size:.75rem; color:#999; flex-wrap:wrap; background:#f5f5f5; border-radius:0 0 20px 20px; margin:8px 24px 0; border-top:1px solid #ebebeb; }
.footer-access-link { color:var(--text-s); text-decoration:none; transition:color var(--tr); }
.footer-access-link:hover { color:var(--blue); }
.up-btn { background:var(--blue); color:#fff; border:none; padding:6px 20px; border-radius:50px; font-family:'Assistant',sans-serif; font-size:.75rem; font-weight:700; cursor:pointer; transition:all var(--tr); }
.up-btn:hover { background:var(--blue-d); transform:translateY(-2px); }
.footer-credit { text-align:center; font-size:.7rem; color:#bbb; margin:6px 0 0; padding-bottom:10px; }
@media (max-width:768px) {
  .footer-card { margin:0 12px; padding:28px 20px 0; }
  .footer-grid { grid-template-columns:1fr; gap:24px; text-align:center; }
  .footer-contact-col { align-items:center; }
  .footer-contact-row { flex-direction:row; justify-content:center; }
  .footer-social { justify-content:center; }
  .footer-bottom { flex-direction:column; align-items:center; padding:12px 16px; margin:8px 12px 0; gap:8px; text-align:center; font-size:.72rem; }
}
/* ════════════════════════════════════
   MOBILE FIXES – all in one block
   ════════════════════════════════════ */

/* 0. Header mobile */
@media screen and (max-width:749px) {
  .site-header   { padding:8px 12px; }
  .header-pill   { border-radius:60px; height:64px; padding:0 16px; }
  .main-nav      { display:none !important; }
  .header-socials{ display:none !important; }
  .header-whatsapp{ display:none !important; }
  .hamburger     { display:flex !important; }
  .logo-link img { height:52px; }
}



/* 1. Hero title bigger on mobile */
@media screen and (max-width:749px) {
  .hero-title { font-size:36px !important; }
  .hero-section { padding-top:24px; padding-bottom:12px; }
  .hero-content { margin-bottom:24px; }
  .hero-carousel-item { width:300px; height:225px; }
  @keyframes scroll-hero { 0%{transform:translateX(0)} 100%{transform:translateX(calc(-1 * (300px + 20px) * 7))} }
}
@media screen and (max-width:480px) {
  .hero-carousel-item { width:260px; height:195px; }
  @keyframes scroll-hero { 0%{transform:translateX(0)} 100%{transform:translateX(calc(-1 * (260px + 20px) * 7))} }
}
@media screen and (max-width:480px) {
  .hero-title { font-size:30px !important; }
}

/* 2. Services – gap between title and circles */
@media screen and (max-width:749px) {
  .bar-title-wrap.services-title { padding:0 0 16px; }
  .services-section { padding:20px 0 0; }
  .bar-title-wrap.services-title .bar-title-text { font-size:24px; }
  .services-grid { grid-template-columns:repeat(2,1fr); gap:8px; padding:0 8px; }
}

/* 3. About section – show image + slide-in on mobile */
@media screen and (max-width:749px) {
  .about-rtl-container {
    grid-template-columns: 1fr !important;
    direction: rtl;
    gap: 28px;
  }
  .about-text-col {
    order: 1;
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .7s ease, transform .7s ease;
  }
  .about-text-col.visible { opacity: 1; transform: translateY(0); }
  .about-image-col {
    order: 2;
    display: block !important;
    width: 100%;
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .7s ease .15s, transform .7s ease .15s;
  }
  .about-image-col.visible { opacity: 1; transform: translateY(0); }
  .about-img-wrap img { animation: none; border-radius: 12px; width: 100%; }
}

/* 4. Footer background fix */
.site-footer { background: #ffffff !important; }

/* 5. Performance – preload hint for logo */
.logo-link img { content-visibility: visible; }


/* ════════════════════════════
   TESTIMONIALS – rev2 (two-row carousel)
   ════════════════════════════ */
.rev2-section { background:#fff; padding:60px 0; overflow:hidden; min-height:200px; }
.rev2-header { text-align:center; margin-bottom:40px; }

.rev2-row-wrap {
  overflow:hidden; direction:ltr; min-height:160px;
  mask-image:linear-gradient(to right,transparent,black 4%,black 96%,transparent);
  -webkit-mask-image:linear-gradient(to right,transparent,black 4%,black 96%,transparent);
}
.rev2-track { display:flex; gap:16px; width:max-content; direction:ltr; }
.rev2-track--ltr { animation:rev2Ltr 35s linear infinite; }
.rev2-track--rtl { animation:rev2Rtl 35s linear infinite; }
.rev2-track:hover { animation-play-state:paused; }
@keyframes rev2Ltr { from{transform:translateX(0)} to{transform:translateX(-50%)} }
@keyframes rev2Rtl { from{transform:translateX(-50%)} to{transform:translateX(0)} }

.rev2-card {
  flex: 0 0 320px; width:320px;
  background:#fff; border:1px solid #e0e0e0;
  border-radius:14px; padding:18px;
  box-shadow:0 2px 12px rgba(0,0,0,.07);
  direction:rtl;
}
.rev2-top {
  display:flex; align-items:center; gap:12px;
  margin-bottom:12px; flex-direction:row;
}
.rev2-avatar {
  width:52px; height:52px; min-width:52px;
  border-radius:50%; flex-shrink:0;
  border:2px solid #e0e8ff;
  background-color:#f4f6f8;
  background-size:contain;
  background-position:center;
  background-repeat:no-repeat;
}
.rev2-name {
  font-size:14px; font-weight:700; color:#111;
  font-family:'Assistant',sans-serif; text-align:right; flex:1;
}
.rev2-text {
  font-size:13px; color:#555; line-height:1.65;
  font-family:'Assistant',sans-serif;
  direction:rtl; text-align:right;
}
.rev2-role { display:none; }

@media (max-width:749px) {
  .rev2-card { flex:0 0 270px; width:270px; padding:14px; }
  .rev2-avatar { width:42px; height:42px; min-width:42px; }
  .rev2-name { font-size:13px; }
  .rev2-text { font-size:12px; }
  .rev2-track { gap:12px; }
  .rev2-section { padding:40px 0; }
}

/* Bento grid – mobile */
@media screen and (max-width:749px) {
  .bento-section { padding:20px 16px 32px; }
  .bento-grid {
    grid-template-columns: 1fr;
    min-height: auto;
    gap: 10px;
  }
  .bento-main {
    height: 240px;
    min-height: 240px;
    border-radius: 12px;
    /* בRTL: bento-main מגיע שני – נשים אותו ראשון */
    order: 1;
  }
  .bento-right {
    order: 2;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 140px 140px;
    gap: 8px;
  }
  .bento-small { border-radius: 10px; }
}
@media screen and (max-width:480px) {
  .bento-main  { height: 200px; min-height: 200px; }
  .bento-right { grid-template-rows: 115px 115px; }
}

@media screen and (max-width:749px) {
  /* reviews-heading handled below */
}

@media screen and (max-width:749px) {
  .portfolio-header-badge { font-size:15px; padding:12px 18px; border-radius:34px; }
  .portfolio-header-heading { font-size:24px; }
  .portfolio-header-container { gap:14px; }
  .portfolio-header-section { padding:14px 16px 14px; }
}

/* old transform:scale rules removed */

/* About + reviews mobile size fixes */
@media screen and (max-width:749px) {
  .about-headline { font-size:34px !important; }
  .about-logo-wrap img { width:180px !important; }
  .about-img-wrap img { max-height:280px; object-fit:cover; }
  .about-body { font-size:13px; }
  .reviews-heading { font-size:24px !important; }
}

@media screen and (max-width:749px) {
  .bar-title-wrap.clients-title .bar-title-text { font-size:22px; }
  .bar-title-wrap.clients-title::before,
  .bar-title-wrap.clients-title::after { height:26px; }
}