/* Work With Us page (scoped to .wwu) */
body .wwu{ --n:#0a2c63; --n2:#104289; --g:#2f8f22; --gold:#f5b800; --b:#1a6fd6; --r:#e0505f; --v:#8a5cf0; --t:#12a39a;
  font-family:"DM Sans",system-ui,sans-serif; color:#33445f; }
body .wwu *{ box-sizing:border-box; }
body .wwu .wwu-sec{ padding:68px 0; }
body .wwu .container{ padding-left:16px; padding-right:16px; }
body .wwu .wwu-intro{ background:linear-gradient(180deg,#f4f9ff,#e9f3ff); padding-bottom:56px; }
body .wwu .wwu-why{ background:linear-gradient(180deg,#f6fbf3,#ebf7e5); }
body .wwu .wwu-apply{ background:linear-gradient(180deg,#fffaeb,#fff1cf); scroll-margin-top:90px; }
body .wwu .wwu-head{ text-align:center; max-width:760px; margin:0 auto 38px; }
body .wwu .wwu-intro .wwu-head{ margin-bottom:0; }
body .wwu .wwu-kick{ display:inline-flex; align-items:center; gap:10px; font-size:13px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--g); margin:0 0 14px; }
body .wwu .wwu-kick::before{ content:""; width:28px; height:3px; border-radius:2px; background:var(--g); }
body .wwu .wwu-tag{ display:inline-flex; align-items:center; gap:8px; padding:7px 16px; border-radius:999px; background:linear-gradient(100deg,#e0505f,#f0803c); color:#fff; font-size:12.5px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; margin-bottom:14px; box-shadow:0 10px 20px rgba(224,80,95,.3); }
body .wwu .wwu-h{ font:800 clamp(28px,3.6vw,40px)/1.18 "DM Sans",sans-serif; color:var(--n); margin:0 0 14px; text-transform:none; letter-spacing:-.01em; }
body .wwu .wwu-h span{ color:var(--g); }
body .wwu .wwu-sub{ font-size:17px; line-height:1.7; color:#51627d; margin:0; text-align:center; }
body .wwu .wwu-go{ display:inline-flex; align-items:center; gap:10px; margin-top:24px; padding:14px 30px; border-radius:999px; background:linear-gradient(100deg,#2f8f22,#12a39a); color:#fff; font:700 16px "DM Sans",sans-serif; text-decoration:none; box-shadow:0 14px 26px rgba(47,143,34,.3); transition:transform .2s; }
body .wwu .wwu-go:hover{ transform:translateY(-3px); color:#fff; }

/* why cards */
body .wwu .wwu-card{ --c:var(--g); position:relative; height:100%; padding:30px 24px 28px; border-radius:22px; background:#fff; border:1px solid #e3ecf6; box-shadow:0 10px 26px rgba(10,44,99,.07); overflow:hidden; transition:transform .25s,box-shadow .25s; }
body .wwu .wwu-card::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:5px; background:var(--c); }
body .wwu .wwu-card:hover{ transform:translateY(-6px); box-shadow:0 18px 36px rgba(10,44,99,.12); }
body .wwu .wwu-card.c1{ --c:#e0505f; } body .wwu .wwu-card.c2{ --c:#1a6fd6; } body .wwu .wwu-card.c3{ --c:#2f8f22; } body .wwu .wwu-card.c4{ --c:#d98a00; }
body .wwu .wwu-ic{ width:58px; height:58px; border-radius:18px; display:inline-flex; align-items:center; justify-content:center; font-size:25px; color:#fff; background:var(--c); box-shadow:0 10px 20px color-mix(in srgb,var(--c) 35%,transparent); margin-bottom:18px; }
body .wwu .wwu-card h3{ font:700 19px/1.3 "DM Sans",sans-serif; color:var(--n); margin:0 0 8px; text-transform:none; }
body .wwu .wwu-card p{ margin:0; font-size:15.5px; line-height:1.65; color:#51627d; text-align:left; }

/* form */
body .wwu .wwu-wrap{ max-width:860px; margin:0 auto; }
body .wwu .wwu-form{ position:relative; padding:34px 36px 28px; border-radius:28px; background:#fff; border:1px solid #f0e3b8; box-shadow:0 22px 48px rgba(10,44,99,.12); overflow:hidden; }
body .wwu .wwu-form::before{ content:""; position:absolute; left:0; right:0; top:0; height:6px; background:linear-gradient(90deg,var(--g) 0 25%,var(--gold) 25% 50%,var(--b) 50% 75%,var(--r) 75%); }
body .wwu .wwu-step{ --c:var(--g); padding:6px 0 4px; margin-bottom:6px; }
body .wwu .wwu-step.s1{ --c:#2f8f22; } body .wwu .wwu-step.s2{ --c:#1a6fd6; } body .wwu .wwu-step.s3{ --c:#d98a00; } body .wwu .wwu-step.s4{ --c:#8a5cf0; } body .wwu .wwu-step.s5{ --c:#e0505f; }
body .wwu .wwu-step h3{ display:flex; align-items:center; gap:12px; font:700 19px/1.2 "DM Sans",sans-serif; color:var(--n); margin:14px 0 14px; text-transform:none; }
body .wwu .wwu-step h3 .n{ width:34px; height:34px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:16px; font-weight:800; color:#fff; background:var(--c); box-shadow:0 8px 16px color-mix(in srgb,var(--c) 35%,transparent); flex:0 0 auto; }
body .wwu .wwu-grid{ display:grid; grid-template-columns:1fr 1fr; column-gap:16px; row-gap:0; }
body .wwu .wwu-f{ position:relative; display:block; padding-bottom:27px; margin:0; }
body .wwu .wwu-f.full{ grid-column:1 / -1; }
body .wwu .wwu-step > .wwu-f.full{ display:block; }
body .wwu .wwu-f .lb{ display:block; margin:0 0 6px; font-size:12.5px; font-weight:700; letter-spacing:.04em; color:#33445f; }
body .wwu .wwu-f .lb b{ color:var(--r); }
body .wwu .in{ position:relative; display:block; }
body .wwu .in > i{ position:absolute; left:12px; top:50%; transform:translateY(-50%); width:30px; height:30px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:14px; color:var(--c); background:color-mix(in srgb,var(--c) 14%,#fff); pointer-events:none; transition:background .2s,color .2s; }
body .wwu .in.ta > i{ top:12px; transform:none; }
body .wwu .in input,body .wwu .in select,body .wwu .in textarea{ width:100%; height:50px; padding:0 14px 0 52px; border:1.5px solid #dbe6f6; border-radius:14px; background:#fff; font:500 15px "DM Sans",sans-serif; color:var(--n); outline:none; transition:border-color .2s,box-shadow .2s; appearance:none; -webkit-appearance:none; }
body .wwu .in textarea{ height:auto; min-height:110px; padding:13px 14px 13px 52px; resize:vertical; line-height:1.55; }
body .wwu .in select{ padding-right:40px; cursor:pointer; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%230a2c63' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 16px center; }
body .wwu .in input::placeholder,body .wwu .in textarea::placeholder{ color:#9aa9c0; font-weight:400; }
body .wwu .in input:hover,body .wwu .in select:hover,body .wwu .in textarea:hover{ border-color:#b9cdea; }
body .wwu .in input:focus,body .wwu .in select:focus,body .wwu .in textarea:focus{ border-color:var(--c); box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 18%,transparent); }
body .wwu .in:focus-within > i{ background:var(--c); color:#fff; }
body .wwu .wwu-f .err{ position:absolute; left:2px; right:0; bottom:7px; margin:0; font-size:12.5px; line-height:16px; font-weight:600; color:#d6405a; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; opacity:0; transform:translateY(-3px); transition:opacity .18s,transform .18s; pointer-events:none; }
body .wwu .wwu-f.bad .err{ opacity:1; transform:none; }
body .wwu .wwu-f.bad .in input,body .wwu .wwu-f.bad .in select,body .wwu .wwu-f.bad .in textarea,
body .wwu .wwu-f.bad .in input:focus,body .wwu .wwu-f.bad .in select:focus,body .wwu .wwu-f.bad .in textarea:focus{ border-color:var(--r); box-shadow:0 0 0 4px rgba(224,80,95,.14); }
body .wwu .wwu-f.bad .in > i{ background:#fde7ea; color:var(--r); }
body .wwu .wwu-hp{ position:absolute !important; left:-9999px !important; width:1px; height:1px; opacity:0; }

/* upload */
body .wwu .wwu-drop{ position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; gap:4px; padding:26px 18px; border:2px dashed #f0cf7d; border-radius:18px; background:linear-gradient(180deg,#fffdf4,#fff8de); cursor:pointer; transition:border-color .2s,background .2s,transform .2s; }
body .wwu .wwu-drop:hover,body .wwu .wwu-drop:focus-visible,body .wwu .wwu-drop.drag{ border-color:#d98a00; background:#fff6d6; outline:none; }
body .wwu .wwu-drop.drag{ transform:scale(1.01); }
body .wwu .wwu-drop input{ position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; }
body .wwu .wwu-up{ width:54px; height:54px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:24px; color:#fff; background:linear-gradient(135deg,#d98a00,#f5b800); box-shadow:0 10px 20px rgba(217,138,0,.3); margin-bottom:6px; }
body .wwu .wwu-drop strong{ font-size:16px; color:var(--n); }
body .wwu .wwu-drop small{ font-size:13.5px; color:#74839c; }
body .wwu .wwu-file{ display:flex; align-items:center; gap:14px; padding:14px 16px; border-radius:16px; background:#f4faf2; border:1.5px solid #cfe8c8; }
body .wwu .wwu-file[hidden]{ display:none; }
body .wwu .wwu-file .ficon{ width:44px; height:44px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; font-size:22px; color:#fff; background:#e0505f; flex:0 0 auto; }
body .wwu .wwu-file .fname{ flex:1; min-width:0; display:flex; flex-direction:column; }
body .wwu .wwu-file .fname b{ font-size:15px; color:var(--n); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
body .wwu .wwu-file .fname em{ font-style:normal; font-size:12.5px; color:#74839c; }
body .wwu .wwu-file .fx{ width:34px; height:34px; border:0; border-radius:50%; background:#fff; color:#d6405a; cursor:pointer; box-shadow:0 4px 10px rgba(0,0,0,.1); }
body .wwu .wwu-f.bad .wwu-drop{ border-color:var(--r); background:#fff4f5; }

/* captcha */
body .wwu .cap-row{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
body .wwu .cap-row img{ display:block; border-radius:12px; border:1.5px solid #dbe6f6; background:#fff; width:150px; height:48px; }
body .wwu .cap-new{ width:44px; height:44px; border:0; border-radius:50%; background:#fdeaec; color:var(--r); font-size:17px; cursor:pointer; transition:transform .4s; }
body .wwu .cap-new:hover{ transform:rotate(180deg); }
body .wwu .cap-row .in{ flex:1 1 200px; }

/* actions */
body .wwu .wwu-actions{ display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-top:10px; }
body .wwu .wwu-actions .note{ margin:0; font-size:13.5px; color:#74839c; text-align:left; }
body .wwu .wwu-actions .note i{ color:var(--b); margin-right:6px; }
body .wwu .wwu-actions .btns{ display:flex; gap:12px; }
body .wwu .wwu-btn{ position:relative; overflow:hidden; display:inline-flex; align-items:center; justify-content:center; gap:10px; height:52px; padding:0 28px; border:0; border-radius:16px; font:800 16px "DM Sans",sans-serif; cursor:pointer; transition:transform .25s,box-shadow .25s,filter .25s; }
body .wwu .wwu-btn-s{ color:#fff; background:linear-gradient(100deg,#2f8f22 0%,#12a39a 50%,#1a6fd6 100%); box-shadow:0 14px 28px rgba(26,111,214,.3); }
body .wwu .wwu-btn-s:hover{ transform:translateY(-3px); box-shadow:0 20px 36px rgba(26,111,214,.38); }
body .wwu .wwu-btn-r{ color:#fff; background:linear-gradient(100deg,#e0505f 0%,#f0803c 55%,#f5b800 100%); box-shadow:0 14px 28px rgba(224,80,95,.3); }
body .wwu .wwu-btn-r:hover{ transform:translateY(-3px); box-shadow:0 20px 36px rgba(224,80,95,.4); }
body .wwu .wwu-btn-r .fa{ transition:transform .4s; } body .wwu .wwu-btn-r:hover .fa{ transform:rotate(-360deg); }
body .wwu .wwu-btn[disabled]{ cursor:progress; filter:grayscale(.3) brightness(.95); transform:none; }
body .wwu .wwu-btn .spin{ display:none; width:20px; height:20px; border-radius:50%; border:3px solid rgba(255,255,255,.4); border-top-color:#fff; animation:wwuSpin .8s linear infinite; }
body .wwu .wwu-btn.busy .spin{ display:inline-block; } body .wwu .wwu-btn.busy .arr{ display:none; }
@keyframes wwuSpin{ to{ transform:rotate(360deg) } }
body .wwu .wwu-bar{ height:8px; border-radius:6px; background:#e8eef8; overflow:hidden; margin-top:14px; }
body .wwu .wwu-bar[hidden]{ display:none; }
body .wwu .wwu-bar span{ display:block; height:100%; width:0; background:linear-gradient(90deg,#2f8f22,#f5b800,#1a6fd6); transition:width .2s; }
body .wwu .wwu-foot{ position:relative; min-height:46px; margin-top:12px; }
body .wwu .wwu-msg{ position:absolute; left:0; right:0; top:0; min-height:42px; display:flex; align-items:center; justify-content:center; text-align:center; padding:8px 14px; border-radius:12px; background:#fff0f2; border:1px solid #f7c8cf; color:#b4232f; font-size:14px; font-weight:600; opacity:0; visibility:hidden; transition:opacity .15s; }
body .wwu .wwu-msg.show{ opacity:1; visibility:visible; }

/* success */

body .wwu .wwu-contact{ display:flex; flex-wrap:wrap; justify-content:center; gap:12px; margin-top:28px; }
body .wwu .wwu-contact a{ display:inline-flex; align-items:center; gap:10px; padding:10px 18px; border-radius:999px; background:#fff; border:1.5px solid #f0e3b8; color:var(--n); font-weight:600; font-size:14.5px; text-decoration:none; box-shadow:0 6px 14px rgba(10,44,99,.06); transition:transform .2s; }
body .wwu .wwu-contact a:hover{ transform:translateY(-3px); }
body .wwu .wwu-contact a .fa{ color:var(--g); }

@media (max-width:767px){
  body .wwu .wwu-sec{ padding:46px 0; }
  body .wwu .wwu-form{ padding:26px 18px 22px; border-radius:22px; }
  body .wwu .wwu-grid{ grid-template-columns:1fr; }
  body .wwu .wwu-actions{ flex-direction:column; align-items:stretch; }
  body .wwu .wwu-actions .btns{ flex-direction:column; }
  body .wwu .wwu-btn{ width:100%; }
  body .wwu .wwu-actions .note{ text-align:center; }
}

/* success popup */
.wwu-pop{ position:fixed; inset:0; z-index:100000; display:flex; align-items:center; justify-content:center; padding:20px; background:rgba(8,28,66,.6); backdrop-filter:blur(3px); }
.wwu-pop[hidden]{ display:none; }
.wwu-pop-box{ position:relative; width:100%; max-width:460px; max-height:calc(100vh - 40px); overflow-y:auto; padding:38px 30px 30px; border-radius:28px; background:#fff; text-align:center; box-shadow:0 30px 80px rgba(10,44,99,.4); animation:wwuPopIn .4s ease both; }
.wwu-pop-box::before{ content:""; position:absolute; left:0; right:0; top:0; height:6px; border-radius:28px 28px 0 0; background:linear-gradient(90deg,#2a8420 0 25%,#f5b800 25% 50%,#1a6fd6 50% 75%,#e35d6a 75%); }
.wwu-tick{ position:relative; width:88px; height:88px; margin:6px auto 22px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:40px; color:#fff; background:linear-gradient(135deg,#2a8420,#5cc23f); box-shadow:0 18px 34px rgba(47,143,34,.4); }
.wwu-tick::before,.wwu-tick::after{ content:""; position:absolute; inset:-10px; border-radius:50%; border:2px dashed rgba(47,143,34,.35); animation:wwuSpin 14s linear infinite; }
.wwu-tick::after{ inset:-20px; border-color:rgba(245,184,0,.45); animation-direction:reverse; }
.wwu-pop-box h3{ margin:0; font:800 28px/1.2 "DM Sans",sans-serif; text-transform:none; background:linear-gradient(100deg,#2a8420,#12a39a,#1a6fd6); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.wwu-pop-box p{ margin:10px auto 0; max-width:360px; font-size:16px; line-height:1.6; color:#3b4a63; text-align:center; }
.wwu-ref{ display:inline-block; margin:18px 0 6px; padding:10px 22px; border-radius:14px; background:#fff8e0; border:1.5px dashed #e8c14f; font-size:13px; font-weight:700; color:#8a6500; letter-spacing:.08em; text-transform:uppercase; }
.wwu-ref b{ display:block; margin-top:2px; font-size:24px; letter-spacing:.1em; color:#0a2c63; }
.wwu-pop-btns{ display:flex; gap:12px; justify-content:center; margin-top:18px; flex-wrap:wrap; }
.wwu-pop-btns a,.wwu-pop-btns button{ display:inline-flex; align-items:center; gap:8px; padding:12px 24px; border-radius:14px; border:0; font:700 15px "DM Sans",sans-serif; cursor:pointer; text-decoration:none; }
.wwu-pop-wa{ background:#17753f; color:#fff; } .wwu-pop-wa:hover{ background:#0f5f31; color:#fff; }
.wwu-pop-ok{ background:#eaf1fc; color:#0a2c63; } .wwu-pop-ok:hover,.wwu-pop-ok:focus-visible{ background:#d9e6fa; }
body.wwu-pop-open{ overflow:hidden; }
@keyframes wwuPopIn{ from{ opacity:0; transform:translateY(16px) scale(.96); } to{ opacity:1; transform:none; } }
@media (max-width:520px){ .wwu-pop-box{ padding:34px 20px 24px; border-radius:24px; } .wwu-tick{ width:76px; height:76px; font-size:34px; } .wwu-pop-box h3{ font-size:24px; } }
@media (prefers-reduced-motion:reduce){ .wwu-pop-box,.wwu-tick::before,.wwu-tick::after{ animation:none !important; } }
