/* Refreshed inner pages: Admissions, Curriculum, Facilities, Open Day (pr- prefix).
   Same tokens as the homepage (hm-): DM Sans / Cairo, weights 400/500/700, px sizes, 2px shapes, navy + gold.
   The site body is 24px, so every element sets its own size. Bump ?v= on the <link> when this file changes. */
:root {
    --pr-navy: #272555;
    --pr-gold: #E3A81F;
    --pr-text: #434A62;
    --pr-ink: #303B57;
    --pr-tint: #F6F6F8;
    --pr-line: #E6E6EE;
    --pr-shadow: 2px 4px 24px rgb(46 44 111 / 10%);
    --pr-shadow-up: 4px 12px 32px rgb(46 44 111 / 18%);
    --pr-ease: cubic-bezier(.2, .7, .2, 1);
}

/* ---------- reveal on scroll (only once JS ran, so no-JS visitors still see everything) ---------- */
.pr-js .pr-reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s var(--pr-ease), transform .7s var(--pr-ease); transition-delay: var(--pr-d, 0s); }
.pr-js .pr-reveal.is-in { opacity: 1; transform: none; }

/* ---------- banner (the existing banner markup, restyled) ---------- */
.pr-banner { position: relative; overflow: hidden; padding: 118px 0 108px; isolation: isolate; }
.pr-banner::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(100deg, rgb(39 37 85 / 88%) 0%, rgb(39 37 85 / 62%) 55%, rgb(39 37 85 / 38%) 100%); }
.pr-banner.pr-banner::after { content: none; }
.pr-banner .banner-head__cs { margin-bottom: 0; animation: pr-up .8s var(--pr-ease) both; }
.pr-banner .banner-head__cs::after { content: ''; display: block; width: 56px; height: 3px; margin: 18px auto 0; background: var(--pr-gold); }
.pr-banner .banner-head__cs_1, .pr-banner .banner-head__cs_2 { margin-top: 16px; margin-bottom: 0; animation: pr-up .8s .1s var(--pr-ease) both; }
.pr-banner .breadcrubs-wrpr { display: inline-flex; width: auto; margin: 26px auto 0; padding: 4px 18px; border-radius: 2px; background: rgb(255 255 255 / 12%); backdrop-filter: blur(6px); animation: pr-up .8s .2s var(--pr-ease) both; }
.pr-banner { text-align: center; }
.pr-banner .breadcrubs-wrpr a, .pr-banner .breadcrubs-wrpr span { font-size: 16px; line-height: 30px; }
@keyframes pr-up { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

/* ---------- sections ---------- */
.pr-section { padding: 80px 0; overflow-x: clip; }
.pr-section--tint { background: var(--pr-tint); }
.pr-anchor { scroll-margin-top: 150px; }
.pr-h2 { position: relative; margin: 0 0 26px; padding-bottom: 16px; font-size: clamp(26px, 3vw, 36px); line-height: 1.25; font-weight: 700; color: var(--pr-navy); display: block; }
.pr-h2::after { content: ''; position: absolute; bottom: 0; inset-inline-start: 0; width: 48px; height: 3px; background: var(--pr-gold); }
.pr-h2--center { text-align: center; }
.pr-h2--center::after { inset-inline-start: 50%; margin-inline-start: -24px; }
.pr-prose p { font-size: 18px; line-height: 32px; color: var(--pr-text); margin: 0 0 18px; opacity: 1; }
.pr-prose p:last-child { margin-bottom: 0; }
.pr-center-lead { max-width: 760px; margin: 0 auto 44px; text-align: center; font-size: 18px; line-height: 32px; color: var(--pr-text); }
.pr-lead { margin: 0 0 18px; padding-inline-start: 22px; border-inline-start: 4px solid var(--pr-gold); font-size: 18px; line-height: 32px; font-weight: 500; color: var(--pr-navy); }
.pr-prose p.pr-lead { font-size: 18px; line-height: 32px; color: var(--pr-navy); margin-bottom: 18px; }
/* intro photo beside the Admissions intro: slightly taller than its natural 3:2 so it balances the text */
.pr-figure--intro img { aspect-ratio: 5 / 4; object-fit: cover; }
.pr-cta-row.pr-cta-row--start { justify-content: flex-start; }
.pr-figure--crop img { aspect-ratio: 4 / 3; object-fit: cover; object-position: center 30%; }
.pr-figure { position: relative; margin: 0; }
.pr-figure img { position: relative; z-index: 1; display: block; width: 100%; height: auto; border-radius: 2px; box-shadow: var(--pr-shadow); }
.pr-figure::before { content: ''; position: absolute; inset: 20px -16px -16px 20px; border: 3px solid var(--pr-gold); border-radius: 2px; transition: transform .6s var(--pr-ease); }
[dir="rtl"] .pr-figure::before { inset: 20px 20px -16px -16px; }
.pr-figure:hover::before { transform: translate(6px, 6px); }
[dir="rtl"] .pr-figure:hover::before { transform: translate(-6px, 6px); }

/* ---------- jump bar ---------- */
.pr-pills { position: sticky; top: 84px; z-index: 20; background: #fff; border-bottom: 1px solid var(--pr-line); box-shadow: 0 4px 14px rgb(46 44 111 / 6%); }
.pr-pills-in { display: flex; gap: 8px; overflow-x: auto; padding: 12px 0; scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; }
.pr-pills-in::-webkit-scrollbar { display: none; }
.pr-pills a { flex: 0 0 auto; padding: 8px 18px; border-radius: 2px; font-size: 14px; line-height: 22px; font-weight: 500; color: var(--pr-text); text-decoration: none; background: var(--pr-tint); transition: background-color .3s, color .3s; }
.pr-pills a:hover, .pr-pills a.is-on { background: var(--pr-navy); color: #fff; }

/* ---------- cards ---------- */
.pr-card { position: relative; height: 100%; background: #fff; border-radius: 2px; border-top: 3px solid transparent; box-shadow: var(--pr-shadow); padding: 30px 26px 26px; transition: transform .45s var(--pr-ease), box-shadow .45s var(--pr-ease), border-color .3s; }
.pr-card:hover { transform: translateY(-6px); box-shadow: var(--pr-shadow-up); border-top-color: var(--pr-gold); }
.pr-card h3, .pr-card h4 { font-size: 19px; line-height: 29px; font-weight: 700; color: var(--pr-navy); margin: 0 0 12px; text-align: start; }
.pr-card p { font-size: 16px; line-height: 27px; color: var(--pr-text); margin: 0 0 18px; opacity: 1; text-align: start; }
.pr-card--steps { display: flex; flex-direction: column; }
.pr-card--steps .pr-link { margin-top: auto; }
.pr-num { position: absolute; top: 14px; inset-inline-end: 20px; font-size: 56px; line-height: 1; font-weight: 700; color: rgb(39 37 85 / 7%); pointer-events: none; }
.pr-icon { display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; margin-bottom: 20px; border-radius: 50%; background: rgb(227 168 31 / 14%); }
.pr-icon img { width: 30px; height: 30px; object-fit: contain; }
.pr-icon i { font-size: 28px; line-height: 1; color: var(--pr-gold); }
.pr-card--intent img { height: 44px; width: auto; margin-bottom: 14px; }

.pr-link { display: inline-flex; align-items: center; gap: 8px; font-size: 16px; line-height: 24px; font-weight: 700; color: var(--pr-navy); text-decoration: none; transition: color .3s, gap .3s; }
.pr-link i { font-size: 16px; color: var(--pr-gold); transition: transform .3s var(--pr-ease); }
.pr-link:hover { color: var(--pr-navy); gap: 12px; }
.pr-link:hover i { transform: translateX(3px); }
[dir="rtl"] .pr-link i { transform: scaleX(-1); }
[dir="rtl"] .pr-link:hover i { transform: scaleX(-1) translateX(3px); }

/* ---------- check lists ---------- */
.pr-checks { list-style: none; margin: 0; padding: 0; }
.pr-checks li { position: relative; padding: 5px 0; padding-inline-start: 36px; font-size: 18px; line-height: 30px; color: var(--pr-text); opacity: 1; break-inside: avoid; }
.pr-checks li::before { content: ''; position: absolute; top: 10px; inset-inline-start: 0; width: 20px; height: 20px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='10' fill='%23E3A81F'/%3E%3Cpath d='M5.5 10.5l3 3 6-6.5' fill='none' stroke='%23272555' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
.pr-checks--2 { column-count: 2; column-gap: 48px; }
.pr-panel { background: #fff; border-radius: 2px; box-shadow: var(--pr-shadow); padding: 28px 32px; }
.pr-checks--tight li { font-size: 16px; line-height: 27px; padding: 7px 0; padding-inline-start: 34px; }
.pr-checks--tight li::before { top: 10px; }

/* ---------- admissions: step timeline ---------- */
.pr-steps { position: relative; }
.pr-step { position: relative; display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 24px; padding-bottom: 32px; }
.pr-step:last-child { padding-bottom: 0; }
.pr-step::before { content: ''; position: absolute; top: 56px; bottom: 0; inset-inline-start: 27px; width: 2px; background: linear-gradient(var(--pr-gold), rgb(227 168 31 / 18%)); }
.pr-step:last-child::before { display: none; }
.pr-step-mark { position: relative; z-index: 1; width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--pr-navy); color: var(--pr-gold); font-size: 22px; line-height: 1; font-weight: 700; box-shadow: 0 0 0 6px #fff, 0 0 0 8px rgb(227 168 31 / 40%); }
.pr-step-body { background: #fff; border-radius: 2px; box-shadow: var(--pr-shadow); padding: 30px 32px; }
.pr-step-body h3 { margin: 0 0 12px; font-size: 25px; line-height: 34px; font-weight: 700; color: var(--pr-navy); }
.pr-step-body h5 { margin: 0 0 8px; font-size: 18px; line-height: 28px; font-weight: 700; color: var(--pr-navy); }
.pr-step-body p { margin: 0 0 14px; font-size: 16px; line-height: 27px; color: var(--pr-text); opacity: 1; }
.pr-label { margin: 22px 0 10px; font-size: 14px; line-height: 22px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--pr-gold); }
.pr-minis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 20px 0 0; }
.pr-mini { padding: 20px; background: var(--pr-tint); border-radius: 2px; border-top: 3px solid var(--pr-gold); }
.pr-mini p:last-child { margin-bottom: 0; }
.pr-notice--warn { background: #FFF8E6; box-shadow: none; }
.pr-notice--tip { background: var(--pr-tint); box-shadow: none; border-inline-start-color: var(--pr-navy); }
.pr-notice--tip i, .pr-notice--info i { color: var(--pr-navy); }
.pr-step-body .pr-notice { margin-top: 20px; box-shadow: none; }
.pr-step-body .pr-notice + .pr-notice { margin-top: 12px; }
.pr-step-body .pr-notice--info { background: #fff; border: 1px solid var(--pr-line); border-inline-start: 4px solid var(--pr-navy); }
@media (max-width: 991px) { .pr-minis { grid-template-columns: 1fr; } }
@media (max-width: 576px) {
    .pr-step { grid-template-columns: 1fr; gap: 14px; }
    .pr-step::before { display: none; }
    .pr-step-mark { width: 48px; height: 48px; font-size: 20px; }
    .pr-step-body { padding: 22px 18px; }
}

/* ---------- CTA band ---------- */
.pr-cta { position: relative; overflow: hidden; padding: 76px 0; text-align: center; background: var(--pr-navy); }
.pr-cta::before, .pr-cta::after { content: ''; position: absolute; border-radius: 50%; border: 2px solid rgb(227 168 31 / 28%); pointer-events: none; }
.pr-cta::before { width: 340px; height: 340px; inset-inline-start: -110px; top: -130px; }
.pr-cta::after { width: 220px; height: 220px; inset-inline-end: -50px; bottom: -90px; }
.pr-cta h2 { position: relative; z-index: 1; margin: 0 0 30px; color: #fff; font-size: clamp(26px, 3.4vw, 40px); line-height: 1.25; font-weight: 700; }
.pr-cta p { position: relative; z-index: 1; max-width: 640px; margin: 0 auto 28px; font-size: 18px; line-height: 30px; color: rgb(255 255 255 / 88%); }
.pr-cta--photo { background: linear-gradient(rgb(39 37 85 / 88%), rgb(39 37 85 / 88%)), var(--pr-photo) center / cover no-repeat; }
.pr-cta-row { position: relative; z-index: 1; display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }
.pr-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 32px; border: 2px solid transparent; border-radius: 2px; font-size: 16px; line-height: 1; font-weight: 700; text-decoration: none; transition: transform .3s var(--pr-ease), background-color .3s, color .3s, box-shadow .3s; }
.pr-btn:hover { transform: translateY(-3px); }
.pr-btn:focus-visible, .pr-link:focus-visible, .pr-pills a:focus-visible { outline: 3px solid var(--pr-gold); outline-offset: 3px; }
.pr-btn--gold { background: var(--pr-gold); color: var(--pr-navy); box-shadow: 0 8px 22px rgb(227 168 31 / 35%); }
.pr-btn--gold:hover { background: #f0b82d; color: var(--pr-navy); box-shadow: 0 12px 28px rgb(227 168 31 / 45%); }
.pr-btn--ghost { color: #fff; border-color: rgb(255 255 255 / 70%); }
.pr-btn--ghost:hover { background: #fff; color: var(--pr-navy); border-color: #fff; }
.pr-btn--line { color: var(--pr-navy); border-color: var(--pr-navy); }
.pr-btn--line:hover { background: var(--pr-navy); color: #fff; }
/* the site forces direction:ltr on every wa.me link (phone digits); an icon + label row must follow the page language */
html[dir="rtl"] a.pr-btn[href^="https://wa.me/"] { direction: rtl; }
.pr-btn--navy { background: var(--pr-navy); color: #fff; }
.pr-btn--navy:hover { background: #3a3777; color: #fff; }

/* ---------- curriculum: stages + subjects ---------- */
.pr-stage { display: flex; align-items: center; gap: 18px; height: 100%; padding: 26px 24px; background: #fff; border-radius: 2px; border-bottom: 3px solid transparent; box-shadow: var(--pr-shadow); text-decoration: none; transition: transform .45s var(--pr-ease), box-shadow .45s var(--pr-ease), border-color .3s; }
.pr-stage:hover { transform: translateY(-6px); box-shadow: var(--pr-shadow-up); border-bottom-color: var(--pr-gold); }
.pr-stage .pr-icon { margin: 0; flex: 0 0 auto; }
.pr-stage span { flex: 1; font-size: 19px; line-height: 28px; font-weight: 700; color: var(--pr-navy); }
.pr-stage > i { font-size: 20px; color: var(--pr-gold); transition: transform .3s var(--pr-ease); }
.pr-stage:hover > i { transform: translateX(4px); }
[dir="rtl"] .pr-stage > i { transform: scaleX(-1); }
[dir="rtl"] .pr-stage:hover > i { transform: scaleX(-1) translateX(4px); }
.pr-subnav { display: flex; flex-direction: column; gap: 4px; position: sticky; top: 108px; }
.pr-subnav button { display: block; width: 100%; padding: 12px 18px; border: 0; border-inline-start: 3px solid transparent; border-radius: 2px; background: transparent; text-align: start; font-family: inherit; font-size: 16px; line-height: 24px; font-weight: 500; color: var(--pr-text); cursor: pointer; transition: background-color .3s, color .3s, border-color .3s; }
.pr-subnav button:hover { background: #fff; color: var(--pr-navy); }
.pr-subnav button[aria-selected="true"] { background: #fff; color: var(--pr-navy); font-weight: 700; border-inline-start-color: var(--pr-gold); box-shadow: var(--pr-shadow); }
.pr-subject { background: #fff; border-radius: 2px; box-shadow: var(--pr-shadow); padding: 34px 36px; margin-bottom: 24px; }
.pr-subject h4 { margin: 0 0 18px; font-size: 28px; line-height: 38px; font-weight: 700; color: var(--pr-navy); display: block; }
.pr-subject p { font-size: 18px; line-height: 32px; color: var(--pr-text); opacity: 1; margin: 0 0 16px; }
.pr-subject p:last-child { margin-bottom: 0; }
.pr-subject ul { margin: 0 0 16px; padding-inline-start: 24px; }
.pr-subject li { font-size: 18px; line-height: 32px; color: var(--pr-text); }
.pr-tabs-ready .pr-subject { display: none; margin-bottom: 0; }
.pr-tabs-ready .pr-subject.is-active { display: block; animation: pr-fade .45s var(--pr-ease); }
@keyframes pr-fade { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.pr-subjects-tabs { display: none; }

/* ---------- facilities ---------- */
.pr-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: 0 auto 8px; padding: 0; list-style: none; }
.pr-chips li { display: inline-flex; align-items: center; gap: 10px; padding: 12px 20px; background: #fff; border-radius: 2px; box-shadow: var(--pr-shadow); font-size: 16px; line-height: 24px; font-weight: 500; color: var(--pr-navy); }
.pr-chips i { font-size: 18px; color: var(--pr-gold); }
.pr-gallery .filter-align { padding: 8px; }
.pr-gallery .filter-align a { position: relative; display: block; overflow: hidden; border-radius: 2px; box-shadow: var(--pr-shadow); }
.pr-gallery .filter-item img { box-shadow: none; transition: transform .8s var(--pr-ease); }
.pr-gallery .filter-item img:hover { transform: scale(1.06); }
.pr-gallery .filter-align a::after { content: ''; position: absolute; inset: 0; opacity: 0; transition: opacity .35s; background: linear-gradient(180deg, transparent 45%, rgb(39 37 85 / 70%) 100%), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7'/%3E%3C/svg%3E") center / 34px no-repeat; pointer-events: none; }
.pr-gallery .filter-align a:hover::after { opacity: 1; }

/* ---------- open day ---------- */
.pr-notice { display: flex; gap: 16px; align-items: flex-start; padding: 20px 22px; background: #fff; border-radius: 2px; border-inline-start: 4px solid var(--pr-gold); box-shadow: var(--pr-shadow); font-size: 16px; line-height: 27px; color: var(--pr-text); }
.pr-notice i { flex: 0 0 auto; margin-top: 2px; font-size: 22px; line-height: 1; color: var(--pr-gold); }
.pr-notice + .pr-notice { margin-top: 16px; }
.pr-notice--info { border-inline-start-color: var(--pr-navy); }
.pr-notice--info i { color: var(--pr-navy); }
.pr-insta { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 24px; border-radius: 2px; font-size: 16px; line-height: 1; font-weight: 700; color: #fff; text-decoration: none; background: linear-gradient(45deg, #f09433, #e6683c 30%, #dc2743 55%, #cc2366 75%, #bc1888); transition: transform .3s var(--pr-ease), box-shadow .3s; }
.pr-insta:hover { color: #fff; transform: translateY(-3px); box-shadow: 0 10px 24px rgb(220 39 67 / 35%); }
.pr-aside { position: sticky; top: 108px; }
.pr-links { list-style: none; margin: 0; padding: 0; }
.pr-links li + li { margin-top: 8px; }
.pr-links a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; background: var(--pr-tint); border-radius: 2px; font-size: 16px; line-height: 24px; font-weight: 500; color: var(--pr-navy); text-decoration: none; transition: background-color .3s, color .3s, transform .3s var(--pr-ease); }
.pr-links a i { color: var(--pr-gold); transition: transform .3s var(--pr-ease); }
.pr-links a:hover { background: var(--pr-navy); color: #fff; transform: translateX(4px); }
[dir="rtl"] .pr-links a:hover { transform: translateX(-4px); }
[dir="rtl"] .pr-links a i { transform: scaleX(-1); }
.pr-callbox { margin-top: 20px; padding: 32px 24px; text-align: center; background: var(--pr-navy); border-radius: 2px; }
.pr-callbox h4 { margin: 0 0 12px; font-size: 22px; line-height: 30px; font-weight: 700; color: #fff; }
.pr-callbox p { margin: 0 0 24px; font-size: 16px; line-height: 26px; color: rgb(255 255 255 / 88%); }
.pr-form-shell .form-wrpr-cs-b-a-t { border-top: 4px solid var(--pr-gold); }
.pr-activities { background: #fff; border-radius: 2px; box-shadow: var(--pr-shadow); padding: 32px; }
.pr-activities p, .pr-activities li { font-size: 18px; line-height: 32px; color: var(--pr-text); }
.pr-activities ul { list-style: disc; padding-inline-start: 24px; margin: 0 0 16px; }
.pr-activities ol { list-style: decimal; padding-inline-start: 24px; margin: 0 0 16px; }
.pr-activities > :last-child { margin-bottom: 0; }

@media (max-width: 991px) {
    .pr-section { padding: 60px 0; }
    .pr-banner { padding: 96px 0 88px; }
    .pr-checks--2 { column-count: 1; }
    .pr-figure::before { display: none; }
    .pr-subnav { position: static; flex-direction: row; overflow-x: auto; gap: 8px; margin-bottom: 20px; scrollbar-width: none; -ms-overflow-style: none; }
    .pr-subnav::-webkit-scrollbar { display: none; }
    .pr-subnav button { width: auto; flex: 0 0 auto; padding: 9px 16px; border-inline-start: 0; border-bottom: 3px solid transparent; background: #fff; box-shadow: var(--pr-shadow); white-space: nowrap; }
    .pr-subnav button[aria-selected="true"] { border-bottom-color: var(--pr-gold); }
    .pr-aside { position: static; margin-top: 32px; }
}
@media (max-width: 576px) {
    .pr-section { padding: 44px 0; }
    .pr-banner { padding: 72px 0 66px; }
    .pr-panel, .pr-activities { padding: 22px 18px; }
    .pr-subject { padding: 24px 20px; }
    .pr-subject h4 { font-size: 24px; line-height: 32px; }
    .pr-cta { padding: 56px 0; }
    .pr-btn { width: 100%; max-width: 320px; }
}
@media (prefers-reduced-motion: reduce) {
    .pr-js .pr-reveal { opacity: 1; transform: none; transition: none; }
    .pr-banner .banner-head__cs, .pr-banner .banner-head__cs_1, .pr-banner .banner-head__cs_2, .pr-banner .breadcrubs-wrpr, .pr-tabs-ready .pr-subject.is-active { animation: none; }
    .pr-card, .pr-stage, .pr-btn, .pr-gallery .filter-item img, .pr-links a { transition: none; }
}