/* ============================================================
   Omri — MAIN CSS (deferred, non-render-blocking)
   Below-the-fold + components: grids, cards, prose, footer…
   ============================================================ */

/* --- Trust strip (front page) --- */
.omri-trust{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-block:8px 40px}
.omri-trust-item{background:var(--omri-card);border:1px solid var(--omri-line);border-radius:14px;padding:14px 16px;display:flex;align-items:center;gap:10px;font-weight:500;font-size:.95rem}
.omri-trust-item svg{flex:none}

/* --- Card grid --- */
.omri-grid{display:grid;grid-template-columns:1fr;gap:18px;margin-block:8px 8px}
.omri-card{background:var(--omri-card);border:1px solid var(--omri-line);border-radius:var(--omri-radius);overflow:hidden;box-shadow:var(--omri-shadow);transition:transform .18s,box-shadow .18s}
.omri-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(15,118,110,.16)}
.omri-card-link{display:flex;flex-direction:column;height:100%;text-decoration:none;color:inherit}
.omri-card-media{aspect-ratio:16/10;overflow:hidden;background:var(--omri-sand-deep)}
.omri-card-media img{width:100%;height:100%;object-fit:cover}
.omri-card-body{display:flex;flex-direction:column;gap:8px;padding:18px;flex:1}
.omri-card-title{font-family:var(--omri-font-head);font-weight:700;font-size:1.1rem;color:var(--omri-teal-deep);line-height:1.7}
.omri-card-excerpt{color:var(--omri-muted);font-size:.92rem;line-height:1.8;flex:1}
.omri-card-cta{align-self:flex-start;font-weight:700;color:var(--omri-amber-dark);font-size:.95rem}
.omri-card-cta::after{content:"←";margin-inline-start:6px} /* RTL: forward arrow */

/* --- Hub intro + child count --- */
.omri-hub-meta{color:var(--omri-muted);font-size:.9rem;margin-block-end:1.4em}

/* --- Article prose --- */
.omri-prose{max-width:78ch}
.omri-prose h2{font-size:1.45rem;margin-block:1.8em .7em;padding-block-start:.4em;border-block-start:3px solid var(--omri-sand-deep)}
.omri-prose h3{font-size:1.2rem;margin-block:1.6em .6em;color:var(--omri-teal)}
.omri-prose ul,.omri-prose ol{padding-inline-start:1.4em;margin-block:0 1.2em}
.omri-prose li{margin-block-end:.4em}
.omri-prose blockquote{margin:1.4em 0;padding:14px 20px;border-inline-start:4px solid var(--omri-amber);background:#fff;border-radius:12px;color:var(--omri-muted)}
.omri-prose table{width:100%;border-collapse:collapse;margin-block:1.4em;font-size:.95rem;background:#fff;border-radius:12px;overflow:hidden}
.omri-prose th{background:var(--omri-teal);color:#fff;font-family:var(--omri-font-head);padding:12px 14px;text-align:start}
.omri-prose td{padding:10px 14px;border-block-end:1px solid var(--omri-line)}
.omri-prose tr:nth-child(even) td{background:#FBF8F0}
.omri-table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-block:1.4em}
.omri-table-scroll table{margin-block:0;min-width:560px}

/* Featured image on articles — explicit ratio reserves space (no CLS) */
.omri-featured{margin-block:20px 28px;border-radius:var(--omri-radius);overflow:hidden;aspect-ratio:1200/630;background:var(--omri-sand-deep)}
.omri-featured img{width:100%;height:100%;object-fit:cover}

/* Author box */
.omri-author{display:flex;gap:16px;align-items:center;background:#fff;border:1px solid var(--omri-line);border-radius:var(--omri-radius);padding:20px;margin-block:36px}
.omri-author-avatar{inline-size:72px;block-size:72px;border-radius:50%;background:var(--omri-teal);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--omri-font-head);font-weight:800;font-size:1.6rem;flex:none}
.omri-author-name{font-family:var(--omri-font-head);font-weight:700;color:var(--omri-teal-deep)}
.omri-author-bio{color:var(--omri-muted);font-size:.92rem;margin:0}

/* Related pages */
.omri-related{margin-block:40px}

/* --- FAQ / CTA band --- */
.omri-cta-band{background:var(--omri-teal-deep);color:#fff;border-radius:28px;padding:clamp(28px,6vw,56px);text-align:center;margin-block:56px}
.omri-cta-band h2{color:#fff;font-size:1.6rem}
.omri-cta-band p{color:#D8EAE7;max-width:56ch;margin-inline:auto}

/* --- Footer --- */
.omri-footer{background:var(--omri-teal-deep);color:#D8EAE7;margin-block-start:64px;padding-block:48px calc(28px + env(safe-area-inset-bottom,0px))}
.omri-footer-grid{display:grid;gap:32px}
.omri-footer-brand .omri-brand-word{color:#fff}
.omri-footer-brand .omri-brand-tag{color:#A9C7C3}
.omri-footer-desc{font-size:.92rem;color:#A9C7C3;max-width:38ch}
.omri-footer h3{color:#fff;font-size:1.05rem;margin-block-end:1em}
.omri-footer-nav ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.omri-footer-nav a{color:#D8EAE7;text-decoration:none;display:inline-flex;align-items:center;min-height:44px;padding:4px 0}
.omri-footer-nav a:hover{color:var(--omri-amber)}
.omri-footer-bottom{border-block-start:1px solid rgba(255,255,255,.14);margin-block-start:32px;padding-block-start:20px;display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;font-size:.85rem;color:#A9C7C3}

/* --- Back to top --- */
.omri-to-top{
  position:fixed;inset-block-end:calc(20px + env(safe-area-inset-bottom,0px));inset-inline-end:20px;z-index:120;
  inline-size:52px;block-size:52px;border-radius:50%;border:none;
  background:var(--omri-amber);color:#3A2A05;box-shadow:0 10px 24px rgba(0,0,0,.25);
  display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .25s;
}
.omri-to-top[data-omri-visible]{opacity:1;pointer-events:auto}

/* --- Search form --- */
.omri-search{display:flex;gap:8px;max-width:480px;margin-block:20px}
.omri-search input{flex:1;min-height:52px;border:2px solid var(--omri-line);border-radius:14px;padding:10px 16px;background:#fff;min-width:0}
.omri-search input:focus{outline:3px solid rgba(15,118,110,.25);border-color:var(--omri-teal)}
.omri-search button{min-height:52px;padding:10px 24px;border:none;border-radius:14px;background:var(--omri-teal);color:#fff;font-weight:700}

/* --- 404: base styles live in critical.css (CLS fix); only the deferred extras stay here --- */

/* --- Lottie animations (containers are pre-sized: zero layout shift) --- */
/* Homepage hero: decorative calendar animation, inline-end side, hidden on small screens */
.omri-hero-lottie{position:absolute;inset-inline-end:clamp(12px,5vw,72px);top:50%;transform:translateY(-50%);width:clamp(140px,24vw,300px);aspect-ratio:1/1;pointer-events:none;opacity:.95}
@media (max-width:700px){.omri-hero-lottie{display:none}}
/* Tool result-state badge: tiny overlay in the tool wrap corner (positioned by JS-added class) */
.omri-tool-wrap{position:relative}
.omri-lottie-badge{position:absolute;inset-inline-end:14px;top:14px;width:64px;height:64px;pointer-events:none;opacity:0;transform:scale(.6);transition:opacity .25s ease,transform .25s ease;z-index:5}
.omri-lottie-badge.is-visible{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.omri-lottie-badge{display:none}}

/* --- Desktop enhancements (≥700px) --- */
@media (min-width:700px){
  .omri-grid{grid-template-columns:repeat(2,1fr)}
  .omri-hero h1{font-size:2.6rem}
  .omri-footer-grid{grid-template-columns:1.4fr 1fr 1fr}
}
@media (min-width:1024px){
  .omri-grid{grid-template-columns:repeat(3,1fr)}
  .omri-grid.omri-grid-4{grid-template-columns:repeat(4,1fr)}
  .omri-hero h1{font-size:3rem}
  .omri-page-head h1{font-size:2.3rem}
}

/* --- Reduced motion --- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
}

/* --- Print --- */
@media print{
  .omri-header,.omri-footer,.omri-to-top,.omri-nav-toggle,.omri-crumbs,.omri-cta-band{display:none}
  body{background:#fff}
  .omri-tool-wrap{box-shadow:none}
}