/* ============================================================
   KLIENTO — עמוד צור קשר (v2)
   נטען רק בעמוד contact.php דרך $extraCss ב-head.php.
   כל הכללים מוגבלים לשורש .kc כדי שלא ידלפו לשאר האתר,
   ומקבלים specificity של html[dir="rtl"] כדי לגבור על
   style.rtl.css / theme-default.rtl.css / responsive.rtl.css.
   ============================================================ */

.kc {
  /* מותג */
  --k-50:#F0F9FD; --k-100:#E0F3FA; --k-200:#ABDEF2; --k-300:#7DCBEB;
  --kc-500:#2DACDF; --kc-600:#2691BB; --kc-700:#1E7293;
  --ink:#16242E; --ink-700:#2B3A45; --slate:#5C6B75; --slate-400:#93A1AB;
  --line:#E6ECEF; --mist:#F7FAFB; --mist-100:#EEF3F5;
  --ok:#2E9E6B; --warn:#E0A22B; --danger:#D9534F;

  /* טיפוגרפיה */
  --kc-font:'Rubik','Segoe UI','Arial Hebrew',Arial,-apple-system,sans-serif;
  --fs-xs:12px; --fs-sm:13.5px; --fs-base:15px; --fs-md:17px;
  --fs-lg:20px; --fs-h2:28px; --fs-h1:34px;

  /* מרווח ורדיוסים */
  --pad:20px; --gap:14px; --r-sm:8px; --r:10px; --r-lg:14px; --r-xl:16px;
  --kc-shadow:0 10px 30px rgba(22,36,46,.07);

  background:#FFFFFF;
  color:var(--ink);
  font-family:var(--kc-font);
  font-size:var(--fs-base);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

html[dir="rtl"] .kc *,
html[dir="rtl"] .kc *::before,
html[dir="rtl"] .kc *::after { box-sizing:border-box }

/* עברית: ללא tracking שלילי */
html[dir="rtl"] .kc h1, html[dir="rtl"] .kc h2, html[dir="rtl"] .kc h3,
html[dir="rtl"] .kc h4, html[dir="rtl"] .kc p, html[dir="rtl"] .kc li,
html[dir="rtl"] .kc label, html[dir="rtl"] .kc button,
html[dir="rtl"] .kc input, html[dir="rtl"] .kc select,
html[dir="rtl"] .kc textarea { letter-spacing:0 }

/* מספרים בעמודות אחידות */
html[dir="rtl"] .kc .num,
html[dir="rtl"] .kc time,
html[dir="rtl"] .kc a[href^="tel:"] {
  font-variant-numeric:tabular-nums; font-feature-settings:"tnum" 1;
}

html[dir="rtl"] .kc a { color:var(--kc-600); text-decoration:none }
html[dir="rtl"] .kc a:hover { color:var(--kc-700); text-decoration:underline }
html[dir="rtl"] .kc img, html[dir="rtl"] .kc svg { max-width:100% }

/* focus גלוי ואחיד */
html[dir="rtl"] .kc a:focus-visible,
html[dir="rtl"] .kc button:focus-visible,
html[dir="rtl"] .kc input:focus-visible,
html[dir="rtl"] .kc select:focus-visible,
html[dir="rtl"] .kc textarea:focus-visible {
  outline:2px solid var(--kc-600);
  outline-offset:2px;
  border-radius:4px;
}

html[dir="rtl"] .kc .kc-wrap { max-width:1120px; margin:0 auto; padding:0 20px }

/* ============ פתיח ============ */
html[dir="rtl"] .kc .kc-intro { padding:40px 0 4px; border-bottom:1px solid var(--line) }
html[dir="rtl"] .kc .kc-eyebrow {
  display:inline-flex; align-items:center; gap:9px;
  font-size:11.5px; font-weight:600; letter-spacing:.16em;
  text-transform:uppercase; color:var(--kc-600); margin:0 0 14px;
}
html[dir="rtl"] .kc .kc-eyebrow::before {
  content:""; width:22px; height:1px; background:var(--kc-500); display:block;
}
html[dir="rtl"] .kc .kc-intro h1 {
  font-size:var(--fs-h1); font-weight:800; line-height:1.25;
  margin:0 0 12px; max-width:16ch; color:var(--ink);
}
html[dir="rtl"] .kc .kc-lead {
  font-size:var(--fs-md); color:var(--slate);
  margin:0 0 26px; max-width:52ch; line-height:1.7;
}

/* שורת מדדים */
html[dir="rtl"] .kc .kc-sla {
  display:flex; flex-wrap:wrap; gap:0;
  border:1px solid var(--line); border-radius:var(--r-lg);
  overflow:hidden; margin:0 0 36px; background:var(--mist);
}
html[dir="rtl"] .kc .kc-sla-item { flex:1 1 100%; padding:13px 18px; border-top:1px solid var(--line) }
html[dir="rtl"] .kc .kc-sla-item:first-child { border-top:none }
html[dir="rtl"] .kc .kc-sla-k {
  display:flex; align-items:baseline; gap:6px;
  font-size:19px; font-weight:700; color:var(--ink);
  font-variant-numeric:tabular-nums;
}
html[dir="rtl"] .kc .kc-sla-l { font-size:var(--fs-xs); color:var(--slate); margin-top:1px }
html[dir="rtl"] .kc .kc-dot {
  width:7px; height:7px; border-radius:50%; background:var(--ok);
  display:inline-block; flex:0 0 auto; position:relative; top:-2px;
}

/* ============ פריסה ראשית ============ */
html[dir="rtl"] .kc .kc-main { padding:34px 0 56px }
html[dir="rtl"] .kc .kc-layout {
  display:grid; grid-template-columns:1fr; gap:24px; align-items:start;
}

/* ---- כרטיס טופס ---- */
html[dir="rtl"] .kc .kc-card {
  background:#fff; border:1px solid var(--line);
  border-radius:var(--r-xl); padding:var(--pad);
}
html[dir="rtl"] .kc .kc-card--form { box-shadow:var(--kc-shadow) }
html[dir="rtl"] .kc .kc-card-head {
  margin:0 0 20px; padding-bottom:16px; border-bottom:1px solid var(--line);
}
html[dir="rtl"] .kc .kc-card-head h2 {
  font-size:var(--fs-h2); font-weight:700; margin:0 0 6px;
  line-height:1.3; color:var(--ink);
}
html[dir="rtl"] .kc .kc-card-sub { font-size:var(--fs-sm); color:var(--slate); margin:0 }

/* ---- הודעות סטטוס (flash) ---- */
html[dir="rtl"] .kc .kc-flash {
  border-radius:var(--r); padding:13px 16px; margin:0 0 18px;
  font-size:var(--fs-sm); font-weight:500;
  border:1px solid var(--line); background:var(--mist); color:var(--ink-700);
}
html[dir="rtl"] .kc .kc-flash--ok {
  background:var(--k-50); border-color:var(--k-200); color:var(--kc-700);
}
html[dir="rtl"] .kc .kc-flash--error {
  background:#FEF2F2; border-color:#FCA5A5; color:#B91C1C;
}

html[dir="rtl"] .kc .kc-grid-2 { display:grid; grid-template-columns:1fr; gap:var(--gap) }
html[dir="rtl"] .kc .kc-field { margin-bottom:0 }
html[dir="rtl"] .kc .kc-field label {
  display:block; font-size:var(--fs-sm); font-weight:600;
  color:var(--ink-700); margin-bottom:6px; text-align:right;
}
html[dir="rtl"] .kc .kc-req { color:var(--danger); font-weight:400; margin-inline-start:2px }
html[dir="rtl"] .kc .kc-hint {
  display:block; font-size:var(--fs-xs); color:var(--slate);
  font-weight:400; margin-top:5px;
}

html[dir="rtl"] .kc input[type="text"],
html[dir="rtl"] .kc input[type="email"],
html[dir="rtl"] .kc input[type="tel"],
html[dir="rtl"] .kc select,
html[dir="rtl"] .kc textarea {
  width:100%; height:auto; max-width:none; float:none; display:block;
  font-family:var(--kc-font); font-size:var(--fs-base); font-weight:400;
  line-height:1.65; color:var(--ink); background:#fff; background-color:#fff;
  border:1.5px solid var(--line); border-radius:var(--r);
  padding:11px 13px; margin:0;
  box-shadow:none; text-align:right;
  transition:border-color .15s, box-shadow .15s;
}
html[dir="rtl"] .kc input::placeholder,
html[dir="rtl"] .kc textarea::placeholder { color:var(--slate-400); opacity:1 }
html[dir="rtl"] .kc input:focus,
html[dir="rtl"] .kc select:focus,
html[dir="rtl"] .kc textarea:focus {
  border-color:var(--kc-500);
  box-shadow:0 0 0 3px var(--k-50);
  outline:none;
}
html[dir="rtl"] .kc input:focus-visible,
html[dir="rtl"] .kc select:focus-visible,
html[dir="rtl"] .kc textarea:focus-visible {
  outline:2px solid var(--kc-600); outline-offset:1px;
}
html[dir="rtl"] .kc input[type="tel"],
html[dir="rtl"] .kc input[type="email"] {
  direction:ltr; text-align:right; font-variant-numeric:tabular-nums;
}
html[dir="rtl"] .kc textarea { min-height:130px; resize:vertical; line-height:1.7 }

html[dir="rtl"] .kc select {
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%235C6B75' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:left 13px center;
  padding-inline-start:38px;
  cursor:pointer;
}

/* honeypot */
html[dir="rtl"] .kc .kc-hp {
  position:absolute; width:1px; height:1px; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap;
}

html[dir="rtl"] .kc .kc-form-foot {
  display:flex; flex-direction:column; gap:12px;
  margin-top:22px; padding-top:18px; border-top:1px solid var(--line);
}
html[dir="rtl"] .kc .kc-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:var(--kc-font); font-size:var(--fs-md); font-weight:600;
  line-height:1.4; padding:14px 26px; border:none; border-radius:var(--r);
  cursor:pointer; transition:background .15s;
  background:var(--kc-500); color:#fff; width:100%;
  text-transform:none; box-shadow:none;
}
html[dir="rtl"] .kc .kc-btn:hover { background:var(--kc-600); color:#fff }
html[dir="rtl"] .kc .kc-btn:active { background:var(--kc-700) }
html[dir="rtl"] .kc .kc-btn svg { width:17px; height:17px }
html[dir="rtl"] .kc .kc-privacy {
  font-size:var(--fs-xs); color:var(--slate); margin:0; line-height:1.6;
}

/* ---- עמודת פרטי קשר ---- */
html[dir="rtl"] .kc .kc-aside { display:flex; flex-direction:column; gap:16px }
html[dir="rtl"] .kc .kc-info {
  border:1px solid var(--line); border-radius:var(--r-xl);
  overflow:hidden; background:#fff;
}
html[dir="rtl"] .kc .kc-info-head {
  padding:14px var(--pad); background:var(--mist);
  border-bottom:1px solid var(--line);
  font-size:11.5px; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:var(--slate); margin:0; line-height:1.5;
}
html[dir="rtl"] .kc .kc-info-row {
  display:flex; gap:13px; align-items:flex-start;
  padding:15px var(--pad); border-bottom:1px solid var(--line);
}
html[dir="rtl"] .kc .kc-info-row:last-child { border-bottom:none }
html[dir="rtl"] .kc .kc-ic {
  width:36px; height:36px; flex:0 0 auto;
  border-radius:var(--r-sm); background:var(--k-50); color:var(--kc-600);
  display:flex; align-items:center; justify-content:center;
}
html[dir="rtl"] .kc .kc-ic svg { width:18px; height:18px }
html[dir="rtl"] .kc .kc-info-l {
  font-size:var(--fs-xs); color:var(--slate); margin:0 0 2px; line-height:1.4;
}
html[dir="rtl"] .kc .kc-info-v {
  font-size:var(--fs-base); font-weight:600; color:var(--ink);
  margin:0; line-height:1.5;
}
html[dir="rtl"] .kc .kc-info-v a { color:var(--ink) }
html[dir="rtl"] .kc .kc-info-v a:hover { color:var(--kc-600) }
html[dir="rtl"] .kc .kc-ltr {
  direction:ltr; display:inline-block; unicode-bidi:embed;
  font-variant-numeric:tabular-nums;
}
html[dir="rtl"] .kc .kc-info-note { font-size:var(--fs-xs); color:var(--slate); margin:3px 0 0 }

/* כרטיס וואטסאפ */
html[dir="rtl"] .kc .kc-wa {
  display:flex; align-items:center; gap:13px;
  border:1px solid var(--line); border-radius:var(--r-xl);
  padding:16px var(--pad); background:#fff;
  transition:border-color .15s, background .15s;
}
html[dir="rtl"] .kc .kc-wa:hover {
  border-color:var(--k-200); background:var(--k-50); text-decoration:none;
}
html[dir="rtl"] .kc .kc-wa .kc-ic { background:#E7F6EE; color:#1F7A50 }
html[dir="rtl"] .kc .kc-wa-t {
  display:block; font-size:var(--fs-base); font-weight:600;
  color:var(--ink); margin:0; line-height:1.5;
}
html[dir="rtl"] .kc .kc-wa-s {
  display:block; font-size:var(--fs-xs); color:var(--slate); margin:1px 0 0; line-height:1.4;
}
html[dir="rtl"] .kc .kc-wa-arrow { margin-inline-start:auto; color:var(--slate-400); display:flex }
html[dir="rtl"] .kc .kc-wa-arrow svg { width:18px; height:18px }

/* ============ רספונסיבי ============ */
@media (min-width:600px) {
  .kc { --pad:26px; --gap:16px; --fs-h1:38px }
  html[dir="rtl"] .kc .kc-grid-2 { grid-template-columns:1fr 1fr }
  html[dir="rtl"] .kc .kc-field--full { grid-column:1/-1 }
  html[dir="rtl"] .kc .kc-form-foot {
    flex-direction:row; align-items:center; justify-content:space-between; gap:20px;
  }
  html[dir="rtl"] .kc .kc-btn { width:auto }
  html[dir="rtl"] .kc .kc-privacy { max-width:34ch; text-align:start }
  html[dir="rtl"] .kc .kc-intro { padding-top:52px }
  html[dir="rtl"] .kc .kc-sla-item {
    flex:1 1 0; border-top:none;
    border-inline-start:1px solid var(--line); padding:14px 18px;
  }
  html[dir="rtl"] .kc .kc-sla-item:first-child { border-inline-start:none }
}

@media (min-width:900px) {
  .kc { --fs-h1:44px; --fs-h2:30px }
  html[dir="rtl"] .kc .kc-wrap { padding:0 32px }
  html[dir="rtl"] .kc .kc-layout {
    grid-template-columns:minmax(0,1.55fr) minmax(300px,1fr); gap:28px;
  }
  html[dir="rtl"] .kc .kc-main { padding:44px 0 72px }
  html[dir="rtl"] .kc .kc-intro { padding:64px 0 6px }
  html[dir="rtl"] .kc .kc-lead { font-size:19px }
  html[dir="rtl"] .kc .kc-sla { margin-bottom:44px }
}

@media (prefers-reduced-motion:reduce) {
  html[dir="rtl"] .kc *,
  html[dir="rtl"] .kc *::before,
  html[dir="rtl"] .kc *::after {
    animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important;
  }
}
