/* CLEAR Projects home page, styled on clearuk.org. Loaded after chrome.css (fonts, accessibility panel, focus styles). */
:root{
  --ck-purple:#3d2b96;--ck-purple-d:#2e2073;--ck-pink:#c03d73;--ck-teal:#4294af;--ck-mint:#73dcb2;--ck-yellow:#efbb57;--ck-orange:#ef8836;
  --ck-lav:#ebe9f9;--ck-mintbg:#ecfdf5;--ck-ink:#1f2433;--ck-body:#3b4254;--ck-slate:#566583;--ck-grey:#6b7285;
}
html[data-contrast="high"]{--ck-body:#000;--ck-ink:#000;--ck-slate:#000;--ck-lav:#fff;--ck-mintbg:#fff}
body.ck{background:#fff;color:var(--ck-body);font-family:var(--font)}
.ck h1,.ck h2,.ck h3{color:var(--ck-ink);letter-spacing:-.01em}
.ck-wrap{width:100%;max-width:1200px;margin:0 auto;padding:0 24px}

/* helpline bar */
.ck-help{background:#347d97;color:#fff;font-weight:500;font-size:1rem}
.ck-help .ck-wrap{padding-top:12px;padding-bottom:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ck-help a{color:#fff;text-decoration:none;font-weight:600}
.ck-help a:hover{text-decoration:underline}

/* header */
.ck-head{background:#fff;border-bottom:1px solid #eceaf3;position:sticky;top:0;z-index:30}
.ck-head .ck-wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:96px}
.ck-logo img{display:block;height:58px;width:auto}
.ck-headbtns{display:flex;gap:12px;align-items:center}
.ck-round{width:56px;height:56px;border-radius:50%;border:0;background:var(--ck-purple);color:#fff;display:grid;place-items:center;cursor:pointer;text-decoration:none}
.ck-round:hover{background:var(--ck-purple-d)}
.ck-round svg{width:26px;height:26px;stroke:#fff;fill:none;stroke-width:2.2;stroke-linecap:round}
.ck-menulabel{font-weight:600;color:var(--ck-purple);margin-right:4px}

/* menu (full screen, like clearuk.org) */
.ck-menu{position:fixed;inset:0;z-index:70;background:#fff;overflow:auto}
.ck-menu .top{display:flex;justify-content:flex-end;border-bottom:1px solid #eceaf3;padding:18px 24px}
.ck-close{width:52px;height:52px;border:0;background:none;cursor:pointer;color:var(--ck-slate);display:grid;place-items:center;border-radius:12px}
.ck-close svg{width:30px;height:30px;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.ck-menu .body{max-width:720px;margin:0 auto;padding:28px 24px 60px}
.ck-menu .lbl{font-size:.9rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--ck-grey);margin:18px 0 10px}
.ck-menu ul{list-style:none;margin:0;padding:0}
.ck-menu .main a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;font-size:1.6rem;font-weight:700;color:var(--ck-slate);text-decoration:none;border-radius:12px}
.ck-menu .main a:hover{background:var(--ck-lav);color:var(--ck-purple)}
.ck-menu .main a svg{width:26px;height:26px;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ck-menu .main li:nth-child(1) svg{stroke:var(--ck-pink)}
.ck-menu .main li:nth-child(2) svg{stroke:var(--ck-teal)}
.ck-menu .main li:nth-child(3) svg{stroke:var(--ck-orange)}
.ck-menu .main li:nth-child(4) svg{stroke:#6a5cf0}
.ck-menu .res{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;padding:0 16px}
.ck-menu .res a{font-size:1.35rem;font-weight:500;color:var(--ck-slate);text-decoration:none;padding:6px 0}
.ck-menu .res a:hover{color:var(--ck-purple);text-decoration:underline}
.ck-sq{display:inline-block;width:12px;height:12px;background:var(--ck-pink)}

/* hero */
.ck-hero{background:var(--ck-purple);color:#fff;overflow:hidden}
.ck-hero .ck-wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center;padding-top:72px;padding-bottom:80px}
.ck-hero .eyebrow{font-size:.95rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ck-mint);margin:0 0 14px}
.ck-hero h1{color:#fff;font-size:clamp(2.3rem,5.2vw,3.8rem);line-height:1.08;font-weight:700;margin:0 0 20px}
.ck-hero p{font-size:clamp(1.1rem,2vw,1.35rem);line-height:1.65;color:#fff;margin:0 0 32px;max-width:32em}
.ck-hero .btns{display:flex;flex-wrap:wrap;gap:14px}
.ck-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:500 1.15rem var(--font);text-decoration:none;border-radius:8px;padding:16px 30px;min-height:56px;border:2px solid transparent;cursor:pointer;transition:background .15s,transform .15s}
.ck-btn:hover{transform:translateY(-1px)}
.ck-btn.pink{background:var(--ck-pink);color:#fff}
.ck-btn.pink:hover{background:#a8305f}
.ck-btn.ghost{background:transparent;color:#fff;border-color:#ffffffb3}
.ck-btn.ghost:hover{background:#ffffff1a}
.ck-btn.purple{background:var(--ck-purple);color:#fff}
.ck-btn.purple:hover{background:var(--ck-purple-d)}
.ck-bubbles{width:100%;max-width:440px;justify-self:center}
.ck-bubbles svg{width:100%;height:auto;display:block}

/* lavender card section */
.ck-lav{background:var(--ck-lav);padding:72px 0}
.ck-sechead{text-align:center;max-width:44em;margin:0 auto 40px}
.ck-sechead h2{font-size:clamp(1.8rem,3.6vw,2.5rem);margin:0 0 12px}
.ck-sechead p{font-size:1.15rem;line-height:1.7;margin:0}
.ck-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
.ck-card{background:#fff;border-radius:36px;padding:44px 36px 40px;text-align:center;box-shadow:0 2px 10px #3d2b960f;display:flex;flex-direction:column;align-items:center}
.ck-circle{width:136px;height:136px;border-radius:50%;display:grid;place-items:center;margin-bottom:22px}
.ck-circle svg{width:60px;height:60px;fill:#fff}
.ck-card h3{font-size:1.9rem;font-weight:600;margin:0 0 14px}
.ck-card p{font-size:1.15rem;line-height:1.75;margin:0 0 26px;flex:1}
.ck-card.small{padding:36px 30px}
.ck-card.small .ck-circle{width:104px;height:104px}.ck-card.small .ck-circle svg{width:46px;height:46px}
.ck-card.small h3{font-size:1.5rem}
.c-pink .ck-circle{background:var(--ck-pink)}.c-pink h3{color:var(--ck-pink)}
.c-teal .ck-circle{background:var(--ck-teal)}.c-teal h3{color:var(--ck-teal)}
.c-orange .ck-circle{background:var(--ck-orange)}.c-orange h3{color:#c8641a}
.c-purple .ck-circle{background:var(--ck-purple)}.c-purple h3{color:var(--ck-purple)}
.ck-textlink{font-weight:600;font-size:1.1rem;color:var(--ck-purple);text-underline-offset:4px}

/* mint section: topics people can talk about */
.ck-mint{padding:72px 0}
.ck-mintbox{background:var(--ck-mintbg);border-radius:36px;padding:48px 40px}
.ck-mintbox>h2{font-size:clamp(1.8rem,3.6vw,2.5rem);margin:0 0 14px}
.ck-mintbox>p{font-size:1.15rem;line-height:1.75;margin:0 0 32px;max-width:44em}
.ck-topics{display:grid;grid-template-columns:repeat(3,1fr);gap:0;background:#fff;border-radius:28px;overflow:hidden;box-shadow:0 2px 10px #0a7a5c12}
.ck-topic{padding:34px 28px;text-align:center;border-bottom:1px solid #eef3f1;border-right:1px solid #eef3f1;text-decoration:none;color:var(--ck-body);display:flex;flex-direction:column;align-items:center;transition:background .15s}
.ck-topic:hover{background:#f7fffb}
.ck-topic .t{font-size:.95rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;margin:0 0 18px}
.ck-speech{width:104px;height:104px;margin:0 0 18px}
.ck-topic p{margin:0 0 12px;font-size:1.05rem;line-height:1.6}
.ck-topic .go{margin-top:auto;font-weight:600;color:var(--ck-purple);text-decoration:underline;text-underline-offset:4px}
.ck-topic:last-child{border-right:0}

/* footer */
.ck-foot{background:var(--ck-purple);color:#fff}
.ck-foot .ck-wrap{padding-top:48px;padding-bottom:40px;display:grid;grid-template-columns:1.2fr 1fr;gap:32px;align-items:start}
.ck-foot img{height:44px;width:auto;background:#fff;border-radius:10px;padding:8px 12px}
.ck-foot p{margin:14px 0 0;color:#e4e0f7;line-height:1.7}
.ck-foot ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ck-foot a{color:#fff;text-underline-offset:4px}
.ck-foot .base{border-top:1px solid #ffffff2e;grid-column:1/-1;padding-top:20px;font-size:.92rem;color:#d6d0f3}

/* floating buttons */
.ck-top{position:fixed;right:24px;bottom:110px;z-index:50;display:inline-flex;align-items:center;gap:10px;background:var(--ck-purple);color:#fff;border:0;border-radius:8px;padding:14px 22px;font:500 1.1rem var(--font);cursor:pointer;box-shadow:0 8px 24px #3d2b9640}
.ck-top svg{width:22px;height:22px;stroke:#fff;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.ck-a11yfab{position:fixed;right:24px;bottom:24px;z-index:50;width:68px;height:68px;border-radius:50%;background:#fff;border:6px solid var(--ck-purple);display:grid;place-items:center;cursor:pointer;box-shadow:0 6px 20px #3d2b9633}
.ck-a11yfab svg{width:40px;height:40px;fill:var(--ck-purple)}
.a11y{top:auto;bottom:104px}

@media (max-width:900px){
  .ck-hero .ck-wrap{grid-template-columns:1fr;padding-top:48px;padding-bottom:56px;gap:36px}
  .ck-bubbles{max-width:280px;order:-1}
  .ck-cards{grid-template-columns:1fr}
  .ck-topics{grid-template-columns:1fr}
  .ck-topic{border-right:0}
  .ck-foot .ck-wrap{grid-template-columns:1fr}
}
@media (max-width:600px){
  .ck-wrap{padding:0 20px}
  .ck-head .ck-wrap{min-height:84px}
  .ck-logo img{height:46px}
  .ck-menulabel{display:none}
  .ck-lav,.ck-mint{padding:48px 0}
  .ck-mintbox{padding:36px 22px;border-radius:28px}
  .ck-card{padding:36px 24px;border-radius:30px}
  .ck-card h3{font-size:1.65rem}
  .ck-btn{width:100%}
  .ck-top{right:16px;bottom:100px;padding:12px 18px}
  .ck-a11yfab{right:16px;bottom:16px;width:62px;height:62px}
}
@media print{.ck-help,.ck-top,.ck-a11yfab,.ck-headbtns{display:none!important}}

/* resources list: pink squares between items, a plain list on phones */
.ck-menu .res li{display:flex;align-items:center;gap:18px}
.ck-menu .res li+li::before{content:"";width:12px;height:12px;background:var(--ck-pink);flex:none}
@media (max-width:600px){.ck-menu .res{flex-direction:column;align-items:flex-start;gap:2px}.ck-menu .res li+li::before{display:none}}
/* topics: centre the last row */
.ck-topics{display:flex;flex-wrap:wrap;justify-content:center}
.ck-topic{flex:0 0 33.333%}
@media (max-width:900px){.ck-topic{flex-basis:100%}.ck-bubbles{max-width:180px}}