/* English pages: the few things the Arabic components never needed. */

/* the Arabic name under an English one */
.olympic-en .inst-card__ar {
    display: block;
    margin-block-start: 2px;
    font-size: .82rem;
    color: var(--muted);
    direction: rtl;
    unicode-bidi: isolate;
    font-family: var(--font-body);
}

/* a review's original text, kept one click away */
.olympic-en .review-card__orig {
    margin-block-start: 14px;
    padding-block-start: 12px;
    border-block-start: 1px solid var(--border);
    font-size: .82rem;
    color: var(--muted);
}

.olympic-en .review-card__orig summary {
    cursor: pointer;
    list-style: none;
}

.olympic-en .review-card__orig summary::-webkit-details-marker { display: none; }
.olympic-en .review-card__orig summary:hover { color: var(--text); }

.olympic-en .review-card__orig p {
    margin: 10px 0 0;
    line-height: 1.9;
    color: var(--text-soft);
    font-family: var(--font-body);
}

/* the theme's line heights are set for Arabic; English reads better a little tighter */
.olympic-en .review-card blockquote { line-height: 1.75; }
.olympic-en .feature-card p { line-height: 1.75; }

/* the benefits of a partnership, as a tick list */
.olympic-en .oi-ticks {
    list-style: none;
    margin: 0 0 24px;
    padding: 0;
    display: grid;
    gap: 10px;
}

.olympic-en .oi-ticks li {
    position: relative;
    padding-inline-start: 28px;
    line-height: 1.7;
    color: var(--text-soft);
}

.olympic-en .oi-ticks li::before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: .5em;
    width: 12px;
    height: 7px;
    border-inline-start: 2px solid var(--cyan-fg, var(--cyan));
    border-block-end: 2px solid var(--cyan-fg, var(--cyan));
    transform: rotate(-45deg);
}

/* the steps to a licence, numbered */
.olympic-en .oi-steps {
    counter-reset: oi-step;
    list-style: none;
    margin: 0 0 24px;
    padding: 0;
    display: grid;
    gap: 12px;
}

.olympic-en .oi-steps li {
    counter-increment: oi-step;
    position: relative;
    padding-inline-start: 44px;
    min-height: 30px;
    line-height: 1.7;
    color: var(--text-soft);
}

.olympic-en .oi-steps li::before {
    content: counter(oi-step);
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 0;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-weight: 800;
    font-size: .9rem;
    color: var(--text);
    background: var(--surf-a);
    border: 1px solid var(--border);
}

.olympic-en .oi-partner-form { padding-block: 8px 56px; }

/* The theme centres its hidden "skip to content" link with a shift written for right-to-left.
   Left to right it pushes the link past the edge of the screen, and a phone then widens the page. */
.olympic-en .skip-link { transform: translateX(-50%); }

/* The English header is wider than a phone: a long name, a button, the theme switch and the menu button
   do not fit side by side, and the page was widening to make room. On a phone the name wraps and the
   button is dropped (the menu has a WhatsApp button of its own). */
@media (max-width: 520px) {
    .olympic-en .nav { gap: 10px; }
    .olympic-en .nav .brand { min-width: 0; flex: 1 1 auto; }
    .olympic-en .nav .brand__text { min-width: 0; }
    .olympic-en .nav .brand__text b,
    .olympic-en .nav .brand__text span { white-space: normal; overflow-wrap: anywhere; line-height: 1.25; }
    .olympic-en .nav .brand__text b { font-size: .9rem; }
    .olympic-en .nav .brand__text span { font-size: .8rem; }
    .olympic-en .nav__actions { flex: none; gap: 6px; }
    .olympic-en .nav__actions .btn--primary { display: none; }
}
