/* Main pages. Direction taken from Julienne's home page mockup: white background, painted brush
   strokes, rounded outline cards in many colours, hand-drawn illustrations that overlap card edges,
   blue pill buttons, one blue call-to-action panel. Fonts: Nunito (titles), Mulish (text),
   Kaushan Script (small script words only; the big home headline is an image). */
:root{
  --blue:#0a47f0;--yellow:#f5b521;--orange:#ff4f17;--pink:#f0609e;--magenta:#c935d0;
  --red:#e3141b;--green:#2e7d32;--peach:#f6a98a;
  --soft-blue:#3b5fd9;
  --c:var(--blue);--t:var(--blue);
  --title:"Nunito","Trebuchet MS",system-ui,sans-serif;
  --body:"Mulish",system-ui,-apple-system,"Segoe UI",sans-serif;
  --script:"Kaushan Script","Brush Script MT",cursive;
}
/* outline colour (--c) and the darker text colour that is safe on white (--t) */
.k-blue{--c:#0a47f0;--t:#0a47f0}.k-yellow{--c:#f5b521;--t:#8a5a00}.k-orange{--c:#ff4f17;--t:#b93200}
.k-pink{--c:#f0609e;--t:#b6256a}.k-magenta{--c:#c935d0;--t:#9b1fa6}.k-red{--c:#e3141b;--t:#c4000b}
.k-green{--c:#2e7d32;--t:#2e7d32}.k-peach{--c:#f6a98a;--t:#a8421b}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:var(--blue);font:400 18px/1.6 var(--body);overflow-x:hidden}
main{overflow-x:clip;position:relative}
img{max-width:100%;height:auto;display:block}
a{color:var(--blue)}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
p{margin:0 0 1em}
h1,h2,h3{font-family:var(--title);font-weight:800;margin:0;line-height:1.1}
.wrap{width:100%;max-width:1200px;margin:0 auto;padding:0 20px;position:relative;z-index:1}
.narrow{max-width:800px}
.center{text-align:center}
.lead{font-size:clamp(19px,2.2vw,23px);line-height:1.55}
.sec{position:relative;padding:clamp(48px,7vw,96px) 0}
.sec.tight{padding-top:0}
.soft{background:linear-gradient(#fff,#f3f6ff 40%,#f3f6ff 60%,#fff)}
.ink{color:var(--t)}

/* ---------- header (floats over the page hero, as in the mockup) ---------- */
.site-head{position:absolute;left:0;right:0;top:0;z-index:30}
.hw{max-width:1640px;margin:0 auto;padding:26px clamp(18px,3.4vw,56px);display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font:800 clamp(18px,1.45vw,22px)/1 var(--title);text-transform:uppercase;color:var(--blue)}
.brand img{width:clamp(64px,6.4vw,100px);height:auto}
.brand b{color:var(--yellow);font-weight:800}
.site-nav{display:flex;align-items:center;gap:clamp(16px,3.7vw,60px);margin-left:auto;font:700 clamp(14px,1.3vw,19px)/1 var(--title);text-transform:uppercase}
.site-nav a:last-child{margin-left:clamp(10px,12vw,200px)}
.site-nav a{color:var(--blue);text-decoration:none;padding:6px 0;border-bottom:4px solid transparent;border-radius:2px}
.site-nav a:hover,.site-nav a[aria-current="page"]{border-bottom-color:var(--orange)}
.nav-toggle{display:none;width:48px;height:48px;border:3px solid var(--blue);border-radius:16px;background:#fff;cursor:pointer;padding:0;position:relative}
.nav-toggle span{position:absolute;left:10px;right:10px;height:3px;border-radius:2px;background:var(--blue)}
.nav-toggle span:nth-child(1){top:13px}.nav-toggle span:nth-child(2){top:20px}.nav-toggle span:nth-child(3){top:27px}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:1199px){
  .hw{position:relative;padding-top:16px;padding-bottom:12px}
  .js .nav-toggle{display:block}
  .js .site-nav{display:none;position:absolute;left:12px;right:12px;top:100%;flex-direction:column;align-items:stretch;gap:0;background:#fff;border:4px solid var(--yellow);border-radius:24px;box-shadow:0 18px 30px rgba(10,71,240,.2);padding:8px 20px 10px;font-size:19px;z-index:40}
  .js .site-nav.open{display:flex}
  .js .site-nav a{padding:15px 0;border-bottom:1px solid #e6ebfb;border-radius:0}
  .js .site-nav a:last-child{border-bottom:0}
  .site-nav{flex-wrap:wrap;gap:4px 22px;justify-content:flex-end}
}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:.5em;font:700 18px/1.2 var(--title);text-decoration:none;padding:17px 32px;border-radius:999px;
  background:var(--blue);color:#fff!important;border:0;cursor:pointer;text-align:center;box-shadow:0 14px 28px -10px rgba(10,71,240,.55)}
.btn:hover{background:#0838c4}
.btn.white{background:#fff;color:var(--blue)!important;box-shadow:0 10px 24px -10px rgba(0,20,100,.5)}
.btn.white:hover{background:#eef3ff}
.btn[disabled]{background:#d9dbe6;color:#4a4d63!important;cursor:not-allowed;box-shadow:none}
.go{font:700 17px/1.2 var(--title);color:var(--blue);text-decoration:none}
.go::after{content:" \2192"}
.btns{display:flex;flex-wrap:wrap;gap:14px}

/* ---------- home hero: everything is placed in cqw, so it scales like the mockup ---------- */
.hh{container-type:inline-size;position:relative;width:100%;max-width:1640px;margin:0 auto;aspect-ratio:1566/880;overflow:hidden}
.hh>*,.hh .art>*{position:absolute}
.hh .splash{left:34cqw;top:0;width:66cqw;max-width:none}
.hh .woman{left:55.7cqw;top:1.6cqw;width:38.2cqw}
.hh .woman img{width:100%}
.hh .woman .tee{position:absolute;left:49.8%;top:53%;width:16.7%}
.hh h1{left:1.76cqw;top:9.6cqw;width:54.7cqw}
.hh h1 img{width:100%}
.hh .sub{left:3.3cqw;top:34cqw;margin:0;font:700 3.1cqw/1.25 var(--title);color:var(--blue)}
.hh .cta{left:3.4cqw;top:43.6cqw;display:flex;align-items:center;justify-content:center;gap:.8cqw;width:25.2cqw;height:5.6cqw;padding:0;font-size:1.62cqw;
  box-shadow:0 1.6cqw 2.4cqw -.4cqw rgba(10,71,240,.38)}
.hh .dove{left:27.5cqw;top:42.2cqw;width:6.2cqw;pointer-events:none}
@media(max-width:899px){
  .hh{aspect-ratio:auto;overflow:hidden;padding:104px 20px 0;display:block;container-type:normal}
  .hh>*{position:static}
  .hh h1{width:min(100%,520px);margin:0 auto 10px}
  .hh .sub{font-size:clamp(22px,6vw,30px);margin:0 0 20px;text-align:center}
  .hh .cta{width:auto;height:auto;font-size:18px;padding:17px 30px;display:flex;max-width:340px;margin:0 auto;box-shadow:0 14px 28px -10px rgba(10,71,240,.55)}
  .hh .dove{display:none}
  .hh .art{display:block;position:relative;width:calc(100% + 40px);margin:26px -20px 0;aspect-ratio:1/1.02}
  .hh .splash{position:absolute;left:-14%;top:0;width:128%}
  .hh .woman{position:absolute;left:21%;top:2%;width:62%}
}
@media(min-width:900px){.hh .art{display:contents}}

/* ---------- home: the four levers ---------- */
.levers{container-type:inline-size;max-width:1640px;margin:0 auto;padding:2.4cqw 0 5cqw;position:relative}
.levers .sec-title{margin:0;text-align:center;font-size:clamp(26px,2.6cqw,44px);color:var(--blue)}
.levers .sec-sub{margin:.4em 0 0;text-align:center;font:400 clamp(17px,1.9cqw,28px)/1.3 var(--body);color:var(--soft-blue)}
.cards4{display:flex;margin:6.4cqw 0 0 7.5cqw}
.lever{position:relative;flex:0 0 18.1cqw;aspect-ratio:284/445;border:5px solid var(--c);border-radius:clamp(22px,1.9cqw,32px);background:#fff;color:var(--blue);text-decoration:none;display:block}
.lever:nth-child(2){margin-left:2.6cqw}.lever:nth-child(3){margin-left:5.5cqw}.lever:nth-child(4){margin-left:5.2cqw}
.lever .lv-photo{position:absolute;inset:0;border-radius:calc(clamp(22px,1.9cqw,32px) - 5px);overflow:hidden}
.lever .lv-photo img{width:100%;height:100%;object-fit:cover}
.lever .lv-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(255,255,255,0) 0%,rgba(255,255,255,0) 36%,rgba(255,255,255,.88) 62%,#fff 78%)}
.lever .tx{position:absolute;left:4%;right:4%;bottom:7%;text-align:center;z-index:2}
.lever h3{font-size:clamp(21px,1.65cqw,30px);color:var(--blue);text-transform:uppercase;letter-spacing:.005em}
.lever p{margin:.3em 0 .6em;font-size:clamp(15px,1.12cqw,19px);line-height:1.35}
.lever .go{font-size:clamp(15px,1.1cqw,18px)}
.lever .art{position:absolute;z-index:3;pointer-events:none;max-width:none}
.lever .bolt{left:92%;top:73%;width:36%}
.lever .dove-m{left:14.8%;top:-23.6%;width:60.6%}
.lever .bible{left:23.6%;top:-13.9%;width:43%}
.lever .fountain{left:-24.3%;top:69.7%;width:47%}
@media(max-width:1099px){
  .cards4{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:70px 26px;margin:84px 20px 0;max-width:760px;margin-left:auto;margin-right:auto;padding:0 20px}
  .lever:nth-child(n){margin-left:0}
  .lever{aspect-ratio:284/420;flex:none}
  .levers .sec-title{font-size:clamp(26px,5vw,38px);padding:0 16px}
  .levers .sec-sub{font-size:clamp(17px,3vw,22px);padding:0 16px}
}
@media(max-width:639px){
  .cards4{grid-template-columns:minmax(0,1fr);gap:84px;max-width:340px}
  .lever{aspect-ratio:284/420}
}

/* ---------- home: testimonials ---------- */
.testis{container-type:inline-size;max-width:1640px;margin:0 auto;position:relative;padding:3.2cqw 0 4cqw}
.testis .splash-l{position:absolute;left:-9cqw;top:-2cqw;width:60cqw;max-width:none;transform:scaleX(-1) rotate(12deg);z-index:0;pointer-events:none}
.testis h2{position:relative;z-index:1;text-align:center;font-size:clamp(26px,2.6cqw,44px);color:var(--blue)}
.tgrid{position:relative;z-index:1;display:grid;grid-template-columns:43cqw 48.7cqw;gap:3.2cqw 2.3cqw;margin:4.6cqw 0 0 3cqw;align-items:start}
.tcard{position:relative;display:grid;grid-template-columns:11.5cqw 1fr;gap:2cqw;align-items:start;border:4px solid var(--c);border-radius:clamp(22px,1.9cqw,32px);padding:1.9cqw 1.9cqw 1.9cqw 1.9cqw;background:#fff;margin:0}
.tcard.tl{background:rgba(255,255,255,.74)}
.tcard img{width:100%;aspect-ratio:1;border-radius:50%;object-fit:cover}
.tcard blockquote{margin:0;position:relative;padding:.4cqw 0 0 3.4cqw}
.tcard blockquote::before{content:"\201D";position:absolute;left:0;top:-.2cqw;font:800 5.6cqw/1 var(--title);color:var(--blue)}
.tcard blockquote p{margin:0 0 1em;font-size:clamp(16px,1.3cqw,22px);line-height:1.4}
.tcard figcaption,.tcard cite{display:block;font-style:normal;font-size:clamp(16px,1.2cqw,21px);line-height:1.35}
.tcard{align-items:center}
@media(max-width:1099px){
  .tgrid{grid-template-columns:minmax(0,1fr);gap:22px;margin:34px 20px 0;max-width:640px;margin-left:auto;margin-right:auto;padding:0 20px}
  .tcard{grid-template-columns:96px 1fr;gap:18px;padding:18px;border-radius:26px;align-items:start}
  .tcard blockquote{padding-left:0}
  .tcard blockquote::before{position:static;display:block;font-size:56px;height:34px;margin-bottom:4px;margin-top:-4px}
  .tcard blockquote p{font-size:17px}
  .tcard figcaption,.tcard cite{font-size:16px}
  .testis .splash-l{width:150%;left:-30%;top:0}
  .testis{padding:36px 0 40px}
  .testis h2{padding:0 16px;font-size:clamp(26px,6vw,36px)}
}
@media(max-width:480px){
  .tcard{grid-template-columns:1fr}
  .tcard>img{width:96px}
}

/* ---------- the blue call-to-action panel (home, and at the end of the other pages) ---------- */
.call{container-type:inline-size;max-width:1640px;margin:0 auto;padding:0 1.4cqw 3cqw}
.call-in{position:relative;overflow:hidden;border-radius:clamp(26px,2cqw,36px);min-height:16cqw;padding:3.4cqw 7.5cqw;
  background:radial-gradient(circle at 18% 20%,rgba(255,255,255,.16),transparent 38%),radial-gradient(circle at 80% 85%,rgba(120,170,255,.4),transparent 45%),linear-gradient(115deg,#1a56f5,#0a47f0 55%,#2468ff);
  background-color:#0a47f0;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:3cqw;box-shadow:0 2cqw 4cqw -2cqw rgba(10,71,240,.55)}
.call h2{font-size:clamp(28px,2.8cqw,48px);color:#fff;text-shadow:0 .3cqw 1cqw rgba(0,30,120,.3);position:relative;z-index:2}
.call p{margin:.6em 0 0;font:400 clamp(18px,1.9cqw,30px)/1.3 var(--body);color:#fff;position:relative;z-index:2}
.call .btn{position:relative;z-index:2;flex:none;padding:1.5cqw 2.6cqw;font-size:clamp(17px,1.45cqw,24px)}
.call .plane{position:absolute;left:47cqw;bottom:-1.2cqw;width:23cqw;max-width:none;z-index:1;pointer-events:none}
@media(max-width:899px){
  .call{padding:0 12px 28px}
  .call-in{flex-direction:column;align-items:flex-start;padding:34px 24px 140px;gap:22px;min-height:0;border-radius:28px}
  .call .plane{left:auto;right:-4%;bottom:-8px;width:min(300px,70%)}
  .call .btn{align-self:flex-start;padding:16px 28px}
}

/* ---------- inner pages: page hero, section titles, outline cards, brush splashes ---------- */
.ph{position:relative;padding:clamp(130px,13vw,190px) 0 clamp(40px,6vw,80px)}
.ph .wrap{display:grid;gap:28px;align-items:center}
@media(min-width:860px){.ph .wrap{grid-template-columns:1.15fr .85fr}}
.ph h1{font-size:clamp(46px,6.2vw,92px);color:var(--t);text-shadow:.045em .045em 0 var(--tint,#fde9b3);margin:0 0 .25em}
.ph .script{margin:0 0 .1em}
.script{font:400 clamp(30px,4.2vw,56px)/1.05 var(--script);color:var(--t);text-shadow:.05em .05em 0 var(--tint,#fde9b3);transform:rotate(-3deg);transform-origin:left}
.ph .lead{max-width:30em;color:var(--blue)}
.ph-art{position:relative;width:min(460px,76vw);margin:0 auto;aspect-ratio:1}
.ph-art .splash{position:absolute;left:50%;top:50%;width:140%;max-width:none;transform:translate(-50%,-50%)}
.ph-art .main{position:absolute;left:50%;top:50%;width:70%;max-width:none;transform:translate(-50%,-50%) rotate(-4deg);filter:drop-shadow(0 14px 14px rgba(10,30,120,.18))}
.tint-yellow{--tint:#fde9b3}.tint-orange{--tint:#ffd2c0}.tint-pink{--tint:#fcd3e4}.tint-magenta{--tint:#f1cdf4}.tint-green{--tint:#cfe8d1}.tint-red{--tint:#fbc7c9}.tint-blue{--tint:#cfdcff}
.h2{font-size:clamp(30px,4vw,52px);color:var(--t);margin:0 0 .5em}
.h2.center{text-align:center}
.h2::after{content:"";display:block;width:90px;height:8px;border-radius:8px;background:var(--c);margin-top:.35em;transform:rotate(-1.5deg)}
.h2.center::after{margin-left:auto;margin-right:auto}
.deco{position:absolute;pointer-events:none;z-index:0;max-width:none;width:clamp(260px,40vw,600px);opacity:.5}
.deco.l{left:-14vw}.deco.r{right:-14vw;transform:scaleX(-1)}
.deco.top{top:-6%}.deco.bot{bottom:-8%}
.deco.hue1{filter:hue-rotate(-25deg)}.deco.hue2{filter:hue-rotate(-60deg)}.deco.hue3{filter:hue-rotate(35deg)}
.deco.flip{transform:scaleY(-1)}
.cx{position:relative;background:#fff;border:5px solid var(--c);border-radius:30px;padding:26px 28px;color:var(--blue)}
.cx h3{font-size:clamp(24px,2.6vw,32px);color:var(--t);margin:0 0 .35em}
.cx p:last-child{margin-bottom:0}
.cx-art{position:absolute;pointer-events:none;max-width:none;z-index:2;filter:drop-shadow(0 8px 8px rgba(10,30,120,.15))}
.cx-art.tr{right:-14px;top:-34px;width:clamp(78px,10vw,112px);transform:rotate(5deg)}
.cx-art.tl{left:-14px;top:-34px;width:clamp(78px,10vw,112px);transform:rotate(-6deg)}
.cx-art.br{right:-14px;bottom:-30px;width:clamp(70px,9vw,100px)}
.cards{display:grid;gap:44px 26px;grid-template-columns:minmax(0,1fr);list-style:none;margin:0;padding:0}
@media(min-width:760px){.cards.c2{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:960px){.cards.c3{grid-template-columns:repeat(3,minmax(0,1fr))}.cards.c4{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:760px) and (max-width:959px){.cards.c3,.cards.c4{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- presentation page ---------- */
.portrait-disc{position:relative;width:min(340px,70vw);aspect-ratio:1;margin:0 auto;border-radius:50%;background:var(--yellow);overflow:hidden;border:6px solid #fff;box-shadow:0 0 0 6px var(--orange)}
.portrait-disc img{position:absolute;left:-4%;bottom:0;width:108%;max-width:none;height:auto}
.who-home{margin:14px 0 0;background:rgba(255,255,255,.88);border-radius:20px;padding:8px 14px;position:relative;text-align:center;font:700 clamp(18px,2.2vw,22px)/1.3 var(--title);color:var(--blue)}
.pres-art{position:relative;max-width:420px;margin:0 auto}
.pres-art .splash{position:absolute;left:50%;top:48%;width:170%;max-width:none;transform:translate(-50%,-50%) rotate(-10deg);z-index:0}
.pres-art>*:not(.splash){position:relative;z-index:1}
.pres-art .dove{position:absolute;right:-18px;top:-30px;width:clamp(100px,13vw,150px);z-index:2;transform:rotate(4deg)}
.flags-card{border:5px solid var(--c);border-radius:34px;padding:26px 20px;background:#fff}
.flags{display:grid;grid-template-columns:repeat(13,minmax(0,1fr));gap:8px;align-items:center;max-width:1000px;margin:0 auto;width:100%}
.flags .flag{width:100%;max-width:78px;margin:0 auto;height:auto}
.flags .flag:nth-child(odd){transform:rotate(-4deg)}.flags .flag:nth-child(even){transform:rotate(3deg) translateY(3px)}
@media(max-width:700px){.flags{grid-template-columns:repeat(7,minmax(0,1fr));gap:10px 6px}}
.asks{display:flex;flex-wrap:wrap;gap:14px;margin:0}
.door{position:relative;display:block;background:#fff;border:5px solid var(--c);border-radius:30px;padding:30px 24px 26px;text-decoration:none;color:var(--blue);min-height:230px}
.door h3{font-size:clamp(26px,3vw,34px);margin:0 0 .3em;color:var(--t);padding-right:96px}
.door p{margin:0 0 .8em;font-size:17px}
.strip{display:grid;gap:26px;align-items:center}
.strip>div:last-child{position:relative;z-index:1}
@media(min-width:820px){.strip{grid-template-columns:1fr 1fr}}
.strip-art{display:flex;gap:10px;justify-content:center;align-items:center;position:relative}
.strip-art .splash{position:absolute;left:50%;top:50%;width:120%;transform:translate(-50%,-50%);z-index:0;max-width:none}
.strip-art .mini{position:relative;z-index:1;width:auto;height:clamp(110px,15vw,190px);max-width:32%;filter:drop-shadow(0 8px 8px rgba(10,30,120,.18))}
.strip-art .mini:nth-child(3){height:clamp(130px,18vw,226px)}
.strip-art .mini:nth-child(4){transform:translateY(14px) rotate(4deg)}.strip-art .mini:nth-child(2){transform:rotate(-5deg)}

/* ---------- solutions page ---------- */
.ph-art .woman-fig{position:absolute;left:50%;bottom:0;width:60%;max-width:none;transform:translateX(-50%)}
.sol-list{display:grid;gap:56px;padding:20px 0 10px}
.sol{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:center;padding:30px 24px 26px}
.sol-art{position:absolute;z-index:2;pointer-events:none;max-width:none;filter:drop-shadow(0 8px 8px rgba(10,30,120,.15));right:-6px;top:-44px}
.sol-art.bolt{width:103px;top:-100px}.sol-art.dove{width:104px;top:-54px}.sol-art.bible{width:96px;top:-52px}.sol-art.fountain{width:90px;top:-48px}
.sol-main h3,.sol-main .sol-line{padding-right:96px}
.sol-line{font:800 clamp(18px,2vw,21px)/1.3 var(--title);color:var(--blue)}
.sol-points{margin:0 0 1em;padding-left:1.2em}
.sol-points li{margin:0 0 .4em}
.sol-points li::marker{color:var(--c)}
.sol-quote{margin:0 0 1em;padding:0 0 0 18px;border-left:5px solid var(--c)}
.sol-quote p{margin:0 0 .4em;font-style:italic}
.sol-quote cite{display:block;font-style:normal;font-size:16px;color:var(--t);font-weight:700}
.sol-go{margin:0}
.sol-photo{display:none}
@media(min-width:760px){
  .sol{grid-template-columns:minmax(0,1fr) 190px;gap:34px;padding:32px 30px 32px 170px}
  .sol-main h3,.sol-main .sol-line{padding-right:0}
  .sol-art{right:auto;left:-34px;top:50%;margin-top:-80px}
  .sol-art.bolt,.sol-art.dove,.sol-art.bible,.sol-art.fountain{top:50%}
  .sol-art.bolt{width:148px;margin-top:-131px;left:-44px}.sol-art.dove{width:150px;margin-top:-72px}
  .sol-art.bible{width:138px;margin-top:-68px}.sol-art.fountain{width:130px;margin-top:-72px}
  .sol-photo{display:block;aspect-ratio:3/4;border-radius:20px;overflow:hidden}
  .sol-photo img{width:100%;height:100%;object-fit:cover}
}

/* ---------- missionair ---------- */
.lead-card{max-width:36em;margin:0 0 20px}
.lead-card .lead{margin:0}
.motto{font:400 clamp(30px,4vw,48px)/1.05 var(--script);color:var(--t);margin:0;text-shadow:.04em .04em 0 var(--tint,#cfdcff);transform:rotate(-2deg);transform-origin:left}
.pillar p{margin:0;font-size:19px;padding-right:56px}
.gives ul,.needs ul{margin:0;padding-left:1.2em}
@media(min-width:860px){.gives ul{columns:2;column-gap:44px}}
.gives li,.needs li{margin-bottom:.7em;break-inside:avoid;font-size:18px}
.role{display:flex;align-items:center;min-height:120px;font:800 clamp(22px,2.2vw,28px)/1.1 var(--title);color:var(--t)}
.who{display:grid;gap:30px;align-items:center}
@media(min-width:820px){.who{grid-template-columns:.6fr 1.4fr}}
.small-link{margin-top:22px}
.call .small-link a{color:#fff;font-weight:700;font-size:19px}

/* ---------- field page ---------- */
.figures-wrap{position:relative;margin-top:50px}
.figures-card{padding:44px clamp(20px,5vw,60px) 30px clamp(130px,17vw,230px)}
.figures-wrap .cx-art{width:clamp(110px,16vw,190px);left:-18px;top:-44px;transform:none}
.figures{list-style:none;margin:0 0 20px;padding:0;columns:2;column-gap:30px;font-size:clamp(18px,2.2vw,24px);font-weight:700}
.figures strong{font:800 clamp(28px,3.4vw,40px)/1 var(--title);color:var(--t);margin-right:.15em}
.figures li{break-inside:avoid;margin-bottom:6px}
.figures .hot{column-span:all;background:var(--pink);color:#14102a;border-radius:16px;padding:6px 14px;font-size:24px}
.figures .hot strong{color:#14102a}
.seeds{font:800 clamp(24px,3vw,30px)/1.2 var(--title);color:var(--t);margin:0}
@media(max-width:700px){
  .figures-wrap .cx-art{width:90px;left:-8px;top:-52px}
  .figures-card{padding:68px 18px 24px}
  .figures{columns:1}
}
.map{width:100%;border-radius:20px}
.verse p{font-size:19px;line-height:1.55}
.verse .ref{font:800 clamp(26px,3.2vw,36px)/1 var(--title);color:var(--t);margin:0 0 .3em}
.actions-card{display:grid;gap:10px 40px;grid-template-columns:minmax(0,1fr)}
@media(min-width:760px){.actions-card{grid-template-columns:1fr 1.4fr}}
.actions-card ul{margin:0;padding-left:1.1em;font-size:clamp(18px,2vw,22px);font-weight:700}
.steps{font:800 clamp(18px,2.4vw,26px)/1.3 var(--title);margin:26px 0 0;text-align:center;color:var(--t)}
.flags-wrap{position:relative;margin-top:26px}

/* ---------- Épafras ---------- */
.pr-art{padding-right:clamp(90px,12vw,130px)}
.chars{margin:0;padding-left:1.2em}
.chars li{margin-bottom:.7em;font-size:18px}
.req p{font-size:18px}

/* ---------- contact ---------- */
.who-line{font:700 clamp(20px,2.4vw,26px)/1.3 var(--title);color:var(--blue);margin:0 0 1.2em}
.portrait-col{position:relative;max-width:420px;margin:0 auto}
.portrait-col .splash{position:absolute;left:50%;top:52%;width:170%;max-width:none;transform:translate(-50%,-50%) rotate(8deg);z-index:0}
.portrait-col .portrait{position:relative;z-index:1;width:100%}
.portrait-col .bolt2{position:absolute;right:-6%;top:6%;width:26%;transform:rotate(6deg);z-index:2}

/* ---------- forms ---------- */
.form{background:#fff;border:5px solid var(--c);border-radius:30px;padding:28px;max-width:640px;position:relative;z-index:1}
.form-title{font-size:30px;margin:0 0 .6em;color:var(--t)}
.form label{display:block;font-weight:700;font-size:16px;margin:0 0 6px;color:var(--blue)}
.form input[type=text],.form input[type=email],.form textarea{width:100%;font:400 17px var(--body);padding:14px 16px;border:2px solid var(--blue);border-radius:16px;margin-bottom:18px;color:#14214f;background:#fff}
.form fieldset{border:2px solid var(--blue);border-radius:18px;margin:0 0 18px;padding:10px 16px 6px}
.form legend{font-weight:700;color:var(--blue);padding:0 6px}
.form .radio,.form .consent{display:flex;gap:10px;align-items:flex-start;font-weight:400;margin-bottom:10px;line-height:1.4}
.form input[type=radio],.form input[type=checkbox]{margin-top:4px;width:20px;height:20px;flex:none;accent-color:var(--blue)}
.form .consent{font-size:15px;margin:4px 0 18px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-note{margin:14px 0 0;font-size:15px;line-height:1.5;color:#44506b;font-weight:400}

/* ---------- legal ---------- */
.legal h2{font:800 22px/1.3 var(--title);margin:1.8em 0 .4em;color:var(--blue)}
.legal li{margin-bottom:.3em}
.plain-list{margin:0;padding-left:1.1em}

/* ---------- small screens: no illustration or splash ever sits under text ---------- */
@media(max-width:1099px){
  .ph-art,.pres-art,.portrait-col,.strip-art{overflow:hidden;border-radius:32px}
  .pres-art .dove{right:6px;top:6px}
  .portrait-col .bolt2{right:2%}
}
@media(max-width:859px){
  .deco{display:none}
  .pres-art{padding:18px 0 4px}
  .cx h3{padding-right:0}
  .door h3{padding-right:70px}
  #devenir-epafras-form{padding-top:40px}
}

/* ---------- motion: only when the visitor has not asked for less ---------- */
@media (prefers-reduced-motion: no-preference){
  .nav-toggle span{transition:transform .2s,opacity .2s}
  .btn,.lever,.door{transition:transform .15s,background-color .15s}
  .btn:hover,.lever:hover,.door:hover{transform:translateY(-3px)}
  .hh .dove,.lever .art,.pres-art .dove,.cx-art,.sol-art{animation:float 7s ease-in-out infinite}
  .lever .dove-m{animation-delay:-2s}.lever .fountain{animation-delay:-4s}.cx-art.tl{animation-delay:-3s}
  @keyframes float{0%,100%{translate:0 0}50%{translate:0 -8px}}
  .fade{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
  .fade.in{opacity:1;transform:none}
}
