:root{--connect-navy:#071b33;--connect-navy-2:#102d4d;--connect-gold:#f4b323;--connect-ink:#102542;--connect-ivory:#fffaf0;--connect-muted:#677487}
@property --connect-border-angle{syntax:"<angle>";initial-value:0deg;inherits:false}
*{box-sizing:border-box}
html{min-height:100%;background:var(--connect-navy)}
body.connect-body{min-width:320px;min-height:100%;margin:0;background:var(--connect-navy);font-family:Inter,Vazirmatn,Arial,sans-serif}
.connect-body .edupath-consultation-overlay{font-family:Inter,Vazirmatn,Arial,sans-serif}
.connect-skip{position:fixed;top:12px;inset-inline-start:14px;z-index:10010;padding:10px 14px;border-radius:12px;background:#fff;color:var(--connect-ink);font-weight:800;text-decoration:none;transform:translateY(-160%);transition:transform .2s ease}
.connect-skip:focus{transform:translateY(0);outline:3px solid var(--connect-gold)}
.connect-page{position:relative;isolation:isolate;display:grid;min-height:100svh;place-items:center;overflow:hidden;padding:36px 18px;background:radial-gradient(circle at 15% 15%,rgba(33,91,137,.56),transparent 34%),radial-gradient(circle at 88% 80%,rgba(244,179,35,.18),transparent 32%),linear-gradient(145deg,#06182d,#0b2949 55%,#071b33)}
.connect-page::before{position:absolute;inset:0;z-index:-2;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:46px 46px;content:"";mask-image:linear-gradient(to bottom,black,transparent 78%)}
.connect-orb{position:absolute;z-index:-1;border-radius:50%;filter:blur(1px);pointer-events:none}
.connect-orb-one{top:-140px;inset-inline-end:-110px;width:330px;height:330px;border:1px solid rgba(244,179,35,.24);box-shadow:inset 0 0 80px rgba(244,179,35,.06)}
.connect-orb-two{bottom:-190px;inset-inline-start:-160px;width:430px;height:430px;border:1px solid rgba(119,181,225,.15);box-shadow:inset 0 0 100px rgba(119,181,225,.05)}
.connect-card{width:min(100%,680px);overflow:hidden;border:1px solid rgba(255,255,255,.16);border-radius:34px;background:linear-gradient(150deg,rgba(255,255,255,.98),rgba(255,250,240,.94));box-shadow:0 36px 110px rgba(0,0,0,.35),inset 0 1px rgba(255,255,255,.9)}
.connect-card-header{display:flex;align-items:center;gap:16px;padding:26px 30px 4px}
.connect-language{display:inline-flex;min-width:72px;min-height:42px;align-items:center;justify-content:center;margin-inline-start:auto;padding:9px 14px;border:1px solid rgba(16,37,66,.14);border-radius:14px;background:rgba(255,255,255,.82);box-shadow:0 8px 22px rgba(16,37,66,.08);color:var(--connect-ink);font-size:13px;font-weight:850;text-decoration:none;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.connect-language:hover{transform:translateY(-2px);border-color:rgba(244,179,35,.58);box-shadow:0 12px 28px rgba(16,37,66,.12)}
.connect-intro{padding:4px 30px 24px;text-align:center}
.connect-intro-logo{display:inline-flex;align-items:center;justify-content:center;margin-bottom:12px}
.connect-intro-logo img{display:block;width:clamp(138px,24vw,168px);height:auto;object-fit:contain}
.connect-intro h1{margin:0;color:var(--connect-ink);font-size:clamp(32px,6vw,49px);font-weight:900;line-height:1.08;letter-spacing:-.045em}
html[dir="rtl"] .connect-intro h1{letter-spacing:-.025em}
.connect-intro p{max-width:560px;margin:16px auto 0;color:var(--connect-muted);font-size:15px;font-weight:530;line-height:1.75}
.connect-save{position:relative;display:grid;grid-template-columns:56px minmax(0,1fr) auto;align-items:center;gap:15px;margin:0 30px;padding:16px 18px;overflow:hidden;border:1px solid rgba(133,87,0,.24);border-radius:20px;background:linear-gradient(135deg,#ffd972,#f4b323);box-shadow:0 17px 36px rgba(193,125,0,.24),inset 0 1px rgba(255,255,255,.78);color:#271b05;text-align:start;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}
.connect-save::before{position:absolute;top:-110%;left:-20%;width:40%;height:300%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);content:"";transform:rotate(24deg);transition:left .65s ease}
.connect-save:hover{transform:translateY(-3px);box-shadow:0 22px 43px rgba(193,125,0,.31),inset 0 1px rgba(255,255,255,.85)}
.connect-save:hover::before{left:115%}
.connect-save-icon{display:grid;width:56px;height:56px;place-items:center;border-radius:17px;background:rgba(255,255,255,.48);box-shadow:inset 0 1px rgba(255,255,255,.72)}
.connect-save-icon svg{width:30px;height:30px}
.connect-save strong,.connect-save-number{position:relative;z-index:1;display:block}
.connect-save strong{font-size:17px;font-weight:900;line-height:1.35}
.connect-save-number{margin-top:5px;color:rgba(39,27,5,.72);font-size:12px;font-weight:850;line-height:1.3;direction:ltr;unicode-bidi:isolate;white-space:nowrap}
html[dir="rtl"] .connect-save-number{text-align:right}
.connect-arrow{position:relative;z-index:1;font-size:24px;font-weight:400}
.connect-links{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:18px 30px 30px}
.connect-link{--connect-border-base:rgba(244,179,35,.32);--connect-border-light:rgba(255,222,126,.92);--connect-border-accent:rgba(221,151,0,.64);position:relative;isolation:isolate;display:grid;min-height:94px;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:12px;padding:14px;overflow:hidden;border:1px solid rgba(16,37,66,.1);border-radius:19px;background:rgba(255,255,255,.76);box-shadow:0 12px 30px rgba(16,37,66,.07),inset 0 1px rgba(255,255,255,.9);color:var(--connect-ink);text-align:start;text-decoration:none;transition:box-shadow .18s ease}
.connect-link::before{--connect-border-angle:0deg;position:absolute;inset:0;z-index:2;padding:1.5px;border-radius:inherit;background:conic-gradient(from var(--connect-border-angle),var(--connect-border-base) 0deg,var(--connect-border-base) 76deg,rgba(255,255,255,.98) 110deg,var(--connect-border-light) 140deg,var(--connect-border-accent) 174deg,var(--connect-border-base) 214deg,var(--connect-border-base) 360deg);content:"";-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;pointer-events:none;animation:connectBorderSpin 4.8s linear infinite}
.connect-link:hover{box-shadow:0 17px 35px rgba(16,37,66,.12),inset 0 1px rgba(255,255,255,.95)}
.connect-link:hover::before{animation-duration:2.6s}
.connect-link-icon{display:grid;width:44px;height:44px;place-items:center;border-radius:14px;background:#eef2f5;color:var(--connect-ink)}
.connect-link-icon svg{width:24px;height:24px}
.connect-link strong,.connect-link small{display:block}
.connect-link strong{font-size:13px;font-weight:900;line-height:1.35}
.connect-link small{margin-top:4px;color:var(--connect-muted);font-size:10px;font-weight:650;line-height:1.45}
.connect-link i{color:#9c6b00;font-size:17px;font-style:normal}
.connect-link-whatsapp,.connect-link-instagram{-webkit-backdrop-filter:blur(16px) saturate(135%);backdrop-filter:blur(16px) saturate(135%)}
.connect-link-whatsapp{--connect-border-base:rgba(15,169,88,.34);--connect-border-light:rgba(111,245,166,.94);--connect-border-accent:rgba(8,137,69,.78);background:linear-gradient(135deg,rgba(37,211,102,.24),rgba(18,140,83,.10) 52%,rgba(255,255,255,.78));box-shadow:0 12px 30px rgba(18,140,83,.12),inset 0 1px rgba(255,255,255,.94)}
.connect-link-whatsapp:hover{box-shadow:0 17px 38px rgba(18,140,83,.2),inset 0 1px rgba(255,255,255,.98)}
.connect-link-whatsapp strong{color:#063e28}
.connect-link-whatsapp small{color:rgba(6,62,40,.7)}
.connect-link-whatsapp i{color:#098945}
.connect-link-whatsapp .connect-link-icon{background:linear-gradient(145deg,#35df7c,#0da956);box-shadow:0 8px 20px rgba(18,140,83,.22),inset 0 1px rgba(255,255,255,.48);color:#fff}
.connect-link-guidance .connect-link-icon{background:#fff1c8;color:#9b6800}
.connect-link-programs .connect-link-icon{background:#e3ecf7;color:#174d80}
.connect-link-instagram{--connect-border-base:rgba(131,58,180,.34);--connect-border-light:rgba(255,105,180,.96);--connect-border-accent:rgba(252,175,69,.92);background:linear-gradient(135deg,rgba(114,55,189,.20),rgba(230,52,123,.15) 54%,rgba(246,161,45,.20));box-shadow:0 12px 30px rgba(164,46,126,.13),inset 0 1px rgba(255,255,255,.92)}
.connect-link-instagram:hover{box-shadow:0 17px 38px rgba(164,46,126,.21),inset 0 1px rgba(255,255,255,.98)}
.connect-link-instagram strong{color:#481940}
.connect-link-instagram small{color:rgba(72,25,64,.68)}
.connect-link-instagram i{color:#bd2e76}
.connect-link-instagram .connect-link-icon{background:linear-gradient(135deg,#7237bd,#e6347b 58%,#f6a12d);box-shadow:0 8px 20px rgba(193,48,124,.25),inset 0 1px rgba(255,255,255,.45);color:#fff}
.connect-link-linkedin .connect-link-icon{background:#0a66c2;color:#fff}
.connect-link-facebook .connect-link-icon{background:#1877f2;color:#fff}
@keyframes connectBorderSpin{to{--connect-border-angle:360deg}}
.connect-footer{padding:18px 30px 22px;border-top:1px solid rgba(16,37,66,.09);background:rgba(16,37,66,.035);text-align:center}
.connect-footer nav{display:flex;align-items:center;justify-content:center;gap:9px;color:#a4aab2;font-size:11px}
.connect-footer a{color:#556273;font-weight:800;text-decoration:none}
.connect-footer a:hover{text-decoration:underline;text-underline-offset:3px}
@media(max-width:620px){
  .connect-page{align-items:start;padding:0;background:linear-gradient(160deg,#0c3155 0,#071b33 48%,#06172b)}
  .connect-card{min-height:100svh;border:0;border-radius:0;background:linear-gradient(160deg,rgba(255,255,255,.99),rgba(255,250,240,.97))}
  .connect-card-header{padding:20px 20px 8px}
  .connect-language{min-width:66px;min-height:40px;padding:8px 12px}
  .connect-intro{padding:14px 20px 21px}
  .connect-intro h1{font-size:34px}
  .connect-intro p{font-size:13px;line-height:1.68}
  .connect-save{grid-template-columns:50px minmax(0,1fr) auto;margin:0 18px;padding:14px;border-radius:18px}
  .connect-save-icon{width:50px;height:50px;border-radius:15px}
  .connect-save-icon svg{width:27px;height:27px}
  .connect-save strong{font-size:15px}
  .connect-links{grid-template-columns:1fr;gap:10px;padding:18px 18px 24px}
  .connect-link{min-height:78px;padding:12px 13px;border-radius:17px}
  .connect-link strong{font-size:13px}
  .connect-link small{font-size:10px}
  .connect-footer{padding:18px 20px 24px}
}
@media(max-width:355px){
  .connect-card-header{padding-inline:15px}
  .connect-intro{padding-inline:15px}
  .connect-intro h1{font-size:30px}
  .connect-save{grid-template-columns:44px minmax(0,1fr) auto;margin-inline:13px;padding:12px}
  .connect-save-icon{width:44px;height:44px}
  .connect-links{padding-inline:13px}
}
@media(prefers-reduced-motion:reduce){.connect-skip,.connect-language,.connect-save,.connect-save::before,.connect-link{transition:none}.connect-link::before{animation:none}}
