/* /enterprise/: hero panel, what you get, security answers, rollout, Arabic and
 * English, the plan. Tokens from knowledge.css; logical properties for RTL. */

.ent-section .section-sub { max-width: 70ch; }

/* Walkthrough first, waitlist second, then the note and the mailto link. */
.ent-actions { gap: 10px; }
.ent-mail {
  font-size: 14px;
  font-weight: 550;
  color: var(--brand-a);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}
.ent-mail:hover { color: var(--brand-b); }

/* Hero panel: three layers held by one rule. */
.ent-stack {
  width: 100%;
  max-width: 500px;
  margin-inline: auto;
  padding: 18px;
  display: grid;
  gap: 10px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-pop);
  text-align: start;
}
.ent-stack-rule {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-self: start;
  padding: 6px 12px;
  border-radius: 999px;
  background: var(--brand-tint);
  color: var(--brand-b);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0.02em;
}
.ent-lock {
  width: 9px;
  height: 7px;
  border-radius: 2px;
  background: currentColor;
  position: relative;
  margin-top: 3px;
}
.ent-lock::before {
  content: "";
  position: absolute;
  left: 1px;
  bottom: 5px;
  width: 3px;
  height: 4px;
  border: 2px solid currentColor;
  border-bottom: 0;
  border-radius: 4px 4px 0 0;
}
.ent-layer {
  display: grid;
  gap: 4px;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid var(--line-soft);
  border-inline-start: 4px solid var(--brand-a);
  background: var(--bg);
}
.ent-layer b { color: var(--ink); font-size: 15px; font-weight: 650; }
.ent-layer span { color: var(--ink-2); font-size: 13px; line-height: 1.45; }
.ent-layer-a { border-inline-start-color: var(--plane-tender); }
.ent-layer-b { border-inline-start-color: var(--good); }
.ent-layer-c { border-inline-start-color: var(--plane-investor); }
.ent-stack-foot { margin: 4px 2px 0; font-size: 12px; line-height: 1.5; color: var(--muted); }

/* What an organisation gets. */
.ent-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 28px;
}
.ent-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 22px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}
.ent-card h3 { margin: 0; font-size: 17px; color: var(--ink); line-height: 1.3; }
.ent-card p { margin: 0; color: var(--ink-2); font-size: 14px; line-height: 1.6; flex: 1; }
.ent-card a { font-size: 14px; font-weight: 600; color: var(--brand-a); text-decoration: none; }
.ent-card a:hover { text-decoration: underline; }
[dir="rtl"] .ent-card a span { display: inline-block; transform: scaleX(-1); }

/* Security answers. */
.ent-answers {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin-top: 26px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel);
  overflow: hidden;
}
.ent-answer { padding: 22px; border-bottom: 1px solid var(--line-soft); border-inline-end: 1px solid var(--line-soft); }
.ent-answer:nth-child(3n) { border-inline-end: 0; }
.ent-answer:nth-last-child(-n + 3) { border-bottom: 0; }
.ent-answer h3 { margin: 0 0 8px; font-size: 15px; color: var(--ink); }
.ent-answer p { margin: 0; font-size: 14px; line-height: 1.6; color: var(--ink-2); }
.ent-more { margin-top: 18px; color: var(--muted); max-width: 72ch; }

/* Rollout reuses .ea-steps from convert.css. */
.ent-rollout { margin-top: 26px; }

/* Arabic and English. */
.ent-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 40px;
  align-items: start;
}
.ent-split h2 { margin: 6px 0 14px; }
.ent-split p { color: var(--ink-2); line-height: 1.6; max-width: 52ch; }
.ent-ticks { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.ent-ticks li {
  position: relative;
  padding: 14px 16px 14px 44px;
  padding-inline: 44px 16px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--ink-2);
  line-height: 1.5;
}
.ent-ticks li::before {
  content: "";
  position: absolute;
  inset-inline-start: 18px;
  top: 19px;
  width: 11px;
  height: 6px;
  border-inline-start: 2px solid var(--good);
  border-bottom: 2px solid var(--good);
  transform: rotate(-45deg);
}
[dir="rtl"] .ent-ticks li::before { transform: rotate(45deg) scaleX(-1); }
.ent-ticks a { margin-inline-start: 6px; font-weight: 600; color: var(--brand-a); }

/* The plan. */
.ent-plan {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  gap: 36px;
  align-items: center;
  padding: 36px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--line);
  background: linear-gradient(135deg, var(--brand-grad-soft), var(--panel) 70%);
}
.ent-plan h2 { margin: 6px 0 12px; }
.ent-plan-copy p { color: var(--ink-2); line-height: 1.6; }
.ent-plan-copy p + p { margin-top: 12px; }
.ent-plan-other { font-size: 14px; color: var(--muted) !important; }
.ent-plan-list { list-style: none; margin: 4px 0 16px; padding: 0; display: grid; gap: 8px; }
.ent-plan-list li { position: relative; padding-inline-start: 24px; font-size: 15px; line-height: 1.5; color: var(--ink-2); }
.ent-plan-list li::before { content: ""; position: absolute; inset-inline-start: 2px; top: 0.45em; width: 12px; height: 7px; border-inline-start: 2px solid var(--good); border-bottom: 2px solid var(--good); transform: rotate(-45deg); }

@media (max-width: 980px) {
  .ent-grid, .ent-answers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ent-answer:nth-child(3n) { border-inline-end: 1px solid var(--line-soft); }
  .ent-answer:nth-child(2n) { border-inline-end: 0; }
  .ent-answer:nth-last-child(-n + 3) { border-bottom: 1px solid var(--line-soft); }
  .ent-answer:nth-last-child(-n + 2) { border-bottom: 0; }
  .ent-split, .ent-plan { grid-template-columns: minmax(0, 1fr); gap: 24px; }
}
@media (max-width: 640px) {
  .ent-grid, .ent-answers { grid-template-columns: minmax(0, 1fr); }
  .ent-answer, .ent-answer:nth-child(n) { border-inline-end: 0; border-bottom: 1px solid var(--line-soft); }
  .ent-answer:last-child { border-bottom: 0; }
  .ent-plan { padding: 22px; }
  .ent-stack { padding: 14px; }
}
