/* Perth Pathways — public website.
   Layout follows the Hathloul site (sticky light header, rounded hero slider,
   floating stats bar, "— label —" section heads, tinted bands, card grids,
   contact pair, dark footer). Colours come from the three partner logos:
   teal (Sanctuary Award + IAPK), IAPK purple, Sanctuary maroon. */

:root{
  --bg:#F8F7F4; --band:#EEF4F1; --band-2:#F3EEF6; --card:#FFFFFF;
  --ink:#2A1B3D; --text:#4E4759; --muted:#6F6879; --line:#E6E1EA;
  --purple:#522569; --purple-2:#6B3A86; --teal:#1A7C67; --teal-2:#2AB195; --teal-soft:#DDEFEA;
  --rose:#A11E57; --deep:#1E1428;
  --radius:22px; --shadow:0 10px 30px -12px rgba(42,27,61,.18); --shadow-sm:0 2px 10px rgba(42,27,61,.06);
  --font:'Bahnschrift','Barlow','Segoe UI',system-ui,sans-serif;
  --font-ar:'Tajawal','Noto Sans Arabic',system-ui,sans-serif;
}
*{box-sizing:border-box}
[hidden]{display:none !important}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
[dir="rtl"] body,[dir="rtl"]{font-family:var(--font-ar)}
[lang="am"] body,[lang="am"] .btn,[lang="am"] input,[lang="am"] select{font-family:'Noto Sans Ethiopic','Nyala','Ebrima',var(--font)}
/* text arrives from the language file a moment after the page — fade in instead of flashing empty boxes */
body main,body .site-footer{transition:opacity .2s}
body:not(.ready) main,body:not(.ready) .site-footer{opacity:0}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4{color:var(--ink);margin:0;line-height:1.2;font-weight:700;text-wrap:balance}
p{margin:0}
.container{max-width:1200px;margin:0 auto;padding-inline:20px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
:focus-visible{outline:3px solid var(--teal-2);outline-offset:2px;border-radius:6px}
.ico{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);box-shadow:0 4px 24px -10px rgba(42,27,61,.18)}
.nav{display:flex;align-items:center;gap:24px;height:76px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;flex:none}
.logo img{height:46px;width:auto}
.logo-text{display:flex;flex-direction:column;line-height:1.1}
.logo-text b{font-size:1.05rem;color:var(--ink)}
.logo-text span{font-family:var(--font-ar);font-size:.8rem;color:var(--teal);font-weight:700}
.nav-links{display:flex;gap:26px;margin-inline:auto;font-weight:600;font-size:.93rem}
.nav-links a{text-decoration:none;color:var(--ink);opacity:.85;padding-block:6px;border-bottom:2px solid transparent}
.nav-links a:hover,.nav-links a[aria-current="page"]{opacity:1;border-bottom-color:var(--teal)}
.nav-cta{display:inline-flex;align-items:center;gap:8px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;padding:12px 24px;font-weight:700;font-size:.95rem;text-decoration:none;border:none;cursor:pointer;font-family:inherit;transition:transform .2s,box-shadow .2s,background .2s}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--teal);color:#fff;box-shadow:0 8px 20px -8px rgba(31,138,114,.6)}
.btn-primary:hover{background:#146352}
.btn-dark{background:var(--purple);color:#fff}
.btn-dark:hover{background:var(--purple-2)}
.btn-ghost{background:#fff;color:var(--ink);border:1px solid var(--line)}
.btn-sm{padding:9px 18px;font-size:.86rem}
.btn[disabled]{opacity:.55;cursor:not-allowed;transform:none}
.lang-toggle{display:inline-flex;background:var(--band);border-radius:999px;padding:4px;border:1px solid var(--line)}
.lang-toggle button{border:none;background:none;border-radius:999px;padding:6px 12px;font-weight:700;font-size:.8rem;cursor:pointer;color:var(--muted);font-family:var(--font)}
.lang-toggle button.on{background:var(--purple);color:#fff}
.menu-btn{display:none;width:44px;height:44px;border-radius:12px;border:1px solid var(--line);background:var(--band);align-items:center;justify-content:center;cursor:pointer}
@media (max-width:980px){
  .nav-links{display:none;position:absolute;top:76px;left:0;right:0;background:#fff;flex-direction:column;gap:0;padding:8px 20px 16px;box-shadow:var(--shadow)}
  .nav-links.open{display:flex}
  .nav-links a{padding:12px 0;border-bottom:1px solid var(--line)}
  .nav{gap:10px}
  .nav-cta{margin-inline-start:auto}
  .menu-btn{display:inline-flex}
  .nav-cta .btn{display:none}
}
@media (max-width:420px){
  .logo-text span{display:none}
  .lang-toggle button{padding:6px 9px}
  .wa-float span{display:none}
  .wa-float{padding:14px}
}

/* ---------- hero slider ---------- */
.hero{padding-block:28px 0}
.hero-card{position:relative;overflow:hidden;border-radius:32px;background:linear-gradient(120deg,#E3F0EC 0%,#EEE9F4 60%,#F4EAF0 100%);min-height:480px;box-shadow:var(--shadow-sm)}
.hero-card .ring{position:absolute;border:1.5px solid rgba(82,37,105,.13);border-radius:50%;pointer-events:none}
.slides{position:relative;min-height:480px}
.slide{position:absolute;inset:0;display:grid;grid-template-columns:1.25fr .75fr;align-items:center;gap:30px;padding:56px 90px;opacity:0;visibility:hidden;transition:opacity .6s}
.slide.on{opacity:1;visibility:visible}
.slide .eyebrow-ar{font-family:var(--font-ar);font-weight:700;color:var(--purple);font-size:1.02rem;margin-bottom:8px}
.slide h1,.slide .slide-title{font-size:clamp(1.9rem,3.6vw,2.9rem);margin-bottom:14px}
.slide p.lead{font-size:1.05rem;max-width:520px;margin-bottom:26px}
.slide .cta{display:flex;gap:12px;flex-wrap:wrap}
.orb{justify-self:center;width:250px;height:250px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff 0%,#F2EEF6 45%,#DCD3E6 100%);box-shadow:0 30px 60px -25px rgba(82,37,105,.45),inset 0 -12px 30px rgba(82,37,105,.08);display:flex;align-items:center;justify-content:center;color:var(--purple)}
.orb .ico{width:96px;height:96px;stroke-width:1.3}
.hero-tag{position:absolute;top:26px;inset-inline-end:34px;font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--purple);text-align:end;line-height:1.5;z-index:2}
.slide-arrow{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:50%;background:#fff;border:none;box-shadow:var(--shadow-sm);cursor:pointer;z-index:3;display:flex;align-items:center;justify-content:center;color:var(--ink)}
.slide-arrow.prev{inset-inline-start:18px}.slide-arrow.next{inset-inline-end:18px}
[dir="rtl"] .slide-arrow .ico,[dir="rtl"] .btn .ico{transform:scaleX(-1)}
.dots{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);display:flex;gap:6px;z-index:3}
.dots button{position:relative;width:8px;height:8px;border-radius:99px;border:none;background:rgba(82,37,105,.25);cursor:pointer;padding:0;transition:width .3s}
.dots button.on{width:26px;background:var(--purple)}
.dots button::before{content:"";position:absolute;inset:-10px -4px}  /* bigger tap area, same look */
@media (max-width:820px){
  .slide{grid-template-columns:1fr;text-align:center;padding:40px 26px 60px;justify-items:center}
  .slide .orb{order:-1;width:150px;height:150px}.orb .ico{width:60px;height:60px}
  .slide p.lead{margin-inline:auto}.slide .cta{justify-content:center}
  .hero-card,.slides{min-height:660px}
  .slide{padding-bottom:76px}
  .slide-arrow{display:none}.hero-tag{display:none}
}

/* stats bar (floats under the hero like the reference) */
.stats{position:relative;margin-top:-6px;background:#fff;border-radius:22px;box-shadow:var(--shadow);display:grid;grid-template-columns:repeat(4,1fr);margin-inline:auto;max-width:1160px;transform:translateY(22px);z-index:4}
.stat{display:flex;align-items:center;justify-content:center;gap:12px;padding:20px 12px}
.stat+.stat{border-inline-start:1px solid var(--line)}
.stat .ico{width:28px;height:28px;color:var(--teal)}
.stat b{display:block;font-size:1.5rem;color:var(--ink);line-height:1;font-variant-numeric:tabular-nums}
.stat span{font-size:.8rem;color:var(--muted)}
@media (max-width:1000px){.stats{grid-template-columns:repeat(2,1fr)}.stat:nth-child(3){border-inline-start:none}.stat:nth-child(n+3){border-top:1px solid var(--line)}}
/* the section right under the floating stats bar needs a little extra room, not a whole screen */
.after-stats{padding-top:104px}
@media (max-width:700px){.after-stats{padding-top:72px}}
@media (max-width:560px){.stats{grid-template-columns:1fr 1fr}.stat:nth-child(n){border-inline-start:none;border-top:1px solid var(--line)}.stat:nth-child(-n+2){border-top:none}.stat:nth-child(even){border-inline-start:1px solid var(--line)}.stat{justify-content:flex-start;padding:16px}}

/* ---------- sections ---------- */
section{padding-block:88px}
.band{background:var(--band)}
.band-2{background:var(--band-2)}
.label{display:inline-flex;align-items:center;gap:10px;color:var(--teal);font-weight:700;font-size:.85rem;margin-bottom:10px}
.label::before,.label::after{content:"";width:26px;height:2px;background:currentColor;border-radius:2px}
.head{text-align:center;max-width:720px;margin:0 auto 44px}
.head h2{font-size:clamp(1.7rem,3vw,2.3rem);margin-bottom:12px}
.head p{color:var(--muted)}
.head-start{text-align:start;margin-inline:0}

/* quick questions */
.qq-grid{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.qq{display:inline-flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:11px 18px;font-weight:600;font-size:.93rem;cursor:pointer;color:var(--ink);font-family:inherit;box-shadow:var(--shadow-sm);transition:all .2s}
.qq .ico{width:18px;height:18px;color:var(--teal)}
.qq:hover{border-color:var(--teal);transform:translateY(-2px)}
.qq.on{background:var(--purple);color:#fff;border-color:var(--purple)}
.qq.on .ico{color:#fff}
.qq-answer{margin-top:28px;background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:26px;border:1px solid var(--line)}
.qq-answer h3{font-size:1.2rem;margin-bottom:4px}
.qq-answer .sub{color:var(--muted);font-size:.9rem;margin-bottom:16px}

/* service rows (shared by quick answers, directory, partner pages) */
.svc-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px}
.svc{background:var(--bg);border:1px solid var(--line);border-radius:16px;padding:16px 18px;display:flex;flex-direction:column;gap:6px}
.svc-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.svc h4{font-size:1rem}
.code{font-size:.72rem;font-weight:700;color:var(--muted);border:1px solid var(--line);border-radius:6px;padding:1px 6px;white-space:nowrap;font-variant-numeric:tabular-nums;background:#fff}
.svc p{font-size:.88rem}
.meta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.82rem;color:var(--muted)}
.meta span{display:inline-flex;align-items:center;gap:5px}
.meta .ico{width:15px;height:15px}
.meta a{color:var(--teal);font-weight:600;text-decoration:none}
.pill{display:inline-flex;align-items:center;gap:5px;font-size:.74rem;font-weight:700;border-radius:999px;padding:3px 10px}
.pill-open{background:#DDF3EA;color:#146B55}
.pill-today{background:#EFE6F5;color:var(--purple)}
.pill-cat{background:#fff;border:1px solid var(--line);color:var(--text)}
.empty{text-align:center;color:var(--muted);padding:24px}

/* about (philosophy) */
.about{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:center}
.about-art{border-radius:28px;min-height:360px;background:radial-gradient(circle at 70% 20%,#6B3A86 0%,var(--purple) 45%,var(--deep) 100%);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.about-art img{width:150px;height:150px;border-radius:36px;box-shadow:0 20px 50px -20px #000}
.about-art .ring{position:absolute;border:1.5px solid rgba(255,255,255,.1);border-radius:50%}
.about h1,.about h2{font-size:clamp(1.7rem,3vw,2.2rem);margin-bottom:14px}
.about p+p{margin-top:10px}
.feat-pair{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:26px}
.feat{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:var(--shadow-sm)}
.feat .ic{width:40px;height:40px;border-radius:12px;background:var(--teal-soft);color:var(--teal);display:flex;align-items:center;justify-content:center;margin-bottom:12px}
.feat h3{font-size:1rem;margin-bottom:4px}
.feat p{font-size:.86rem;color:var(--muted)}
@media (max-width:860px){.about{grid-template-columns:1fr}.about-art{min-height:240px}.feat-pair{grid-template-columns:1fr}}

/* goals — two groups of tiles, like "Practice Areas" */
.groups{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.group{background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.9);border-radius:26px;padding:28px}
.group-head{display:flex;gap:14px;align-items:center;margin-bottom:6px}
.group-head img{height:52px;width:auto}
.group h3{font-size:1.25rem}
.group .sub{color:var(--muted);font-size:.9rem;margin-bottom:18px}
.group blockquote{margin:0 0 18px;padding:14px 18px;background:#fff;border-inline-start:4px solid var(--teal);border-radius:12px;font-weight:600;color:var(--ink)}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tile{background:#fff;border-radius:16px;padding:18px 14px;text-align:center;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;align-items:center;gap:8px;font-weight:700;font-size:.88rem;color:var(--ink);text-decoration:none;transition:transform .2s}
.tile:hover{transform:translateY(-3px)}
.tile .ic{width:40px;height:40px;border-radius:12px;background:var(--band-2);color:var(--purple);display:flex;align-items:center;justify-content:center}
.tile small{font-weight:500;color:var(--muted);font-size:.78rem;line-height:1.4}
.source{margin-top:14px;font-size:.78rem;color:var(--muted)}
.source a{color:var(--teal)}
@media (max-width:900px){.groups{grid-template-columns:1fr}}

/* categories grid */
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px}
.cat{background:#fff;border-radius:18px;padding:22px 14px;text-align:center;text-decoration:none;box-shadow:var(--shadow-sm);border:1px solid var(--line);display:flex;flex-direction:column;align-items:center;gap:10px;transition:transform .2s,border-color .2s}
.cat:hover{transform:translateY(-3px);border-color:var(--c)}
.cat .ic{width:46px;height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;color:#fff;background:var(--c)}
.cat b{color:var(--ink);font-size:.92rem;line-height:1.3}
.cat span{font-size:.78rem;color:var(--muted)}

/* partner cards — "Achievements" style */
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.pcard{background:#fff;border-radius:22px;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column}
.pcard-top{position:relative;height:170px;background:linear-gradient(160deg,var(--deep),var(--purple));display:flex;align-items:center;justify-content:center}
.pcard-top .mono{width:84px;height:84px;border-radius:22px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25);color:#fff;font-size:1.8rem;font-weight:800;display:flex;align-items:center;justify-content:center}
.pcard-top .mono img{width:100%;height:100%;object-fit:contain;border-radius:22px;background:#fff}
.pcard-top .pill{position:absolute;top:14px;inset-inline-start:14px;background:var(--teal);color:#fff}
.pcard-body{padding:22px;display:flex;flex-direction:column;gap:8px;flex:1}
.pcard-body h3{font-size:1.1rem}
.pcard-body p{font-size:.88rem;color:var(--muted);flex:1}
.pcard-body .btn{align-self:flex-start;margin-top:8px}
@media (max-width:900px){.cards3{grid-template-columns:1fr}}

/* how it works tiles — "Clients" style */
.how-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.how{background:#fff;border-radius:18px;padding:22px;box-shadow:var(--shadow-sm)}
.how .ic{width:44px;height:44px;border-radius:12px;background:var(--teal-soft);color:var(--teal);display:flex;align-items:center;justify-content:center;margin-bottom:12px}
.how h3{font-size:1rem;margin-bottom:6px}
.how p{font-size:.86rem;color:var(--muted)}
@media (max-width:980px){.how-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.how-grid{grid-template-columns:1fr}}

/* contact pair */
.contact{display:grid;grid-template-columns:.8fr 1.2fr;gap:24px}
.box{background:#fff;border-radius:22px;padding:28px;box-shadow:var(--shadow-sm);border:1px solid var(--line)}
.box h3{font-size:1.15rem;margin-bottom:18px}
.info-row{display:flex;gap:14px;align-items:flex-start;margin-bottom:18px}
.info-row .ic{width:44px;height:44px;border-radius:50%;background:var(--band);color:var(--teal);display:flex;align-items:center;justify-content:center;flex:none}
.info-row small{display:block;color:var(--muted);font-size:.78rem}
.info-row b{color:var(--ink);font-size:.95rem;word-break:break-word}
.form{display:grid;gap:14px}
.form .two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form label{display:block;font-size:.82rem;font-weight:700;color:var(--ink);margin-bottom:6px}
.form input,.form select,.form textarea{width:100%;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:var(--bg);font-family:inherit;font-size:.93rem;color:var(--ink)}
.form textarea{min-height:110px;resize:vertical}
.form .hint{font-size:.78rem;color:var(--muted)}
.form .btn{width:100%}
.note{font-size:.8rem;color:var(--muted);background:var(--band);border-radius:12px;padding:10px 14px}
@media (max-width:860px){.contact{grid-template-columns:1fr}.form .two{grid-template-columns:1fr}}

/* ---------- footer ---------- */
.site-footer{background:var(--deep);color:#CFC6D8;padding-block:56px 0;margin-top:0}
.foot{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.2fr;gap:32px}
.foot h4{color:#fff;font-size:.98rem;margin-bottom:14px}
.foot a{display:block;text-decoration:none;color:#CFC6D8;font-size:.9rem;padding-block:4px}
.foot a:hover{color:#fff}
.foot .logo-text b{color:#fff}
.foot p{font-size:.88rem;margin-top:14px;max-width:320px}
.foot-logos{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.foot-logos span{background:#fff;border-radius:10px;padding:6px 8px;display:inline-flex}
.foot-logos img{height:34px;width:auto}
.foot-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:40px;padding-block:18px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:.8rem}
.foot-bottom em{color:var(--teal-2);font-style:normal}
@media (max-width:900px){.foot{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot{grid-template-columns:1fr}}

/* ---------- inner pages ---------- */
.page-hero{padding-block:34px 0}
.page-hero .hero-card{min-height:auto;padding:44px 60px}
.page-hero h1{font-size:clamp(1.8rem,3.4vw,2.6rem);margin-bottom:10px}
.page-hero p{max-width:640px}
.crumbs{font-size:.82rem;color:var(--muted);margin-bottom:10px}
.crumbs a{color:var(--teal);text-decoration:none}
@media (max-width:760px){.page-hero .hero-card{padding:32px 24px}}

/* directory */
.dir-bar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;justify-content:space-between;margin-bottom:22px}
.seg{display:inline-flex;background:#fff;border:1px solid var(--line);border-radius:999px;padding:4px;box-shadow:var(--shadow-sm)}
.seg button{border:none;background:none;border-radius:999px;padding:9px 20px;font-weight:700;font-size:.9rem;cursor:pointer;color:var(--muted);font-family:inherit;display:inline-flex;gap:8px;align-items:center}
.seg button .ico{width:18px;height:18px}
.seg button.on{background:var(--purple);color:#fff}
.map-frame{width:100%;height:min(78vh,720px);border:0;border-radius:24px;box-shadow:var(--shadow);background:#e9ebf2;display:block}
.search{position:relative;flex:1;min-width:240px;max-width:520px}
.search input{width:100%;padding:13px 16px;padding-inline-start:44px;border-radius:999px;border:1px solid var(--line);background:#fff;font-family:inherit;font-size:.95rem;box-shadow:var(--shadow-sm)}
.search .ico{position:absolute;top:50%;inset-inline-start:15px;transform:translateY(-50%);color:var(--muted);width:19px;height:19px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 14px;font-weight:600;font-size:.84rem;cursor:pointer;color:var(--text);font-family:inherit;display:inline-flex;gap:7px;align-items:center}
.chip i{width:9px;height:9px;border-radius:3px;background:var(--c)}
.chip.on{background:var(--c);border-color:var(--c);color:#fff}
.chip.on i{background:#fff}
.chip-open.on{background:#146B55;border-color:#146B55;color:#fff}
.acc{display:flex;flex-direction:column;gap:12px}
.acc details{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);overflow:hidden}
.acc summary{list-style:none;display:flex;align-items:center;gap:14px;padding:16px 20px;cursor:pointer;font-weight:700;color:var(--ink)}
.acc summary::-webkit-details-marker{display:none}
.acc summary .ic{width:38px;height:38px;border-radius:11px;background:var(--c);color:#fff;display:flex;align-items:center;justify-content:center;flex:none}
.acc summary .n{margin-inline-start:auto;font-size:.78rem;background:var(--band);color:var(--muted);border-radius:99px;padding:3px 10px}
.acc summary .chev{transition:transform .2s;color:var(--muted)}
.acc details[open] .chev{transform:rotate(180deg)}
.acc .inner{padding:4px 20px 20px;display:grid;gap:12px}
.count-line{font-size:.85rem;color:var(--muted);margin-bottom:12px}

/* partner page */
.p-hero{display:flex;gap:26px;align-items:center}
.p-logo{width:120px;height:120px;border-radius:28px;background:linear-gradient(160deg,var(--deep),var(--purple));color:#fff;display:flex;align-items:center;justify-content:center;font-size:2.4rem;font-weight:800;flex:none;box-shadow:var(--shadow);overflow:hidden}
.p-logo img{width:100%;height:100%;object-fit:contain;background:#fff}
.p-hero .pills{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.p-layout{display:grid;grid-template-columns:1.35fr .65fr;gap:28px;align-items:start}
.p-main{display:grid;gap:28px}
.p-side{display:grid;gap:20px;position:sticky;top:96px}
.p-block h2{font-size:1.35rem;margin-bottom:6px}
.p-block>.sub{color:var(--muted);font-size:.9rem;margin-bottom:16px}
.gallery{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:150px 150px;gap:10px}
.gallery div{border-radius:16px;background:linear-gradient(135deg,var(--band),var(--band-2));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--muted);font-size:.8rem;text-align:center;padding:10px;border:1.5px dashed #CFC6D8}
.gallery div:first-child{grid-row:span 2}
.gallery img{width:100%;height:100%;object-fit:cover;border-radius:16px}
.timetable{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;font-size:.9rem}
.timetable th,.timetable td{padding:12px 14px;text-align:start;border-bottom:1px solid var(--line);vertical-align:top}
.timetable th{background:var(--band);color:var(--ink);font-size:.8rem;text-transform:uppercase;letter-spacing:.04em}
.timetable tr:last-child td{border-bottom:none}
.timetable td b{color:var(--ink)}
.table-wrap{overflow-x:auto}
.steps{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.steps span{font-size:.76rem;font-weight:700;padding:4px 10px;border-radius:99px;background:var(--band);color:var(--teal)}
.steps span+span::before{content:"→ ";color:var(--muted)}
.pattern{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--purple)}
.other-p{display:grid;gap:10px}
.other-p a{display:flex;gap:12px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px 12px;text-decoration:none;font-weight:700;color:var(--ink);font-size:.9rem}
.other-p a span{width:36px;height:36px;border-radius:10px;background:var(--purple);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.8rem;flex:none}
.success{display:none;background:#DDF3EA;color:#146B55;border-radius:12px;padding:12px 14px;font-weight:600;font-size:.9rem}
@media (max-width:960px){.p-layout{grid-template-columns:1fr}.p-side{position:static}}
@media (max-width:640px){.p-hero{flex-direction:column;align-items:flex-start}.gallery{grid-template-columns:1fr 1fr;grid-template-rows:130px 130px 130px}.gallery div:first-child{grid-column:span 2;grid-row:auto}}

/* floating whatsapp */
.wa-float{position:fixed;bottom:22px;inset-inline-end:22px;z-index:60;display:flex;align-items:center;gap:10px;background:#1FA855;color:#fff;border-radius:999px;padding:12px 18px;font-weight:700;text-decoration:none;box-shadow:0 10px 25px -8px rgba(31,168,85,.6);font-size:.9rem}
.wa-float .ico{width:22px;height:22px}
.wa-float.pending{background:#fff;color:var(--muted);border:1px solid var(--line);box-shadow:var(--shadow-sm)}

/* reveal on scroll (content is visible by default; animation is a bonus) */
@media (prefers-reduced-motion:no-preference){
  .reveal{animation:rise .7s ease both}
  @keyframes rise{from{opacity:.001;transform:translateY(14px)}to{opacity:1;transform:none}}
}

/* ---------- usability additions ---------- */
.skip{position:absolute;inset-inline-start:0;top:0;transform:translateY(-120%);background:var(--ink);color:#fff;padding:10px 16px;z-index:100;border-radius:0 0 10px 0}
.skip:focus{transform:none}
.draft-bar{margin:0;background:#FFF6DC;color:#5C4400;font-size:.82rem;text-align:center;padding:6px 16px;border-bottom:1px solid #F0DFA8}
.lang-select{position:relative;display:inline-flex;align-items:center;gap:6px;background:var(--band);border:1px solid var(--line);border-radius:999px;padding:0 6px 0 12px;height:38px;color:var(--purple)}
.lang-select .ico{width:18px;height:18px}
.lang-select select{border:none;background:transparent;font:inherit;font-weight:700;font-size:.88rem;color:var(--ink);padding:8px 4px;cursor:pointer;max-width:150px}
.qq-search{display:flex;gap:10px;max-width:640px;margin:0 auto 22px}
.qq-search .search{max-width:none}
.qq-search input{padding-block:15px;font-size:1rem}
.actions{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;font-size:.84rem;margin-top:2px}
.actions a:not(.btn){color:var(--teal);font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:5px;padding-block:4px}
.actions .ico{width:16px;height:16px}
.btn-xs{padding:6px 14px;font-size:.8rem}
.form label.check{display:flex;gap:10px;align-items:center;font-weight:600;cursor:pointer}
.form label.check input{width:20px;height:20px}
.form .lbl{display:block;font-size:.82rem;font-weight:700;color:var(--ink);margin-bottom:6px}
.p-hero .pills .btn{margin-inline-start:6px}
@media (max-width:560px){.qq-search{flex-direction:column}.qq{font-size:.88rem;padding:10px 14px}}
@media (max-width:560px){
  .nav{gap:8px}
  .logo{flex:0 1 auto;min-width:0}
  .logo-text{min-width:0}
  .logo-text b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.98rem}
  .logo img{width:36px;height:36px}
  .lang-select{padding:0 2px 0 8px;height:36px}
  .lang-select .ico{display:none}
  .lang-select select{max-width:96px;font-size:.84rem}
  .menu-btn{width:40px;height:40px;flex:none}
}

section,.qq-answer,#register{scroll-margin-top:90px}
@media (max-width:560px){
  .draft-bar{font-size:.74rem;padding:4px 12px}
}

/* ---------- v3: new logo, home directory, calmer layout ---------- */
.foot .logo img.foot-mark{background:#fff;border-radius:12px;padding:5px 7px;height:52px}
.about-art img{width:auto;height:200px;border-radius:0;box-shadow:none;background:#fff;padding:22px 26px;border-radius:32px}
.sub-head{font-size:1.2rem;text-align:center;margin-top:48px}
.sub-p{text-align:center;color:var(--muted);margin:6px 0 20px}
#directory .dir-bar{justify-content:flex-start}
#directory .search{flex:1;max-width:none}
.chip .ico{width:16px;height:16px}
.chip-open{display:inline-flex;gap:7px;align-items:center}
.chip-open.on{background:#146B55;border-color:#146B55;color:#fff}
.linkbtn{background:none;border:none;color:var(--teal);font:inherit;font-weight:700;cursor:pointer;padding:0 6px;text-decoration:underline}
button.cat{font:inherit;cursor:pointer;color:inherit}
.cat.on{border-color:var(--c);box-shadow:0 0 0 2px var(--c) inset}
.how-6{grid-template-columns:repeat(3,1fr)}
@media (max-width:860px){.how-6{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.how-6{grid-template-columns:1fr}}
/* partner cards: the organisation's own logo on white */
.pcard-top{background:#fff;border-bottom:1px solid var(--line);height:150px;border-top:5px solid var(--c,var(--purple))}
.pcard-top .mono{width:auto;height:auto;max-width:78%;background:none;border:none;border-radius:0;color:var(--ink)}
.pcard-top .mono img{max-height:96px;max-width:100%;width:auto;height:auto;object-fit:contain;background:none;border-radius:0}
.pcard-top .pill{top:10px}
.p-logo{width:auto;min-width:120px;max-width:240px;height:120px;padding:14px;background:#fff;box-shadow:var(--shadow);border-radius:24px}
.p-logo img{width:100%;height:100%;object-fit:contain;background:#fff}
.gallery figure{margin:0;position:relative;border-radius:16px;overflow:hidden}
.gallery figure:first-child{grid-row:span 2}
.gallery figure img{width:100%;height:100%;object-fit:cover;display:block}
.gallery figcaption{position:absolute;inset-inline-start:8px;bottom:8px;background:rgba(0,0,0,.55);color:#fff;font-size:.7rem;padding:2px 8px;border-radius:99px}
.orb-logo img{height:64%;width:auto}
@media (max-width:820px){.orb-logo img{height:66%}}
.gallery.g1{grid-template-columns:1fr;grid-template-rows:320px}
.gallery.g2{grid-template-columns:1fr 1fr;grid-template-rows:260px}
.gallery.g3{grid-template-columns:2fr 1fr;grid-template-rows:150px 150px}
.gallery.g3 figure:first-child{grid-row:span 2}
.gallery.g1 figure:first-child,.gallery.g2 figure:first-child{grid-row:auto}
@media (max-width:640px){.gallery.g2,.gallery.g3{grid-template-columns:1fr;grid-template-rows:auto}.gallery figure{height:200px}.gallery.g3 figure:first-child{grid-row:auto}}
/* home: compact category tiles — 3 × 3, icon beside the name */
#directory .cat-grid{grid-template-columns:repeat(3,1fr);gap:10px}
#directory .cat{flex-direction:row;text-align:start;padding:12px 14px;gap:12px;border-radius:14px}
#directory .cat .ic{width:38px;height:38px;border-radius:11px;flex:none}
#directory .cat b{flex:1}
@media (max-width:760px){#directory .cat-grid{grid-template-columns:1fr 1fr}}
@media (max-width:420px){#directory .cat{padding:10px;gap:8px}#directory .cat b{font-size:.84rem}#directory .cat > span:not(.ic){display:none}}
/* phones: skip the decorative logo card in About — less scrolling */
@media (max-width:760px){.about-art{display:none}}
.other-p a span.has-logo{background:#fff;border:1px solid var(--line);width:52px;padding:3px}
.other-p a span.has-logo img{max-width:100%;max-height:100%;object-fit:contain}
.gallery figure.fit{background:#EDE7F1}.gallery figure.fit img{object-fit:contain}

/* news & events written by organisations */
.post .post-img{display:block;width:100%;max-height:280px;object-fit:cover;border-radius:12px;margin-bottom:12px}
.post .note{margin-top:6px}

/* secure request form */
.hp{position:absolute;inset-inline-start:0;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;opacity:0;pointer-events:none}
.form{position:relative}
.success.error{background:#fdecec;color:#b91c1c;border-color:#f2c9c9}

/* ---------- organisation page: moving banner, carousel, request window ---------- */
.org-banner{position:relative;min-height:340px;display:flex;align-items:flex-end;overflow:hidden;background:var(--deep);color:#fff}
.ob-slides{position:absolute;inset:0}
.ob-slide{position:absolute;inset:-4%;background:center/cover no-repeat;opacity:0;transition:opacity 1.6s ease;animation:ob-pan 18s ease-in-out infinite alternate}
.ob-slide.on{opacity:1}
@keyframes ob-pan{from{transform:scale(1.04) translateX(-1.5%)}to{transform:scale(1.14) translateX(1.5%)}}
.ob-plain{background:linear-gradient(120deg,var(--deep),var(--c,var(--purple)),var(--purple-2));background-size:220% 220%;animation:ob-grad 14s ease infinite}
@keyframes ob-grad{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.ob-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(28,12,38,.15) 0%,rgba(28,12,38,.55) 55%,rgba(28,12,38,.85) 100%)}
.ob-inner{position:relative;z-index:1;padding-block:30px 34px;width:100%}
.ob-inner .crumbs,.ob-inner .crumbs a{color:rgba(255,255,255,.85)}
.ob-head{display:flex;gap:24px;align-items:flex-end}
.ob-head h1{color:#fff;font-size:clamp(1.8rem,3.6vw,2.7rem);margin:0 0 8px;text-shadow:0 2px 14px rgba(0,0,0,.35)}
.ob-head p{color:rgba(255,255,255,.92);max-width:640px;margin:0}
.ob-head .p-logo{background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.3)}
.ob-cta{margin-top:-26px;position:relative;z-index:2}
.btn-lg{padding:16px 26px;font-size:1.05rem;border-radius:999px;box-shadow:0 12px 26px -12px rgba(26,124,103,.7)}
@media (prefers-reduced-motion: reduce){.ob-slide,.ob-plain{animation:none}.ob-slide{transition:none}}
@media (max-width:640px){.org-banner{min-height:300px}.ob-head{flex-direction:column;align-items:flex-start;gap:14px}.ob-head .p-logo{width:84px;height:84px}}
.block-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:12px}
.block-head h2{margin:0}
.mini-chips{display:flex;gap:6px;flex-wrap:wrap}
.mini-chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:3px 11px;font:inherit;font-size:.78rem;color:var(--muted);cursor:pointer}
.mini-chip.on{background:var(--purple);border-color:var(--purple);color:#fff}
.carousel{position:relative}
.car-track{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;border-radius:16px}
.car-track::-webkit-scrollbar{display:none}
.slide-pic{flex:0 0 min(78%,420px);height:260px;margin:0;scroll-snap-align:start;position:relative;border-radius:16px;overflow:hidden;background:#eee}
.slide-pic img{width:100%;height:100%;object-fit:cover}
.slide-pic.fit img{object-fit:contain;background:#f4f1f6}
.slide-pic figcaption{position:absolute;inset-inline-start:10px;bottom:8px;background:rgba(0,0,0,.45);color:#fff;font-size:.7rem;padding:2px 8px;border-radius:999px}
.car-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,255,255,.92);box-shadow:var(--shadow-sm);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--purple)}
.car-btn.prev{inset-inline-start:8px}.car-btn.next{inset-inline-end:8px}
[dir=rtl] .car-btn .ico{transform:scaleX(-1)}
@media (max-width:640px){.slide-pic{flex-basis:86%;height:210px}}
.svc-ask{cursor:pointer;transition:box-shadow .15s,transform .15s}
.svc-ask:hover,.svc-ask:focus-visible{box-shadow:0 10px 26px -14px rgba(82,37,105,.55);transform:translateY(-2px)}
.req-dialog{border:0;border-radius:22px;padding:0;width:min(560px,94vw);max-height:92vh;box-shadow:0 30px 80px rgba(0,0,0,.3)}
.req-dialog::backdrop{background:rgba(25,12,35,.5)}
.req-form{padding:22px 24px 24px;gap:14px}
.req-head{display:flex;gap:12px;align-items:flex-start}
.req-head>div{flex:1}
.req-head h3{margin:0 0 4px;font-size:1.25rem}
.req-x{border:0;background:#f2eef5;width:34px;height:34px;border-radius:50%;cursor:pointer;font-size:1rem;color:var(--purple)}

/* ---------- organisation page, calmer version ---------- */
.org-hero .crumbs{margin:0 4px 12px;font-size:.88rem;color:var(--muted)}
.org-hero .hero-card,.org-hero .slides{min-height:420px}
.org-hero .slide{padding:48px 90px}
.org-hero .slide h1{font-size:clamp(1.9rem,3.4vw,2.7rem)}
.org-hero .slide p.lead{color:var(--text)}
.orb-logo{background:#fff}
.orb-logo img{max-width:72%;max-height:60%;height:auto;object-fit:contain}
.orb-photo{width:100%;height:100%;object-fit:cover;border-radius:50%}
.orb-mono{font-size:3.2rem;color:var(--purple)}
@media (max-width:820px){.org-hero .hero-card,.org-hero .slides{min-height:560px}.org-hero .slide{padding:34px 22px 64px}}
.p-layout{gap:34px}
.p-main{display:grid;gap:38px}
.p-block{scroll-margin-top:90px}
.p-block h2{font-size:1.3rem}
.svc-list{gap:14px}
.svc-top{align-items:flex-start}
.svc-go{flex:none;width:34px;height:34px;border-radius:50%;background:#EFE6F5;color:var(--purple);display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}
.svc-go .ico{width:18px;height:18px}
[dir=rtl] .svc-go .ico{transform:scaleX(-1)}
.svc-ask:hover .svc-go,.svc-ask:focus-visible .svc-go{background:var(--purple);color:#fff}
.svc-ask:focus-visible{outline:3px solid #B89BC9;outline-offset:2px}
.car-track{padding-bottom:2px}
.slide-pic{height:240px}

/* thank-you panel (home contact form and request window) */
.thanks{display:grid;justify-items:center;text-align:center;gap:6px;padding:26px 18px 22px}
.thanks h3{margin:6px 0 0;font-size:1.5rem}
.thanks p{margin:0;color:var(--muted,#5b5470)}
.thanks-ic{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:#e4f4ee;color:#0f7a5a}
.thanks-ic .ico{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.thanks-ref{margin-top:10px!important;display:inline-flex;gap:8px;align-items:center;padding:8px 16px;border-radius:999px;background:#f1edf8;color:var(--ink,#2a1f45)!important}
.thanks-ref b{font-size:1.15rem;letter-spacing:.08em}
.thanks .btn{margin-top:14px}
/* never let anything push the page sideways (right-to-left pages scroll to the left) */
html,body{overflow-x:clip}