/* LANDING */
:root{
  --bg:#061018;
  --text:#f5f7f8;
  --muted:#a0aab2;
  --line:rgba(154,176,191,.18);
  --green:#8df229;
  --green-2:#57d92b;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body{min-height:100vh;overflow-x:hidden}
button,input,select{font:inherit}
button{border:0;color:inherit;cursor:pointer}
img{display:block;max-width:100%;height:auto}

.welcome-screen{position:relative;min-height:100vh;background:var(--bg);color:var(--text);overflow:hidden}
.landing{min-height:100vh;background:linear-gradient(180deg,#07121b 0%,#061018 100%)}

/* Header */
.landing-head{height:92px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(24px,5vw,76px);background:#050505;border-bottom:1px solid rgba(255,255,255,.08);position:relative;z-index:10}
.landing-logo{display:block!important;width:230px!important;max-width:230px!important;min-width:0!important;flex:0 0 230px!important}
.landing-logo img{display:block!important;width:230px!important;height:auto!important;max-width:230px!important;object-fit:contain}
.landing-head-actions{display:flex;align-items:center;gap:22px;min-width:0}
.landing-language{position:relative;height:42px;min-width:144px;color:#f1f4f5;white-space:nowrap;z-index:30}
.landing-language-button{width:100%;height:42px;padding:0 12px;display:flex;align-items:center;gap:9px;color:#f1f4f5;background:rgba(255,255,255,.035);border:1.5px solid var(--green);border-radius:9px;cursor:pointer;white-space:nowrap;transition:background .18s ease,box-shadow .18s ease}
.landing-language-button:hover{background:rgba(141,242,41,.06);box-shadow:0 0 0 1px rgba(141,242,41,.16)}
.landing-language-button:focus-visible{outline:none;box-shadow:0 0 0 2px rgba(141,242,41,.22)}
.language-flag{width:22px!important;height:16px!important;min-width:22px!important;max-width:22px!important;min-height:16px!important;max-height:16px!important;object-fit:cover;border-radius:2px;display:block!important;flex:0 0 22px!important}
.language-current{font-size:17px;font-weight:750;line-height:1.1;flex:1;text-align:left}
.language-chevron{width:8px;height:8px;border-right:2px solid rgba(255,255,255,.72);border-bottom:2px solid rgba(255,255,255,.72);transform:rotate(45deg) translateY(-2px);flex:0 0 8px;transition:transform .18s ease}
.landing-language-button[aria-expanded="true"] .language-chevron{transform:rotate(225deg) translate(-2px,-2px)}
.landing-language-menu{position:absolute;top:calc(100% + 8px);right:0;width:190px;padding:6px;background:#0a0d0f;border:1px solid rgba(141,242,41,.48);border-radius:10px;box-shadow:0 14px 30px rgba(0,0,0,.34);z-index:100;overflow:hidden}
.landing-language-menu[hidden]{display:none}
.landing-language-option{width:100%;min-height:40px;padding:8px 10px;display:flex;align-items:center;gap:10px;border:0;border-radius:7px;background:transparent;color:#f4f6f7;font-size:16px;font-weight:650;text-align:left;cursor:pointer}
.landing-language-option:hover,.landing-language-option:focus-visible{background:rgba(141,242,41,.1);outline:none}
.landing-language-option.is-active{background:rgba(141,242,41,.16);color:#fff}
.landing-language-option img{width:22px;height:16px;object-fit:cover;border-radius:2px;flex:0 0 22px}
.language-native-select{position:absolute!important;width:1px!important;height:1px!important;margin:0!important;padding:0!important;opacity:0!important;pointer-events:none!important;clip-path:inset(50%)!important;overflow:hidden!important}
.landing-login-top{padding:12px 25px;min-height:46px;border:1px solid var(--green);border-radius:28px;background:transparent;color:#e8f4df;font-size:18px;font-weight:800;white-space:nowrap;transition:.18s ease}
.landing-login-top:hover{background:rgba(141,242,41,.1);box-shadow:0 0 20px rgba(141,242,41,.1)}

/* Hero: the photo is a full-bleed background. The left copy remains translucent so the photo continues behind it. */
.landing-main{position:relative}
.landing-hero{position:relative;min-height:calc(100vh - 92px);display:block;overflow:hidden;background:#061018}
.landing-hero:before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,rgba(3,9,14,.82) 0%,rgba(3,9,14,.73) 27%,rgba(3,9,14,.54) 48%,rgba(3,9,14,.18) 72%,rgba(3,9,14,.03) 100%)}
.landing-hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:150px;z-index:3;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(3,10,15,.82))}
.landing-hero-copy{position:relative;z-index:4;align-self:center;width:min(58%,780px);min-height:calc(100vh - 92px);display:flex;flex-direction:column;justify-content:center;padding:68px clamp(28px,5vw,76px) 72px;max-width:780px;min-width:0}
.landing-eyebrow{font-size:16px;line-height:1.35;letter-spacing:3px;margin-bottom:18px;font-weight:600}
.landing-hero-copy h1{margin:0;font-size:clamp(42px,3.45vw,58px);line-height:1.05;letter-spacing:-1.8px;font-weight:800;max-width:640px}
.landing-hero-copy p{margin:24px 0 0;max-width:650px;color:#aeb7be;font-size:19px;line-height:1.5;font-weight:400}
.landing-features-main{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-top:29px;max-width:670px}
.landing-feature-main{display:flex;flex-direction:column;align-items:flex-start;gap:9px;min-width:0;color:#aeb7be;font-size:18px;line-height:1.28}
.landing-feature-main img{display:block!important;width:58px!important;height:58px!important;min-width:58px!important;max-width:58px!important;min-height:58px!important;max-height:58px!important;object-fit:cover!important;border-radius:50%;flex:0 0 58px;box-shadow:0 0 22px rgba(141,242,41,.06)}
.landing-feature-main:nth-child(1) img{box-shadow:0 0 24px rgba(32,201,243,.1)}
.landing-feature-main:nth-child(3) img{box-shadow:0 0 24px rgba(190,73,255,.1)}
.landing-feature-main:nth-child(4) img{box-shadow:0 0 24px rgba(255,159,25,.1)}
.landing-actions{display:flex;align-items:center;gap:14px;margin-top:31px;flex-wrap:wrap}
.landing-actions button{min-height:62px;padding:0 28px;border-radius:10px;font-size:18px;font-weight:800;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
.landing-primary{background:linear-gradient(90deg,#91f52d,#62e832);color:#07100a;box-shadow:0 8px 30px rgba(105,235,46,.12)}
.landing-primary span{font-size:21px;margin-left:8px;vertical-align:-1px}
.landing-primary:hover{transform:translateY(-1px);box-shadow:0 12px 34px rgba(105,235,46,.2)}
.landing-secondary{min-width:205px;background:rgba(7,16,24,.72);border:1px solid rgba(119,143,157,.55);color:#f0f3f5}
.landing-secondary:hover{background:rgba(20,34,44,.9)}
.landing-motto{margin-top:34px;width:max-content;transform:rotate(-5deg);font-family:"Segoe Print","Bradley Hand",cursive;font-size:31px;color:#9ba5bb;font-style:italic;position:relative}
.landing-motto i{display:block;height:5px;width:190px;margin:1px 0 0 33px;background:var(--green);border-radius:100%;transform:rotate(-4deg);box-shadow:0 0 14px rgba(141,242,41,.3)}

.landing-hero-visual{position:absolute;inset:0;z-index:1;min-width:0;min-height:0;overflow:hidden;display:block}
.landing-hero-visual:after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,rgba(4,12,18,.18) 0%,rgba(4,12,18,.06) 55%,rgba(4,12,18,.02) 100%)}
.landing-hero-visual picture{display:block!important;width:100%!important;height:100%!important}
.landing-hero-visual img{display:block!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;min-width:0!important;min-height:0!important;object-fit:cover!important;object-position:center bottom!important;filter:saturate(.98) contrast(1.02)}

/* Benefits */
.landing-benefits{position:relative;z-index:5;min-height:126px;display:grid;grid-template-columns:1fr 1.35fr 1.2fr .7fr;align-items:center;gap:24px;padding:20px clamp(24px,5vw,80px);background:#06121a;border-top:1px solid rgba(141,242,41,.05)}
.landing-benefit{display:flex;align-items:center;gap:15px;min-width:0}
.landing-benefit img{display:block!important;width:54px!important;height:54px!important;min-width:54px!important;max-width:54px!important;min-height:54px!important;max-height:54px!important;object-fit:cover!important;flex:0 0 54px}
.landing-benefit strong,.landing-benefit span{display:block}
.landing-benefit strong{font-size:16px;font-weight:500;color:#d8dee2;line-height:1.25}
.landing-benefit span{margin-top:5px;font-size:16px;line-height:1.3}
.landing-benefit-motto{justify-self:end;font-family:"Segoe Print","Bradley Hand",cursive;color:#9ba5bb;font-size:25px;line-height:1.05;font-style:italic;transform:rotate(-7deg);position:relative;padding-right:8px}
.landing-benefit-motto i{display:block;width:108px;height:4px;margin:6px 0 0 30px;background:var(--green);border-radius:100%;transform:rotate(-5deg);box-shadow:0 0 14px rgba(141,242,41,.28)}

/* Desktop/tablet */
@media (max-width:1199px){
  .landing-head{padding-left:32px;padding-right:32px}
  .landing-logo,.landing-logo img{width:205px!important;max-width:205px!important}
  .landing-logo{flex-basis:205px!important}
  .landing-hero{min-height:calc(100vh - 92px)}
  .landing-hero-copy{width:min(62%,720px);padding-left:32px;padding-right:20px}
  .landing-hero-copy h1{font-size:48px}
  .landing-hero-copy p{font-size:17px}
  .landing-feature-main{font-size:16px}
  .landing-feature-main img{width:52px!important;height:52px!important;min-width:52px!important;max-width:52px!important;min-height:52px!important;max-height:52px!important;flex-basis:52px}
  .landing-benefits{padding-left:32px;padding-right:32px;gap:18px}
  .landing-benefit strong{font-size:17px}
  .landing-benefit span{font-size:15.5px}
}

@media (max-width:1023px){
  .landing-head{height:82px;padding:0 24px}
  .landing-logo,.landing-logo img{width:195px!important;max-width:195px!important}
  .landing-logo{flex-basis:195px!important}
  .landing-head-actions{gap:18px}
  .landing-login-top{padding:11px 20px;font-size:17px}

  /* Tablet/mobile keep the hero photo behind the copy instead of moving it below the text. */
  .landing-hero{display:block;min-height:0;align-items:stretch}
  .landing-hero:before{background:linear-gradient(180deg,rgba(3,9,14,.88) 0%,rgba(3,9,14,.78) 42%,rgba(3,9,14,.66) 76%,rgba(3,9,14,.78) 100%)}
  .landing-hero-copy{width:100%;max-width:none;min-height:0;padding:52px 32px 42px;align-items:center;text-align:center}
  .landing-hero-visual{position:absolute;inset:0;z-index:1;width:100%;height:100%;min-height:0;max-height:none;overflow:hidden}
  .landing-hero-visual picture{display:block!important;width:100%!important;height:100%!important}
.landing-hero-visual img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center center!important}
  .landing-hero-copy{position:relative;z-index:4}
  .landing-eyebrow{margin-left:auto;margin-right:auto}
  .landing-hero-copy p{margin-left:auto;margin-right:auto}
  .landing-features-main{width:min(100%,620px);max-width:620px;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 44px;margin-left:auto;margin-right:auto}
  .landing-feature-main{align-items:center;text-align:center;font-size:17px}
  .landing-actions{justify-content:center}
  .landing-motto{margin-left:auto;margin-right:auto}

  .landing-benefits{grid-template-columns:repeat(2,minmax(0,1fr));padding:30px 32px;gap:28px 34px}
  .landing-benefit{justify-content:center;text-align:center;flex-direction:column;gap:10px}
  .landing-benefit-motto{justify-self:center;grid-column:1 / -1;text-align:center}
}

@media (max-width:700px){
  .landing-head{height:72px;padding:0 15px}
  .landing-logo,.landing-logo img{width:164px!important;max-width:164px!important}
  .landing-logo{flex-basis:164px!important}
  .landing-head-actions{gap:8px}
  .landing-language{min-width:132px;height:38px}.landing-language-button{height:38px;padding:0 10px;gap:7px}.landing-language-menu{width:184px}
  .language-flag{width:20px!important;height:14px!important;min-width:20px!important;max-width:20px!important;min-height:14px!important;max-height:14px!important;flex-basis:20px!important}
  .language-current{font-size:15.5px}
  .landing-login-top{font-size:0;padding:0;width:39px;height:39px;border-radius:50%;position:relative}
  .landing-login-top:before{content:"→";font-size:19px;line-height:1;color:#dff3d0;position:absolute;inset:0;display:grid;place-items:center}

  .landing-hero:before{background:linear-gradient(180deg,rgba(3,9,14,.90) 0%,rgba(3,9,14,.82) 42%,rgba(3,9,14,.72) 72%,rgba(3,9,14,.84) 100%)}
  .landing-hero-copy{padding:39px 18px 38px;align-items:center;text-align:center}
  .landing-eyebrow{font-size:12.5px;letter-spacing:1.8px;margin-bottom:14px}
  .landing-hero-copy h1{font-size:clamp(38px,10vw,52px);letter-spacing:-1.7px}
  .landing-hero-copy p{font-size:18px;line-height:1.48;margin-top:18px}
  .landing-features-main{width:100%;max-width:430px;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 20px;margin-top:27px}
  .landing-feature-main{font-size:16px;gap:7px;align-items:center;text-align:center}
  .landing-feature-main img{width:56px!important;height:56px!important;min-width:56px!important;max-width:56px!important;min-height:56px!important;max-height:56px!important;flex-basis:56px}
  .landing-actions{flex-direction:column;align-items:center;justify-content:center;width:100%;gap:10px;margin-top:28px}
  .landing-actions button{width:min(100%,430px);min-height:56px;font-size:18px}
  .landing-secondary{min-width:0}
  .landing-motto{font-size:28px;margin-top:29px;margin-left:auto;margin-right:auto;text-align:center}
  .landing-motto i{width:165px;margin-left:auto;margin-right:auto}

  .landing-hero-visual{position:absolute;inset:0;width:100%;height:100%;min-height:0;max-height:none}
  .landing-hero-visual picture{display:block!important;width:100%!important;height:100%!important}
.landing-hero-visual img{object-position:center center!important}

  .landing-benefits{grid-template-columns:1fr;padding:30px 18px;gap:25px}
  .landing-benefit{align-items:center;justify-content:center;text-align:center;flex-direction:column;gap:9px}
  .landing-benefit img{width:50px!important;height:50px!important;min-width:50px!important;max-width:50px!important;min-height:50px!important;max-height:50px!important;flex-basis:50px}
  .landing-benefit strong{font-size:18px}
  .landing-benefit span{font-size:15.5px}
  .landing-benefit-motto{font-size:24px;margin:3px auto 0;text-align:center}
  .landing-benefit-motto i{margin-left:auto;margin-right:auto}
}

@media (max-width:420px){
  .landing-logo,.landing-logo img{width:150px!important;max-width:150px!important}
  .landing-logo{flex-basis:150px!important}
  .landing-head{padding:0 12px}
  .landing-head-actions{gap:6px}
  .landing-language{min-width:124px}.landing-language-button{padding:0 8px;gap:6px}.landing-language-menu{width:178px}
  .language-flag{width:19px!important;height:13px!important;min-width:19px!important;max-width:19px!important;min-height:13px!important;max-height:13px!important;flex-basis:19px!important}
  .language-current{font-size:14.5px}
  .landing-hero-copy{padding-top:34px}
  .landing-hero-copy h1{font-size:37px}
  .landing-hero-copy p{font-size:17px}
  .landing-feature-main{font-size:15.5px}
  .landing-feature-main img{width:52px!important;height:52px!important;min-width:52px!important;max-width:52px!important;min-height:52px!important;max-height:52px!important;flex-basis:52px}
}



/* AUTH */
.auth-overlay{position:fixed;inset:0;z-index:100000;background:rgba(2,7,11,.82);backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;padding:20px;overflow:auto}
.auth-overlay.open{display:flex}
.auth-card{width:min(460px,100%);background:#0b151c;border:1px solid #2b3b45;border-radius:18px;box-shadow:0 24px 80px rgba(0,0,0,.45);padding:24px;position:relative;color:#f4f7f9}
.auth-close{position:absolute;right:14px;top:10px;width:36px;height:36px;border:0;background:transparent;color:#8fa0aa;font-size:27px;cursor:pointer}
.auth-card h2{margin:0 35px 7px 0;font-size:27px}
.auth-sub{margin:0 0 20px;font-size:16px;line-height:1.45}
.auth-form{display:grid;gap:10px}
.auth-form label{display:block;margin:13px 0 7px;color:#c8d1d6;font-size:16px}
.auth-form input,.auth-form select{width:100%;box-sizing:border-box;background:#071017;border:1px solid #31434e;color:#f4f7f9;border-radius:10px;padding:12px 13px;font-size:18px;outline:none}
.auth-form input:focus,.auth-form select:focus{border-color:#8df229}
.auth-form select option{background:#071017;color:#fff}
.remember-row{display:flex!important;align-items:center;gap:8px;cursor:pointer;margin-top:12px!important}
.remember-row input{width:auto!important;padding:0!important;accent-color:#8df229}
.auth-submit{width:100%;margin-top:18px;padding:13px 16px;border:0;border-radius:10px;background:linear-gradient(90deg,#8df229,#55d72d);color:#071018;font-weight:900;font-size:18px;cursor:pointer}
.auth-submit:disabled{opacity:.55;cursor:wait}
.auth-secondary{width:100%;margin-top:10px;padding:11px 16px;border-radius:10px;border:1px solid #344651;background:#101b23;color:#edf2f5;font-weight:800;cursor:pointer}
.auth-links{display:flex;justify-content:space-between;gap:10px;margin-top:15px;font-size:15.5px}
.auth-link{color:#9bdc58;cursor:pointer;text-decoration:none}
.auth-error{display:none;margin-top:14px;padding:11px 12px;border-radius:9px;background:#431a21;border:1px solid #6b2a35;color:#ffb8c0;font-size:16px;line-height:1.4}
.auth-success{display:none;margin-top:14px;padding:12px;border-radius:9px;background:#123b20;border:1px solid #1f7040;color:#b9f3c9;font-size:16px;line-height:1.45}
.auth-note{margin-top:12px;font-size:14.5px;line-height:1.45}
.auth-country-row{position:relative;width:100%}
.auth-country-button{width:100%;box-sizing:border-box;min-height:48px;padding:12px 13px;display:flex;align-items:center;gap:10px;background:#071017;border:1px solid #31434e;color:#f4f7f9;border-radius:10px;font:inherit;font-size:18px;text-align:left;cursor:pointer;outline:none}
.auth-country-button:hover{border-color:#536975}
.auth-country-button:focus-visible{border-color:#8df229;box-shadow:0 0 0 2px rgba(141,242,41,.12)}
.auth-country-flag{display:block;width:24px;height:18px;object-fit:cover;flex:0 0 24px;border-radius:2px}
#authCountryCurrent{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.auth-country-chevron{width:8px;height:8px;border-right:2px solid #9cabb3;border-bottom:2px solid #9cabb3;transform:rotate(45deg) translateY(-2px);flex:0 0 8px;transition:transform .16s ease}
.auth-country-button[aria-expanded="true"] .auth-country-chevron{transform:rotate(225deg) translate(-2px,-2px)}
.auth-country-menu{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:120;max-height:300px;overflow:auto;padding:6px;background:#071017;border:1px solid #31434e;border-radius:10px;box-shadow:0 16px 34px rgba(0,0,0,.42)}
.auth-country-menu[hidden]{display:none}
.auth-country-option{width:100%;min-height:42px;padding:9px 10px;display:flex;align-items:center;gap:10px;border:0;border-radius:7px;background:transparent;color:#f4f7f9;font:inherit;font-size:17px;text-align:left;cursor:pointer}
.auth-country-option:hover,.auth-country-option:focus-visible{background:#10202a;outline:none}
.auth-country-option.is-active{background:rgba(141,242,41,.12);color:#dfffbe}
.auth-country-option img{width:24px;height:18px;object-fit:cover;border-radius:2px;flex:0 0 24px}

@media (min-width:561px) and (max-width:1150px){
  .auth-overlay{align-items:flex-start!important;justify-content:center!important;padding:20px!important;overflow:auto!important}
  .auth-card{max-height:calc(100dvh - 40px)!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;box-sizing:border-box!important}
  .auth-close{position:sticky!important;top:0!important;margin-left:auto!important;display:block!important;z-index:2!important}
}
@media(max-width:560px){
  .auth-overlay{align-items:flex-start!important;justify-content:center!important;padding:12px!important;overflow:hidden!important}
  .auth-card{width:100%!important;max-height:calc(100dvh - 24px)!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;box-sizing:border-box!important;padding:20px!important;border-radius:15px!important}
  .auth-close{position:fixed!important;top:14px!important;right:14px!important;z-index:100003!important;width:40px!important;height:40px!important;border-radius:10px!important;background:#0b151c!important;border:1px solid #31434e!important;color:#d7e0e5!important}
  .auth-card h2{font-size:24px}
}

/* EMYDPRO auth security UI v18 */
.password-field{position:relative;display:block}
.password-field input{padding-right:48px!important}
.password-toggle{position:absolute;right:5px;top:50%;transform:translateY(-50%);width:38px;height:38px;border:0;border-radius:8px;background:transparent;font-size:18px;line-height:1;display:grid;place-items:center;cursor:pointer;z-index:2}
.password-toggle:hover,.password-toggle.is-visible{color:#9bea55;background:#12212a}
.auth-code-input{text-align:center!important;font-size:25px!important;font-weight:800!important;letter-spacing:8px!important;font-variant-numeric:tabular-nums;padding-left:18px!important}
.auth-resend:disabled{opacity:.58;cursor:not-allowed}
@media(max-width:520px){.auth-code-input{font-size:23px!important;letter-spacing:6px!important}}

/* V22 — readability pass: improve secondary-text contrast without changing layout or weight. */
.landing-eyebrow{color:#c0c8ce}
.landing-hero-copy p,.landing-feature-main{color:#c5cdd2}
.landing-motto,.landing-benefit-motto{color:#b8c2c9}
.landing-benefit span{color:#aeb9c0}
.auth-sub{color:#aab8c1}
.auth-note{color:#96a7b1}
.password-toggle{color:#acb8c0}

/* V67: public/auth mobile readability. Desktop unchanged. */
@media (max-width:700px){
  body{font-size:16px}
  input,select,textarea,button{font-size:16px}
  .muted,small{line-height:1.45}
}
@media (max-width:700px){
  .landing-eyebrow{font-size:14px!important;font-weight:700!important}
  .auth-note{font-size:15.5px!important}
  .auth-links{font-size:16px!important}
}