@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Outfit:wght@500;600;700&display=swap');

.member-overview { --member-night:#08252d; --member-green:#0d624d; --member-gold:#f8d676; --member-paper:#eef5f0; --member-ink:#143039; background:var(--member-paper); color:var(--member-ink); font-family:'DM Sans','Inter',sans-serif; }
.member-overview h1,.member-overview h2,.member-overview h3 { font-family:'Outfit','Inter',sans-serif; letter-spacing:-.025em; }
[dir="rtl"] .member-overview,[dir="rtl"] .member-overview h1,[dir="rtl"] .member-overview h2,[dir="rtl"] .member-overview h3 { font-family:'Tajawal',sans-serif; letter-spacing:0; }
.member-overview__hero { background:var(--member-night); color:#f7fbf7; overflow:hidden; }
.member-overview__hero-inner { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.95fr); align-items:center; gap:clamp(2rem,5vw,5rem); min-height:600px; padding-block:clamp(4rem,7vw,7rem); }
.member-overview__eyebrow,.member-overview__section-label { display:inline-flex; align-items:center; gap:.8rem; color:#0a7774; font-size:.78rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.member-overview__eyebrow { color:#68d9ce; }
.member-overview__hero h1 { max-width:660px; margin:1.2rem 0 1.5rem; color:#f7fbf7; font-size:clamp(3.3rem,6.2vw,6rem); line-height:1.02; text-wrap:balance; }
.member-overview__hero-copy>p { max-width:570px; color:#c6dfd8; font-size:clamp(1.08rem,1.7vw,1.23rem); line-height:1.8; }
.member-overview__actions { display:flex; align-items:center; gap:1.25rem; flex-wrap:wrap; margin-top:2.2rem; }
.member-overview__button { display:inline-flex; align-items:center; justify-content:center; gap:1rem; min-height:54px; padding:.85rem 1.4rem; border-radius:7px; font-weight:700; text-decoration:none; transition:transform .2s,background .2s,color .2s,box-shadow .2s; }
.member-overview__button:hover { transform:translateY(-3px); }
.member-overview__button--gold { background:var(--member-gold); color:#123036; box-shadow:0 12px 28px #0002; }
.member-overview__button--gold:hover { background:#ffe5a2; color:#123036; box-shadow:0 16px 32px #0003; }
.member-overview__button i { font-size:.8rem; }
.member-overview__status-link { color:#def7ee; font-weight:700; text-decoration:underline; text-underline-offset:.3em; }
.member-overview__status-link:hover { color:#ffe5a2; }
.member-overview__button:focus-visible,.member-overview__status-link:focus-visible { outline:3px solid #6bdad0; outline-offset:4px; }
.member-overview__hero-photo { position:relative; margin:0; min-width:0; padding:0 0 1.5rem 1.5rem; }
.member-overview__hero-photo::before { content:""; position:absolute; inset:1.5rem 1.5rem 0 0; border:1px solid #64d7c3; border-radius:12px; opacity:.65; }
.member-overview__hero-photo img { position:relative; display:block; width:100%; height:auto; aspect-ratio:4/4.2; object-fit:cover; object-position:center; border-radius:12px; }
.member-overview__hero-photo figcaption { position:absolute; bottom:2.5rem; inset-inline-start:2.4rem; z-index:1; padding:.55rem .85rem; border-radius:4px; background:#08252dcc; color:#e1f7ef; font-size:.78rem; font-weight:600; }
.member-overview__about { background:#f8fbf8; padding-block:clamp(5rem,8vw,8rem); }
.member-overview__about-inner { display:grid; grid-template-columns:.42fr 1fr; gap:clamp(2rem,7vw,8rem); align-items:start; }
.member-overview__section-line { width:34px; height:2px; background:currentColor; }
.member-overview h2 { margin:.8rem 0 1.2rem; color:var(--member-green); font-size:clamp(2.35rem,4.4vw,4.2rem); line-height:1.12; text-wrap:balance; }
.member-overview__about p { max-width:810px; margin:0; color:#3b5a5d; font-size:clamp(1.25rem,2.1vw,1.7rem); font-weight:500; line-height:1.7; }
.member-overview__benefits { padding-block:clamp(5rem,8vw,8rem); background:#e4efea; }
.member-overview__split { display:grid; grid-template-columns:.8fr 1fr; gap:clamp(3rem,9vw,9rem); align-items:start; }
.member-overview__section-intro p { max-width:420px; color:#58727a; line-height:1.8; font-size:1.05rem; }
.member-overview__benefit-list { list-style:none; padding:0; margin:0; border-top:1px solid #a9c9bc; }
.member-overview__benefit-list li { display:grid; grid-template-columns:3rem minmax(0,1fr); align-items:center; gap:1.1rem; min-height:92px; padding:1.2rem 0; border-bottom:1px solid #a9c9bc; color:#143c3b; font-size:clamp(1.08rem,1.6vw,1.28rem); font-weight:600; line-height:1.45; }
.member-overview__benefit-icon { display:grid; place-items:center; width:3rem; height:3rem; border-radius:50%; background:#d0e9df; color:#0d6956; font-size:1.05rem; }
.member-overview__audience { background:#f8fbf8; padding-block:clamp(5rem,8vw,8rem); }
.member-overview__audience-heading { display:grid; grid-template-columns:1fr .65fr; align-items:end; gap:3rem; margin-bottom:2.6rem; }
.member-overview__audience-heading p { max-width:430px; margin:0 0 .8rem; color:#58727a; font-size:1.07rem; line-height:1.8; }
.member-overview__audience-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.member-overview__audience-card { min-height:190px; display:flex; flex-direction:column; justify-content:space-between; padding:1.7rem; border:1px solid #c9dfd8; border-radius:10px; background:#eef5f0; }
.member-overview__audience-card i { color:#0b7774; font-size:1.35rem; }
.member-overview__audience-card h3 { margin:1.8rem 0 0; color:var(--member-green); font-size:1.55rem; }
.member-overview__location { display:flex; align-items:center; gap:.7rem; margin:2rem 0 0; color:#385b5d; font-weight:600; }
.member-overview__location i { color:#0b7774; }
.member-overview__community { background:var(--member-night); color:#f5fbf7; padding-block:clamp(5rem,8vw,8rem); }
.member-overview__community .member-overview__section-label { color:#67ddd0; }
.member-overview__community-heading { display:grid; grid-template-columns:1fr .68fr; gap:clamp(2rem,7vw,7rem); align-items:end; margin-bottom:2.5rem; }
.member-overview__community h2 { max-width:660px; color:#f8d676; }
.member-overview__community-heading p { max-width:460px; margin:0 0 1.4rem; color:#c7e1d8; font-size:1.1rem; line-height:1.8; }
.member-overview__gallery { display:grid; grid-template-columns:1.3fr .9fr; grid-template-rows:repeat(2,minmax(0,1fr)); gap:1rem; height:min(58vw,630px); }
.member-overview__gallery figure { margin:0; min-width:0; min-height:0; overflow:hidden; border-radius:10px; background:#173b43; }
.member-overview__gallery figure:first-child { grid-row:span 2; }
.member-overview__gallery img { display:block; width:100%; height:100%; object-fit:cover; }
.member-overview__gallery-caption { margin:1rem 0 0; color:#a6ccc6; font-size:.84rem; }
.member-status { min-height:65vh; }
.member-status__inner { max-width:860px; padding-block:4rem 6rem; }
.member-status__back { display:inline-block; color:#0d624d; margin-bottom:2.5rem; font-weight:700; }
.member-status__back:hover { color:#084e45; text-decoration:underline; text-underline-offset:.3em; }
.member-status__back:focus-visible { outline:3px solid #0d7772; outline-offset:4px; }
.member-status .member-overview__eyebrow { color:#0d7772; }
.member-status h1 { color:#0d624d; font-size:clamp(2.6rem,5vw,4.5rem); line-height:1.05; margin-bottom:1rem; }
.member-status__inner>p { color:#58727a; font-size:1.05rem; line-height:1.7; }
.member-status__card { display:flex; gap:2rem; flex-wrap:wrap; padding:1.5rem; margin:2rem 0; background:#fff; border:1px solid #c5ddd3; border-radius:14px; }
.member-status__card>div { display:grid; gap:.4rem; min-width:180px; }
.member-status__card span { color:#58727a; font-size:.84rem; }
.member-status__badge { color:#0d624d; }
.member-status__timeline { list-style:none; padding:0; margin:2rem 0; display:grid; }
.member-status__timeline li { position:relative; display:grid; grid-template-columns:2rem minmax(0,1fr); gap:1rem; padding:0 0 1rem; }
.member-status__timeline li:last-child { padding-bottom:0; }
.member-status__timeline li::before { content:""; position:absolute; top:3rem; bottom:-1rem; inset-inline-start:calc(1rem - 1px); width:2px; background:#b7d2c8; }
.member-status__timeline li:last-child::before { display:none; }
.member-status__timeline li.is-complete::before { background:#0d624d; }
.member-status__timeline li>span { position:relative; z-index:1; align-self:start; margin-top:1rem; width:2rem; height:2rem; display:grid; place-items:center; border-radius:50%; background:#d8e9e3; color:#0d624d; font-weight:700; }
.member-status__timeline li.is-reached>span { background:#0d624d; color:#fff; }
.member-status__timeline li>div { padding:1.15rem 1.25rem; border:1px solid #c5ddd3; border-radius:12px; background:#fff; }
.member-status__timeline li:not(.is-reached)>div { background:transparent; }
.member-status__timeline strong { color:#143039; }
.member-status__timeline p { color:#58727a; margin:.35rem 0 0; }
@media(max-width:900px){.member-overview__hero-inner{gap:2rem}.member-overview__split{gap:3rem}.member-overview__hero-photo img{aspect-ratio:4/5}}
@media(max-width:700px){
    .member-overview__hero-inner,.member-overview__about-inner,.member-overview__split,.member-overview__audience-heading,.member-overview__community-heading{grid-template-columns:1fr}
    .member-overview__hero-inner{min-height:0;padding-block:4rem;gap:3rem}
    .member-overview__hero h1{font-size:clamp(3rem,12vw,4.5rem)}
    .member-overview__hero-photo{max-width:560px}
    .member-overview__hero-photo img{aspect-ratio:4/3}
    .member-overview__about-inner,.member-overview__audience-heading,.member-overview__community-heading{gap:1.1rem}
    .member-overview__audience-grid{grid-template-columns:1fr}
    .member-overview__audience-card{min-height:130px}
    .member-overview__audience-card h3{margin-top:1rem}
    .member-overview__gallery{height:auto;grid-template-columns:1fr 1fr;grid-template-rows:auto}
    .member-overview__gallery figure:first-child{grid-column:span 2;grid-row:auto}
    .member-overview__gallery img{height:auto;aspect-ratio:4/3}
    .member-status__inner{padding-block:3rem 5rem}
}
@media(max-width:420px){.member-overview__gallery{grid-template-columns:1fr}.member-overview__gallery figure:first-child{grid-column:auto}.member-overview__hero-photo{padding-inline-start:0}.member-overview__hero-photo::before{display:none}}
@media(prefers-reduced-motion:reduce){.member-overview__button{transition:none}.member-overview__button:hover{transform:none}}