/* ===== Orto Global Styles (universal) ===== */
:root{
  --container-max: 980px;
  --brand-yellow: #ffd200;
  --brand-red: #b30000;
  --lime-btn: #eaff00;
  --logo-h: 60px; /* ~50% larger than 40px */
}

/* Base */
html, body { margin:0; padding:0; }
body{
  font-family: "Vazirmatn", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  direction: rtl;
  text-align: right;
  background:#f5f5f5;
  color:#111;
}
main, .container{
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 14px;
}

/* Persian multi-line text: right + justify */
p, li, .justify{
  text-align: justify;
  text-justify: inter-word;
  direction: rtl;
}
h1,h2,h3,h4,h5,h6{ direction: rtl; text-align: right; }

/* Universal Topbar */
.site-topbar{
  background: var(--brand-yellow);
  border-bottom: 1px solid rgba(0,0,0,0.08);
}
.site-topbar .wrap{
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 10px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.site-topbar .brand{
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  color:inherit;
  min-width: 0;
}
.site-topbar .brand img{
  height: var(--logo-h);
  width:auto;
  display:block;
}
.site-topbar .brand .txt{
  display:flex;
  flex-direction:column;
  line-height:1.25;
  min-width:0;
}
.site-topbar .brand .txt .name{
  font-weight: 900;
  font-size: 20px;
  color: var(--brand-red);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.site-topbar .brand .txt .sub{
  font-weight: 800;
  font-size: 14px;
  color:#6b0000;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.site-topbar .cta{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.site-topbar .cta a{
  text-decoration:none;
  font-weight:900;
  padding:10px 14px;
  border-radius:12px;
  color:#fff;
  display:inline-flex;
  align-items:center;
  gap:8px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12);
}
.site-topbar .cta a.btn-neshan{ background:#b30000; }
.site-topbar .cta a.btn-google{ background:#1e6fe6; }

@media (max-width: 768px){
  :root{ --logo-h: 52px; } /* still ~50% bigger than 35px-ish */
  .site-topbar .wrap{ flex-direction:column; align-items:stretch; }
  .site-topbar .cta{ justify-content:center; }
  .site-topbar .brand{ justify-content:center; }
  .site-topbar .brand .txt .name{ font-size:18px; }
}

/* Make nav area sit nicely under topbar */
#nav-placeholder{ background: #eee; }