/* join.html — campaign landing page (tools/build-join.js, js/join.js). Mobile first. */
.jn-page{margin:0;background:#fffaf3;color:#1f3150;font-family:'Noto Sans','Noto Sans Devanagari',Arial,sans-serif}
.jn-page [hidden]{display:none!important}
/* main.css pads every <section> (100px) and colours every <footer>; this page sets its own */
.jn-hero,.jn-nums,.jn-wa-band{padding:0}

/* header */
.jn-top{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:1120px;margin:0 auto;padding:12px 16px}
.jn-logo{display:flex;align-items:center;gap:8px;text-decoration:none;color:#06305e;font:700 18px 'Noto Serif',Georgia,serif}
.jn-logo em{font-style:normal;color:#f07818}
.jn-top-in{padding:8px 16px;border:1.5px solid #e6d3bd;border-radius:999px;color:#06305e;font-weight:700;font-size:14px;text-decoration:none;background:#fff}

/* hero */
.jn-hero{position:relative;overflow:hidden;background:radial-gradient(1200px 500px at 85% -10%,#ffe1bf 0,transparent 60%),radial-gradient(900px 420px at -10% 110%,#ffe9d2 0,transparent 55%),#fff6ec}
.jn-hero-in{display:grid;gap:28px;max-width:1120px;margin:0 auto;padding:22px 16px 40px}
.jn-pill{display:inline-block;margin:0 0 12px;padding:6px 14px;border-radius:999px;background:#fff;border:1px solid #f3d5b2;color:#b5520a;font-size:13px;font-weight:700}
.jn-h1{margin:0 0 12px;color:#06305e;font:700 clamp(31px,7.6vw,52px)/1.18 'Noto Serif Devanagari','Noto Serif',serif}
.jn-h1 small{display:block;margin-top:8px;font:600 clamp(17px,3.6vw,22px)/1.35 'Noto Serif',Georgia,serif;color:#b5520a}
.jn-lead{margin:0 0 20px;font-size:16.5px;line-height:1.6;color:#41536b;max-width:560px}
.jn-alt{margin:16px 0 0;font-size:14.5px;color:#5b6b80}
.jn-alt a{color:#128c4b;font-weight:700;text-decoration:none}

/* sign-up buttons */
.jn-su{max-width:460px}
.jn-btns{display:grid;gap:10px}
.jn-btn{display:flex;align-items:center;justify-content:center;gap:12px;min-height:54px;padding:0 20px;border-radius:14px;font:700 16.5px 'Noto Sans',Arial,sans-serif;text-decoration:none;cursor:pointer;transition:transform .12s,box-shadow .12s,filter .12s}
.jn-btn svg{flex:none;width:24px;height:24px}
.jn-btn:hover{transform:translateY(-1px)}
.jn-btn:disabled{opacity:.6;cursor:progress;transform:none}
.jn-g{border:0;background:#06305e;color:#fff;box-shadow:0 12px 26px rgba(6,48,94,.28)}
.jn-g svg{background:#fff;border-radius:50%;padding:3px;width:28px;height:28px}
.jn-f{border:2px solid #1877F2;background:#fff;color:#0d4fb3}
.jn-w{width:100%;border:2px solid #25d366;background:#fff;color:#0f6b3a}
.jn-w svg{width:26px;height:26px}
.jn-wa{border:0;background:linear-gradient(135deg,#25d366,#128c4b);color:#fff!important;box-shadow:0 12px 26px rgba(18,140,75,.3)}
.jn-micro{margin:12px 0 0;font-size:13px;color:#5b6b80}
.jn-msg{margin:10px 0 0;padding:10px 12px;border-radius:10px;background:#fdecea;color:#a12d22;font-size:14px}

/* welcome card (after sign-in) */
.jn-done{max-width:460px;padding:20px;border-radius:18px;background:#fff;border:1px solid #f0dcc4;box-shadow:0 14px 34px rgba(138,90,43,.14)}
.jn-done-h{margin:0;font:700 24px 'Noto Serif Devanagari','Noto Serif',serif;color:#06305e}
.jn-done-p{margin:6px 0 14px;color:#41536b}
.jn-done-links{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:14px}
.jn-done-links a{color:#c2410c;font-weight:700;text-decoration:none}

/* phone preview */
.jn-phone{justify-self:center;width:min(330px,100%);padding:16px 14px 18px;border-radius:30px;background:#fff;border:8px solid #1f2b3d;box-shadow:0 30px 60px rgba(31,43,61,.25);transform:rotate(1.5deg)}
.jn-ph-top{display:flex;align-items:center;gap:8px;margin-bottom:12px;color:#06305e;font-size:14px}
.jn-ph-top span{margin-left:auto;padding:3px 10px;border-radius:999px;background:#fff1e3;color:#c2410c;font-weight:700}
.jn-ph-card{padding:14px;border-radius:16px;background:linear-gradient(160deg,#fff4e6,#ffe9d4);margin-bottom:10px}
.jn-ph-card small{color:#c2410c;font-weight:700}
.jn-ph-dev{margin:8px 0 6px;font:700 17px/1.5 'Noto Serif Devanagari',serif;color:#06305e}
.jn-ph-mean{margin:0;font-size:13px;line-height:1.5;color:#41536b}
.jn-ph-row{display:flex;align-items:center;gap:10px;padding:10px 12px;margin-top:8px;border-radius:14px;background:#f7f8fb;font-size:13.5px}
.jn-ph-row>span{font-size:20px}
.jn-ph-row div{flex:1;min-width:0}
.jn-ph-row b{display:block;color:#06305e}
.jn-ph-row small{color:#6b7a8f}
.jn-ph-row i{display:block;height:6px;margin-top:5px;border-radius:3px;background:#e8ecf3}
.jn-ph-row i em{display:block;height:100%;border-radius:3px;background:#f07818}

/* numbers */
.jn-nums{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:1px;max-width:1120px;margin:-18px auto 0;position:relative;border-radius:18px;overflow:hidden;background:#f0dcc4;box-shadow:0 10px 30px rgba(138,90,43,.12)}
.jn-nums>div{padding:16px 10px;background:#fff;text-align:center}
.jn-nums b{display:block;font:700 26px 'Noto Serif',Georgia,serif;color:#e8701a}
.jn-nums span{display:block;font-weight:700;color:#06305e;font-size:14px}
.jn-nums small{display:block;color:#6b7a8f;font-size:12px}

/* sections */
.jn-sec{max-width:1120px;margin:0 auto;padding:52px 16px 8px}
.jn-h2{margin:0 0 8px;text-align:center;color:#06305e;font:700 clamp(25px,5vw,34px)/1.25 'Noto Serif','Noto Serif Devanagari',serif}
.jn-sub{margin:0 auto 26px;max-width:620px;text-align:center;color:#5b6b80;font-size:16px}
.jn-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px}
.jn-card{padding:20px;border-radius:18px;background:#fff;border:1px solid #f0e3d2}
.jn-ic{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:#fff1e3;font-size:24px}
.jn-card h3{margin:12px 0 6px;color:#06305e;font-size:17.5px}
.jn-card p{margin:0;color:#4a5a70;font-size:15px;line-height:1.55}
.jn-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:14px;margin:0;padding:0;list-style:none;counter-reset:s}
.jn-steps li{position:relative;padding:20px 20px 20px 74px;border-radius:18px;background:#fff;border:1px solid #f0e3d2}
.jn-steps b{position:absolute;left:20px;top:20px;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#e8701a;color:#fff;font-size:18px}
.jn-steps h3{margin:0 0 4px;color:#06305e;font-size:17px}
.jn-steps p{margin:0;color:#4a5a70;font-size:14.5px}

/* WhatsApp band */
.jn-wa-band{margin:52px 0 0;background:#075e54;color:#fff}
.jn-wa-in{display:grid;grid-template-columns:auto 1fr;gap:14px 16px;align-items:center;max-width:1120px;margin:0 auto;padding:28px 16px}
.jn-wa-ic{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#25d366;color:#fff}
.jn-wa-ic svg{width:30px;height:30px}
.jn-wa-in h2{margin:0;font:700 21px 'Noto Serif',Georgia,serif;color:#fff}
.jn-wa-in p{margin:4px 0 0;color:#cfe9e3;font-size:14.5px}
.jn-wa-in .jn-btn{grid-column:1/-1}

/* FAQ */
.jn-faq{max-width:780px}
.jn-faq details{margin-bottom:10px;border-radius:14px;background:#fff;border:1px solid #f0e3d2}
.jn-faq summary{padding:16px 18px;cursor:pointer;font-weight:700;color:#06305e;list-style:none}
.jn-faq summary::-webkit-details-marker{display:none}
.jn-faq summary:after{content:'+';float:right;color:#e8701a;font-size:20px;line-height:1}
.jn-faq details[open] summary:after{content:'−'}
.jn-faq details p{margin:0;padding:0 18px 16px;color:#4a5a70;line-height:1.6}

/* final call */
.jn-final{max-width:1120px;margin:40px auto 0;padding:44px 16px 56px;text-align:center;background:linear-gradient(180deg,transparent,#ffeedd)}
.jn-final .jn-su,.jn-final .jn-done{margin:0 auto;text-align:left}
.jn-final .jn-micro{text-align:center}

/* sticky bar (phones) */
.jn-sticky{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;align-items:center;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #f0dcc4;box-shadow:0 -8px 24px rgba(31,43,61,.12)}
.jn-sticky>span{flex:1;font-weight:700;color:#06305e;font-size:14px}
.jn-sticky .jn-btn{min-height:44px;padding:0 14px;font-size:14.5px;gap:8px}
.jn-sticky .jn-btn svg{width:22px;height:22px}
.jn-sticky .jn-w{width:auto}
.jn-sticky.has-wa>span{display:none}
.jn-sticky.has-wa .jn-btn{flex:1;padding:0 8px;font-size:13.5px;gap:6px}

.jn-foot{margin:0;padding:22px 16px 90px;background:none;text-align:center;color:#6b7a8f;font-size:13px}
.jn-foot a{color:#5b6b80}

@media (min-width:600px){
  .jn-btns{grid-template-columns:1fr}
  .jn-wa-in{grid-template-columns:auto 1fr auto}
  .jn-wa-in .jn-btn{grid-column:auto}
}
@media (min-width:900px){
  .jn-hero-in{grid-template-columns:1.15fr .85fr;align-items:center;padding:36px 16px 70px}
  .jn-phone{justify-self:end}
  .jn-sticky{display:none!important}
  .jn-foot{padding-bottom:28px}
}
@media (prefers-reduced-motion:reduce){.jn-btn{transition:none}.jn-btn:hover{transform:none}}