body:has(dialog[open]){overflow:hidden}dialog{border:1px solid #aeb6a5;background:var(--paper);color:var(--ink);padding:46px;max-width:560px;width:calc(100% - 32px);max-height:calc(100dvh - 40px);box-shadow:0 35px 100px #1c261a45}dialog::backdrop{background:#1d291e77;backdrop-filter:blur(5px)}.dialog-close{position:absolute;top:10px;inset-inline-end:12px;font-size:28px;width:40px;height:40px}.dialog-close:hover{background:#dde2d5}dialog>.eyebrow{color:#746750}dialog h2{font:43px/1.08 var(--serif);letter-spacing:-.035em;margin:16px 0}dialog p:not(.eyebrow){font-size:14px;line-height:1.8;color:var(--muted)}dialog ul{padding-inline-start:18px;font-size:13px;line-height:1.7;margin:22px 0}dialog li{padding:4px 0}dialog .button{margin-top:15px;width:100%}.contact-options{display:grid;gap:8px;margin-top:22px}.contact-options button{text-align:start;min-height:46px;padding:12px 15px;border:1px solid #bcc4b1;font-size:13px;display:flex;justify-content:space-between}.contact-options button:hover,.contact-options button[aria-pressed=true]{background:#dee4d3;border-color:#647251}.contact-response{margin-top:18px}.preview-note{border-top:1px solid var(--line);padding-top:17px;margin-top:20px;font-size:11px!important}dialog dl{margin-top:25px}dialog dl>div{padding:14px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;font-size:12px}dialog dd{margin:0;white-space:nowrap}

html[data-text-reflow="true"] dialog dl > div {
  align-items: flex-start;
  flex-wrap: wrap;
}
html[data-text-reflow="true"] dialog dd {
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
}
html[data-text-reflow="true"] dialog :is(h2, p, li, dt, dd, .button span) {
  max-width: 100%;
  overflow-wrap: anywhere;
}
@media (max-width: 680px) {
  html[data-text-reflow="true"] dialog dl > div {
    flex-direction: column;
    gap: 4px;
  }
}

/* Home dialogs are siblings of .stage, so they need an explicit Arabic type scope. */
html[dir="rtl"] dialog,
html[dir="rtl"] dialog * {
  font-family: Arabic, Arial, sans-serif;
  letter-spacing: 0;
}

.contact-handoff[hidden] { display: none; }
.contact-handoff { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--line); }
.contact-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
dialog .contact-actions .button { margin-top: 0; min-width: 0; }
dialog .contact-actions .contact-secondary { background: transparent; color: var(--ink); border-color: #90826c; }
dialog .contact-actions .contact-secondary:hover { background: #e4dccd; color: var(--ink); }
.contact-address { margin-top: 16px; }
.contact-address a { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.contact-warning { padding-inline-start: 12px; border-inline-start: 2px solid #90826c; }

@media (max-width: 520px) {
  .contact-actions { grid-template-columns: 1fr; }
}

/* The approved full lockup has its own About presentation; other information panels stay compact. */
#about-dialog {
  width: min(930px, calc(100% - 32px));
  max-width: 930px;
  padding: 0;
  background: var(--paper);
  border-color: var(--line);
}
#about-dialog .dialog-close { z-index: 1; }
.about-layout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); }
.about-logo {
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 440px;
  padding: 40px 28px;
  background: var(--paper);
  border-inline-end: 1px solid var(--line);
  isolation: isolate;
}
.about-logo-crop { position: relative; width: min(100%, 420px); aspect-ratio: 680 / 600; overflow: hidden; }
.about-logo img {
  position: absolute;
  inset-block-start: -33.3333333%;
  inset-inline-start: -23.5294118%;
  width: 147.0588235%;
  max-width: none;
  height: auto;
  mix-blend-mode: darken;
  transform: none;
}
.about-copy { display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: 66px 42px 40px; }
.about-copy h2 { font-size: clamp(30px, 3vw, 43px); line-height: 1.15; }
.about-copy > p:not(.eyebrow) { font-size: 16px; line-height: 1.7; }
.about-copy .button { min-height: 46px; }
html[dir="rtl"] .about-copy h2 { letter-spacing: 0; }

@media (max-width: 700px) {
  .about-layout { grid-template-columns: 1fr; }
  .about-logo { min-height: 0; padding: 38px 24px 14px; border-inline-end: 0; border-bottom: 1px solid var(--line); }
  .about-logo-crop { width: min(100%, 320px); }
  .about-copy { padding: 18px 24px 28px; }
  .about-copy h2 { font-size: clamp(28px, 7vw, 34px); margin: 10px 0 12px; }
  .about-copy > p:not(.eyebrow) { font-size: 14px; }
}

html[data-text-reflow="true"] .about-layout { display: block; }
html[data-text-reflow="true"] .about-logo { min-height: 0; border-inline-end: 0; border-bottom: 1px solid var(--line); }
