/* SANAD Premium — presentation polish for login and institutional identity */
.login{
  width:min(1480px,100%)!important;
  min-height:100vh!important;
  margin:0 auto!important;
  padding:clamp(46px,6vw,94px)!important;
  grid-template-columns:minmax(420px,.78fr) minmax(560px,1.12fr)!important;
  gap:clamp(64px,7vw,118px)!important;
  align-items:center!important;
  isolation:isolate!important;
}
.login::after{
  content:"";
  position:absolute;
  z-index:-2;
  width:58vw;
  height:58vw;
  max-width:980px;
  max-height:980px;
  inset:50% -23vw auto auto;
  transform:translateY(-50%);
  border-radius:50%;
  background:radial-gradient(circle,rgba(55,112,244,.105) 0%,rgba(56,189,248,.045) 34%,rgba(255,255,255,0) 70%);
  pointer-events:none;
}
html[dir="ltr"] .login::after{inset:50% auto auto -23vw}

/* Login card: clearer hierarchy and better density */
.login-card{
  max-width:470px!important;
  padding:31px 30px 28px!important;
  border-radius:27px!important;
  border:1px solid rgba(255,255,255,.92)!important;
  background:rgba(255,255,255,.91)!important;
  box-shadow:0 30px 90px rgba(25,54,108,.14),0 1px 0 rgba(255,255,255,.88) inset!important;
}
.login-card::before{
  content:"";
  display:block;
  height:3px;
  width:44px;
  margin:0 0 23px auto;
  border-radius:999px;
  background:linear-gradient(90deg,#2563eb,#38bdf8);
}
html[dir="ltr"] .login-card::before{margin-left:0;margin-right:auto}
.login-brand{margin-bottom:24px!important}
.login-brand .brand-mark{width:46px!important;height:46px!important;border-radius:14px!important;box-shadow:0 10px 28px rgba(37,99,235,.24)!important}
.login-card h1{font-size:29px!important;line-height:1.18!important;font-weight:850!important;letter-spacing:-.55px!important;margin-bottom:8px!important}
.login-card p{font-size:11.5px!important;line-height:1.75!important;color:#71809c!important}
.login-card .field{margin-top:15px!important;gap:7px!important}
.login-card .field label{font-size:10px!important;font-weight:700!important;color:#52627f!important}
.login-card .field input{min-height:47px!important;padding:11px 13px!important;border-radius:12px!important;font-size:12px!important;background:#fbfdff!important;border-color:rgba(34,75,148,.13)!important}
.login-card .field input:focus{background:#fff!important;border-color:rgba(37,99,235,.44)!important;box-shadow:0 0 0 4px rgba(37,99,235,.075)!important}
.login-card .primary{min-height:47px!important;margin-top:17px!important;border-radius:12px!important;font-size:11.5px!important;letter-spacing:.1px!important;background:linear-gradient(135deg,#2468ed,#3b57df)!important;box-shadow:0 11px 28px rgba(37,99,235,.23)!important}
.login-card .ndr-language-toggle{position:absolute!important;top:18px!important;inset-inline-start:18px!important;width:auto!important;min-width:66px!important;min-height:34px!important;padding:0 11px!important;border-radius:10px!important;background:#fff!important;border:1px solid rgba(34,75,148,.12)!important;color:#203d72!important;font-size:9px!important;font-weight:750!important;box-shadow:0 5px 15px rgba(25,54,108,.045)!important}
.login-card{position:relative!important}

/* Hero: bespoke SANAD identity — no generic AI sparkle */
.sn-login-hero{
  position:relative!important;
  max-width:650px!important;
  min-height:500px!important;
  padding:42px 16px 42px 0!important;
  justify-self:center!important;
  align-items:flex-start!important;
  justify-content:center!important;
  text-align:start!important;
}
html[dir="ltr"] .sn-login-hero{padding:42px 0 42px 16px!important}
.sn-login-hero::before{
  content:"";
  position:absolute;
  inset:5% -8% 5% auto;
  width:1px;
  background:linear-gradient(transparent,rgba(37,99,235,.17) 20%,rgba(56,189,248,.22) 50%,rgba(37,99,235,.11) 80%,transparent);
}
html[dir="ltr"] .sn-login-hero::before{inset:5% auto 5% -8%}
.sn-login-hero::after{
  content:"";
  position:absolute;
  width:320px;
  height:320px;
  top:18%;
  inset-inline-end:-18%;
  z-index:-1;
  border:1px solid rgba(37,99,235,.055);
  border-radius:50%;
  box-shadow:0 0 0 48px rgba(37,99,235,.018),0 0 0 96px rgba(56,189,248,.012);
}
.sn-hero-mark{
  width:74px!important;
  height:74px!important;
  margin:0 0 30px!important;
  border-radius:22px!important;
  position:relative!important;
  overflow:visible!important;
  background:linear-gradient(145deg,#0d1d46,#173b86)!important;
  border:1px solid rgba(95,159,255,.34)!important;
  box-shadow:0 19px 48px rgba(26,61,135,.24),inset 0 0 0 1px rgba(255,255,255,.08)!important;
}
.sn-hero-mark svg{display:none!important}
.sn-hero-mark::before{
  content:"";
  position:absolute;
  inset:17px;
  background:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40' fill='none'%3E%3Cpath d='M7 27V17.5C7 14.46 9.46 12 12.5 12H27.5C30.54 12 33 14.46 33 17.5V27' stroke='white' stroke-width='3' stroke-linecap='round'/%3E%3Cpath d='M11 27H29' stroke='%237DD3FC' stroke-width='3' stroke-linecap='round'/%3E%3Cpath d='M15 12V8H25V12' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='11' cy='27' r='2.4' fill='white'/%3E%3Ccircle cx='29' cy='27' r='2.4' fill='white'/%3E%3Ccircle cx='20' cy='8' r='2.4' fill='%237DD3FC'/%3E%3C/svg%3E");
}
.sn-hero-mark::after{
  content:"";
  position:absolute;
  inset:-9px;
  border-radius:29px;
  border:1px solid rgba(37,99,235,.13);
  box-shadow:0 0 0 9px rgba(37,99,235,.025);
}

/* Replace generic marketing copy with tighter institutional language */
.sn-kicker{font-size:0!important;margin-bottom:15px!important;color:#2d66d5!important;letter-spacing:0!important}
.sn-kicker::before{
  content:"SANAD  /  INTERNAL PLATFORM";
  display:block;
  direction:ltr;
  font-size:9px;
  line-height:1;
  font-weight:850;
  letter-spacing:1.9px;
}
html[lang="ar"] .sn-kicker::before{content:"SANAD  /  المنصة الداخلية";letter-spacing:.2px}
.sn-login-hero h2{
  max-width:610px!important;
  margin:0!important;
  font-size:0!important;
  line-height:1.08!important;
  letter-spacing:0!important;
  color:#0b1739!important;
}
.sn-login-hero h2::before{
  content:"Knowledge and services.\A One clear place.";
  display:block;
  white-space:pre-line;
  font-size:clamp(44px,4vw,62px);
  line-height:1.06;
  font-weight:880;
  letter-spacing:-2.1px;
}
html[lang="ar"] .sn-login-hero h2::before{
  content:"المعرفة والخدمات،\A في مكان واحد.";
  font-size:clamp(44px,4vw,60px);
  line-height:1.12;
  letter-spacing:-1.5px;
}
.sn-login-hero p{
  max-width:565px!important;
  margin:19px 0 0!important;
  font-size:0!important;
  line-height:1.9!important;
  color:#6d7c98!important;
}
.sn-login-hero p::before{
  content:"Find the right procedure, open the required form, and get a reliable answer from the institute's approved sources.";
  display:block;
  font-size:13px;
  line-height:1.85;
  font-weight:500;
  color:#6d7c98;
}
html[lang="ar"] .sn-login-hero p::before{
  content:"اعثر على الإجراء الصحيح، افتح النموذج المطلوب، واحصل على إجابة موثوقة من مصادر المعهد المعتمدة.";
  font-size:13px;
  line-height:1.9;
}
.sn-login-points{margin-top:24px!important;gap:8px!important}
.sn-login-points span{
  position:relative;
  min-height:34px;
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  padding:0 12px!important;
  font-size:0!important;
  border-radius:11px!important;
  border:1px solid rgba(37,99,235,.105)!important;
  background:rgba(255,255,255,.76)!important;
  color:#49628f!important;
  box-shadow:0 7px 18px rgba(33,61,109,.032)!important;
}
.sn-login-points span::before{content:"";width:6px;height:6px;border-radius:50%;background:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.09)}
.sn-login-points span:nth-child(1)::after{content:"Trusted knowledge"}.sn-login-points span:nth-child(2)::after{content:"Approved workflows"}.sn-login-points span:nth-child(3)::after{content:"Unified services"}
html[lang="ar"] .sn-login-points span:nth-child(1)::after{content:"معرفة موثوقة"}html[lang="ar"] .sn-login-points span:nth-child(2)::after{content:"إجراءات معتمدة"}html[lang="ar"] .sn-login-points span:nth-child(3)::after{content:"خدمات موحدة"}
.sn-login-points span::after{font-size:9px;font-weight:750;white-space:nowrap}

@media(max-width:1100px){
  .login{grid-template-columns:minmax(360px,.8fr) minmax(470px,1fr)!important;gap:46px!important;padding:42px!important}
  .sn-login-hero h2::before{font-size:44px!important}.sn-login-hero{min-height:440px!important}
}
@media(max-width:820px){
  .login{display:flex!important;flex-direction:column!important;gap:22px!important;padding:28px 18px 42px!important}
  .sn-login-hero{min-height:auto!important;order:-1!important;padding:20px 10px 8px!important;text-align:center!important;align-items:center!important}
  .sn-login-hero::before,.sn-login-hero::after{display:none!important}
  .sn-hero-mark{margin-bottom:23px!important}
  .sn-login-hero h2::before,html[lang="ar"] .sn-login-hero h2::before{font-size:38px!important;letter-spacing:-1px!important}
  .sn-login-hero p::before,html[lang="ar"] .sn-login-hero p::before{font-size:12px!important}
  .sn-login-points{justify-content:center!important}
  .login-card{max-width:500px!important}
}