:root{
  --join-ink:#111827;
  --join-navy:#101a2d;
  --join-navy-2:#172740;
  --join-orange:#ff650d;
  --join-orange-2:#ff8a00;
  --join-muted:#68758a;
  --join-line:#e5eaf1;
}
*{box-sizing:border-box}
.join-page{
  min-height:100vh;position:relative;overflow-x:hidden;margin:0;padding:0 28px 18px;
  color:var(--join-ink);font-family:"DM Sans",sans-serif;
  background:radial-gradient(circle at 8% 12%,#fff7ed 0,transparent 28%),linear-gradient(135deg,#f5f7fb 0%,#eef2f8 52%,#fff 100%);
}
.join-background-glow{position:fixed;z-index:0;pointer-events:none;border-radius:50%;filter:blur(2px);opacity:.48}
.join-background-glow-one{width:390px;height:390px;top:18%;left:-260px;background:#ffd7b2}
.join-background-glow-two{width:460px;height:460px;right:-290px;bottom:-150px;background:#dce7f8}
.join-header,.join-main,.join-footer{position:relative;z-index:1;width:min(1220px,100%);margin-inline:auto}
.join-header{min-height:104px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #dfe5ed}
.join-brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:inherit;min-width:0}
.join-brand-logo{width:88px;height:88px;object-fit:contain;border-radius:17px;background:#fff;box-shadow:0 7px 22px #1727400c}
.join-brand-divider{width:1px;height:48px;background:#d6dce5}
.join-brand-copy{display:grid;gap:2px}
.join-brand-copy strong{font:900 22px/1.05 Manrope,sans-serif;letter-spacing:-.9px;color:#121927}
.join-brand-copy em{font-style:normal;color:var(--join-orange)}
.join-brand-copy small{font-size:12px;font-weight:700;color:#6d7788;letter-spacing:.1px}
.join-header-right{display:flex;align-items:center;gap:23px}
.join-online-indicator{display:flex;align-items:center;gap:8px;padding:9px 13px;border-radius:30px;background:#fff;border:1px solid #e5eaf1;color:#536176;font-size:11px;font-weight:800;letter-spacing:.7px;text-transform:uppercase}
.join-online-indicator i{width:7px;height:7px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 4px #22c55e19}
.join-admin-link{display:inline-flex;align-items:center;gap:8px;color:#596579;text-decoration:none;font-size:13px;font-weight:800;transition:color .2s}
.join-admin-link:hover{color:var(--join-orange)}
.join-main{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(410px,.82fr);align-items:center;gap:clamp(34px,5vw,76px);padding:42px 0 36px}
.join-intro{min-width:0}
.join-intro-heading{max-width:630px;margin:0 0 22px}
.join-kicker{display:inline-flex;align-items:center;gap:9px;color:#596579;font-size:11px;font-weight:900;letter-spacing:1.5px;text-transform:uppercase}
.join-kicker span{width:24px;height:3px;background:var(--join-orange);border-radius:5px}
.join-intro-heading h1{margin:13px 0 10px;font:900 clamp(34px,4.3vw,54px)/1.08 Manrope,sans-serif;letter-spacing:-2.2px;color:#121a2a}
.join-intro-heading h1 span{color:var(--join-orange);white-space:nowrap}
.join-intro-heading p{max-width:560px;margin:0;color:#68758a;font-size:15px;line-height:1.75}
.join-photo-card{height:clamp(300px,34vw,405px);position:relative;overflow:hidden;border-radius:25px;background:#121d31;box-shadow:0 22px 55px #14233b26;border:5px solid #fff}
.join-community-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 48%;transform:scale(1.015)}
.join-photo-shade{position:absolute;inset:0;background:linear-gradient(180deg,#101a2d05 20%,#101a2d1c 47%,#101a2de8 100%)}
.join-photo-topline{position:absolute;top:19px;left:20px;display:flex;align-items:center;gap:8px;padding:9px 12px;border:1px solid #ffffff80;border-radius:30px;background:#101a2da6;backdrop-filter:blur(10px);color:#fff;font-size:9px;font-weight:900;letter-spacing:1.1px}
.join-photo-dot{width:7px;height:7px;border-radius:50%;background:#ff8a00;box-shadow:0 0 0 4px #ff8a002f}
.join-photo-caption{position:absolute;left:24px;bottom:22px;display:flex;align-items:center;gap:14px;color:#fff}
.join-photo-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:15px;background:linear-gradient(140deg,#ff8a00,#f4510b);box-shadow:0 8px 22px #f65b1244;font-size:23px}
.join-photo-caption strong{display:block;font:900 23px/1.13 Manrope,sans-serif;letter-spacing:-.7px}
.join-photo-caption small{display:block;margin-top:7px;color:#ffd8bf;font-size:11px;font-weight:800;letter-spacing:.8px;text-transform:uppercase}
.join-photo-stamp{position:absolute;right:18px;bottom:22px;padding:10px 13px;border:1px solid #ffffff66;border-radius:30px;background:#fff1;color:#fff;font-size:11px;font-weight:800;backdrop-filter:blur(8px)}
.join-photo-stamp i{margin-right:5px;color:#ff9a31}
.join-benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:17px}
.join-benefit{display:flex;align-items:center;gap:9px;min-width:0;padding:10px 8px;border:1px solid #e4e9f0;border-radius:14px;background:#ffffffbd;box-shadow:0 5px 18px #14233b06}
.join-benefit>span{flex:0 0 34px;width:34px;height:34px;display:grid;place-items:center;border-radius:11px;color:var(--join-orange);background:#fff0e5;font-size:16px}
.join-benefit strong,.join-benefit small{display:block;line-height:1.25;white-space:nowrap}
.join-benefit strong{font-size:11px;font-weight:900;color:#202b3d}
.join-benefit small{margin-top:2px;color:#778397;font-size:10px}
.join-panel{position:relative;isolation:isolate;overflow:hidden;border:1px solid #e8ebf0;border-radius:27px;background:#fff;box-shadow:0 24px 75px #15243b16}
.join-panel-accent{position:absolute;z-index:-1;top:-120px;right:-90px;width:270px;height:270px;border-radius:50%;background:radial-gradient(circle,#fff0e2 0%,#fff0e2a0 42%,transparent 70%)}
.join-panel-content{padding:clamp(27px,3.2vw,40px)}
.join-panel-icon{width:58px;height:58px;display:grid;place-items:center;border-radius:18px;color:#fff;background:linear-gradient(145deg,#ff9a16,#f2530b);box-shadow:0 10px 24px #f36a1f3a;font-size:26px;margin-bottom:20px}
.join-panel-eyebrow{color:#ee6a19;font-size:10px;font-weight:900;letter-spacing:1.7px}
.join-panel h2{margin:8px 0 6px;font:900 clamp(27px,3vw,35px)/1.12 Manrope,sans-serif;letter-spacing:-1.2px;color:#121b2b}
.join-panel h2 span{display:block;color:var(--join-orange)}
.join-panel-lead{margin:0 0 25px;color:#768194;font-size:14px}
.join-form{display:grid;gap:17px}
.join-field-group label{display:block;margin:0 0 8px;color:#253147;font-size:12px;font-weight:900}
.join-input-wrap{display:flex;align-items:center;gap:12px;min-height:59px;padding:0 16px;border:1.5px solid #e1e6ee;border-radius:14px;background:#fbfcfe;transition:border-color .2s,box-shadow .2s,background .2s}
.join-input-wrap:focus-within{border-color:#ff8a35;background:#fff;box-shadow:0 0 0 4px #ff8a0018}
.join-input-wrap>i{flex:0 0 19px;color:#758197;font-size:19px}
.join-input-wrap input{width:100%;min-width:0;height:55px;border:0;outline:0;background:transparent;color:#182337;font:600 15px "DM Sans",sans-serif}
.join-input-wrap input::placeholder{color:#9aa4b3;font-weight:500}
.join-field-hint{display:block;margin:7px 1px 0;color:#929cad;font-size:10px}
.join-message{padding:12px 13px;border-radius:12px;font-size:12px;line-height:1.5}
.join-error{color:#a32929;border:1px solid #f5caca;background:#fff3f3}
.join-submit{width:100%;min-height:60px;margin-top:3px;padding:0 18px;border:0;border-radius:15px;color:#fff;background:linear-gradient(100deg,#ff8a00 0%,#ff5a0a 55%,#f1480b 100%);box-shadow:0 12px 25px #f35e1739,inset 0 1px #ffffff6e;font:900 14px Manrope,sans-serif;cursor:pointer;transition:transform .2s,box-shadow .2s,filter .2s}
.join-submit:hover{transform:translateY(-2px);box-shadow:0 16px 30px #f35e1748,inset 0 1px #ffffff6e;filter:saturate(1.08)}
.join-submit:active{transform:translateY(0)}
.join-submit:disabled{opacity:.72;cursor:wait;transform:none}
.join-submit .btn-normal,.join-submit .btn-loading{display:flex;align-items:center;justify-content:center;gap:10px}
.join-submit .btn-normal>i:first-child{font-size:18px}
.join-submit-arrow{margin-left:auto;font-size:17px}
.join-spin{font-size:18px;animation:join-rotate 1s linear infinite}
@keyframes join-rotate{to{transform:rotate(360deg)}}
.join-security-note{display:flex;align-items:flex-start;gap:11px;margin-top:19px;padding:13px;border:1px solid #dceee3;border-radius:13px;background:#f4fbf6}
.join-security-note>span{flex:0 0 30px;width:30px;height:30px;display:grid;place-items:center;border-radius:9px;color:#159653;background:#e1f6e9;font-size:18px}
.join-security-note p{margin:0;color:#698074;font-size:10px;line-height:1.55}
.join-security-note strong{color:#286644;font-size:11px}
.join-divider{display:flex;align-items:center;gap:12px;margin:21px 0 12px;color:#a4adba}
.join-divider span{height:1px;flex:1;background:#edf0f4}
.join-divider small{font-size:9px;font-weight:900;letter-spacing:1.8px}
.join-motto{margin:0;text-align:center;color:#7d8796;font-size:11px}
.join-motto strong{color:#242f42}
.join-panel-bottom{display:flex;align-items:center;justify-content:center;gap:7px;min-height:43px;background:#101a2d;color:#d8e1ee;font-size:10px;font-weight:800;letter-spacing:.8px}
.join-panel-bottom i{color:#ff8a00}
.join-panel-bottom b{color:#ff8a00}
.join-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:0 0 8px;color:#8993a2;font-size:10px}
@media(max-width:1050px){
  .join-page{padding-inline:20px}
  .join-main{grid-template-columns:minmax(0,1fr) minmax(365px,.9fr);gap:28px}
  .join-benefits{grid-template-columns:repeat(2,1fr)}
  .join-benefit{padding:9px 10px}
  .join-photo-stamp{display:none}
}
@media(max-width:760px){
  .join-page{padding:0 15px 16px}
  .join-header{min-height:82px}
  .join-brand{gap:9px}
  .join-brand-logo{width:60px;height:60px;border-radius:12px}
  .join-brand-divider{height:39px}
  .join-brand-copy strong{font-size:18px}
  .join-brand-copy small{font-size:10px}
  .join-header-right{gap:0}
  .join-online-indicator{display:none}
  .join-admin-link{width:39px;height:39px;justify-content:center;border:1px solid #e1e6ee;border-radius:12px;background:#fff;font-size:17px}
  .join-admin-link span{display:none}
  .join-main{display:flex;flex-direction:column;gap:23px;padding:23px 0 22px;align-items:stretch}
  .join-panel{order:1;border-radius:23px}
  .join-intro{order:2}
  .join-panel-content{padding:25px 21px 22px}
  .join-panel-icon{width:50px;height:50px;border-radius:15px;margin-bottom:14px;font-size:22px}
  .join-panel h2{font-size:30px}
  .join-panel-lead{margin-bottom:20px}
  .join-input-wrap{min-height:57px}
  .join-input-wrap input{font-size:16px}
  .join-submit{min-height:58px}
  .join-intro-heading{margin-bottom:14px}
  .join-intro-heading h1{font-size:32px;letter-spacing:-1.3px}
  .join-intro-heading p{font-size:13px;line-height:1.6}
  .join-photo-card{height:260px;border-radius:19px;border-width:3px}
  .join-photo-topline{top:12px;left:12px;padding:7px 9px;font-size:8px}
  .join-photo-caption{left:15px;bottom:15px;gap:10px}
  .join-photo-icon{width:40px;height:40px;border-radius:12px;font-size:19px}
  .join-photo-caption strong{font-size:18px}
  .join-photo-caption small{font-size:9px}
  .join-benefits{gap:8px;margin-top:11px}
  .join-benefit{padding:8px 7px;border-radius:12px;gap:7px}
  .join-benefit>span{width:30px;height:30px;flex-basis:30px;border-radius:9px;font-size:14px}
  .join-benefit strong{font-size:10px}
  .join-benefit small{font-size:9px}
  .join-footer{font-size:9px}
}
@media(max-width:390px){
  .join-brand-logo{width:52px;height:52px}
  .join-brand-copy strong{font-size:16px}
  .join-brand-copy small{font-size:9px}
  .join-panel-content{padding-inline:17px}
  .join-panel h2{font-size:27px}
  .join-photo-card{height:230px}
  .join-footer span:last-child{max-width:145px;text-align:right}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}