/* ==========================================================
   Grunis Law — Hebrew typography & RTL refinements
   Loaded only on the Hebrew pages (/he/), after style.css.
   ========================================================== */

/* ── Direction is fixed by the markup, never by script ── */
html[dir="rtl"],
html[dir="rtl"] body {
  direction: rtl;
}

/* ── Reading text: justified, like a well-set Hebrew page ── */
html[dir="rtl"] body {
  font-weight: 400;
}

html[dir="rtl"] .practice-card p,
html[dir="rtl"] .about-text p,
html[dir="rtl"] .about-bio p,
html[dir="rtl"] .value-item p,
html[dir="rtl"] .practice-intro p,
html[dir="rtl"] .practice-full-body p,
html[dir="rtl"] .contact-info > p,
html[dir="rtl"] .contact-privacy,
html[dir="rtl"] .about-philosophy {
  text-align: justify;
  text-align-last: right;
  text-justify: inter-word;
  hyphens: none;
}

html[dir="rtl"] .hero-tagline      { font-size: clamp(1.02rem, 1.5vw, 1.18rem); line-height: 1.85; }
html[dir="rtl"] .practice-card p   { font-size: 0.97rem; line-height: 1.8; }
html[dir="rtl"] .about-text p,
html[dir="rtl"] .about-bio p       { font-size: 1.02rem; line-height: 1.9; }
html[dir="rtl"] .value-item p      { font-size: 0.93rem; line-height: 1.75; }
html[dir="rtl"] .practice-full-body p {
  font-size: 1.02rem;
  line-height: 1.95;
  margin-block-end: 1.1rem;
  white-space: normal;
}
html[dir="rtl"] .practice-full-body p:last-child { margin-block-end: 0; }
html[dir="rtl"] .contact-info > p  { font-size: 0.98rem; line-height: 1.8; }

/* ── Hebrew is not letter-spaced or upper-cased ── */
html[dir="rtl"] .nav-links a,
html[dir="rtl"] .nav-cta,
html[dir="rtl"] .btn,
html[dir="rtl"] .hero-eyebrow-text,
html[dir="rtl"] .section-label-text,
html[dir="rtl"] .page-hero-label span:last-child,
html[dir="rtl"] .nav-logo-sub,
html[dir="rtl"] .footer-logo-sub,
html[dir="rtl"] .footer-col h5,
html[dir="rtl"] .attorney-title,
html[dir="rtl"] .contact-detail-text strong,
html[dir="rtl"] .offices-label,
html[dir="rtl"] label,
html[dir="rtl"] .practice-subtitle,
html[dir="rtl"] .practice-full-subtitle,
html[dir="rtl"] .practice-card-link,
html[dir="rtl"] .office-directions,
html[dir="rtl"] .credential-year,
html[dir="rtl"] .hero-epigraph-cite,
html[dir="rtl"] .footer-offices-line {
  letter-spacing: 0 !important;
  text-transform: none;
}

/* Small labels need a little more size and weight in Hebrew */
html[dir="rtl"] .hero-eyebrow-text,
html[dir="rtl"] .section-label-text,
html[dir="rtl"] .page-hero-label span:last-child {
  font-size: 0.9rem;
  font-weight: 500;
}
html[dir="rtl"] .nav-logo-sub      { font-size: 0.8rem; font-weight: 500; }
html[dir="rtl"] .footer-logo-sub   { font-size: 0.8rem; }
html[dir="rtl"] .footer-col h5     { font-size: 0.85rem; font-weight: 700; }
html[dir="rtl"] .attorney-title    { font-size: 0.95rem; font-weight: 500; }
html[dir="rtl"] .practice-subtitle { font-size: 0.85rem; }
html[dir="rtl"] .practice-full-subtitle { font-size: 0.92rem; }
html[dir="rtl"] .contact-detail-text strong,
html[dir="rtl"] .offices-label     { font-size: 0.85rem; }
html[dir="rtl"] label              { font-size: 0.88rem; font-weight: 500; }
html[dir="rtl"] .credential-year   { font-size: 0.85rem; }
html[dir="rtl"] .credential-label  { font-size: 0.97rem; }

/* ── Navigation ── */
html[dir="rtl"] .nav-links a       { font-size: 0.97rem; font-weight: 400; }
html[dir="rtl"] .nav-logo-name     { font-size: 1.15rem; }
html[dir="rtl"] .lang-switcher     { direction: ltr; }   /* keep EN | HE order */

/* ── Buttons ── */
html[dir="rtl"] .btn               { font-size: 0.97rem; font-weight: 500; }

/* ── Hero ── */
html[dir="rtl"] .hero h1 {
  font-size: clamp(2.6rem, 6vw, 4.4rem);
  line-height: 1.15;
  max-width: 20ch;
}
html[dir="rtl"] .hero-epigraph-text {
  font-size: clamp(1.05rem, 1.6vw, 1.25rem);
  font-weight: 300;
}
html[dir="rtl"] .hero-epigraph-cite::before { content: '— '; }

/* The tap-to-call link is mobile-only. The generic RTL rule for tel: links
   in style.css would otherwise reveal it (with an unsized icon) on desktop. */
html[dir="rtl"] a.hero-phone-mobile { display: none; }
@media (max-width: 640px) {
  html[dir="rtl"] a.hero-phone-mobile { display: inline-flex; direction: rtl; }
}

/* ── Headings: Heebo is heavy; step sizes down slightly so they sit calmly ── */
html[dir="rtl"] .section-title,
html[dir="rtl"] .about-text h2 { font-size: clamp(1.75rem, 3.1vw, 2.35rem); line-height: 1.3; }
html[dir="rtl"] .page-hero h1  { font-size: clamp(2rem, 4vw, 2.9rem); }
html[dir="rtl"] .practice-full-body h2 { font-size: clamp(1.4rem, 2.5vw, 1.8rem); }

/* ── Arrow and bar decorations follow the reading direction ── */
html[dir="rtl"] .about-philosophy {
  padding-left: 0;
  padding-inline-start: 1.5rem;
}

/* ── Numbers keep Latin shaping ── */
html[dir="rtl"] .practice-num,
html[dir="rtl"] .practice-full-num {
  font-family: var(--font-serif-en);
}

/* ── Contact details and form ── */
html[dir="rtl"] input[type="tel"],
html[dir="rtl"] input[type="email"] {
  direction: ltr;
  text-align: right;
}
html[dir="rtl"] input[type="tel"]::placeholder,
html[dir="rtl"] input[type="email"]::placeholder {
  direction: rtl;
}
html[dir="rtl"] select {
  background-position: left 1rem center;
}

/* ── Footer ── */
html[dir="rtl"] .footer-tagline    { font-size: 0.92rem; }
html[dir="rtl"] .footer-col a,
html[dir="rtl"] .footer-contact-item { font-size: 0.92rem; }
html[dir="rtl"] .footer-copy,
html[dir="rtl"] .footer-offices-line { font-size: 0.82rem; }

/* ── Mobile menu opens from the right ── */
@media (max-width: 640px) {
  html[dir="rtl"] .nav-links { align-items: flex-start; }
  html[dir="rtl"] .practice-card p,
  html[dir="rtl"] .practice-full-body p,
  html[dir="rtl"] .about-bio p { text-align: right; }   /* narrow columns read better ragged */
}

/* ── Column widths follow the RTL re-ordering in style.css ──
   style.css moves the text column first in RTL but keeps the original
   width ratios, which squeezed the text into the narrow column.        */
html[dir="rtl"] .about-grid          { grid-template-columns: 6fr 5fr; }
html[dir="rtl"] .about-page-grid     { grid-template-columns: 7fr 5fr; }
html[dir="rtl"] .practice-full-item  { grid-template-columns: 2fr 1fr; }
@media (max-width: 900px) {
  html[dir="rtl"] .about-grid,
  html[dir="rtl"] .about-page-grid,
  html[dir="rtl"] .practice-full-item { grid-template-columns: 1fr; }
  /* single column: text first, then the portrait / number */
}