/* ARDUNA volunteer opportunity cards + detail/application dialog.
   Inspired by the reference card structure while preserving ARDUNA's paper/slate/yellow identity. */
.join-opportunities-section{position:relative}
.join-roles-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:3rem}
.join-role-card{appearance:none;width:100%;border:1px solid rgba(82,87,98,.14);background:rgba(239,236,231,.58);padding:0;text-align:inherit;color:var(--ink,#525762);cursor:pointer;border-radius:22px;overflow:hidden;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;background .18s ease}
.join-role-card:hover,.join-role-card:focus-visible{transform:translateY(-3px);border-color:rgba(82,87,98,.28);background:rgba(239,236,231,.86);box-shadow:0 18px 38px rgba(40,45,48,.07)}
.join-role-card:focus-visible{outline:2px solid var(--accent,#F3D862);outline-offset:4px}
.join-role-card__visual{position:relative;min-height:205px;display:grid;place-items:center;border-bottom:1px solid rgba(82,87,98,.1);background:rgba(255,255,255,.32)}
.join-role-card__halo{position:absolute;width:138px;height:138px;border-radius:50%;border:8px solid rgba(255,255,255,.7);box-shadow:inset 12px 12px 28px rgba(82,87,98,.06)}
.join-role-card__orb{position:relative;z-index:2;width:100px;height:100px;border-radius:50%;display:grid;place-items:center;background:var(--accent,#F3D862);box-shadow:9px 14px 22px rgba(82,87,98,.18);color:var(--ink,#525762)}
.join-role-card__orb svg{width:38px;height:38px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.join-role-card__status{position:absolute;right:18px;bottom:17px;z-index:3;display:flex;align-items:center;gap:7px;padding:7px 10px;border:1px solid rgba(82,87,98,.12);background:rgba(247,244,239,.92);border-radius:999px;font:600 9px/1 Helvetica,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:rgba(82,87,98,.66)}
.join-role-card__status::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent,#F3D862);box-shadow:0 0 0 3px rgba(243,216,98,.16)}
.join-role-card__body{padding:24px 24px 22px}
.join-role-card__eyebrow{display:flex;justify-content:space-between;gap:16px;align-items:center;font:600 9px/1.4 Helvetica,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:rgba(82,87,98,.5)}
.join-role-card h3{margin-top:16px;font-family:'Merriweather',Georgia,serif;font-size:1.55rem;font-weight:300;line-height:1.13;letter-spacing:-.025em;color:var(--ink,#525762)}
.join-role-card p{margin-top:13px;font-size:.95rem;line-height:1.68;color:rgba(82,87,98,.74)}
.join-role-card__meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:19px;padding-top:17px;border-top:1px solid rgba(82,87,98,.1)}
.join-role-card__meta span{font-size:10px;line-height:1.35;color:rgba(82,87,98,.6)}
.join-role-card__open{margin-left:auto;color:var(--ink,#525762)!important;font-weight:700}
[dir="rtl"] .join-role-card__status{right:auto;left:18px}
[dir="rtl"] .join-role-card__open{margin-left:0;margin-right:auto}

.join-role-dialog{width:min(1180px,94vw);max-height:min(88vh,900px);padding:0;border:0;border-radius:24px;background:var(--paper-soft,#F7F4EF);color:var(--ink,#525762);box-shadow:0 30px 90px rgba(25,30,34,.22);overflow:hidden}
.join-role-dialog::backdrop{background:rgba(38,42,47,.56);backdrop-filter:blur(3px)}
.join-role-dialog__top{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;padding:22px 26px;border-bottom:1px solid rgba(82,87,98,.12);background:rgba(239,236,231,.7)}
.join-role-dialog__icon{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:var(--accent,#F3D862);box-shadow:5px 8px 16px rgba(82,87,98,.13)}
.join-role-dialog__icon svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.join-role-dialog__kicker{font:600 9px/1.4 Helvetica,Arial,sans-serif;letter-spacing:.13em;text-transform:uppercase;color:rgba(82,87,98,.52)}
.join-role-dialog__title{margin-top:4px;font-family:'Merriweather',Georgia,serif;font-size:1.8rem;font-weight:300;line-height:1.12;letter-spacing:-.025em}
.join-role-dialog__close{appearance:none;border:1px solid rgba(82,87,98,.14);background:transparent;width:42px;height:42px;border-radius:50%;cursor:pointer;font-size:20px;line-height:1;color:var(--ink,#525762)}
.join-role-dialog__close:hover{border-color:var(--accent,#F3D862)}
.join-role-dialog__grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(360px,1.08fr);min-height:580px;max-height:calc(88vh - 100px);overflow:auto}
.join-role-detail{padding:34px 36px 42px;border-right:1px solid rgba(82,87,98,.12)}
.join-role-detail__lead{font-family:'Merriweather',Georgia,serif;font-size:1.35rem;line-height:1.5;font-weight:300;color:var(--ink,#525762)}
.join-role-detail__facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:26px 0 30px}
.join-role-detail__fact{padding:15px 0;border-top:1px solid rgba(82,87,98,.12)}
.join-role-detail__fact small{display:block;font:600 8px/1.4 Helvetica,Arial,sans-serif;letter-spacing:.13em;text-transform:uppercase;color:rgba(82,87,98,.48)}
.join-role-detail__fact strong{display:block;margin-top:7px;font-size:.92rem;line-height:1.5;font-weight:500;color:rgba(82,87,98,.82)}
.join-role-detail h3{margin:28px 0 12px;font:600 10px/1.4 Helvetica,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:rgba(82,87,98,.56)}
.join-role-detail ul{margin:0;padding-left:1.15rem}
.join-role-detail li{margin:.55rem 0;font-size:.95rem;line-height:1.68;color:rgba(82,87,98,.78)}
[dir="rtl"] .join-role-detail{border-right:0;border-left:1px solid rgba(82,87,98,.12)}
[dir="rtl"] .join-role-detail ul{padding-left:0;padding-right:1.15rem}

.join-role-apply{padding:34px 36px 42px;background:rgba(255,255,255,.26)}
.join-role-apply__head{display:flex;justify-content:space-between;gap:18px;align-items:start;padding-bottom:22px;border-bottom:1px solid rgba(82,87,98,.12)}
.join-role-apply__head h3{font-family:'Merriweather',Georgia,serif;font-size:1.35rem;font-weight:300;line-height:1.25}
.join-role-apply__head p{max-width:40ch;font-size:.78rem;line-height:1.55;color:rgba(82,87,98,.62)}
.join-application-form{display:grid;grid-template-columns:1fr 1fr;gap:16px 18px;margin-top:24px}
.join-field{display:grid;gap:7px}
.join-field--full{grid-column:1/-1}
.join-field label{font:600 9px/1.35 Helvetica,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:rgba(82,87,98,.58)}
.join-field input,.join-field textarea,.join-field select{width:100%;border:1px solid rgba(82,87,98,.17);background:rgba(247,244,239,.8);border-radius:10px;padding:12px 13px;font:400 14px/1.5 Helvetica,Arial,sans-serif;color:var(--ink,#525762);outline:none}
.join-field textarea{min-height:110px;resize:vertical}
.join-field input:focus,.join-field textarea:focus,.join-field select:focus{border-color:var(--accent,#F3D862);box-shadow:0 0 0 3px rgba(243,216,98,.15)}
.join-consent{grid-column:1/-1;display:flex;align-items:flex-start;gap:10px;margin-top:2px;font-size:.76rem;line-height:1.55;color:rgba(82,87,98,.66)}
.join-consent input{margin-top:2px;accent-color:var(--accent,#F3D862)}
.join-application-actions{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:4px;padding-top:19px;border-top:1px solid rgba(82,87,98,.12)}
.join-application-note{font-size:.72rem;line-height:1.5;color:rgba(82,87,98,.56);max-width:40ch}
.join-application-submit{appearance:none;border:1px solid var(--ink,#525762);background:var(--ink,#525762);color:var(--paper-soft,#F7F4EF);padding:12px 18px;border-radius:999px;font:600 9px/1 Helvetica,Arial,sans-serif;letter-spacing:.11em;text-transform:uppercase;cursor:pointer;white-space:nowrap;transition:background .18s ease,border-color .18s ease,color .18s ease}
.join-application-submit:hover{background:var(--accent,#F3D862);border-color:var(--accent,#F3D862);color:var(--ink,#525762)}
.join-application-status{grid-column:1/-1;min-height:1.4em;font-size:.78rem;line-height:1.5;color:rgba(82,87,98,.7)}

.join-current-note{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:clamp(3rem,8vw,8rem);align-items:start}
.join-current-note__badge{display:inline-flex;align-items:center;gap:8px;font:600 9px/1 Helvetica,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--accent,#F3D862)}
.join-current-note__badge::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent,#F3D862)}

@media(max-width:980px){.join-roles-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.join-role-dialog__grid{grid-template-columns:1fr;max-height:calc(88vh - 96px)}.join-role-detail{border-right:0!important;border-left:0!important;border-bottom:1px solid rgba(82,87,98,.12)}.join-current-note{grid-template-columns:1fr;gap:2rem}}
@media(max-width:640px){.join-roles-grid{grid-template-columns:1fr;gap:16px}.join-role-card__visual{min-height:180px}.join-role-card__body{padding:21px}.join-role-dialog{width:96vw;max-height:92vh;border-radius:18px}.join-role-dialog__top{padding:16px 18px}.join-role-dialog__title{font-size:1.35rem}.join-role-dialog__grid{max-height:calc(92vh - 86px)}.join-role-detail,.join-role-apply{padding:24px 20px 30px}.join-role-detail__facts{grid-template-columns:1fr 1fr}.join-application-form{grid-template-columns:1fr}.join-field--full,.join-consent,.join-application-actions,.join-application-status{grid-column:1}.join-application-actions{align-items:flex-start;flex-direction:column}.join-application-submit{width:100%}}
@media(prefers-reduced-motion:reduce){.join-role-card{transition:none}.join-role-card:hover{transform:none}}