/* פונטים בעברית — 2026 enhancement layer (footer + 2-col article + sidebar)
   Palette: warm peach (#F0AE7B) + deep navy (#1A2032) to match the site hero. */

:root{
  --ink:#0F1620;
  --ink-2:#3a4754;
  --ink-3:#697583;
  --bg:#FBF9F4;
  --bg-card:#FFFFFF;
  --bg-soft:#F4EFE5;
  --accent:#D27A3E;          /* peach-orange darker for readable links on light bg */
  --accent-2:#E89260;         /* coral peach */
  --accent-soft:#FCE9D7;
  --accent-bg:#FFF6EC;        /* very soft peach for highlights */
  --gold:#C9A961;
  --navy:#1A2032;
  --navy-2:#10141F;
  --line:#E6E0D2;
  --shadow:0 2px 6px rgba(15,22,32,.04), 0 8px 24px rgba(15,22,32,.06);
  --shadow-lg:0 4px 14px rgba(15,22,32,.05), 0 24px 54px rgba(15,22,32,.10);
  --radius-sm:8px;
  --radius:14px;
  --radius-lg:22px;
  --font-ui:'Heebo','Assistant','Segoe UI',Tahoma,Arial,sans-serif;
  --font-serif:'Frank Ruhl Libre','Bellefair','David Libre',Georgia,serif;
}

/* Mobile overflow guard */
html,body{overflow-x:hidden;max-width:100vw;overscroll-behavior-x:none}
@supports(overflow-x:clip){html,body{overflow-x:clip}}

/* Hide legacy thin "site-footer" wrapper so we control footer placement. */
footer#site-footer{display:none !important}

/* Hide every legacy <header> the JS tagged (hello-elementor + canvas templates) */
header[data-fontim-old-header="1"]{display:none !important}

/* Hide every legacy footer section the JS tagged with data-fontim-legacy-footer="1" */
[data-fontim-legacy-footer="1"]{display:none !important}

/* Belt-and-suspenders: hide the original homepage credit-line element by ID too */
.elementor-element-1af5442{display:none !important}

/* Hide the empty "הכי נקראים" heading + divider on the homepage (no posts under it). */
.elementor-element-8daadb4,
.elementor-element-4466d16{display:none !important}

/* Hide the legacy sub-heading "אספנו עבורכם פונטים בעברית בחינם להורדה מיידית" —
   the new showcase has its own H2 above the grid, this one is redundant. */
.elementor-element-c60e5db{display:none !important}

/* Hide the entire legacy contact-page form section ("אנחנו כאן בשבילכם, מלאו את הטופס...") —
   the new .fontim-cta card below provides a better contact form site-wide. */
.elementor-element-33f9cae{display:none !important}

/* ============================================================
   POST PAGE — two-column grid (article + sticky sidebar)
   ============================================================ */
body.fontim-post-page{
  background:var(--bg);
  font-family:var(--font-ui);
  color:var(--ink);
  line-height:1.75;
  font-size:17px;
}

body.fontim-post-page #content{
  max-width:1180px;
  margin:0 auto;
  padding:36px 24px 24px;
}

.fontim-article-grid{
  display:grid;
  grid-template-columns: minmax(0,1fr) 320px;
  gap:48px;
  align-items:start;
}
@media(max-width:980px){
  .fontim-article-grid{grid-template-columns:1fr;gap:32px}
}

/* ---- ARTICLE MAIN ---- */
.fontim-article-main{
  min-width:0;
  background:var(--bg-card);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:40px 44px 36px;
  box-shadow:var(--shadow);
}
@media(max-width:640px){
  .fontim-article-main{padding:28px 22px 28px;border-radius:var(--radius)}
}

/* Breadcrumbs */
.fontim-article-main .fontim-crumbs{
  font-size:13.5px;color:var(--ink-3);
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  margin:0 0 22px;padding-bottom:18px;border-bottom:1px dashed var(--line);
}
.fontim-article-main .fontim-crumbs a{color:var(--accent);font-weight:500;text-decoration:none}
.fontim-article-main .fontim-crumbs a:hover{text-decoration:underline}
.fontim-article-main .fontim-crumbs .sep{color:var(--line)}

/* Title */
.fontim-article-main .page-header{margin:0 0 14px;padding:0}
.fontim-article-main .page-header .entry-title{
  font-family:var(--font-serif);
  font-size:clamp(28px,3.6vw,42px);
  font-weight:700;line-height:1.18;letter-spacing:-.01em;
  color:var(--ink);margin:0;
}

/* Article meta strip */
.fontim-article-main .fontim-article-meta{
  margin:0 0 28px;padding:0 0 22px;
  display:flex;flex-wrap:wrap;gap:14px;align-items:center;
  font-size:14px;color:var(--ink-3);
  border-bottom:1px solid var(--line);
}
.fontim-article-main .fontim-article-meta .author{
  display:inline-flex;align-items:center;gap:9px;font-weight:500;color:var(--ink-2);
}
.fontim-article-main .fontim-article-meta .avatar{
  width:32px;height:32px;border-radius:50%;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:#fff;display:grid;place-items:center;font-weight:700;font-size:13px;
}
.fontim-article-main .fontim-article-meta .dot{color:var(--line)}
.fontim-article-main .fontim-article-meta .read-time::before{content:"⏱ ";opacity:.7}

/* Page content area */
.fontim-article-main .page-content{margin:0;padding:0;max-width:none}

/* Neutralize Elementor's section/column padding on post pages only */
body.fontim-post-page .page-content .elementor-section,
body.fontim-post-page .page-content .elementor-container,
body.fontim-post-page .page-content .elementor-inner,
body.fontim-post-page .page-content .elementor-section-wrap,
body.fontim-post-page .page-content .elementor-row,
body.fontim-post-page .page-content .elementor-column,
body.fontim-post-page .page-content .elementor-column-wrap,
body.fontim-post-page .page-content .elementor-widget-wrap,
body.fontim-post-page .page-content .elementor-element{
  padding:0 !important;margin:0 !important;background:transparent !important;
  box-shadow:none !important;border:0 !important;
  width:100% !important;max-width:100% !important;
}
body.fontim-post-page .page-content .elementor-section{display:block !important}
body.fontim-post-page .page-content .elementor-column{display:block !important;flex:none !important}

/* Headings */
body.fontim-post-page .page-content .elementor-heading-title{
  font-family:var(--font-serif);
  font-size:clamp(22px,2.6vw,28px);
  font-weight:700;color:var(--ink);
  line-height:1.3;letter-spacing:-.005em;
  margin:1.7em 0 .5em !important;
  position:relative;padding-inline-start:18px;
}
body.fontim-post-page .page-content .elementor-heading-title::before{
  content:"";position:absolute;
  inset-inline-start:0;top:.2em;bottom:.2em;
  width:4px;border-radius:3px;
  background:linear-gradient(180deg,var(--accent),var(--accent-2));
}

/* Body text */
body.fontim-post-page .page-content .elementor-text-editor{
  font-size:17px;line-height:1.85;color:var(--ink-2);
  margin:0 0 1.2em !important;
}
body.fontim-post-page .page-content .elementor-text-editor p{margin:0 0 1em}
body.fontim-post-page .page-content .elementor-text-editor ol,
body.fontim-post-page .page-content .elementor-text-editor ul{
  padding-inline-start:1.7em;margin:0 0 1.2em;
}
body.fontim-post-page .page-content .elementor-text-editor li{
  margin:.55em 0;line-height:1.78;
}
body.fontim-post-page .page-content .elementor-text-editor ol li::marker{
  color:var(--accent);font-weight:700;
}
body.fontim-post-page .page-content .elementor-text-editor ul li::marker{color:var(--accent)}
body.fontim-post-page .page-content .elementor-text-editor a{
  color:var(--accent);font-weight:500;text-decoration:underline;
  text-decoration-color:var(--accent-soft);text-underline-offset:3px;
}
body.fontim-post-page .page-content .elementor-text-editor a:hover{
  text-decoration-color:var(--accent);
}

/* Inline H2/H3 inside text-editor (works on both standard + canvas templates).
   We use !important to override the inline #fontim-unified-font block in the HTML head
   that forces Heebo on all H1-H6 with !important. */
body.fontim-post-page .elementor-text-editor h2{
  font-family:var(--font-serif) !important;
  font-size:clamp(22px,3vw,28px);
  font-weight:700;color:var(--ink);
  margin:1.8em 0 .55em;line-height:1.3;
  letter-spacing:-.005em;
  position:relative;padding-inline-start:18px;
}
body.fontim-post-page .elementor-text-editor h2::before{
  content:"";position:absolute;
  inset-inline-start:0;top:.2em;bottom:.2em;
  width:4px;border-radius:3px;
  background:linear-gradient(180deg,var(--accent),var(--accent-2));
}
body.fontim-post-page .elementor-text-editor h2 strong{
  font-family:var(--font-serif) !important;
  font-weight:700;color:inherit;
}
body.fontim-post-page .elementor-text-editor h3{
  font-family:var(--font-serif) !important;
  font-size:clamp(18px,2.4vw,22px);
  font-weight:700;color:var(--ink);
  margin:1.4em 0 .45em;line-height:1.35;
}

/* Lists in article body (canvas template — no .page-content wrapper) */
body.fontim-post-page .elementor-text-editor ul,
body.fontim-post-page .elementor-text-editor ol{
  padding-inline-start:1.7em;margin:.6em 0 1.3em;
}
body.fontim-post-page .elementor-text-editor li{margin:.5em 0;line-height:1.78}
body.fontim-post-page .elementor-text-editor ul li::marker{color:var(--accent)}
body.fontim-post-page .elementor-text-editor ol li::marker{color:var(--accent);font-weight:700}

/* Tables — used for comparison content */
body.fontim-post-page .elementor-text-editor table{
  width:100%;border-collapse:collapse;
  margin:1.2em 0 1.6em;
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;overflow:hidden;
  font-size:15.5px;
  box-shadow:0 2px 8px rgba(15,22,32,.04);
}
body.fontim-post-page .elementor-text-editor th,
body.fontim-post-page .elementor-text-editor td{
  border-bottom:1px solid var(--line);
  padding:12px 16px;text-align:start;vertical-align:top;
}
body.fontim-post-page .elementor-text-editor th{
  background:linear-gradient(180deg,#FBF1E5,#F6E9D9);
  font-weight:700;color:var(--ink);font-size:14.5px;
  text-transform:uppercase;letter-spacing:.04em;
}
body.fontim-post-page .elementor-text-editor tr:last-child td{border-bottom:0}
body.fontim-post-page .elementor-text-editor tr:nth-child(even){background:#FCFAF6}
body.fontim-post-page .elementor-text-editor tr:hover td{background:#FFF6EC}
body.fontim-post-page .elementor-text-editor strong{color:var(--ink);font-weight:700}
body.fontim-post-page .elementor-text-editor a{
  color:var(--accent);font-weight:500;text-decoration:underline;
  text-decoration-color:var(--accent-soft);text-underline-offset:3px;
}
body.fontim-post-page .elementor-text-editor a:hover{text-decoration-color:var(--accent)}
body.fontim-post-page .elementor-text-editor code{
  background:#FBF1E5;color:var(--accent);
  padding:2px 7px;border-radius:6px;
  font-family:'JetBrains Mono','Menlo',monospace;font-size:.88em;
}

/* Tip callout — paragraphs/divs marked with .tip class */
body.fontim-post-page .elementor-text-editor .tip{
  background:linear-gradient(135deg,#FFF6EC 0%,#FFFEFC 100%);
  border-inline-start:4px solid var(--accent);
  border-radius:10px;
  padding:14px 18px;
  margin:1.2em 0;
  font-size:16px;line-height:1.7;
}
body.fontim-post-page .elementor-text-editor .tip::before{
  content:"💡 טיפ: ";color:var(--accent);font-weight:700;
}

/* Dividers — convert Elementor hairlines to peach accent */
body.fontim-post-page .page-content .elementor-divider{
  margin:1.6em auto !important;width:80px;
}
body.fontim-post-page .page-content .elementor-divider-separator{
  display:block !important;height:3px !important;border:0 !important;
  background:linear-gradient(90deg,var(--accent),var(--accent-2));
  border-radius:3px;
}

/* "חזרה לעמוד הקודם" button */
body.fontim-post-page .page-content .elementor-button-wrapper{margin:2em 0 1em}
body.fontim-post-page .page-content .elementor-button{
  display:inline-flex !important;align-items:center;gap:8px;
  padding:13px 26px !important;border-radius:999px !important;
  background:linear-gradient(135deg,var(--accent),var(--accent-2)) !important;
  color:#fff !important;font-weight:600 !important;font-size:15px !important;
  box-shadow:0 6px 18px rgba(210,122,62,.30);
  transition:.18s;text-decoration:none !important;
}
body.fontim-post-page .page-content .elementor-button:hover{
  transform:translateY(-1px);box-shadow:0 10px 24px rgba(210,122,62,.4);
}

/* Comments area */
body.fontim-post-page #comments{
  margin:42px 0 0;padding:0;
}
body.fontim-post-page #comments .comment-respond{
  background:var(--accent-bg);
  border:1px solid var(--accent-soft);
  border-radius:var(--radius-lg);
  padding:28px;
}
body.fontim-post-page .comment-reply-title{
  margin:0 0 6px;font-size:22px;color:var(--ink);font-weight:700;
  font-family:var(--font-serif);
}
body.fontim-post-page .comment-notes{color:var(--ink-3);font-size:13.5px;margin-bottom:18px}
body.fontim-post-page .comment-form label{
  display:block;font-weight:500;color:var(--ink-2);margin-bottom:6px;font-size:14.5px;
}
body.fontim-post-page .comment-form input[type="text"],
body.fontim-post-page .comment-form input[type="email"],
body.fontim-post-page .comment-form input[type="url"],
body.fontim-post-page .comment-form textarea{
  width:100%;padding:12px 14px;font-size:15px;
  background:#fff;border:1px solid var(--line);border-radius:10px;
  font-family:inherit;color:var(--ink);margin-bottom:14px;
}
body.fontim-post-page .comment-form input:focus,
body.fontim-post-page .comment-form textarea:focus{
  outline:2px solid var(--accent-soft);border-color:var(--accent);
}
body.fontim-post-page .comment-form .submit{
  display:inline-flex;align-items:center;gap:8px;
  padding:13px 28px;border-radius:999px;border:0;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:#fff;font-weight:600;font-size:15px;cursor:pointer;
  box-shadow:0 6px 18px rgba(210,122,62,.30);
  transition:.18s;font-family:inherit;
}
body.fontim-post-page .comment-form .submit:hover{
  transform:translateY(-1px);box-shadow:0 10px 24px rgba(210,122,62,.4);
}

/* ============================================================
   SIDEBAR — sticky on desktop, stacks on mobile
   ============================================================ */
.fontim-sidebar{
  display:flex;flex-direction:column;gap:20px;
  position:sticky;top:24px;align-self:start;
}
@media(max-width:980px){
  .fontim-sidebar{position:static}
}

.fontim-side-widget{
  background:var(--bg-card);border:1px solid var(--line);
  border-radius:var(--radius);padding:22px 22px;
  box-shadow:var(--shadow);
  position:relative;overflow:hidden;
}
.fontim-side-widget::before{
  content:"";position:absolute;top:0;inset-inline-start:0;
  width:48px;height:3px;
  background:linear-gradient(90deg,var(--accent),var(--accent-2));
  border-radius:0 0 3px 3px;
}

.fontim-side-widget .side-head{
  display:flex;align-items:center;justify-content:space-between;
  margin:0 0 16px;
}
.fontim-side-widget h3{
  margin:0;font-family:var(--font-serif);font-size:21px;font-weight:700;
  color:var(--ink);letter-spacing:-.005em;
}

.side-list{
  list-style:none;margin:0;padding:0;
  display:flex;flex-direction:column;gap:14px;
}
.side-list li{margin:0}
.side-link{
  display:grid;grid-template-columns:auto 1fr;gap:12px;
  padding:10px 0;
  text-decoration:none !important;color:var(--ink);
  border-bottom:1px solid var(--line);
  transition:.15s;
}
.side-list li:last-child .side-link{border-bottom:0}
.side-link:hover{transform:translateX(-3px)}
.side-link .num{
  font-family:var(--font-serif);font-size:22px;font-weight:700;
  color:var(--accent);line-height:1;
  min-width:30px;text-align:start;letter-spacing:-.01em;
  padding-top:3px;
}
.side-link .meta{display:flex;flex-direction:column;gap:4px;min-width:0}
.side-link .t{
  font-size:14.5px;font-weight:600;line-height:1.35;color:var(--ink);
}
.side-link:hover .t{color:var(--accent)}
.side-link .d{
  font-size:12.5px;line-height:1.45;color:var(--ink-3);
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
}

.side-all{
  display:block;text-align:center;margin-top:14px;
  padding:11px 14px;border-radius:999px;
  background:var(--accent-bg);
  color:var(--accent);font-weight:600;font-size:13.5px;
  text-decoration:none;transition:.15s;
}
.side-all:hover{background:var(--accent);color:#fff;text-decoration:none}

/* Sidebar CTA */
.fontim-side-cta{
  background:linear-gradient(155deg,var(--navy) 0%,var(--navy-2) 100%);
  border-color:transparent;color:#E0E5EF;
}
.fontim-side-cta::before{background:linear-gradient(90deg,var(--accent),var(--gold))}
.fontim-side-cta h3{color:#fff;font-family:var(--font-serif);font-size:20px;margin:0 0 6px}
.fontim-side-cta p{margin:0 0 14px;font-size:14px;line-height:1.6;color:#9FA8B6}
.fontim-side-cta .side-cta-btn{
  display:block;text-align:center;
  padding:12px 18px;border-radius:999px;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:#fff !important;font-weight:600;font-size:14.5px;
  text-decoration:none;transition:.18s;
  box-shadow:0 6px 18px rgba(210,122,62,.30);
}
.fontim-side-cta .side-cta-btn:hover{
  transform:translateY(-1px);box-shadow:0 10px 24px rgba(210,122,62,.45);
  text-decoration:none;
}
.fontim-side-cta .side-mail{
  display:block;text-align:center;margin-top:12px;
  font-size:13px;color:#9FA8B6;text-decoration:none;
  word-break:break-all;
}
.fontim-side-cta .side-mail:hover{color:var(--accent);text-decoration:none}

/* ============================================================
   BOTTOM RELATED GRID — full width below the article grid
   ============================================================ */
.fontim-related{
  max-width:1180px;margin:48px auto 24px;padding:0 24px;
}
.fontim-related .header{
  display:flex;align-items:baseline;justify-content:space-between;
  gap:18px;flex-wrap:wrap;margin-bottom:22px;
  border-bottom:1px solid var(--line);padding-bottom:14px;
}
.fontim-related h2{
  font-family:var(--font-serif);font-size:clamp(22px,3vw,30px);
  font-weight:700;color:var(--ink);margin:0;letter-spacing:-.005em;
}
.fontim-related .header a.all{
  color:var(--accent);font-weight:500;font-size:14.5px;text-decoration:none;
}
.fontim-related .header a.all:hover{text-decoration:underline}

.fontim-related-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:18px;
}
.fontim-related-card{
  background:var(--bg-card);border:1px solid var(--line);
  border-radius:var(--radius);padding:22px 22px 20px;
  color:var(--ink);transition:.18s;
  display:flex;flex-direction:column;gap:10px;
  text-decoration:none !important;
  position:relative;overflow:hidden;
}
.fontim-related-card::before{
  content:"";position:absolute;top:0;inset-inline-start:0;
  width:42px;height:3px;
  background:linear-gradient(90deg,var(--accent),var(--accent-2));
  border-radius:0 0 3px 3px;transition:width .28s;
}
.fontim-related-card:hover{
  transform:translateY(-3px);box-shadow:var(--shadow-lg);
  border-color:var(--accent-soft);text-decoration:none;
}
.fontim-related-card:hover::before{width:100%}
.fontim-related-card .kicker{
  color:var(--accent);font-size:11.5px;font-weight:700;
  text-transform:uppercase;letter-spacing:.08em;
}
.fontim-related-card h3{
  margin:0;font-size:17.5px;line-height:1.4;color:var(--ink);font-weight:600;
  font-family:var(--font-ui);
}
.fontim-related-card p{
  margin:0;font-size:14px;color:var(--ink-3);line-height:1.55;
}
.fontim-related-card .read-more{
  color:var(--accent);font-weight:600;font-size:13.5px;margin-top:auto;
  display:inline-flex;align-items:center;gap:5px;
}

/* ============================================================
   AUTHORITATIVE FOOTER (every page)
   ============================================================ */
.fontim-footer{
  --fp-bg-1:#1A2032;
  --fp-bg-2:#10141F;
  --fp-accent:#F0AE7B;
  --fp-accent-2:#E89260;
  --fp-gold:#E7C58A;
  --fp-ink-soft:#C9D0DA;
  --fp-ink-mute:#8995A3;
  --fp-ink-very-mute:#697583;

  background:linear-gradient(180deg,var(--fp-bg-1) 0%,var(--fp-bg-2) 100%);
  color:var(--fp-ink-soft);
  padding:56px 24px 24px;
  margin-top:60px;
  font-family:var(--font-ui);position:relative;
}
.fontim-footer::before{
  content:"";position:absolute;top:0;inset-inline-start:0;right:0;
  height:3px;
  background:linear-gradient(90deg,var(--fp-accent) 0%,var(--fp-accent-2) 50%,var(--fp-gold) 100%);
}
.fontim-footer .wrap{
  max-width:1180px;margin:0 auto;
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;
}
@media(max-width:880px){.fontim-footer .wrap{grid-template-columns:1fr 1fr;gap:32px}}
@media(max-width:480px){.fontim-footer .wrap{grid-template-columns:1fr}}
.fontim-footer .col h4{
  color:#fff;font-size:14px;font-weight:700;
  text-transform:uppercase;letter-spacing:.1em;
  margin:0 0 18px;position:relative;padding-bottom:10px;
}
.fontim-footer .col h4::after{
  content:"";position:absolute;bottom:0;inset-inline-start:0;
  width:34px;height:2px;
  background:linear-gradient(90deg,var(--fp-accent),var(--fp-accent-2));
}
.fontim-footer .col.brand{padding-inline-end:8px}
.fontim-footer .col.brand .logo{
  display:inline-flex;align-items:center;gap:11px;margin-bottom:14px;
  text-decoration:none;color:#fff;
}
.fontim-footer .col.brand .logo .mark{
  width:44px;height:44px;border-radius:11px;
  background:linear-gradient(135deg,var(--fp-accent),var(--fp-accent-2));
  color:#1A2032;display:grid;place-items:center;font-weight:900;
  font-family:var(--font-serif);font-size:26px;
  box-shadow:0 4px 14px rgba(240,174,123,.30);
}
.fontim-footer .col.brand .logo .name{
  font-size:19px;font-weight:700;color:#fff;line-height:1.2;
}
.fontim-footer .col.brand .logo .tagline{
  display:block;font-size:12px;font-weight:400;color:var(--fp-ink-mute);margin-top:2px;
}
.fontim-footer .col.brand p{font-size:14px;line-height:1.7;color:var(--fp-ink-mute);margin:0}
.fontim-footer .col ul{list-style:none;padding:0;margin:0}
.fontim-footer .col ul li{margin:0 0 9px}
.fontim-footer .col ul a{
  color:var(--fp-ink-soft);font-size:14px;line-height:1.45;
  display:inline-flex;align-items:center;gap:6px;
  transition:.12s;text-decoration:none;
}
.fontim-footer .col ul a::before{
  content:"›";color:var(--fp-accent);font-weight:700;opacity:0;
  transform:translateX(6px);transition:.15s;
}
.fontim-footer .col ul a:hover{color:#fff;text-decoration:none}
.fontim-footer .col ul a:hover::before{opacity:1;transform:translateX(0)}
.fontim-footer .col.contact .info{font-size:14px;color:var(--fp-ink-mute);line-height:1.7;margin:0}
.fontim-footer .col.contact .info strong{color:#fff;font-weight:500;display:block;margin-top:8px}
.fontim-footer .col.contact .info a{color:var(--fp-accent)}
.fontim-footer .col.contact .info a:hover{color:#fff}
.fontim-footer .legal{
  max-width:1180px;margin:42px auto 0;padding-top:22px;
  border-top:1px solid rgba(240,174,123,.10);
  display:flex;justify-content:space-between;align-items:center;
  gap:14px;flex-wrap:wrap;font-size:13px;color:var(--fp-ink-very-mute);
}
.fontim-footer .legal a{color:var(--fp-ink-mute)}
.fontim-footer .legal a:hover{color:var(--fp-accent)}

/* ============================================================
   BLOG INDEX — grid of post cards for /פונטים/ and /פונטים-בעברית/
   ============================================================ */
.fontim-blog-list{
  max-width:1180px;margin:0 auto;padding:48px 24px 40px;
  font-family:var(--font-ui);
}
.fontim-blog-head{
  text-align:center;margin:0 auto 36px;max-width:760px;
}
.fontim-blog-head h1{
  font-family:var(--font-serif) !important;
  font-size:clamp(32px,5vw,52px);
  color:var(--ink, #0F1620);
  font-weight:800;margin:0 0 14px;
  line-height:1.15;letter-spacing:-.01em;
}
.fontim-blog-head p{
  font-size:clamp(15px,1.6vw,18px);
  color:var(--ink-2, #3a4754);
  line-height:1.7;margin:0;
}
.fontim-blog-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(310px, 1fr));
  gap:20px;
}
.fontim-blog-card{
  background:#fff;
  border:1px solid var(--line, #E6E2D7);
  border-radius:16px;
  padding:26px 26px 22px;
  display:flex;flex-direction:column;gap:12px;
  color:var(--ink, #0F1620);
  text-decoration:none !important;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  position:relative;overflow:hidden;
  min-height:200px;
}
.fontim-blog-card::before{
  content:"";position:absolute;top:0;inset-inline-start:0;
  width:42px;height:3px;
  background:linear-gradient(90deg, var(--accent, #D27A3E), var(--accent-2, #E89260));
  border-radius:0 0 3px 3px;transition:width .25s ease;
}
.fontim-blog-card:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 36px rgba(15,22,32,.12);
  border-color:#E0CCAE;
  text-decoration:none !important;
}
.fontim-blog-card:hover::before{width:100%}
.fontim-blog-card-kicker{
  font-size:11.5px;font-weight:700;
  color:var(--accent, #D27A3E);
  text-transform:uppercase;letter-spacing:.08em;
  font-family:var(--font-ui) !important;
}
.fontim-blog-card-title{
  font-family:var(--font-serif) !important;
  font-size:21px;font-weight:700;
  color:var(--ink, #0F1620);
  margin:0;line-height:1.35;letter-spacing:-.005em;
}
.fontim-blog-card-desc{
  font-size:14.5px;color:var(--ink-2, #3a4754);line-height:1.6;
  margin:0;
  font-family:var(--font-ui) !important;
}
.fontim-blog-card-read{
  margin-top:auto;
  color:var(--accent, #D27A3E);font-weight:600;font-size:14px;
  font-family:var(--font-ui) !important;
  display:inline-flex;align-items:center;gap:4px;
}

@media (max-width: 520px){
  .fontim-blog-list{padding:32px 18px 28px}
  .fontim-blog-card{padding:22px 22px 18px;min-height:auto}
  .fontim-blog-card-title{font-size:18.5px}
}

/* ============================================================
   HOMEPAGE HERO — vanilla replacement for the Elementor hero band.
   Wide peach gradient, big H1, sub-headline, stats row, CTA.
   ============================================================ */
.fontim-hero{
  background:linear-gradient(135deg, #F4B07A 0%, #E89260 50%, #D27A3E 100%);
  text-align:center;
  padding:80px 24px 64px;
  position:relative;
  overflow:hidden;
  font-family:var(--font-ui);
}
.fontim-hero::before{
  content:'';
  position:absolute;inset:0;
  background:radial-gradient(ellipse at center, rgba(255,255,255,.18) 0%, transparent 65%);
  pointer-events:none;
}
.fontim-hero::after{
  content:'';
  position:absolute;left:-80px;bottom:-120px;
  width:280px;height:280px;border-radius:50%;
  background:radial-gradient(circle, rgba(255,255,255,.20) 0%, transparent 70%);
  pointer-events:none;
}
.fontim-hero .hero-inner{
  max-width:920px;margin:0 auto;
  position:relative;z-index:1;
}
.fontim-hero h1{
  font-family:var(--font-serif) !important;
  font-size:clamp(38px, 6.5vw, 68px);
  font-weight:800;
  color:#1a1a1a;
  margin:0 0 20px;
  line-height:1.1;
  letter-spacing:-.02em;
}
.fontim-hero .hero-sub{
  font-size:clamp(15px, 1.8vw, 19px);
  color:#2a2a2a;
  max-width:680px;
  margin:0 auto 32px;
  line-height:1.65;
  font-weight:500;
}
.fontim-hero .hero-stats{
  display:flex;justify-content:center;align-items:center;
  gap:36px;flex-wrap:wrap;
  margin:0 auto 32px;max-width:680px;
}
.fontim-hero .stat{
  display:flex;flex-direction:column;align-items:center;gap:2px;
  min-width:0;
}
.fontim-hero .stat strong{
  font-family:var(--font-serif) !important;
  font-size:clamp(26px, 3.4vw, 36px);
  font-weight:800;
  color:#1a1a1a;
  line-height:1;
  letter-spacing:-.01em;
}
.fontim-hero .stat span{
  font-size:13px;
  color:#3a3a3a;
  font-weight:600;
  letter-spacing:.02em;
}
.fontim-hero .hero-cta{
  display:inline-flex;align-items:center;gap:10px;
  padding:15px 34px;
  background:#1A1A1A;
  color:#fff !important;
  border-radius:999px;
  font-weight:600;
  font-size:16px;
  text-decoration:none !important;
  box-shadow:0 8px 22px rgba(0,0,0,.22);
  transition:transform .18s ease, box-shadow .18s ease;
}
.fontim-hero .hero-cta:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(0,0,0,.32);
}

@media (max-width: 600px){
  .fontim-hero{padding:54px 20px 48px}
  .fontim-hero .hero-stats{gap:20px}
  .fontim-hero .hero-cta{padding:13px 26px;font-size:15px}
}
@media (max-width: 420px){
  .fontim-hero .hero-stats{gap:14px}
  .fontim-hero .stat strong{font-size:22px}
  .fontim-hero .stat span{font-size:11.5px}
}

/* ============================================================
   UNIFIED SITE HEADER — same brand identity as footer
   Sticky on every page. Logo (peach mark + dark wordmark) + nav menu + mobile burger.
   ============================================================ */
.fontim-header{
  --fh-bg:#FFFFFF;
  --fh-bg-2:#FBF9F4;
  --fh-ink:#0F1620;
  --fh-ink-2:#3a4754;
  --fh-line:#EFE9DA;
  --fh-accent:#D27A3E;
  --fh-accent-2:#E89260;

  position:sticky;top:0;z-index:60;
  background:rgba(255,255,255,.94);
  -webkit-backdrop-filter:saturate(140%) blur(10px);
          backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--fh-line);
  font-family:var(--font-ui);
  box-shadow:0 1px 0 rgba(15,22,32,.02);
}
.fontim-header::before{
  content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,var(--fh-accent) 0%,var(--fh-accent-2) 50%,#E7C58A 100%);
}
.fontim-header .fh-wrap{
  max-width:1200px;margin:0 auto;
  padding:14px 24px;
  display:flex;align-items:center;gap:18px;
}

/* Logo */
.fontim-header .fh-logo{
  display:inline-flex;align-items:center;gap:11px;
  text-decoration:none;color:var(--fh-ink);
  flex:0 0 auto;
}
.fontim-header .fh-logo .mark{
  width:42px;height:42px;border-radius:11px;
  background:linear-gradient(135deg,var(--fh-accent),var(--fh-accent-2));
  color:#fff;display:grid;place-items:center;
  font-family:var(--font-serif);font-size:24px;font-weight:900;
  box-shadow:0 4px 12px rgba(210,122,62,.30);
  flex:0 0 auto;
}
.fontim-header .fh-logo .word{display:flex;flex-direction:column;line-height:1.15}
.fontim-header .fh-logo .name{
  font-family:var(--font-serif);font-size:19px;font-weight:700;color:var(--fh-ink);
  letter-spacing:-.005em;
}
.fontim-header .fh-logo .tagline{
  font-size:11.5px;font-weight:500;color:var(--ink-3);margin-top:2px;
  letter-spacing:.01em;
}

/* Mobile burger toggle */
.fontim-header .fh-toggle{
  display:none;
  background:transparent;border:1px solid var(--fh-line);
  border-radius:10px;padding:9px 11px;
  margin-inline-start:auto;
  flex-direction:column;gap:4px;cursor:pointer;
  transition:.15s;
}
.fontim-header .fh-toggle span{
  width:20px;height:2px;background:var(--fh-ink);
  border-radius:2px;display:block;transition:.18s;
}
.fontim-header.is-open .fh-toggle span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.fontim-header.is-open .fh-toggle span:nth-child(2){opacity:0}
.fontim-header.is-open .fh-toggle span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* Nav */
.fontim-header .fh-nav{
  display:flex;align-items:center;gap:4px;flex-wrap:wrap;
  margin-inline-start:auto;
}
.fontim-header .fh-link{
  display:inline-flex;align-items:center;
  padding:9px 14px;border-radius:999px;
  color:var(--fh-ink-2);font-size:14.5px;font-weight:500;
  text-decoration:none;transition:.15s;
  white-space:nowrap;
  pointer-events:auto;position:relative;z-index:1;
}
.fontim-header .fh-link:hover{
  background:var(--accent-bg);color:var(--fh-accent);text-decoration:none;
}
.fontim-header .fh-link.is-current{
  background:var(--accent-bg);color:var(--fh-accent);font-weight:600;
}
.fontim-header .fh-cta{
  display:inline-flex;align-items:center;
  margin-inline-start:8px;
  padding:10px 18px;border-radius:999px;
  background:linear-gradient(135deg,var(--fh-accent),var(--fh-accent-2));
  color:#fff !important;font-size:14px;font-weight:600;
  text-decoration:none;transition:.18s;
  box-shadow:0 6px 16px rgba(210,122,62,.28);
  white-space:nowrap;
  pointer-events:auto;position:relative;z-index:1;
}
.fontim-header .fh-cta:hover{
  transform:translateY(-1px);box-shadow:0 10px 22px rgba(210,122,62,.40);
  text-decoration:none;
}

@media(max-width:920px){
  .fontim-header .fh-toggle{display:flex}
  .fontim-header .fh-nav{
    display:none;
    position:absolute;top:100%;inset-inline-start:0;right:0;
    background:#fff;border-bottom:1px solid var(--fh-line);
    padding:14px 22px;flex-direction:column;align-items:stretch;gap:6px;
    box-shadow:0 18px 30px rgba(15,22,32,.10);
  }
  .fontim-header.is-open .fh-nav{display:flex}
  .fontim-header .fh-link{padding:11px 14px;text-align:start}
  .fontim-header .fh-cta{margin:6px 0 0;text-align:center}
}
@media(max-width:480px){
  .fontim-header .fh-logo .tagline{display:none}
  .fontim-header .fh-logo .name{font-size:17px}
  .fontim-header .fh-wrap{padding:11px 18px}
}

/* ============================================================
   CTA FORM — replaces broken WP comments form, appears on every page
   ============================================================ */
.fontim-cta{
  max-width:1180px;margin:48px auto 0;padding:0 24px;
}
.fontim-cta-card{
  display:grid;
  grid-template-columns:1fr 1.05fr;
  gap:48px;align-items:start;
  background:linear-gradient(160deg,#FFF6EC 0%,#FFFFFF 60%);
  border:1px solid var(--accent-soft);
  border-radius:var(--radius-lg);
  padding:44px 44px;
  box-shadow:var(--shadow-lg);
  position:relative;overflow:hidden;
}
.fontim-cta-card::before{
  content:"";position:absolute;top:0;inset-inline-start:0;right:0;height:4px;
  background:linear-gradient(90deg,var(--accent),var(--accent-2),var(--gold));
}
.fontim-cta-card::after{
  /* decorative peach blob */
  content:"";position:absolute;inset-inline-end:-80px;bottom:-100px;
  width:280px;height:280px;border-radius:50%;
  background:radial-gradient(circle,var(--accent-soft) 0%,transparent 70%);
  pointer-events:none;
}
@media(max-width:820px){
  .fontim-cta-card{grid-template-columns:1fr;gap:28px;padding:32px 26px}
}

.fontim-cta-card .cta-text{position:relative;z-index:1}
.fontim-cta-card .cta-eyebrow{
  display:inline-block;padding:5px 12px;border-radius:999px;
  background:#fff;border:1px solid var(--accent-soft);
  color:var(--accent);font-weight:700;font-size:11.5px;
  text-transform:uppercase;letter-spacing:.1em;margin-bottom:14px;
}
.fontim-cta-card .cta-text h2{
  font-family:var(--font-serif);
  font-size:clamp(24px,3vw,32px);font-weight:700;
  color:var(--ink);line-height:1.2;letter-spacing:-.01em;
  margin:0 0 12px;
}
.fontim-cta-card .cta-text p{
  font-size:16px;line-height:1.65;color:var(--ink-2);margin:0 0 22px;
}
.fontim-cta-card .cta-direct{
  display:inline-flex;align-items:center;gap:10px;
  padding:11px 18px;border-radius:999px;
  background:#fff;border:1px solid var(--line);
  font-size:14.5px;color:var(--ink-2);
}
.fontim-cta-card .cta-direct .ic{
  color:var(--accent);font-size:16px;
}
.fontim-cta-card .cta-direct a{
  color:var(--accent);font-weight:600;text-decoration:none;
}
.fontim-cta-card .cta-direct a:hover{text-decoration:underline}

/* Form */
.fontim-cta-form{
  display:flex;flex-direction:column;gap:14px;
  position:relative;z-index:1;
}
.fontim-cta-form .row{
  display:grid;grid-template-columns:1fr 1fr;gap:14px;
}
@media(max-width:520px){
  .fontim-cta-form .row{grid-template-columns:1fr}
}
.fontim-cta-form .field{display:flex;flex-direction:column;gap:6px}
.fontim-cta-form .field > span{
  font-size:13px;font-weight:600;color:var(--ink-2);
}
.fontim-cta-form input,
.fontim-cta-form textarea{
  width:100%;padding:12px 14px;font-size:15px;
  background:#fff;border:1.5px solid var(--line);border-radius:10px;
  font-family:inherit;color:var(--ink);
  transition:.15s;resize:vertical;
}
.fontim-cta-form input:focus,
.fontim-cta-form textarea:focus{
  outline:2px solid var(--accent-soft);
  border-color:var(--accent);
}
.fontim-cta-form input.err,
.fontim-cta-form textarea.err{
  border-color:#E63946;background:#FFF5F6;
}
.fontim-cta-form .cta-submit{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  margin-top:6px;
  padding:14px 28px;border-radius:999px;border:0;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:#fff;font-weight:600;font-size:15.5px;cursor:pointer;
  box-shadow:0 8px 22px rgba(210,122,62,.32);
  transition:.18s;font-family:inherit;align-self:flex-start;
}
.fontim-cta-form .cta-submit:hover{
  transform:translateY(-1px);box-shadow:0 12px 28px rgba(210,122,62,.42);
}
.fontim-cta-form .cta-submit .arrow{display:inline-block;transition:.18s}
.fontim-cta-form .cta-submit:hover .arrow{transform:translateX(-4px)}
.fontim-cta-form .cta-note{
  font-size:12.5px;color:var(--ink-3);margin:4px 0 0;line-height:1.55;
}

/* ============================================================
   UNIFIED FONTS SHOWCASE — all fonts (legacy + new SIL OFL) share the same card.
   @font-face rules + font-family on .preview are generated dynamically in JS so the
   layout works regardless of which fonts exist on disk.
   ============================================================ */
.fontim-fonts-showcase{
  max-width:1200px;margin:32px auto 8px;padding:0 24px;
  font-family:var(--font-ui);
}
.fontim-fonts-showcase .head{
  display:flex;align-items:baseline;justify-content:space-between;
  flex-wrap:wrap;gap:16px;margin-bottom:8px;
}
.fontim-fonts-showcase h2{
  font-family:var(--font-serif) !important;
  font-size:clamp(26px,3.4vw,34px);
  color:var(--ink);font-weight:700;margin:0;letter-spacing:-.01em;
}
.fontim-fonts-showcase .head .legal-note{
  font-size:13px;color:var(--ink-3);
  display:inline-flex;align-items:center;gap:6px;
  padding:5px 12px;background:#E6F7EC;border:1px solid #B8E6C8;
  border-radius:999px;color:#0a7138;font-weight:600;
}
.fontim-fonts-showcase .head .legal-note::before{content:"✓ ";font-weight:900}
.fontim-fonts-showcase .intro{
  font-size:16px;color:var(--ink-2);line-height:1.7;
  margin:6px 0 22px;max-width:780px;
}

.fontim-fonts-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
  gap:18px;
}
.fontim-font-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:22px 22px 20px;
  display:flex;flex-direction:column;gap:14px;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  position:relative;overflow:hidden;
}
.fontim-font-card::before{
  content:"";position:absolute;top:0;inset-inline-start:0;
  height:3px;width:48px;
  background:linear-gradient(90deg,var(--accent),var(--accent-2));
  border-radius:0 0 3px 3px;transition:width .25s ease;
}
.fontim-font-card:hover{
  transform:translateY(-3px);
  box-shadow:0 14px 32px rgba(15,22,32,.10);
  border-color:#E0CCAE;
}
.fontim-font-card:hover::before{width:100%}

.fontim-font-card .head-row{
  display:flex;justify-content:space-between;align-items:start;gap:10px;
}
.fontim-font-card .names{display:flex;flex-direction:column;gap:2px}
.fontim-font-card .name-he{
  font-family:var(--font-serif) !important;
  font-size:22px;font-weight:700;color:var(--ink);line-height:1.2;
}
.fontim-font-card .name-en{
  font-size:12.5px;font-weight:500;color:var(--ink-3);
  letter-spacing:.04em;text-transform:uppercase;
}
.fontim-font-card .cat-badge{
  flex:0 0 auto;font-size:11px;font-weight:700;
  padding:4px 10px;border-radius:999px;
  text-transform:uppercase;letter-spacing:.06em;
}
.fontim-font-card .cat-badge[data-cat="sans-serif"]{background:#EAF2FD;color:#1758c4}
.fontim-font-card .cat-badge[data-cat="serif"]{background:#FBF1E5;color:#8a5320}
.fontim-font-card .cat-badge[data-cat="display"]{background:#F4E9FF;color:#6020A0}

.fontim-font-card .preview{
  font-size:32px;line-height:1.35;color:var(--ink);
  background:var(--bg-soft);
  padding:18px 18px 14px;
  border-radius:10px;
  margin:2px 0;
  text-align:start;
  direction:rtl;
  word-break:break-word;
  overflow:hidden;
  min-height:74px;
  -webkit-font-smoothing:antialiased;
  cursor:text;
  border:2px dashed transparent;
  outline:none;
  transition:.18s border-color, .18s background;
  position:relative;
}
.fontim-font-card .preview:hover{
  background:#FBF1E5;
  border-color:#E0CCAE;
}
.fontim-font-card.is-editing .preview,
.fontim-font-card .preview:focus{
  background:#fff;
  border-color:#D27A3E;
  border-style:solid;
  box-shadow:0 0 0 3px rgba(210,122,62,.15);
}

.fontim-font-card .preview-hint{
  font-size:12px;color:var(--ink-3);font-family:var(--font-ui) !important;
  margin:-4px 0 4px;
  text-align:center;
  opacity:.7;transition:opacity .18s;
  user-select:none;
}
.fontim-font-card:hover .preview-hint{opacity:1;color:#D27A3E}
.fontim-font-card.is-editing .preview-hint{opacity:0}
/* font-family + weight are set inline per-card by buildFontsShowcase() in JS */

.fontim-font-card .desc{
  font-size:14px;color:var(--ink-2);line-height:1.6;margin:0;
  font-family:var(--font-ui) !important;
}
.fontim-font-card .footer{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin-top:auto;padding-top:6px;
}
.fontim-font-card .lic{
  font-size:11.5px;color:var(--ink-3);font-weight:500;
  display:inline-flex;align-items:center;gap:5px;
}
.fontim-font-card .lic::before{
  content:"";width:8px;height:8px;border-radius:50%;
  background:#10A958;display:inline-block;
}
.fontim-font-card .dl{
  display:inline-flex;align-items:center;gap:7px;
  padding:10px 18px;border-radius:999px;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:#fff !important;font-weight:600;font-size:13.5px;
  text-decoration:none;
  box-shadow:0 4px 12px rgba(210,122,62,.28);
  transition:transform .15s, box-shadow .15s;
}
.fontim-font-card .dl:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(210,122,62,.38);
  text-decoration:none;
}
.fontim-font-card .dl svg{width:13px;height:13px;color:#fff}

@media(max-width:520px){
  .fontim-font-card{padding:18px 18px 16px}
  .fontim-font-card .preview{font-size:28px;padding:14px;min-height:60px}
  .fontim-font-card[data-slug="bellefair"] .preview,
  .fontim-font-card[data-slug="suezone"] .preview,
  .fontim-font-card[data-slug="secularone"] .preview,
  .fontim-font-card[data-slug="karantina"] .preview{font-size:30px}
}

/* ============================================================
   HOMEPAGE FONT LIST — restyle the existing Elementor font cards
   so each "row" feels like a polished card with a clear CTA.
   ============================================================ */
body:not(.fontim-post-page) .elementor-widget-button .elementor-button{
  display:inline-flex !important;
  align-items:center;justify-content:center;gap:9px;
  padding:13px 26px !important;
  background:linear-gradient(135deg,#D27A3E 0%,#E89260 100%) !important;
  color:#fff !important;
  border-radius:999px !important;
  font-family:var(--font-ui) !important;
  font-weight:600 !important;font-size:15px !important;
  letter-spacing:.01em;
  text-decoration:none !important;
  border:0 !important;
  box-shadow:0 6px 18px rgba(210,122,62,.30) !important;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease !important;
}
body:not(.fontim-post-page) .elementor-widget-button .elementor-button:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 10px 26px rgba(210,122,62,.42) !important;
  background:linear-gradient(135deg,#C66F32 0%,#E08555 100%) !important;
}
body:not(.fontim-post-page) .elementor-widget-button .elementor-button:active{
  transform:translateY(0) !important;
}
body:not(.fontim-post-page) .elementor-widget-button .elementor-button-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:18px;height:18px;
  margin:0 !important;
  color:#fff;
}
body:not(.fontim-post-page) .elementor-widget-button .elementor-button-icon svg{
  width:100%;height:100%;display:block;color:#fff;
}
/* If FA fails entirely and svg also fails for some reason, hide <i> placeholder square */
body:not(.fontim-post-page) .elementor-widget-button .elementor-button-icon i:not([class*="fa-"]){
  display:none;
}
/* Animated bobbing arrow ::after — uses unicode glyph (downloads icon-feel) */
body:not(.fontim-post-page) .elementor-widget-button .elementor-button-text{
  font-weight:600;line-height:1;
}

/* Each font "row" (alphabet showcase) — gentle hover lift */
body:not(.fontim-post-page) section.elementor-section.elementor-top-section.elementor-section-stretched.elementor-hidden-phone{
  transition:transform .25s ease, box-shadow .25s ease;
}

/* Soft separator under each alphabet showcase + breathing room between cards.
   We can't directly inject around each font row (it's Elementor markup), but
   we can give them a clean transition + scroll-snap-like spacing. */
body:not(.fontim-post-page) section.elementor-section{
  scroll-margin-top:80px;
}

/* The "אבגד..." preview headings — give them more polish */
body:not(.fontim-post-page) .elementor-widget-heading h2.elementor-heading-title p[contenteditable]{
  margin:0;
  letter-spacing:-.005em;
  line-height:1.25;
}

/* ============================================================
   FAQ — modern accordion (replaces broken/limited Elementor toggle)
   ============================================================ */
/* Hide the original Elementor toggle widgets (desktop + mobile dupes) */
.elementor-element-848c31d,
.elementor-element-98e0268{display:none !important}

.fontim-faq{
  max-width:1000px;margin:8px auto 0;padding:0 24px;
}
.fontim-faq-list{
  display:flex;flex-direction:column;gap:12px;
  margin-top:18px;
}
.fontim-faq-item{
  background:var(--bg-card,#fff);
  border:1px solid var(--line,#E6E2D7);
  border-radius:14px;
  overflow:hidden;
  transition:.18s box-shadow, .18s border-color;
}
.fontim-faq-item:hover{
  border-color:#D9C5A8;
  box-shadow:0 4px 14px rgba(15,22,32,.05);
}
.fontim-faq-item.is-open{
  border-color:#D27A3E;
  box-shadow:0 6px 22px rgba(210,122,62,.10);
}
/* CRITICAL overrides for the question button — Elementor applies
   `.elementor button` styles + `:focus` background that bleed through.
   We force transparent / peach background on the question row. */
.fontim-faq-q,
.elementor .fontim-faq-q,
button.fontim-faq-q{
  display:flex !important;align-items:center;justify-content:space-between;gap:14px;
  width:100% !important;text-align:start;
  padding:18px 24px !important;
  font-family:var(--font-ui),'Heebo',sans-serif !important;
  font-size:17px !important;font-weight:600 !important;
  color:var(--ink,#0F1620) !important;
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  border:0 !important;cursor:pointer !important;
  line-height:1.4 !important;
  box-shadow:none !important;
  border-radius:14px !important;
  appearance:none !important;-webkit-appearance:none !important;
}
.fontim-faq-q:hover,
.elementor .fontim-faq-q:hover{
  color:#D27A3E !important;
  background:transparent !important;
  background-color:transparent !important;
}
.fontim-faq-q:focus,
.fontim-faq-q:focus-visible,
.fontim-faq-q:active,
.elementor .fontim-faq-q:focus,
.elementor .fontim-faq-q:active{
  outline:none !important;
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
}
.fontim-faq-item.is-open .fontim-faq-q,
.elementor .fontim-faq-item.is-open .fontim-faq-q{
  background:linear-gradient(135deg,#FFF6EC 0%,#FFFAF3 100%) !important;
  background-color:#FFF6EC !important;
  color:var(--ink,#0F1620) !important;
}
.fontim-faq-item.is-open .fontim-faq-q .t,
.elementor .fontim-faq-item.is-open .fontim-faq-q .t{
  color:var(--ink,#0F1620) !important;
}
.fontim-faq-q .ico{
  flex:0 0 auto;
  width:32px;height:32px;border-radius:50%;
  background:linear-gradient(135deg,#FBF1E5,#FFF);
  border:1px solid #EFE0C8;
  display:grid;place-items:center;
  color:#D27A3E;font-weight:700;font-size:18px;line-height:1;
  transition:.22s transform, .22s background, .22s color;
}
.fontim-faq-item.is-open .fontim-faq-q .ico{
  background:linear-gradient(135deg,#D27A3E,#E89260);
  color:#fff;
  transform:rotate(45deg);
}
.fontim-faq-a{
  max-height:0;overflow:hidden;
  transition:max-height .35s ease;
  padding:0 24px;
}
.fontim-faq-item.is-open .fontim-faq-a{
  max-height:600px;
}
.fontim-faq-a-inner{
  padding:0 0 22px;
  font-family:var(--font-ui),'Heebo',sans-serif;
  font-size:15.5px;color:var(--ink-2,#3a4754);line-height:1.75;
}
.fontim-faq-a-inner ul,
.fontim-faq-a-inner ol{padding-inline-start:1.4em;margin:.5em 0}
.fontim-faq-a-inner li{margin:.25em 0}
.fontim-faq-a-inner strong{color:var(--ink,#0F1620)}
.fontim-faq-a-inner a{color:#D27A3E;font-weight:600}
.fontim-faq-a-inner a:hover{text-decoration:underline}

@media(max-width:520px){
  .fontim-faq-q{padding:15px 18px;font-size:15.5px}
  .fontim-faq-a{padding:0 18px}
  .fontim-faq-a-inner{font-size:14.5px}
}