/* ===================================================================== ABOUT HERO — RenderBox module (CodePen "Gravity", Haml/Sass -> HTML/CSS; font: Univia Pro) Root: #AboutHero_root__Ah1 Prefix: AboutHero_*__Ah1 Star field forked by the original author from https://codepen.io/saransh/details/BKJun (@saran5h) Round 2: title 'About Destintel' scales with the width (em-based spacing); scene layers sit in a viewport-height box; the principles intro flows below the title so the hero can grow (min-height). NOTE (Rule #2.5 corollary): transform / opacity / letter-spacing / padding-left on animated elements carry NO !important so the keyframes can drive them. ===================================================================== */ /* Univia Pro: same files/descriptors as the LeadTeam module. No quotes anywhere so CMS &quot; encoding cannot break them. */ @font-face { font-family: Univia Pro; font-style: normal; font-weight: 300; font-display: swap; src: url(https://destintel.com/folder/font/UniviaPro/UniviaPro-Light.otf); } @font-face { font-family: Univia Pro; font-style: normal; font-weight: 400; font-display: swap; src: url(https://destintel.com/folder/font/UniviaPro/UniviaPro-Regular.otf); } @font-face { font-family: Univia Pro; font-style: normal; font-weight: 500; font-display: swap; src: url(https://destintel.com/folder/font/UniviaPro/UniviaPro-Medium.otf); } @font-face { font-family: Univia Pro; font-style: italic; font-weight: 500; font-display: swap; src: url(https://destintel.com/folder/font/UniviaPro/UniviaPro-MediumItalic.otf); } @font-face { font-family: Univia Pro; font-style: normal; font-weight: 700; font-display: swap; src: url(https://destintel.com/folder/font/UniviaPro/UniviaPro-Bold.otf); } @font-face { font-family: Univia Pro; font-style: italic; font-weight: 700; font-display: swap; src: url(https://destintel.com/folder/font/UniviaPro/UniviaPro-BoldItalic.otf); } /* Scoped reset (Section 4.2) — no !important so element rules below win */ #AboutHero_root__Ah1, #AboutHero_root__Ah1 *, #AboutHero_root__Ah1 *::before, #AboutHero_root__Ah1 *::after { margin: 0; padding: 0; box-sizing: border-box; } /* Root — relative context for absolute layers (Rule #7). Height now follows the content (min-height = one scene); the scene box clips the oversized horizon/earth (Rule #9 option B). */ #AboutHero_root__Ah1 { --ah-scene-h: max(520px, 100vh); position: relative !important; display: block !important; width: 100% !important; height: auto !important; min-height: var(--ah-scene-h) !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; isolation: isolate !important; container-type: inline-size; font-family: Univia Pro, system-ui, sans-serif !important; font-size: 16px !important; line-height: normal !important; color: #FFF !important; text-align: left !important; background: #000000 !important; } @supports (height: 100dvh) { #AboutHero_root__Ah1 { --ah-scene-h: max(520px, 100dvh); } } /* Scene box: the original full-screen GRAVITY backdrop (stars, horizon, earth), unchanged inside */ #AboutHero_root__Ah1 .AboutHero_scene__Ah1 { display: block !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important; z-index: 0 !important; width: 100% !important; height: auto !important; min-height: var(--ah-scene-h) !important; overflow: hidden !important; pointer-events: none !important; background: #000000 !important; } /* ---- Star layers: background z 1 (mobile-first: reduced list, full list >=768px) ---- */ /* AboutHero_stars__Ah1: 700 stars on desktop, 270 on <768px (only the ones that can be on screen) */ #AboutHero_root__Ah1 .AboutHero_stars__Ah1 { display: block !important; position: absolute !important; top: 0px !important; left: 0 !important; z-index: 1 !important; width: 1px !important; height: 1px !important; background: transparent !important; box-shadow: 407px 902px #FFF, 83px 62px #FFF, 480px 1131px #FFF, 369px 126px #FFF, 137px 720px #FFF, 488px 554px #FFF, 361px 1737px #FFF, 49px 94px #FFF, 4px 1102px #FFF, 342px 1815px #FFF, 27px 1323px #FFF, 118px 235px #FFF, 379px 1193px #FFF, 558px 1458px #FFF, 508px 778px #FFF, 274px 1900px #FFF, 201px 625px #FFF, 67px 68px #FFF, 722px 1745px #FFF, 492px 847px #FFF, 605px 423px #FFF, 81px 1946px #FFF, 618px 276px #FFF, 501px 971px #FFF, 547px 1677px #FFF, 231px 823px #FFF, 177px 1181px #FFF, 44px 373px #FFF, 363px 609px #FFF, 764px 669px #FFF, 239px 1794px #FFF, 168px 304px #FFF, 603px 1375px #FFF, 242px 1153px #FFF, 662px 1162px #FFF, 104px 500px #FFF, 757px 1664px #FFF, 687px 1706px #FFF, 506px 1724px #FFF, 157px 294px #FFF, 291px 1255px #FFF, 326px 1591px #FFF, 111px 346px #FFF, 299px 1608px #FFF, 625px 731px #FFF, 220px 118px #FFF, 365px 359px #FFF, 314px 783px #FFF, 36px 1381px #FFF, 666px 245px #FFF, 111px 1849px #FFF, 526px 442px #FFF, 414px 253px #FFF, 78px 129px #FFF, 404px 217px #FFF, 251px 1776px #FFF, 608px 268px #FFF, 110px 293px #FFF, 348px 1481px #FFF, 20px 1088px #FFF, 512px 1520px #FFF, 19px 127px #FFF, 318px 532px #FFF, 134px 1735px #FFF, 400px 1177px #FFF, 137px 1994px #FFF, 536px 722px #FFF, 603px 790px #FFF, 190px 589px #FFF, 656px 1595px #FFF, 331px 1478px #FFF, 469px 1731px #FFF, 672px 487px #FFF, 625px 284px #FFF, 724px 642px #FFF, 102px 1192px #FFF, 370px 92px #FFF, 340px 828px #FFF, 17px 1313px #FFF, 736px 1665px #FFF, 417px 1770px #FFF, 336px 1508px #FFF, 495px 823px #FFF, 617px 231px #FFF, 430px 550px #FFF, 127px 1600px #FFF, 402px 834px #FFF, 424px 1074px #FFF, 33px 1727px #FFF, 382px 199px #FFF, 34px 1212px #FFF, 284px 1908px #FFF, 359px 1755px #FFF, 594px 745px #FFF, 75px 1526px #FFF, 608px 1524px #FFF, 647px 253px #FFF, 48px 1766px #FFF, 515px 1093px #FFF, 179px 237px #FFF, 255px 792px #FFF, 410px 1673px #FFF, 41px 751px #FFF, 345px 850px #FFF, 649px 984px #FFF, 103px 1120px #FFF, 194px 1073px #FFF, 436px 1098px #FFF, 628px 755px #FFF, 101px 431px #FFF, 175px 1202px #FFF, 305px 258px #FFF, 320px 1662px #FFF, 318px 326px #FFF, 238px 988px #FFF, 747px 1285px #FFF, 51px 395px #FFF, 508px 1328px #FFF, 426px 1650px #FFF, 179px 447px #FFF, 308px 757px #FFF, 132px 310px #FFF, 184px 1275px #FFF, 143px 881px #FFF, 323px 1586px #FFF, 553px 1374px #FFF, 639px 654px #FFF, 56px 1792px #FFF, 57px 1648px #FFF, 657px 1691px #FFF, 645px 1099px #FFF, 129px 683px #FFF, 225px 600px #FFF, 119px 1551px #FFF, 556px 1416px #FFF, 467px 73px #FFF, 627px 1434px #FFF, 613px 438px #FFF, 370px 1495px #FFF, 634px 91px #FFF, 10px 1677px #FFF, 473px 1435px #FFF, 621px 1216px #FFF, 320px 1130px #FFF, 638px 1192px #FFF, 173px 703px #FFF, 587px 1161px #FFF, 422px 700px #FFF, 253px 883px #FFF, 232px 1901px #FFF, 105px 273px #FFF, 356px 938px #FFF, 218px 1080px #FFF, 34px 1282px #FFF, 378px 1479px #FFF, 557px 1380px #FFF, 378px 159px #FFF, 87px 661px #FFF, 720px 169px #FFF, 508px 916px #FFF, 362px 291px #FFF, 549px 552px #FFF, 194px 1259px #FFF, 8px 331px #FFF, 151px 126px #FFF, 285px 824px #FFF, 270px 374px #FFF, 53px 858px #FFF, 15px 6px #FFF, 503px 138px #FFF, 521px 1178px #FFF, 325px 134px #FFF, 57px 1652px #FFF, 550px 1526px #FFF, 702px 901px #FFF, 736px 1469px #FFF, 714px 1955px #FFF, 697px 493px #FFF, 284px 203px #FFF, 164px 1848px #FFF, 155px 335px #FFF, 375px 977px #FFF, 737px 1821px #FFF, 73px 1953px #FFF, 574px 1430px #FFF, 233px 1398px #FFF, 484px 1402px #FFF, 266px 730px #FFF, 78px 1657px #FFF, 182px 1146px #FFF, 239px 1592px #FFF, 350px 180px #FFF, 480px 191px #FFF, 116px 1936px #FFF, 352px 589px #FFF, 401px 74px #FFF, 736px 773px #FFF, 650px 1115px #FFF, 230px 82px #FFF, 464px 784px #FFF, 638px 691px #FFF, 624px 1081px #FFF, 767px 1055px #FFF, 715px 1511px #FFF, 572px 1174px #FFF, 62px 747px #FFF, 393px 1876px #FFF, 540px 150px #FFF, 566px 1423px #FFF, 539px 246px #FFF, 227px 1296px #FFF, 240px 1120px #FFF, 93px 904px #FFF, 130px 463px #FFF, 534px 1997px #FFF, 608px 1293px #FFF, 722px 133px #FFF, 382px 1707px #FFF, 102px 1611px #FFF, 374px 533px #FFF, 370px 923px #FFF, 389px 1655px #FFF, 533px 1251px #FFF, 151px 1604px #FFF, 589px 274px #FFF, 6px 1534px #FFF, 223px 277px #FFF, 620px 38px #FFF, 479px 568px #FFF, 571px 502px #FFF, 309px 1113px #FFF, 667px 1160px #FFF, 701px 30px #FFF, 198px 1168px #FFF, 367px 847px #FFF, 602px 731px #FFF, 508px 802px #FFF, 356px 722px #FFF, 268px 1561px #FFF, 449px 675px #FFF, 626px 1521px #FFF, 24px 149px #FFF, 474px 129px #FFF, 567px 689px #FFF, 698px 1015px #FFF, 18px 1683px #FFF, 766px 946px #FFF, 56px 561px #FFF, 305px 1215px #FFF, 54px 1223px #FFF, 86px 1498px #FFF, 406px 1631px #FFF, 746px 1084px #FFF, 301px 1540px #FFF, 176px 1679px #FFF, 378px 1500px #FFF, 211px 1995px #FFF, 583px 1117px #FFF, 117px 58px #FFF, 614px 1637px #FFF, 193px 206px #FFF, 134px 1236px #FFF, 316px 1108px #FFF, 542px 1674px #FFF, 502px 1897px #FFF, 133px 1989px #FFF, 451px 1486px #FFF, 448px 856px #FFF, 521px 942px #FFF, 343px 498px #FFF !important; transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; will-change: transform; animation: AboutHero_animStar__Ah1 50s linear infinite; } #AboutHero_root__Ah1 .AboutHero_stars__Ah1::after { content: ' ' !important; display: block !important; position: absolute !important; top: 2000px !important; left: 0 !important; width: 1px !important; height: 1px !important; background: transparent !important; box-shadow: 407px 902px #FFF, 83px 62px #FFF, 480px 1131px #FFF, 369px 126px #FFF, 137px 720px #FFF, 488px 554px #FFF, 361px 1737px #FFF, 49px 94px #FFF, 4px 1102px #FFF, 342px 1815px #FFF, 27px 1323px #FFF, 118px 235px #FFF, 379px 1193px #FFF, 558px 1458px #FFF, 508px 778px #FFF, 274px 1900px #FFF, 201px 625px #FFF, 67px 68px #FFF, 722px 1745px #FFF, 492px 847px #FFF, 605px 423px #FFF, 81px 1946px #FFF, 618px 276px #FFF, 501px 971px #FFF, 547px 1677px #FFF, 231px 823px #FFF, 177px 1181px #FFF, 44px 373px #FFF, 363px 609px #FFF, 764px 669px #FFF, 239px 1794px #FFF, 168px 304px #FFF, 603px 1375px #FFF, 242px 1153px #FFF, 662px 1162px #FFF, 104px 500px #FFF, 757px 1664px #FFF, 687px 1706px #FFF, 506px 1724px #FFF, 157px 294px #FFF, 291px 1255px #FFF, 326px 1591px #FFF, 111px 346px #FFF, 299px 1608px #FFF, 625px 731px #FFF, 220px 118px #FFF, 365px 359px #FFF, 314px 783px #FFF, 36px 1381px #FFF, 666px 245px #FFF, 111px 1849px #FFF, 526px 442px #FFF, 414px 253px #FFF, 78px 129px #FFF, 404px 217px #FFF, 251px 1776px #FFF, 608px 268px #FFF, 110px 293px #FFF, 348px 1481px #FFF, 20px 1088px #FFF, 512px 1520px #FFF, 19px 127px #FFF, 318px 532px #FFF, 134px 1735px #FFF, 400px 1177px #FFF, 137px 1994px #FFF, 536px 722px #FFF, 603px 790px #FFF, 190px 589px #FFF, 656px 1595px #FFF, 331px 1478px #FFF, 469px 1731px #FFF, 672px 487px #FFF, 625px 284px #FFF, 724px 642px #FFF, 102px 1192px #FFF, 370px 92px #FFF, 340px 828px #FFF, 17px 1313px #FFF, 736px 1665px #FFF, 417px 1770px #FFF, 336px 1508px #FFF, 495px 823px #FFF, 617px 231px #FFF, 430px 550px #FFF, 127px 1600px #FFF, 402px 834px #FFF, 424px 1074px #FFF, 33px 1727px #FFF, 382px 199px #FFF, 34px 1212px #FFF, 284px 1908px #FFF, 359px 1755px #FFF, 594px 745px #FFF, 75px 1526px #FFF, 608px 1524px #FFF, 647px 253px #FFF, 48px 1766px #FFF, 515px 1093px #FFF, 179px 237px #FFF, 255px 792px #FFF, 410px 1673px #FFF, 41px 751px #FFF, 345px 850px #FFF, 649px 984px #FFF, 103px 1120px #FFF, 194px 1073px #FFF, 436px 1098px #FFF, 628px 755px #FFF, 101px 431px #FFF, 175px 1202px #FFF, 305px 258px #FFF, 320px 1662px #FFF, 318px 326px #FFF, 238px 988px #FFF, 747px 1285px #FFF, 51px 395px #FFF, 508px 1328px #FFF, 426px 1650px #FFF, 179px 447px #FFF, 308px 757px #FFF, 132px 310px #FFF, 184px 1275px #FFF, 143px 881px #FFF, 323px 1586px #FFF, 553px 1374px #FFF, 639px 654px #FFF, 56px 1792px #FFF, 57px 1648px #FFF, 657px 1691px #FFF, 645px 1099px #FFF, 129px 683px #FFF, 225px 600px #FFF, 119px 1551px #FFF, 556px 1416px #FFF, 467px 73px #FFF, 627px 1434px #FFF, 613px 438px #FFF, 370px 1495px #FFF, 634px 91px #FFF, 10px 1677px #FFF, 473px 1435px #FFF, 621px 1216px #FFF, 320px 1130px #FFF, 638px 1192px #FFF, 173px 703px #FFF, 587px 1161px #FFF, 422px 700px #FFF, 253px 883px #FFF, 232px 1901px #FFF, 105px 273px #FFF, 356px 938px #FFF, 218px 1080px #FFF, 34px 1282px #FFF, 378px 1479px #FFF, 557px 1380px #FFF, 378px 159px #FFF, 87px 661px #FFF, 720px 169px #FFF, 508px 916px #FFF, 362px 291px #FFF, 549px 552px #FFF, 194px 1259px #FFF, 8px 331px #FFF, 151px 126px #FFF, 285px 824px #FFF, 270px 374px #FFF, 53px 858px #FFF, 15px 6px #FFF, 503px 138px #FFF, 521px 1178px #FFF, 325px 134px #FFF, 57px 1652px #FFF, 550px 1526px #FFF, 702px 901px #FFF, 736px 1469px #FFF, 714px 1955px #FFF, 697px 493px #FFF, 284px 203px #FFF, 164px 1848px #FFF, 155px 335px #FFF, 375px 977px #FFF, 737px 1821px #FFF, 73px 1953px #FFF, 574px 1430px #FFF, 233px 1398px #FFF, 484px 1402px #FFF, 266px 730px #FFF, 78px 1657px #FFF, 182px 1146px #FFF, 239px 1592px #FFF, 350px 180px #FFF, 480px 191px #FFF, 116px 1936px #FFF, 352px 589px #FFF, 401px 74px #FFF, 736px 773px #FFF, 650px 1115px #FFF, 230px 82px #FFF, 464px 784px #FFF, 638px 691px #FFF, 624px 1081px #FFF, 767px 1055px #FFF, 715px 1511px #FFF, 572px 1174px #FFF, 62px 747px #FFF, 393px 1876px #FFF, 540px 150px #FFF, 566px 1423px #FFF, 539px 246px #FFF, 227px 1296px #FFF, 240px 1120px #FFF, 93px 904px #FFF, 130px 463px #FFF, 534px 1997px #FFF, 608px 1293px #FFF, 722px 133px #FFF, 382px 1707px #FFF, 102px 1611px #FFF, 374px 533px #FFF, 370px 923px #FFF, 389px 1655px #FFF, 533px 1251px #FFF, 151px 1604px #FFF, 589px 274px #FFF, 6px 1534px #FFF, 223px 277px #FFF, 620px 38px #FFF, 479px 568px #FFF, 571px 502px #FFF, 309px 1113px #FFF, 667px 1160px #FFF, 701px 30px #FFF, 198px 1168px #FFF, 367px 847px #FFF, 602px 731px #FFF, 508px 802px #FFF, 356px 722px #FFF, 268px 1561px #FFF, 449px 675px #FFF, 626px 1521px #FFF, 24px 149px #FFF, 474px 129px #FFF, 567px 689px #FFF, 698px 1015px #FFF, 18px 1683px #FFF, 766px 946px #FFF, 56px 561px #FFF, 305px 1215px #FFF, 54px 1223px #FFF, 86px 1498px #FFF, 406px 1631px #FFF, 746px 1084px #FFF, 301px 1540px #FFF, 176px 1679px #FFF, 378px 1500px #FFF, 211px 1995px #FFF, 583px 1117px #FFF, 117px 58px #FFF, 614px 1637px #FFF, 193px 206px #FFF, 134px 1236px #FFF, 316px 1108px #FFF, 542px 1674px #FFF, 502px 1897px #FFF, 133px 1989px #FFF, 451px 1486px #FFF, 448px 856px #FFF, 521px 942px #FFF, 343px 498px #FFF !important; } /* AboutHero_stars2__Ah1: 200 stars on desktop, 87 on <768px (only the ones that can be on screen) */ #AboutHero_root__Ah1 .AboutHero_stars2__Ah1 { display: block !important; position: absolute !important; top: 1px !important; left: 0 !important; z-index: 1 !important; width: 2px !important; height: 2px !important; background: transparent !important; box-shadow: 658px 270px #FFF, 567px 1054px #FFF, 236px 1124px #FFF, 745px 152px #FFF, 472px 1674px #FFF, 294px 170px #FFF, 143px 1340px #FFF, 27px 1170px #FFF, 592px 1760px #FFF, 496px 1374px #FFF, 40px 380px #FFF, 617px 241px #FFF, 584px 1825px #FFF, 234px 236px #FFF, 43px 1887px #FFF, 408px 1316px #FFF, 293px 500px #FFF, 538px 1213px #FFF, 237px 1857px #FFF, 110px 1198px #FFF, 469px 240px #FFF, 437px 1402px #FFF, 666px 611px #FFF, 54px 671px #FFF, 750px 1823px #FFF, 486px 1837px #FFF, 265px 1658px #FFF, 100px 908px #FFF, 594px 1410px #FFF, 195px 662px #FFF, 662px 1470px #FFF, 62px 699px #FFF, 222px 1925px #FFF, 260px 155px #FFF, 558px 1229px #FFF, 33px 626px #FFF, 733px 880px #FFF, 694px 1452px #FFF, 246px 868px #FFF, 465px 1467px #FFF, 327px 1903px #FFF, 653px 683px #FFF, 488px 1687px #FFF, 427px 1127px #FFF, 758px 1791px #FFF, 729px 277px #FFF, 170px 1686px #FFF, 185px 1977px #FFF, 135px 1777px #FFF, 733px 1601px #FFF, 155px 1826px #FFF, 442px 1951px #FFF, 705px 988px #FFF, 202px 154px #FFF, 379px 518px #FFF, 64px 763px #FFF, 118px 465px #FFF, 589px 1718px #FFF, 165px 1930px #FFF, 305px 1724px #FFF, 617px 394px #FFF, 321px 1088px #FFF, 290px 799px #FFF, 588px 1040px #FFF, 434px 565px #FFF, 503px 1888px #FFF, 635px 1785px #FFF, 74px 1441px #FFF, 488px 781px #FFF, 652px 1495px #FFF, 436px 408px #FFF, 517px 1241px #FFF, 136px 1838px #FFF, 331px 1361px #FFF, 375px 1672px #FFF, 283px 1208px #FFF, 72px 969px #FFF, 321px 170px #FFF, 142px 1193px #FFF, 341px 78px #FFF, 410px 457px #FFF, 651px 296px #FFF, 614px 1354px #FFF, 642px 1345px #FFF, 319px 1153px #FFF, 49px 352px #FFF, 101px 257px #FFF !important; transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; will-change: transform; animation: AboutHero_animStar__Ah1 100s linear infinite; } #AboutHero_root__Ah1 .AboutHero_stars2__Ah1::after { content: ' ' !important; display: block !important; position: absolute !important; top: 2000px !important; left: 0 !important; width: 2px !important; height: 2px !important; background: transparent !important; box-shadow: 658px 270px #FFF, 567px 1054px #FFF, 236px 1124px #FFF, 745px 152px #FFF, 472px 1674px #FFF, 294px 170px #FFF, 143px 1340px #FFF, 27px 1170px #FFF, 592px 1760px #FFF, 496px 1374px #FFF, 40px 380px #FFF, 617px 241px #FFF, 584px 1825px #FFF, 234px 236px #FFF, 43px 1887px #FFF, 408px 1316px #FFF, 293px 500px #FFF, 538px 1213px #FFF, 237px 1857px #FFF, 110px 1198px #FFF, 469px 240px #FFF, 437px 1402px #FFF, 666px 611px #FFF, 54px 671px #FFF, 750px 1823px #FFF, 486px 1837px #FFF, 265px 1658px #FFF, 100px 908px #FFF, 594px 1410px #FFF, 195px 662px #FFF, 662px 1470px #FFF, 62px 699px #FFF, 222px 1925px #FFF, 260px 155px #FFF, 558px 1229px #FFF, 33px 626px #FFF, 733px 880px #FFF, 694px 1452px #FFF, 246px 868px #FFF, 465px 1467px #FFF, 327px 1903px #FFF, 653px 683px #FFF, 488px 1687px #FFF, 427px 1127px #FFF, 758px 1791px #FFF, 729px 277px #FFF, 170px 1686px #FFF, 185px 1977px #FFF, 135px 1777px #FFF, 733px 1601px #FFF, 155px 1826px #FFF, 442px 1951px #FFF, 705px 988px #FFF, 202px 154px #FFF, 379px 518px #FFF, 64px 763px #FFF, 118px 465px #FFF, 589px 1718px #FFF, 165px 1930px #FFF, 305px 1724px #FFF, 617px 394px #FFF, 321px 1088px #FFF, 290px 799px #FFF, 588px 1040px #FFF, 434px 565px #FFF, 503px 1888px #FFF, 635px 1785px #FFF, 74px 1441px #FFF, 488px 781px #FFF, 652px 1495px #FFF, 436px 408px #FFF, 517px 1241px #FFF, 136px 1838px #FFF, 331px 1361px #FFF, 375px 1672px #FFF, 283px 1208px #FFF, 72px 969px #FFF, 321px 170px #FFF, 142px 1193px #FFF, 341px 78px #FFF, 410px 457px #FFF, 651px 296px #FFF, 614px 1354px #FFF, 642px 1345px #FFF, 319px 1153px #FFF, 49px 352px #FFF, 101px 257px #FFF !important; } /* AboutHero_stars3__Ah1: 100 stars on desktop, 47 on <768px (only the ones that can be on screen) */ #AboutHero_root__Ah1 .AboutHero_stars3__Ah1 { display: block !important; position: absolute !important; top: 3px !important; left: 0 !important; z-index: 1 !important; width: 3px !important; height: 3px !important; background: transparent !important; box-shadow: 259px 1248px #FFF, 541px 970px #FFF, 748px 504px #FFF, 471px 1652px #FFF, 763px 786px #FFF, 630px 1835px #FFF, 602px 1704px #FFF, 203px 780px #FFF, 650px 489px #FFF, 117px 1823px #FFF, 95px 1017px #FFF, 159px 512px #FFF, 252px 1234px #FFF, 129px 1088px #FFF, 35px 1242px #FFF, 471px 1303px #FFF, 172px 1522px #FFF, 690px 1226px #FFF, 634px 474px #FFF, 153px 457px #FFF, 168px 263px #FFF, 483px 1989px #FFF, 290px 1623px #FFF, 536px 1102px #FFF, 194px 1578px #FFF, 154px 461px #FFF, 43px 965px #FFF, 741px 309px #FFF, 710px 889px #FFF, 11px 445px #FFF, 81px 450px #FFF, 273px 100px #FFF, 36px 493px #FFF, 46px 1795px #FFF, 239px 103px #FFF, 679px 1257px #FFF, 46px 1659px #FFF, 28px 304px #FFF, 343px 1816px #FFF, 671px 1434px #FFF, 80px 71px #FFF, 118px 742px #FFF, 12px 114px #FFF, 373px 795px #FFF, 655px 8px #FFF, 163px 653px #FFF, 296px 640px #FFF !important; transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; will-change: transform; animation: AboutHero_animStar__Ah1 150s linear infinite; } #AboutHero_root__Ah1 .AboutHero_stars3__Ah1::after { content: ' ' !important; display: block !important; position: absolute !important; top: 2000px !important; left: 0 !important; width: 3px !important; height: 3px !important; background: transparent !important; box-shadow: 259px 1248px #FFF, 541px 970px #FFF, 748px 504px #FFF, 471px 1652px #FFF, 763px 786px #FFF, 630px 1835px #FFF, 602px 1704px #FFF, 203px 780px #FFF, 650px 489px #FFF, 117px 1823px #FFF, 95px 1017px #FFF, 159px 512px #FFF, 252px 1234px #FFF, 129px 1088px #FFF, 35px 1242px #FFF, 471px 1303px #FFF, 172px 1522px #FFF, 690px 1226px #FFF, 634px 474px #FFF, 153px 457px #FFF, 168px 263px #FFF, 483px 1989px #FFF, 290px 1623px #FFF, 536px 1102px #FFF, 194px 1578px #FFF, 154px 461px #FFF, 43px 965px #FFF, 741px 309px #FFF, 710px 889px #FFF, 11px 445px #FFF, 81px 450px #FFF, 273px 100px #FFF, 36px 493px #FFF, 46px 1795px #FFF, 239px 103px #FFF, 679px 1257px #FFF, 46px 1659px #FFF, 28px 304px #FFF, 343px 1816px #FFF, 671px 1434px #FFF, 80px 71px #FFF, 118px 742px #FFF, 12px 114px #FFF, 373px 795px #FFF, 655px 8px #FFF, 163px 653px #FFF, 296px 640px #FFF !important; } @media (min-width: 768px) { #AboutHero_root__Ah1 .AboutHero_stars__Ah1, #AboutHero_root__Ah1 .AboutHero_stars__Ah1::after { box-shadow: 1873px 433px #FFF, 407px 902px #FFF, 986px 22px #FFF, 1680px 1687px #FFF, 83px 62px #FFF, 1250px 398px #FFF, 1076px 1696px #FFF, 866px 1818px #FFF, 811px 1173px #FFF, 1337px 1412px #FFF, 1627px 1293px #FFF, 1338px 1338px #FFF, 1845px 805px #FFF, 1702px 477px #FFF, 1618px 1020px #FFF, 1407px 1746px #FFF, 1857px 119px #FFF, 480px 1131px #FFF, 369px 126px #FFF, 1349px 556px #FFF, 137px 720px #FFF, 1388px 1905px #FFF, 488px 554px #FFF, 1268px 801px #FFF, 361px 1737px #FFF, 49px 94px #FFF, 1409px 1669px #FFF, 1924px 1894px #FFF, 1839px 1642px #FFF, 4px 1102px #FFF, 901px 871px #FFF, 342px 1815px #FFF, 27px 1323px #FFF, 1250px 1353px #FFF, 913px 1017px #FFF, 118px 235px #FFF, 1478px 142px #FFF, 1759px 391px #FFF, 1093px 77px #FFF, 1961px 904px #FFF, 1144px 1803px #FFF, 1562px 418px #FFF, 970px 38px #FFF, 960px 1935px #FFF, 1876px 1150px #FFF, 379px 1193px #FFF, 558px 1458px #FFF, 1692px 1671px #FFF, 508px 778px #FFF, 274px 1900px #FFF, 1926px 1467px #FFF, 1690px 273px #FFF, 201px 625px #FFF, 67px 68px #FFF, 790px 1053px #FFF, 722px 1745px #FFF, 492px 847px #FFF, 1255px 1434px #FFF, 932px 955px #FFF, 1485px 23px #FFF, 605px 423px #FFF, 81px 1946px #FFF, 1474px 1193px #FFF, 618px 276px #FFF, 501px 971px #FFF, 1285px 1427px #FFF, 907px 1043px #FFF, 1726px 808px #FFF, 547px 1677px #FFF, 1553px 502px #FFF, 1532px 1692px #FFF, 1783px 1511px #FFF, 1180px 382px #FFF, 1841px 858px #FFF, 1872px 1357px #FFF, 1572px 27px #FFF, 1453px 1587px #FFF, 865px 1236px #FFF, 1954px 255px #FFF, 1904px 809px #FFF, 1645px 974px #FFF, 1140px 228px #FFF, 1913px 393px #FFF, 231px 823px #FFF, 1820px 724px #FFF, 1664px 707px #FFF, 1336px 98px #FFF, 1925px 71px #FFF, 177px 1181px #FFF, 1947px 192px #FFF, 1517px 1651px #FFF, 1988px 1908px #FFF, 44px 373px #FFF, 1155px 1025px #FFF, 363px 609px #FFF, 764px 669px #FFF, 239px 1794px #FFF, 168px 304px #FFF, 1292px 1881px #FFF, 603px 1375px #FFF, 1738px 1209px #FFF, 242px 1153px #FFF, 1999px 522px #FFF, 1499px 640px #FFF, 1793px 806px #FFF, 1240px 1679px #FFF, 662px 1162px #FFF, 1706px 962px #FFF, 104px 500px #FFF, 1297px 1778px #FFF, 1957px 1812px #FFF, 757px 1664px #FFF, 687px 1706px #FFF, 1372px 608px #FFF, 506px 1724px #FFF, 1332px 1854px #FFF, 157px 294px #FFF, 291px 1255px #FFF, 326px 1591px #FFF, 1785px 778px #FFF, 111px 346px #FFF, 1754px 297px #FFF, 1088px 1908px #FFF, 1862px 1851px #FFF, 1900px 74px #FFF, 299px 1608px #FFF, 1081px 1876px #FFF, 890px 1446px #FFF, 625px 731px #FFF, 220px 118px #FFF, 1635px 1165px #FFF, 365px 359px #FFF, 1247px 1372px #FFF, 945px 751px #FFF, 314px 783px #FFF, 1623px 858px #FFF, 36px 1381px #FFF, 807px 1407px #FFF, 666px 245px #FFF, 111px 1849px #FFF, 1085px 69px #FFF, 1229px 1394px #FFF, 1276px 137px #FFF, 823px 116px #FFF, 526px 442px #FFF, 1054px 211px #FFF, 774px 124px #FFF, 414px 253px #FFF, 78px 129px #FFF, 1762px 627px #FFF, 1335px 967px #FFF, 404px 217px #FFF, 1765px 1186px #FFF, 1378px 1115px #FFF, 251px 1776px #FFF, 1686px 526px #FFF, 608px 268px #FFF, 110px 293px #FFF, 1098px 1010px #FFF, 1159px 455px #FFF, 348px 1481px #FFF, 1514px 1184px #FFF, 1362px 165px #FFF, 20px 1088px #FFF, 512px 1520px #FFF, 965px 625px #FFF, 19px 127px #FFF, 847px 71px #FFF, 1615px 1808px #FFF, 1882px 633px #FFF, 1748px 1682px #FFF, 1730px 1103px #FFF, 318px 532px #FFF, 134px 1735px #FFF, 1000px 430px #FFF, 400px 1177px #FFF, 965px 978px #FFF, 1760px 766px #FFF, 137px 1994px #FFF, 1434px 1165px #FFF, 536px 722px #FFF, 603px 790px #FFF, 190px 589px #FFF, 1170px 874px #FFF, 1243px 1579px #FFF, 1351px 1179px #FFF, 1154px 1556px #FFF, 1651px 1777px #FFF, 656px 1595px #FFF, 909px 1883px #FFF, 1180px 1695px #FFF, 331px 1478px #FFF, 1750px 711px #FFF, 1198px 222px #FFF, 1892px 379px #FFF, 880px 486px #FFF, 1640px 261px #FFF, 1738px 172px #FFF, 1838px 713px #FFF, 469px 1731px #FFF, 1057px 200px #FFF, 672px 487px #FFF, 1386px 380px #FFF, 985px 369px #FFF, 625px 284px #FFF, 724px 642px #FFF, 102px 1192px #FFF, 1560px 1355px #FFF, 370px 92px #FFF, 340px 828px #FFF, 1834px 190px #FFF, 17px 1313px #FFF, 736px 1665px #FFF, 1246px 1179px #FFF, 1742px 780px #FFF, 803px 1973px #FFF, 417px 1770px #FFF, 1685px 1872px #FFF, 1634px 781px #FFF, 336px 1508px #FFF, 1201px 168px #FFF, 1397px 899px #FFF, 1871px 945px #FFF, 951px 225px #FFF, 495px 823px #FFF, 1582px 1132px #FFF, 1185px 431px #FFF, 617px 231px #FFF, 430px 550px #FFF, 1267px 916px #FFF, 1512px 171px #FFF, 1126px 1968px #FFF, 127px 1600px #FFF, 402px 834px #FFF, 1384px 793px #FFF, 1267px 394px #FFF, 1808px 968px #FFF, 1129px 499px #FFF, 1724px 1638px #FFF, 1055px 1215px #FFF, 424px 1074px #FFF, 1991px 148px #FFF, 1715px 85px #FFF, 33px 1727px #FFF, 1318px 356px #FFF, 1378px 1431px #FFF, 382px 199px #FFF, 1015px 83px #FFF, 34px 1212px #FFF, 1841px 471px #FFF, 1081px 36px #FFF, 1710px 1438px #FFF, 284px 1908px #FFF, 1116px 1778px #FFF, 1026px 1264px #FFF, 972px 498px #FFF, 907px 1054px #FFF, 359px 1755px #FFF, 1933px 756px #FFF, 1518px 320px #FFF, 965px 1007px #FFF, 1919px 585px #FFF, 1607px 834px #FFF, 1648px 397px #FFF, 1511px 415px #FFF, 594px 745px #FFF, 872px 312px #FFF, 895px 1661px #FFF, 1516px 1651px #FFF, 1695px 1105px #FFF, 75px 1526px #FFF, 608px 1524px #FFF, 911px 331px #FFF, 1101px 1355px #FFF, 1787px 1469px #FFF, 647px 253px #FFF, 1231px 884px #FFF, 1276px 773px #FFF, 924px 1621px #FFF, 1680px 1642px #FFF, 1605px 1499px #FFF, 1563px 26px #FFF, 947px 315px #FFF, 1128px 651px #FFF, 1224px 345px #FFF, 48px 1766px #FFF, 865px 521px #FFF, 1759px 314px #FFF, 1702px 1323px #FFF, 1352px 1193px #FFF, 921px 787px #FFF, 515px 1093px #FFF, 179px 237px #FFF, 255px 792px #FFF, 1490px 3px #FFF, 1271px 1414px #FFF, 1771px 246px #FFF, 410px 1673px #FFF, 1116px 867px #FFF, 41px 751px #FFF, 835px 216px #FFF, 1831px 824px #FFF, 1033px 1987px #FFF, 1381px 1115px #FFF, 1256px 1076px #FFF, 1679px 126px #FFF, 345px 850px #FFF, 649px 984px #FFF, 103px 1120px #FFF, 1232px 1408px #FFF, 1228px 1132px #FFF, 1353px 860px #FFF, 194px 1073px #FFF, 436px 1098px #FFF, 628px 755px #FFF, 913px 1453px #FFF, 101px 431px #FFF, 175px 1202px #FFF, 305px 258px #FFF, 1654px 1932px #FFF, 320px 1662px #FFF, 1910px 1426px #FFF, 318px 326px #FFF, 1768px 1051px #FFF, 1298px 408px #FFF, 1019px 36px #FFF, 238px 988px #FFF, 747px 1285px #FFF, 1116px 523px #FFF, 51px 395px #FFF, 919px 1872px #FFF, 1793px 662px #FFF, 1537px 1036px #FFF, 508px 1328px #FFF, 1066px 307px #FFF, 426px 1650px #FFF, 179px 447px #FFF, 1188px 1940px #FFF, 308px 757px #FFF, 1602px 1860px #FFF, 132px 310px #FFF, 1572px 588px #FFF, 184px 1275px #FFF, 143px 881px #FFF, 323px 1586px #FFF, 1592px 1585px #FFF, 1098px 627px #FFF, 1376px 18px #FFF, 553px 1374px #FFF, 1647px 1569px #FFF, 1246px 1713px #FFF, 911px 534px #FFF, 639px 654px #FFF, 1668px 112px #FFF, 56px 1792px #FFF, 866px 543px #FFF, 1576px 766px #FFF, 1834px 1668px #FFF, 57px 1648px #FFF, 1798px 1079px #FFF, 871px 211px #FFF, 1931px 898px #FFF, 657px 1691px #FFF, 1192px 1651px #FFF, 957px 1424px #FFF, 645px 1099px #FFF, 129px 683px #FFF, 1964px 1556px #FFF, 827px 67px #FFF, 225px 600px #FFF, 1843px 258px #FFF, 119px 1551px #FFF, 556px 1416px #FFF, 1106px 1451px #FFF, 790px 1715px #FFF, 467px 73px #FFF, 627px 1434px #FFF, 613px 438px #FFF, 1639px 769px #FFF, 1763px 1554px #FFF, 1436px 426px #FFF, 1872px 1538px #FFF, 1583px 1126px #FFF, 370px 1495px #FFF, 1843px 1183px #FFF, 818px 460px #FFF, 1549px 63px #FFF, 980px 1836px #FFF, 634px 91px #FFF, 1229px 1456px #FFF, 1014px 1714px #FFF, 10px 1677px #FFF, 1403px 892px #FFF, 1920px 635px #FFF, 1574px 1073px #FFF, 1080px 135px #FFF, 473px 1435px #FFF, 1638px 812px #FFF, 621px 1216px #FFF, 1730px 676px #FFF, 1192px 871px #FFF, 1771px 344px #FFF, 795px 1153px #FFF, 320px 1130px #FFF, 638px 1192px #FFF, 173px 703px #FFF, 587px 1161px #FFF, 1926px 1658px #FFF, 422px 700px #FFF, 1016px 28px #FFF, 1058px 1255px #FFF, 1895px 1505px #FFF, 253px 883px #FFF, 1700px 1088px #FFF, 1398px 1508px #FFF, 232px 1901px #FFF, 1827px 1869px #FFF, 105px 273px #FFF, 356px 938px #FFF, 1116px 649px #FFF, 218px 1080px #FFF, 1283px 466px #FFF, 34px 1282px #FFF, 378px 1479px #FFF, 945px 501px #FFF, 1690px 1417px #FFF, 993px 1040px #FFF, 557px 1380px #FFF, 1406px 1044px #FFF, 1302px 826px #FFF, 1399px 1783px #FFF, 378px 159px #FFF, 87px 661px #FFF, 1292px 1713px #FFF, 938px 1415px #FFF, 947px 62px #FFF, 1761px 467px #FFF, 720px 169px #FFF, 1582px 1865px #FFF, 1492px 1604px #FFF, 1427px 716px #FFF, 1285px 1993px #FFF, 508px 916px #FFF, 362px 291px #FFF, 1755px 935px #FFF, 1619px 1895px #FFF, 549px 552px #FFF, 194px 1259px #FFF, 853px 1502px #FFF, 999px 1082px #FFF, 1652px 146px #FFF, 8px 331px #FFF, 1519px 1330px #FFF, 772px 1343px #FFF, 151px 126px #FFF, 285px 824px #FFF, 1104px 639px #FFF, 1498px 882px #FFF, 270px 374px #FFF, 1707px 1901px #FFF, 53px 858px #FFF, 15px 6px #FFF, 1643px 796px #FFF, 1786px 1656px #FFF, 1886px 643px #FFF, 503px 138px #FFF, 1662px 104px #FFF, 1204px 1007px #FFF, 893px 246px #FFF, 1212px 1647px #FFF, 1756px 690px #FFF, 1982px 397px #FFF, 521px 1178px #FFF, 1208px 751px #FFF, 903px 477px #FFF, 1730px 526px #FFF, 1704px 262px #FFF, 802px 965px #FFF, 325px 134px #FFF, 1493px 764px #FFF, 1314px 1082px #FFF, 1404px 577px #FFF, 870px 1178px #FFF, 1222px 886px #FFF, 1884px 1316px #FFF, 57px 1652px #FFF, 942px 960px #FFF, 1875px 1364px #FFF, 1968px 1745px #FFF, 550px 1526px #FFF, 819px 1058px #FFF, 702px 901px #FFF, 1033px 214px #FFF, 1895px 1917px #FFF, 736px 1469px #FFF, 1156px 375px #FFF, 1578px 737px #FFF, 1709px 391px #FFF, 714px 1955px #FFF, 1551px 1041px #FFF, 1852px 580px #FFF, 1244px 1367px #FFF, 697px 493px #FFF, 284px 203px #FFF, 1588px 564px #FFF, 164px 1848px #FFF, 921px 1195px #FFF, 1827px 1055px #FFF, 155px 335px #FFF, 1136px 1301px #FFF, 375px 977px #FFF, 1698px 208px #FFF, 873px 1998px #FFF, 1337px 738px #FFF, 1611px 1978px #FFF, 737px 1821px #FFF, 1262px 181px #FFF, 1318px 494px #FFF, 1013px 61px #FFF, 73px 1953px #FFF, 574px 1430px #FFF, 233px 1398px #FFF, 1751px 1562px #FFF, 1453px 703px #FFF, 484px 1402px #FFF, 1518px 725px #FFF, 266px 730px #FFF, 1119px 80px #FFF, 78px 1657px #FFF, 1155px 1874px #FFF, 1367px 185px #FFF, 1338px 1312px #FFF, 182px 1146px #FFF, 882px 641px #FFF, 1560px 1202px #FFF, 239px 1592px #FFF, 350px 180px #FFF, 1407px 1943px #FFF, 1481px 506px #FFF, 1774px 71px #FFF, 480px 191px #FFF, 970px 531px #FFF, 116px 1936px #FFF, 1739px 661px #FFF, 1001px 1463px #FFF, 352px 589px #FFF, 1152px 1242px #FFF, 1243px 1968px #FFF, 849px 516px #FFF, 861px 469px #FFF, 1423px 1805px #FFF, 1635px 402px #FFF, 401px 74px #FFF, 1767px 1892px #FFF, 736px 773px #FFF, 1237px 245px #FFF, 650px 1115px #FFF, 1019px 1701px #FFF, 778px 1224px #FFF, 230px 82px #FFF, 464px 784px #FFF, 638px 691px #FFF, 624px 1081px #FFF, 1566px 1518px #FFF, 767px 1055px #FFF, 715px 1511px #FFF, 1091px 81px #FFF, 572px 1174px #FFF, 62px 747px #FFF, 393px 1876px #FFF, 1988px 1043px #FFF, 540px 150px #FFF, 566px 1423px #FFF, 539px 246px #FFF, 1995px 1083px #FFF, 1320px 1530px #FFF, 227px 1296px #FFF, 240px 1120px #FFF, 93px 904px #FFF, 130px 463px #FFF, 858px 777px #FFF, 1662px 1882px #FFF, 534px 1997px #FFF, 892px 765px #FFF, 928px 1286px #FFF, 608px 1293px #FFF, 945px 1450px #FFF, 1252px 1584px #FFF, 1391px 672px #FFF, 722px 133px #FFF, 1384px 1977px #FFF, 382px 1707px #FFF, 102px 1611px #FFF, 374px 533px #FFF, 370px 923px #FFF, 389px 1655px #FFF, 533px 1251px #FFF, 1202px 869px #FFF, 151px 1604px #FFF, 589px 274px #FFF, 1030px 1223px #FFF, 1738px 1047px #FFF, 6px 1534px #FFF, 1154px 831px #FFF, 878px 1273px #FFF, 223px 277px #FFF, 1481px 504px #FFF, 620px 38px #FFF, 939px 1164px #FFF, 1450px 1850px #FFF, 1138px 376px #FFF, 479px 568px #FFF, 962px 623px #FFF, 571px 502px #FFF, 1605px 612px #FFF, 309px 1113px #FFF, 1877px 1697px #FFF, 667px 1160px #FFF, 1367px 1809px #FFF, 1240px 469px #FFF, 1538px 1925px #FFF, 1451px 1800px #FFF, 701px 30px #FFF, 1688px 397px #FFF, 198px 1168px #FFF, 1584px 1183px #FFF, 1421px 78px #FFF, 367px 847px #FFF, 602px 731px #FFF, 508px 802px #FFF, 356px 722px #FFF, 1229px 667px #FFF, 268px 1561px #FFF, 449px 675px #FFF, 626px 1521px #FFF, 24px 149px #FFF, 474px 129px #FFF, 1433px 1322px #FFF, 1963px 1997px #FFF, 1777px 1339px #FFF, 994px 616px #FFF, 567px 689px #FFF, 698px 1015px #FFF, 1980px 190px #FFF, 18px 1683px #FFF, 766px 946px #FFF, 1419px 1884px #FFF, 1140px 1796px #FFF, 56px 561px #FFF, 951px 432px #FFF, 1234px 941px #FFF, 305px 1215px #FFF, 54px 1223px #FFF, 1317px 337px #FFF, 1911px 1339px #FFF, 86px 1498px #FFF, 1017px 934px #FFF, 1045px 1145px #FFF, 806px 1336px #FFF, 875px 1600px #FFF, 406px 1631px #FFF, 1949px 1124px #FFF, 1159px 1240px #FFF, 746px 1084px #FFF, 1065px 1302px #FFF, 1825px 42px #FFF, 301px 1540px #FFF, 1175px 575px #FFF, 989px 294px #FFF, 176px 1679px #FFF, 378px 1500px #FFF, 913px 1255px #FFF, 211px 1995px #FFF, 583px 1117px #FFF, 117px 58px #FFF, 614px 1637px #FFF, 1873px 945px #FFF, 1946px 1094px #FFF, 193px 206px #FFF, 134px 1236px #FFF, 1627px 843px #FFF, 1626px 1078px #FFF, 1839px 1705px #FFF, 316px 1108px #FFF, 817px 1788px #FFF, 542px 1674px #FFF, 502px 1897px #FFF, 1188px 337px #FFF, 1113px 913px #FFF, 1156px 1446px #FFF, 133px 1989px #FFF, 1189px 830px #FFF, 451px 1486px #FFF, 986px 1959px #FFF, 1061px 908px #FFF, 448px 856px #FFF, 521px 942px #FFF, 1716px 38px #FFF, 343px 498px #FFF, 1168px 1707px #FFF !important; } #AboutHero_root__Ah1 .AboutHero_stars2__Ah1, #AboutHero_root__Ah1 .AboutHero_stars2__Ah1::after { box-shadow: 785px 1125px #FFF, 1235px 1317px #FFF, 658px 270px #FFF, 567px 1054px #FFF, 835px 122px #FFF, 1887px 1026px #FFF, 236px 1124px #FFF, 1178px 1912px #FFF, 745px 152px #FFF, 944px 908px #FFF, 1032px 1775px #FFF, 1611px 1921px #FFF, 472px 1674px #FFF, 294px 170px #FFF, 143px 1340px #FFF, 1980px 1514px #FFF, 27px 1170px #FFF, 1438px 1279px #FFF, 592px 1760px #FFF, 496px 1374px #FFF, 40px 380px #FFF, 1351px 283px #FFF, 617px 241px #FFF, 584px 1825px #FFF, 1684px 495px #FFF, 234px 236px #FFF, 1315px 1774px #FFF, 1626px 1217px #FFF, 813px 1603px #FFF, 43px 1887px #FFF, 1200px 840px #FFF, 408px 1316px #FFF, 1977px 282px #FFF, 1721px 446px #FFF, 1482px 1658px #FFF, 293px 500px #FFF, 538px 1213px #FFF, 991px 698px #FFF, 237px 1857px #FFF, 110px 1198px #FFF, 469px 240px #FFF, 437px 1402px #FFF, 783px 1545px #FFF, 1706px 1872px #FFF, 666px 611px #FFF, 54px 671px #FFF, 1373px 1006px #FFF, 1729px 228px #FFF, 867px 1498px #FFF, 1745px 280px #FFF, 1029px 634px #FFF, 750px 1823px #FFF, 979px 1860px #FFF, 1949px 1662px #FFF, 486px 1837px #FFF, 265px 1658px #FFF, 100px 908px #FFF, 594px 1410px #FFF, 845px 752px #FFF, 195px 662px #FFF, 1665px 551px #FFF, 662px 1470px #FFF, 1959px 1058px #FFF, 62px 699px #FFF, 1106px 1915px #FFF, 222px 1925px #FFF, 1924px 542px #FFF, 1258px 1924px #FFF, 896px 597px #FFF, 1489px 1359px #FFF, 260px 155px #FFF, 1875px 773px #FFF, 1625px 556px #FFF, 972px 1048px #FFF, 992px 1438px #FFF, 1244px 1423px #FFF, 1648px 1612px #FFF, 558px 1229px #FFF, 1677px 1355px #FFF, 1615px 1521px #FFF, 1560px 1023px #FFF, 1163px 1px #FFF, 1926px 1211px #FFF, 1101px 886px #FFF, 1933px 845px #FFF, 1071px 1426px #FFF, 33px 626px #FFF, 733px 880px #FFF, 1352px 458px #FFF, 694px 1452px #FFF, 856px 24px #FFF, 1750px 839px #FFF, 1010px 1939px #FFF, 1470px 961px #FFF, 1041px 1179px #FFF, 1719px 31px #FFF, 1506px 1778px #FFF, 1231px 1060px #FFF, 925px 241px #FFF, 246px 868px #FFF, 465px 1467px #FFF, 1629px 319px #FFF, 327px 1903px #FFF, 653px 683px #FFF, 488px 1687px #FFF, 427px 1127px #FFF, 758px 1791px #FFF, 1091px 806px #FFF, 729px 277px #FFF, 170px 1686px #FFF, 1191px 1208px #FFF, 1250px 1787px #FFF, 185px 1977px #FFF, 135px 1777px #FFF, 733px 1601px #FFF, 1768px 865px #FFF, 155px 1826px #FFF, 442px 1951px #FFF, 705px 988px #FFF, 877px 1180px #FFF, 1169px 1957px #FFF, 1651px 509px #FFF, 1212px 1644px #FFF, 1814px 66px #FFF, 202px 154px #FFF, 1345px 34px #FFF, 1888px 1560px #FFF, 1717px 930px #FFF, 379px 518px #FFF, 1662px 1721px #FFF, 1622px 17px #FFF, 64px 763px #FFF, 1051px 803px #FFF, 1247px 526px #FFF, 1397px 1345px #FFF, 1294px 1421px #FFF, 118px 465px #FFF, 950px 128px #FFF, 589px 1718px #FFF, 165px 1930px #FFF, 1874px 641px #FFF, 1865px 1781px #FFF, 1351px 175px #FFF, 305px 1724px #FFF, 1125px 665px #FFF, 617px 394px #FFF, 961px 866px #FFF, 321px 1088px #FFF, 290px 799px #FFF, 588px 1040px #FFF, 434px 565px #FFF, 503px 1888px #FFF, 635px 1785px #FFF, 808px 634px #FFF, 74px 1441px #FFF, 949px 1115px #FFF, 488px 781px #FFF, 1784px 1239px #FFF, 1001px 284px #FFF, 1431px 111px #FFF, 652px 1495px #FFF, 1178px 1078px #FFF, 436px 408px #FFF, 1830px 1754px #FFF, 517px 1241px #FFF, 1898px 1011px #FFF, 1124px 1355px #FFF, 136px 1838px #FFF, 331px 1361px #FFF, 375px 1672px #FFF, 283px 1208px #FFF, 72px 969px #FFF, 1824px 1262px #FFF, 964px 151px #FFF, 1947px 817px #FFF, 1456px 1430px #FFF, 321px 170px #FFF, 142px 1193px #FFF, 341px 78px #FFF, 410px 457px #FFF, 1200px 561px #FFF, 947px 96px #FFF, 831px 1699px #FFF, 1457px 533px #FFF, 1040px 1018px #FFF, 651px 296px #FFF, 614px 1354px #FFF, 930px 1000px #FFF, 780px 187px #FFF, 642px 1345px #FFF, 983px 826px #FFF, 1429px 1569px #FFF, 319px 1153px #FFF, 49px 352px #FFF, 1448px 1030px #FFF, 1375px 765px #FFF, 1093px 1607px #FFF, 1177px 454px #FFF, 1662px 319px #FFF, 101px 257px #FFF !important; } #AboutHero_root__Ah1 .AboutHero_stars3__Ah1, #AboutHero_root__Ah1 .AboutHero_stars3__Ah1::after { box-shadow: 1103px 1862px #FFF, 1763px 124px #FFF, 259px 1248px #FFF, 1883px 926px #FFF, 541px 970px #FFF, 883px 1268px #FFF, 748px 504px #FFF, 471px 1652px #FFF, 932px 1237px #FFF, 931px 1350px #FFF, 763px 786px #FFF, 1486px 1164px #FFF, 630px 1835px #FFF, 602px 1704px #FFF, 203px 780px #FFF, 650px 489px #FFF, 1328px 397px #FFF, 117px 1823px #FFF, 95px 1017px #FFF, 1604px 737px #FFF, 1387px 1590px #FFF, 159px 512px #FFF, 1297px 468px #FFF, 252px 1234px #FFF, 1355px 211px #FFF, 1153px 16px #FFF, 1320px 1564px #FFF, 1766px 714px #FFF, 129px 1088px #FFF, 1722px 1695px #FFF, 35px 1242px #FFF, 1598px 1684px #FFF, 987px 1295px #FFF, 471px 1303px #FFF, 172px 1522px #FFF, 836px 1044px #FFF, 690px 1226px #FFF, 1935px 463px #FFF, 1130px 58px #FFF, 1226px 652px #FFF, 634px 474px #FFF, 153px 457px #FFF, 168px 263px #FFF, 1388px 1318px #FFF, 483px 1989px #FFF, 1718px 604px #FFF, 1091px 1731px #FFF, 1041px 609px #FFF, 1198px 1406px #FFF, 290px 1623px #FFF, 932px 1452px #FFF, 885px 566px #FFF, 1684px 1495px #FFF, 536px 1102px #FFF, 194px 1578px #FFF, 154px 461px #FFF, 43px 965px #FFF, 741px 309px #FFF, 1622px 1513px #FFF, 710px 889px #FFF, 1991px 1018px #FFF, 11px 445px #FFF, 1656px 102px #FFF, 1074px 1857px #FFF, 81px 450px #FFF, 273px 100px #FFF, 36px 493px #FFF, 960px 443px #FFF, 985px 1208px #FFF, 1080px 1322px #FFF, 46px 1795px #FFF, 957px 1025px #FFF, 1655px 1355px #FFF, 1848px 1091px #FFF, 1249px 286px #FFF, 239px 103px #FFF, 679px 1257px #FFF, 46px 1659px #FFF, 1732px 1285px #FFF, 1555px 1036px #FFF, 28px 304px #FFF, 343px 1816px #FFF, 671px 1434px #FFF, 80px 71px #FFF, 1686px 383px #FFF, 118px 742px #FFF, 1886px 1891px #FFF, 1717px 474px #FFF, 970px 19px #FFF, 12px 114px #FFF, 894px 225px #FFF, 1081px 1855px #FFF, 373px 795px #FFF, 1470px 188px #FFF, 655px 8px #FFF, 163px 653px #FFF, 296px 640px #FFF, 989px 1862px #FFF, 1509px 787px #FFF, 1710px 906px #FFF !important; } } /* ---- Horizon glow: background z 2 ---- */ #AboutHero_root__Ah1 .AboutHero_horizon__Ah1 { display: block !important; position: absolute !important; z-index: 2 !important; width: 160% !important; height: calc(var(--ah-scene-h) * 0.42) !important; border-radius: 100% / 100% !important; background: #2563eb !important; -webkit-filter: blur(80px) !important; filter: blur(80px) !important; opacity: 0.28 !important; left: 50% !important; top: calc(var(--ah-scene-h) * 0.28) !important; bottom: auto !important; margin: 0 0 0 -80% !important; padding: 0 !important; } #AboutHero_root__Ah1 .AboutHero_horizon__Ah1::before { content: ' ' !important; display: block !important; position: absolute !important; width: 81.25% !important; height: 70% !important; border-radius: 100% / 100% !important; background: #3b82f6 !important; -webkit-filter: blur(50px) !important; filter: blur(50px) !important; opacity: 0.28 !important; margin-left: 9.375% !important; } #AboutHero_root__Ah1 .AboutHero_horizon__Ah1::after { content: ' ' !important; display: block !important; position: absolute !important; width: 32% !important; height: 20% !important; border-radius: 650px / 350px !important; background: #60a5fa !important; -webkit-filter: blur(45px) !important; filter: blur(45px) !important; opacity: 0.20 !important; margin-left: 34% !important; } #AboutHero_root__Ah1 .AboutHero_horizon__Ah1 .AboutHero_glow__Ah1 { display: block !important; position: absolute !important; width: 100% !important; height: 100% !important; border-radius: 100% / 100% !important; background: #1e3a8a !important; -webkit-filter: blur(140px) !important; filter: blur(140px) !important; opacity: 0.32 !important; top: -10% !important; margin: 0 !important; padding: 0 !important; } /* ---- Earth (R6): TRUE globe ellipse (deep arc, no flat shelf). Limb at 48% of the first viewport. Earth and rim share one geometry so the bright rim sits on the curved limb. The scene fills the root, so the globe continues under the intro with no straight clip mid-screen. ---- */ #AboutHero_root__Ah1 .AboutHero_earth__Ah1 { display: block !important; position: absolute !important; z-index: 3 !important; left: 50% !important; top: calc(var(--ah-scene-h) * 0.48) !important; width: 220% !important; height: calc(var(--ah-scene-h) * 1.55) !important; margin: 0 0 0 -110% !important; padding: 0 !important; border-radius: 50% !important; background-color: #000000 !important; background-image: radial-gradient(ellipse 55% 22% at 50% 8%, #1e4a8c 0%, #12306e 25%, #0b1f4a 48%, rgba(6, 18, 48, 0) 72%), radial-gradient(ellipse 80% 55% at 50% 0%, #0b1f4a 0%, #061230 35%, #020611 65%, #000000 100%) !important; background-repeat: no-repeat !important; box-shadow: none !important; } #AboutHero_root__Ah1 .AboutHero_earth__Ah1::before { content: ' ' !important; display: block !important; position: absolute !important; left: 0 !important; top: 0 !important; width: 100% !important; height: 100% !important; border-radius: 50% !important; pointer-events: none !important; background: transparent !important; /* limb glow just under the rim, blending into the navy surface */ box-shadow: inset 0 3px 10px -2px rgba(190, 220, 255, 0.95), inset 0 20px 50px -12px rgba(59, 130, 246, 0.55), inset 0 70px 140px -40px rgba(37, 99, 235, 0.30) !important; } #AboutHero_root__Ah1 .AboutHero_earth__Ah1::after { content: ' ' !important; display: block !important; position: absolute !important; left: 0 !important; top: 0 !important; width: 100% !important; height: 100% !important; border-radius: 50% !important; pointer-events: none !important; /* side vignette so the globe falls off into black at the edges */ background: linear-gradient(to right, rgba(0, 0, 0, 0.92) 0%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0.92) 100%) !important; } /* Atmosphere: soft glow above the limb (fades to transparent, no edges) */ #AboutHero_root__Ah1 .AboutHero_atmosphere__Ah1 { display: block !important; position: absolute !important; z-index: 4 !important; left: 50% !important; top: calc(var(--ah-scene-h) * 0.20) !important; width: 220% !important; height: calc(var(--ah-scene-h) * 0.55) !important; margin: 0 0 0 -110% !important; padding: 0 !important; pointer-events: none !important; /* centred on the limb (51% of this box) and fully transparent well before every edge: no straight seams */ background: radial-gradient(ellipse 48% 44% at 50% 51%, rgba(125, 185, 255, 0.45) 0%, rgba(59, 130, 246, 0.24) 35%, rgba(37, 99, 235, 0.08) 62%, rgba(0, 0, 0, 0) 80%) !important; } /* Rim: same ellipse as the earth; only its curved top stroke + outer glow show */ #AboutHero_root__Ah1 .AboutHero_rim__Ah1 { display: block !important; position: absolute !important; z-index: 5 !important; left: 50% !important; top: calc(var(--ah-scene-h) * 0.48) !important; width: 220% !important; height: calc(var(--ah-scene-h) * 1.55) !important; margin: 0 0 0 -110% !important; padding: 0 !important; pointer-events: none !important; background: transparent !important; border: none !important; border-radius: 50% !important; border-top: 2px solid rgba(235, 245, 255, 1) !important; box-shadow: 0 -1px 0 0 rgba(190, 220, 255, 1), 0 -4px 10px 1px rgba(120, 185, 255, 0.95), 0 -12px 32px 6px rgba(59, 130, 246, 0.75), 0 -28px 80px 18px rgba(37, 99, 235, 0.38) !important; } /* ---- Title (REF1): "About" white + "Destintel" blue gradient, Univia Pro Regular (400), tight spacing, one line. Width ~45% of the hero on desktop (as in the reference); never wider than 92% on small screens. One gentle fade-in (class-based, JS); transform/opacity carry no !important (Rule #2.5). ---- */ #AboutHero_root__Ah1 .AboutHero_title__Ah1 { display: block !important; position: absolute !important; z-index: 10 !important; font-family: Univia Pro, system-ui, sans-serif !important; font-weight: 400 !important; font-style: normal !important; line-height: 1.1 !important; top: calc(var(--ah-scene-h) * 0.36) !important; left: 0 !important; right: 0 !important; margin: -0.55em 0 0 0 !important; padding: 0 !important; font-size: clamp(min(40px, 13.295vw), 6.503vw, 128px) !important; white-space: nowrap !important; text-align: center !important; text-transform: none !important; letter-spacing: -0.01em !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; background: none !important; -webkit-font-smoothing: antialiased !important; text-rendering: geometricPrecision; transition: opacity 1.2s cubic-bezier(0.19, 1, 0.22, 1), transform 1.2s cubic-bezier(0.19, 1, 0.22, 1); } #AboutHero_root__Ah1 .AboutHero_title__Ah1 .AboutHero_titleA__Ah1 { color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; } #AboutHero_root__Ah1 .AboutHero_title__Ah1 .AboutHero_titleB__Ah1 { display: inline-block !important; padding: 0 0.04em 0.08em 0 !important; margin: 0 !important; background: -webkit-linear-gradient(left, #b4c6ff 0%, #8aa5ff 30%, #5b80ff 65%, #3b6bff 100%) !important; background: linear-gradient(90deg, #b4c6ff 0%, #8aa5ff 30%, #5b80ff 65%, #3b6bff 100%) !important; -webkit-background-clip: text !important; background-clip: text !important; color: transparent !important; -webkit-text-fill-color: transparent !important; } #AboutHero_root__Ah1 .AboutHero_titleReveal__Ah1.AboutHero_animIn__Ah1 { opacity: 0; transform: translateY(-26px); } #AboutHero_root__Ah1 .AboutHero_titleReveal__Ah1.AboutHero_animIn__Ah1.AboutHero_animated__Ah1 { opacity: 1; transform: translateY(0); } @supports (font-size: 1cqi) { /* size against the hero's own width (CMS columns may be narrower than the viewport) */ #AboutHero_root__Ah1 .AboutHero_title__Ah1 { font-size: clamp(min(40px, 13.295cqi), 6.503cqi, 128px) !important; } } /* ---- Principles intro (moved from LeadTeam .LeadTeam_prinHero): content z 10, in normal flow ---- */ #AboutHero_root__Ah1 .AboutHero_content__Ah1 { display: block !important; position: relative !important; z-index: 10 !important; width: 100% !important; margin: 0 !important; /* just below the limb (~50%), over the continuous earth surface */ padding: calc(var(--ah-scene-h) * 0.60) 20px 72px !important; } #AboutHero_root__Ah1 .AboutHero_intro__Ah1 { position: relative !important; display: block !important; width: 100% !important; max-width: 920px !important; margin: 0 auto !important; text-align: center !important; -webkit-font-smoothing: antialiased !important; } /* REF1 secondary line: single spaced uppercase, white, Univia Pro — not the old 3-line italic */ #AboutHero_root__Ah1 .AboutHero_introTitle__Ah1 { display: block !important; margin: 0 0 18px !important; padding: 0 12px !important; font-family: Univia Pro, system-ui, sans-serif !important; font-style: normal !important; font-weight: 400 !important; font-size: clamp(11px, 1.35vw, 15px) !important; line-height: 1.4 !important; letter-spacing: 0.28em !important; text-transform: uppercase !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; text-shadow: none !important; text-align: center !important; white-space: normal !important; } #AboutHero_root__Ah1 .AboutHero_introLine__Ah1 { display: inline !important; } #AboutHero_root__Ah1 .AboutHero_accent__Ah1 { color: #ffffff !important; text-shadow: none !important; } #AboutHero_root__Ah1 .AboutHero_introQuote__Ah1 { display: block !important; margin: 0 auto !important; padding: 0 16px !important; max-width: 560px !important; border: none !important; quotes: none !important; font-family: Univia Pro, system-ui, sans-serif !important; font-style: normal !important; font-weight: 400 !important; font-size: clamp(14px, 1.55vw, 16px) !important; line-height: 1.65 !important; color: rgba(255, 255, 255, 0.72) !important; text-align: center !important; } /* Entry fade (class-based, Section 6): same drop-in as the old DONT / LET / GO words. Hidden only once JS adds animIn, so content stays visible if JS never runs. No !important (Rule #2.5). */ #AboutHero_root__Ah1 .AboutHero_reveal__Ah1 { transition: opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1), transform 0.8s cubic-bezier(0.19, 1, 0.22, 1); } #AboutHero_root__Ah1 .AboutHero_reveal__Ah1.AboutHero_animIn__Ah1 { opacity: 0; transform: translateY(-26px); } #AboutHero_root__Ah1 .AboutHero_reveal__Ah1.AboutHero_animIn__Ah1.AboutHero_animated__Ah1 { opacity: 1; transform: translateY(0); } @media (max-width: 900px) { #AboutHero_root__Ah1 .AboutHero_content__Ah1 { padding-left: 16px !important; padding-right: 16px !important; } } @media (max-width: 600px) { #AboutHero_root__Ah1 .AboutHero_content__Ah1 { padding-bottom: 56px !important; } #AboutHero_root__Ah1 .AboutHero_introTitle__Ah1 { font-size: clamp(10px, 2.8vw, 12px) !important; letter-spacing: 0.18em !important; padding: 0 8px !important; } } @media (prefers-reduced-motion: reduce) { #AboutHero_root__Ah1 .AboutHero_reveal__Ah1, #AboutHero_root__Ah1 .AboutHero_reveal__Ah1.AboutHero_animIn__Ah1, #AboutHero_root__Ah1 .AboutHero_titleReveal__Ah1, #AboutHero_root__Ah1 .AboutHero_titleReveal__Ah1.AboutHero_animIn__Ah1 { transition: none !important; opacity: 1 !important; transform: none !important; } } /* ---- Pause all hero loops while off-screen / tab hidden (class toggled by JS, Section 5.1 / 14.3) ---- */ #AboutHero_root__Ah1.AboutHero_paused__Ah1 .AboutHero_stars__Ah1, #AboutHero_root__Ah1.AboutHero_paused__Ah1 .AboutHero_stars2__Ah1, #AboutHero_root__Ah1.AboutHero_paused__Ah1 .AboutHero_stars3__Ah1 { animation-play-state: paused !important; will-change: auto !important; } /* ---- Ambient loops (not entry animations; base state is fully visible if keyframes never run) ---- */ @keyframes AboutHero_animStar__Ah1 { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(0, -2000px, 0); } } /* ===== END ABOUT HERO ===== */ @media (max-width: 359px) { #AboutHero_root__Ah1 .AboutHero_title__Ah1 { font-size: clamp(min(34px, 10.8vw), 6.503vw, 128px) !important; } #AboutHero_root__Ah1 .AboutHero_content__Ah1 { padding-left: 12px !important; padding-right: 12px !important; } } /* R5B GPU: isolate the scene so star/blur layers repaint only inside it (scene already overflow:hidden, no visual change) */ #AboutHero_root__Ah1 .AboutHero_scene__Ah1 { contain: paint; } /* R6: fade the globe into pure black over the last quarter of the hero so there is no seam where the next module starts. Static gradient overlay (no animation, no repaint cost). */ #AboutHero_root__Ah1 .AboutHero_scene__Ah1::after { content: ' ' !important; display: block !important; position: absolute !important; left: 0 !important; right: 0 !important; bottom: 0 !important; z-index: 6 !important; height: 28% !important; pointer-events: none !important; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 45%, #000000 100%) !important; } /* LeadTeam RenderBox module — Univia Pro self-hosted via Destintel absolute URLs */ @font-face { font-family: Univia Pro; font-style: normal; font-weight: 300; font-display: swap; src: url(https://destintel.com/folder/font/UniviaPro/UniviaPro-Light.otf); } @font-face { font-family: Univia Pro; font-style: normal; font-weight: 400; font-display: swap; src: url(https://destintel.com/folder/font/UniviaPro/UniviaPro-Regular.otf); } @font-face { font-family: Univia Pro; font-style: normal; font-weight: 500; font-display: swap; src: url(https://destintel.com/folder/font/UniviaPro/UniviaPro-Medium.otf); } @font-face { font-family: Univia Pro; font-style: italic; font-weight: 500; font-display: swap; src: url(https://destintel.com/folder/font/UniviaPro/UniviaPro-MediumItalic.otf); } @font-face { font-family: Univia Pro; font-style: normal; font-weight: 700; font-display: swap; src: url(https://destintel.com/folder/font/UniviaPro/UniviaPro-Bold.otf); } @font-face { font-family: Univia Pro; font-style: italic; font-weight: 700; font-display: swap; src: url(https://destintel.com/folder/font/UniviaPro/UniviaPro-BoldItalic.otf); } /* Scoped reset — box-sizing only; avoid blanket margin/padding zero that breaks layout */ #LeadTeam_root__Lt9K2, #LeadTeam_root__Lt9K2 * { box-sizing: border-box !important; } #LeadTeam_root__Lt9K2 { position: relative !important; display: block !important; width: 100% !important; max-width: 100% !important; min-height: 100vh !important; min-height: 100dvh !important; margin: 0 !important; padding: 0 !important; padding-left: env(safe-area-inset-left, 0px) !important; padding-right: env(safe-area-inset-right, 0px) !important; padding-bottom: env(safe-area-inset-bottom, 0px) !important; background: #000000 !important; background-color: #000000 !important; font: normal 14px/1.618em Univia Pro, system-ui, sans-serif !important; -webkit-font-smoothing: antialiased !important; color: #ffffff !important; /* Rule #9: NO overflow-x:hidden on root */ } #LeadTeam_root__Lt9K2 ::selection { background: #4f8cff !important; color: #070b14 !important; } /* Ambient layer — absolute inset 0 on relative root (NOT fixed) */ #LeadTeam_root__Lt9K2 .LeadTeam_bgAmbient__Lt9K2 { position: absolute !important; inset: 0 !important; z-index: 0 !important; pointer-events: none !important; overflow: hidden !important; } #LeadTeam_root__Lt9K2 .LeadTeam_bgFluid__Lt9K2 { display: block !important; position: absolute !important; inset: 0 !important; z-index: 1 !important; overflow: hidden !important; } #LeadTeam_root__Lt9K2 .LeadTeam_bgFluidCanvas__Lt9K2 { display: block !important; width: 100% !important; height: 100% !important; opacity: 0.92; } #LeadTeam_root__Lt9K2 .LeadTeam_orb__Lt9K2 { position: absolute !important; z-index: 0 !important; border-radius: 50% !important; filter: blur(80px) !important; opacity: 0.18; transform: translate3d(0, 0, 0); will-change: transform; mix-blend-mode: screen; } #LeadTeam_root__Lt9K2 .LeadTeam_orb1__Lt9K2 { width: 420px !important; height: 420px !important; left: -8% !important; top: -6% !important; background: radial-gradient(circle, rgba(79, 140, 255, 0.75) 0%, transparent 68%) !important; animation: LeadTeam_orbDrift1__Lt9K2 28s ease-in-out infinite alternate; } #LeadTeam_root__Lt9K2 .LeadTeam_orb2__Lt9K2 { width: 480px !important; height: 480px !important; right: -10% !important; top: -4% !important; background: radial-gradient(circle, rgba(79, 140, 255, 0.55) 0%, transparent 68%) !important; animation: LeadTeam_orbDrift2__Lt9K2 34s ease-in-out infinite alternate; } #LeadTeam_root__Lt9K2 .LeadTeam_orb3__Lt9K2 { width: 520px !important; height: 520px !important; right: 5% !important; bottom: -12% !important; background: radial-gradient(circle, rgba(79, 140, 255, 0.65) 0%, transparent 68%) !important; animation: LeadTeam_orbDrift3__Lt9K2 32s ease-in-out infinite alternate; } #LeadTeam_root__Lt9K2 .LeadTeam_orb4__Lt9K2 { width: 380px !important; height: 380px !important; left: 5% !important; bottom: -8% !important; background: radial-gradient(circle, rgba(79, 140, 255, 0.45) 0%, transparent 68%) !important; animation: LeadTeam_orbDrift4__Lt9K2 26s ease-in-out infinite alternate; } #LeadTeam_root__Lt9K2 .LeadTeam_orb5__Lt9K2 { width: 300px !important; height: 300px !important; left: 42% !important; top: 38% !important; background: radial-gradient(circle, rgba(79, 140, 255, 0.35) 0%, transparent 68%) !important; opacity: 0.12; animation: LeadTeam_orbDrift5__Lt9K2 30s ease-in-out infinite alternate; } @keyframes LeadTeam_orbDrift1__Lt9K2 { 0% { transform: translate(0, 0) scale(1); } 100% { transform: translate(12%, 18%) scale(1.12); } } @keyframes LeadTeam_orbDrift2__Lt9K2 { 0% { transform: translate(0, 0) scale(1); } 100% { transform: translate(-14%, 12%) scale(1.08); } } @keyframes LeadTeam_orbDrift3__Lt9K2 { 0% { transform: translate(0, 0) scale(1.05); } 100% { transform: translate(-10%, -16%) scale(1); } } @keyframes LeadTeam_orbDrift4__Lt9K2 { 0% { transform: translate(0, 0) scale(1); } 100% { transform: translate(16%, -10%) scale(1.15); } } @keyframes LeadTeam_orbDrift5__Lt9K2 { 0% { transform: translate(0, 0) scale(1); } 100% { transform: translate(-8%, 10%) scale(1.2); } } /* Pause infinite orb drifts when section off-screen or tab hidden (JS toggles LeadTeam_paused__Lt9K2) */ #LeadTeam_root__Lt9K2.LeadTeam_paused__Lt9K2 .LeadTeam_orb__Lt9K2 { animation-play-state: paused !important; will-change: auto !important; } @media (prefers-reduced-motion: reduce) { #LeadTeam_root__Lt9K2 .LeadTeam_orb__Lt9K2 { animation: none !important; } #LeadTeam_root__Lt9K2 .LeadTeam_bgFluidCanvas__Lt9K2 { opacity: 0.9; } #LeadTeam_root__Lt9K2 .LeadTeam_anim__Lt9K2 { opacity: 1; transform: none; transition: none !important; } #LeadTeam_root__Lt9K2 .LeadTeam_anim__Lt9K2.LeadTeam_animated__Lt9K2 { opacity: 1; transform: none; } } /* Page hero */ #LeadTeam_root__Lt9K2 .LeadTeam_pageHero__Lt9K2 { position: relative !important; z-index: 1 !important; text-align: center !important; padding: 48px 16px 28px !important; max-width: 720px !important; margin: 0 auto !important; width: 100% !important; } /* Class-based hero entrance — NO !important on opacity/transform (animated) */ #LeadTeam_root__Lt9K2 .LeadTeam_anim__Lt9K2 { opacity: 0; transform: translateY(40px); transition: opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1), transform 0.8s cubic-bezier(0.19, 1, 0.22, 1); } #LeadTeam_root__Lt9K2 .LeadTeam_anim__Lt9K2.LeadTeam_animated__Lt9K2 { opacity: 1; transform: translateY(0); } #LeadTeam_root__Lt9K2 .LeadTeam_prinTag__Lt9K2.LeadTeam_anim__Lt9K2 { transition-delay: 0.26s; } #LeadTeam_root__Lt9K2 .LeadTeam_prinHeading__Lt9K2.LeadTeam_anim__Lt9K2 { transition-delay: 0.34s; } #LeadTeam_root__Lt9K2 .LeadTeam_prinGrid__Lt9K2 .LeadTeam_prinCard__Lt9K2.LeadTeam_anim__Lt9K2:nth-child(1) { transition-delay: 0.42s; } #LeadTeam_root__Lt9K2 .LeadTeam_prinGrid__Lt9K2 .LeadTeam_prinCard__Lt9K2.LeadTeam_anim__Lt9K2:nth-child(2) { transition-delay: 0.52s; } #LeadTeam_root__Lt9K2 .LeadTeam_prinGrid__Lt9K2 .LeadTeam_prinCard__Lt9K2.LeadTeam_anim__Lt9K2:nth-child(3) { transition-delay: 0.62s; } #LeadTeam_root__Lt9K2 .LeadTeam_pageTagline__Lt9K2.LeadTeam_anim__Lt9K2 { transition-delay: 0.72s; } #LeadTeam_root__Lt9K2 .LeadTeam_pageTitle__Lt9K2.LeadTeam_anim__Lt9K2 { transition-delay: 0.82s; } #LeadTeam_root__Lt9K2 .LeadTeam_pageSub__Lt9K2.LeadTeam_anim__Lt9K2 { transition-delay: 0.92s; } #LeadTeam_root__Lt9K2 .LeadTeam_pageTagline__Lt9K2 { display: inline-flex !important; align-items: center !important; gap: 10px !important; margin-bottom: 18px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_pageTaglineDot__Lt9K2 { width: 6px !important; height: 6px !important; border-radius: 50% !important; background: #4f8cff !important; box-shadow: 0 0 12px rgba(79, 140, 255, 0.65) !important; flex-shrink: 0 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_pageTaglineText__Lt9K2 { font-family: Univia Pro, system-ui, sans-serif !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: 0.25em !important; text-transform: uppercase !important; color: rgba(159, 184, 220, 0.9) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_pageTitle__Lt9K2 { margin: 0 0 14px !important; padding: 0 !important; font-family: Univia Pro, system-ui, sans-serif !important; font-style: italic !important; font-weight: 700 !important; font-size: clamp(40px, 7vw, 72px) !important; line-height: 1.08 !important; letter-spacing: -0.02em !important; color: #4f8cff !important; text-shadow: 0 0 24px rgba(79, 140, 255, 0.55), 0 0 48px rgba(79, 140, 255, 0.28) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_pageTitleLine__Lt9K2 { display: inline-block !important; } #LeadTeam_root__Lt9K2 .LeadTeam_pageSub__Lt9K2 { margin: 0 !important; padding: 0 8px !important; font-family: Univia Pro, system-ui, sans-serif !important; font-size: 15px !important; line-height: 1.55 !important; color: rgba(255, 255, 255, 0.55) !important; } /* Grid */ #LeadTeam_root__Lt9K2 .LeadTeam_grid__Lt9K2 { position: relative !important; z-index: 1 !important; display: grid !important; grid-template-columns: 1fr 1fr !important; align-items: stretch !important; gap: 20px !important; padding: 0 16px 32px !important; max-width: 1200px !important; margin: 0 auto !important; width: 100% !important; } /* Stage cells */ #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2 { --delay: 0s; --accent: #4f8cff; --accent-mid: #7ca6ff; --accent-glow: rgba(79, 140, 255, 0.55); position: relative !important; overflow: hidden !important; height: min(85vh, 820px) !important; min-height: min(85vh, 820px) !important; max-width: 100% !important; width: 100% !important; background: transparent !important; border: none !important; box-shadow: none !important; font: normal 14px/1.618em Univia Pro, system-ui, sans-serif !important; -webkit-font-smoothing: antialiased !important; border-radius: 0 !important; transform: none; rotate: none; transition: transform 0.55s cubic-bezier(0.19, 1, 0.22, 1); will-change: auto; touch-action: pan-y; overscroll-behavior: auto; -webkit-tap-highlight-color: transparent; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2:active { transform: translateY(-2px) scale(0.995); } #LeadTeam_root__Lt9K2 .LeadTeam_stageFarhad__Lt9K2 { --delay: 0s; --accent: #4f8cff; --accent-mid: #7ca6ff; --accent-glow: rgba(79, 140, 255, 0.6); --scene-url: url(&quot;https://destintel.com/files/assets/1790892756_scene-farhad.jpg&quot;); } #LeadTeam_root__Lt9K2 .LeadTeam_stageMohsen__Lt9K2 { --delay: 0.35s; --accent: #4f8cff; --accent-mid: #7ca6ff; --accent-glow: rgba(79, 140, 255, 0.6); --scene-url: url(&quot;https://destintel.com/files/assets/1790892756_scene-mohsen.jpg&quot;); } #LeadTeam_root__Lt9K2 .LeadTeam_stageAlireza__Lt9K2 { --delay: 0.7s; --accent: #4f8cff; --accent-mid: #7ca6ff; --accent-glow: rgba(79, 140, 255, 0.6); --scene-url: url(&quot;https://destintel.com/files/assets/1790892756_scene-alireza.jpg&quot;); } #LeadTeam_root__Lt9K2 .LeadTeam_stageMonir__Lt9K2 { --delay: 1.05s; --accent: #4f8cff; --accent-mid: #7ca6ff; --accent-glow: rgba(79, 140, 255, 0.6); --scene-url: url(&quot;https://destintel.com/files/assets/1790892756_scene-monir.jpg&quot;); } #LeadTeam_root__Lt9K2 .LeadTeam_cardName__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_cardRole__Lt9K2 { font-weight: 500 !important; margin: 0 0 5px 0 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardName__Lt9K2 { font-size: clamp(18px, 2.2vw, 22px) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardRole__Lt9K2 { font-size: clamp(12px, 1.5vw, 15px) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_bioText__Lt9K2 { margin: 0 !important; font-family: Univia Pro, system-ui, sans-serif !important; } /* Profile card — final size/glass from the start, hidden until the blue fill has finished growing over it (3.2s + delay); then the fill fades to reveal it. No layout animation. */ #LeadTeam_root__Lt9K2 .LeadTeam_profileCard__Lt9K2 { position: absolute !important; top: 3% !important; left: 3% !important; width: 94% !important; height: 94% !important; margin: 0 !important; z-index: 2 !important; overflow: hidden !important; background-color: rgba(12, 18, 32, 0.28) !important; background-image: linear-gradient(180deg, rgba(7, 11, 20, 0.22) 0%, rgba(7, 11, 20, 0.38) 100%), var(--scene-url) !important; background-size: cover !important; background-position: center center !important; background-repeat: no-repeat !important; -webkit-backdrop-filter: blur(18px) saturate(115%); backdrop-filter: blur(18px) saturate(115%); -webkit-border-radius: 22px !important; border-radius: 22px !important; border: 1px solid rgba(255, 255, 255, 0); -webkit-box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4), 0 0 24px var(--accent-glow), inset 0 1px 0 rgba(255, 255, 255, 0.2); box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4), 0 0 24px var(--accent-glow), inset 0 1px 0 rgba(255, 255, 255, 0.2); -webkit-filter: none; filter: none; opacity: 0; -webkit-clip-path: inset(0 round 22px); clip-path: inset(0 round 22px); transform: none; transition: box-shadow 0.4s ease, border-color 0.4s ease; -webkit-animation: none; animation: none; touch-action: pan-y; overscroll-behavior: auto; } /* Morph runs only after the stage's own IntersectionObserver adds LeadTeam_morphGo__Lt9K2 */ #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_profileCard__Lt9K2 { -webkit-animation: LeadTeam_cardShow__Lt9K2 0.01s calc(3.2s + var(--delay)) linear forwards, LeadTeam_cardBorderIn__Lt9K2 0.6s calc(3.6s + var(--delay)) ease forwards; animation: LeadTeam_cardShow__Lt9K2 0.01s calc(3.2s + var(--delay)) linear forwards, LeadTeam_cardBorderIn__Lt9K2 0.6s calc(3.6s + var(--delay)) ease forwards; } /* Blue fill: the shape's solid accent blue (same as the dot) grows from the dot outline to the full card via clip-path, stays fully opaque for the whole expansion, then fades out over the finished card. Separate layer above the card: no border, no shadow, no backdrop-filter. */ #LeadTeam_root__Lt9K2 .LeadTeam_morphFill__Lt9K2 { position: absolute !important; display: block !important; top: 3% !important; left: 3% !important; width: 94% !important; height: 94% !important; margin: 0 !important; padding: 0 !important; z-index: 3 !important; pointer-events: none !important; background: var(--accent) !important; -webkit-border-radius: 22px !important; border-radius: 22px !important; border: none !important; box-shadow: none !important; opacity: 0; -webkit-clip-path: inset(calc(50% - 28px) calc(50% - 28px) round 28px); clip-path: inset(calc(50% - 28px) calc(50% - 28px) round 28px); -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-animation: none; animation: none; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_morphFill__Lt9K2 { -webkit-animation: LeadTeam_revealCircle__Lt9K2 0.5s calc(2.7s + var(--delay)) cubic-bezier(0.86, 0, 0.07, 1) forwards, LeadTeam_fillOut__Lt9K2 0.6s calc(3.2s + var(--delay)) ease forwards; animation: LeadTeam_revealCircle__Lt9K2 0.5s calc(2.7s + var(--delay)) cubic-bezier(0.86, 0, 0.07, 1) forwards, LeadTeam_fillOut__Lt9K2 0.6s calc(3.2s + var(--delay)) ease forwards; } /* Travelling dot (init / moveDown / moveUp): transform + opacity only, on its own track layer */ #LeadTeam_root__Lt9K2 .LeadTeam_morphTrack__Lt9K2 { position: absolute !important; inset: 0 !important; z-index: 4 !important; display: block !important; margin: 0 !important; padding: 0 !important; pointer-events: none !important; transform: translateY(0); -webkit-animation: none; animation: none; } #LeadTeam_root__Lt9K2 .LeadTeam_morphDot__Lt9K2 { position: absolute !important; display: block !important; top: 50% !important; left: 50% !important; width: 56px !important; height: 56px !important; margin: -28px 0 0 -28px !important; padding: 0 !important; background: var(--accent) !important; -webkit-border-radius: 50%; border-radius: 50%; -webkit-box-shadow: 0 0 22px var(--accent-glow), 0 4px 12px rgba(0, 0, 0, 0.35); box-shadow: 0 0 22px var(--accent-glow), 0 4px 12px rgba(0, 0, 0, 0.35); opacity: 0; transform: translateY(70px) scale(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-animation: none; animation: none; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_morphTrack__Lt9K2 { -webkit-animation: LeadTeam_moveDown__Lt9K2 1s calc(0.8s + var(--delay)) cubic-bezier(0.6, -0.28, 0.735, 0.045) forwards, LeadTeam_moveUp__Lt9K2 1s calc(1.8s + var(--delay)) cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; animation: LeadTeam_moveDown__Lt9K2 1s calc(0.8s + var(--delay)) cubic-bezier(0.6, -0.28, 0.735, 0.045) forwards, LeadTeam_moveUp__Lt9K2 1s calc(1.8s + var(--delay)) cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_morphDot__Lt9K2 { -webkit-animation: LeadTeam_init__Lt9K2 0.5s calc(0.2s + var(--delay)) cubic-bezier(0.55, 0.055, 0.675, 0.19) forwards, LeadTeam_dotOut__Lt9K2 0.15s calc(2.7s + var(--delay)) linear forwards; animation: LeadTeam_init__Lt9K2 0.5s calc(0.2s + var(--delay)) cubic-bezier(0.55, 0.055, 0.675, 0.19) forwards, LeadTeam_dotOut__Lt9K2 0.15s calc(2.7s + var(--delay)) linear forwards; } /* GPU hints only while a stage is animating (class added/removed by JS) */ #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_animating__Lt9K2 .LeadTeam_morphTrack__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_animating__Lt9K2 .LeadTeam_morphDot__Lt9K2 { will-change: transform, opacity; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_animating__Lt9K2 .LeadTeam_morphFill__Lt9K2 { will-change: clip-path, opacity; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_animating__Lt9K2 .LeadTeam_profileCard__Lt9K2 { will-change: opacity; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_animating__Lt9K2 .LeadTeam_cardHeader__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_animating__Lt9K2 .LeadTeam_profileBio__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_animating__Lt9K2 .LeadTeam_profileSocial__Lt9K2 { will-change: transform, opacity; } #LeadTeam_root__Lt9K2 .LeadTeam_stageBg__Lt9K2 { position: absolute !important; inset: 0 !important; z-index: 0 !important; background-repeat: no-repeat !important; background-position: center center !important; background-size: cover !important; opacity: 0; pointer-events: none !important; transform: scale(1.02); transition: transform 3.5s ease; -webkit-animation: none; animation: none; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_stageBg__Lt9K2 { -webkit-animation: LeadTeam_bgFadeIn__Lt9K2 1.2s calc(2.8s + var(--delay)) ease forwards; animation: LeadTeam_bgFadeIn__Lt9K2 1.2s calc(2.8s + var(--delay)) ease forwards; } /* Settled lock: scenes always visible even if CMS kills keyframes mid-way */ #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_settled__Lt9K2 .LeadTeam_stageBg__Lt9K2 { opacity: 0.9 !important; -webkit-animation: none !important; animation: none !important; transform: scale(1.02) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_stageBg__Lt9K2::after { content: &quot;&quot; !important; position: absolute !important; inset: 0 !important; background: rgba(7, 11, 20, 0.42) !important; pointer-events: none !important; } #LeadTeam_root__Lt9K2 .LeadTeam_stageFarhad__Lt9K2 .LeadTeam_stageBg__Lt9K2 { background-image: url(&quot;https://destintel.com/files/assets/1790892756_scene-farhad.jpg&quot;) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_stageMonir__Lt9K2 .LeadTeam_stageBg__Lt9K2 { background-image: url(&quot;https://destintel.com/files/assets/1790892756_scene-monir.jpg&quot;) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_stageAlireza__Lt9K2 .LeadTeam_stageBg__Lt9K2 { background-image: url(&quot;https://destintel.com/files/assets/1790892756_scene-alireza.jpg&quot;) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_stageMohsen__Lt9K2 .LeadTeam_stageBg__Lt9K2 { background-image: url(&quot;https://destintel.com/files/assets/1790892756_scene-mohsen.jpg&quot;) !important; } /* Per-shape dot outline + matching blue-fill clip-path reveal (same vertex count start -> end, so it interpolates) */ #LeadTeam_root__Lt9K2 .LeadTeam_stageMonir__Lt9K2 .LeadTeam_morphDot__Lt9K2 { -webkit-border-radius: 8px; border-radius: 8px; } #LeadTeam_root__Lt9K2 .LeadTeam_stageAlireza__Lt9K2 .LeadTeam_morphDot__Lt9K2 { -webkit-border-radius: 0; border-radius: 0; -webkit-clip-path: polygon(50% 4%, 4% 96%, 96% 96%); clip-path: polygon(50% 4%, 4% 96%, 96% 96%); -webkit-box-shadow: none; box-shadow: none; -webkit-filter: drop-shadow(0 0 18px var(--accent-glow)) drop-shadow(0 4px 12px rgba(0, 0, 0, 0.4)); filter: drop-shadow(0 0 18px var(--accent-glow)) drop-shadow(0 4px 12px rgba(0, 0, 0, 0.4)); } #LeadTeam_root__Lt9K2 .LeadTeam_stageMohsen__Lt9K2 .LeadTeam_morphDot__Lt9K2 { -webkit-border-radius: 0; border-radius: 0; -webkit-clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%); clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%); -webkit-box-shadow: none; box-shadow: none; -webkit-filter: drop-shadow(0 0 18px var(--accent-glow)) drop-shadow(0 4px 12px rgba(0, 0, 0, 0.4)); filter: drop-shadow(0 0 18px var(--accent-glow)) drop-shadow(0 4px 12px rgba(0, 0, 0, 0.4)); } #LeadTeam_root__Lt9K2 .LeadTeam_stageMonir__Lt9K2 .LeadTeam_morphFill__Lt9K2 { -webkit-clip-path: inset(calc(50% - 28px) calc(50% - 28px) round 8px); clip-path: inset(calc(50% - 28px) calc(50% - 28px) round 8px); } #LeadTeam_root__Lt9K2 .LeadTeam_stageAlireza__Lt9K2 .LeadTeam_morphFill__Lt9K2 { -webkit-clip-path: polygon(50% calc(50% - 25.76px), calc(50% - 25.76px) calc(50% + 25.76px), calc(50% + 25.76px) calc(50% + 25.76px), 50% calc(50% - 25.76px)); clip-path: polygon(50% calc(50% - 25.76px), calc(50% - 25.76px) calc(50% + 25.76px), calc(50% + 25.76px) calc(50% + 25.76px), 50% calc(50% - 25.76px)); } #LeadTeam_root__Lt9K2 .LeadTeam_stageMohsen__Lt9K2 .LeadTeam_morphFill__Lt9K2 { -webkit-clip-path: polygon(50% calc(50% - 28px), calc(50% + 24.08px) calc(50% - 14px), calc(50% + 24.08px) calc(50% + 14px), 50% calc(50% + 28px), calc(50% - 24.08px) calc(50% + 14px), calc(50% - 24.08px) calc(50% - 14px)); clip-path: polygon(50% calc(50% - 28px), calc(50% + 24.08px) calc(50% - 14px), calc(50% + 24.08px) calc(50% + 14px), 50% calc(50% + 28px), calc(50% - 24.08px) calc(50% + 14px), calc(50% - 24.08px) calc(50% - 14px)); } #LeadTeam_root__Lt9K2 .LeadTeam_stageMonir__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_morphFill__Lt9K2 { -webkit-animation: LeadTeam_revealSquare__Lt9K2 0.5s calc(2.7s + var(--delay)) cubic-bezier(0.86, 0, 0.07, 1) forwards, LeadTeam_fillOut__Lt9K2 0.6s calc(3.2s + var(--delay)) ease forwards; animation: LeadTeam_revealSquare__Lt9K2 0.5s calc(2.7s + var(--delay)) cubic-bezier(0.86, 0, 0.07, 1) forwards, LeadTeam_fillOut__Lt9K2 0.6s calc(3.2s + var(--delay)) ease forwards; } #LeadTeam_root__Lt9K2 .LeadTeam_stageAlireza__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_morphFill__Lt9K2 { -webkit-animation: LeadTeam_revealTriangle__Lt9K2 0.5s calc(2.7s + var(--delay)) cubic-bezier(0.86, 0, 0.07, 1) forwards, LeadTeam_fillOut__Lt9K2 0.6s calc(3.2s + var(--delay)) ease forwards; animation: LeadTeam_revealTriangle__Lt9K2 0.5s calc(2.7s + var(--delay)) cubic-bezier(0.86, 0, 0.07, 1) forwards, LeadTeam_fillOut__Lt9K2 0.6s calc(3.2s + var(--delay)) ease forwards; } #LeadTeam_root__Lt9K2 .LeadTeam_stageMohsen__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_morphFill__Lt9K2 { -webkit-animation: LeadTeam_revealHex__Lt9K2 0.5s calc(2.7s + var(--delay)) cubic-bezier(0.86, 0, 0.07, 1) forwards, LeadTeam_fillOut__Lt9K2 0.6s calc(3.2s + var(--delay)) ease forwards; animation: LeadTeam_revealHex__Lt9K2 0.5s calc(2.7s + var(--delay)) cubic-bezier(0.86, 0, 0.07, 1) forwards, LeadTeam_fillOut__Lt9K2 0.6s calc(3.2s + var(--delay)) ease forwards; } /* Settled lock (per card, 4.2s + its delay): final glass tile even if keyframes were interrupted */ #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_settled__Lt9K2 .LeadTeam_profileCard__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stageMonir__Lt9K2.LeadTeam_settled__Lt9K2 .LeadTeam_profileCard__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stageAlireza__Lt9K2.LeadTeam_settled__Lt9K2 .LeadTeam_profileCard__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stageMohsen__Lt9K2.LeadTeam_settled__Lt9K2 .LeadTeam_profileCard__Lt9K2 { opacity: 1 !important; border-color: rgba(255, 255, 255, 0.22) !important; -webkit-clip-path: inset(0 round 22px) !important; clip-path: inset(0 round 22px) !important; -webkit-animation: none !important; animation: none !important; will-change: auto !important; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_settled__Lt9K2 .LeadTeam_morphTrack__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_settled__Lt9K2 .LeadTeam_morphFill__Lt9K2 { display: none !important; -webkit-animation: none !important; animation: none !important; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_settled__Lt9K2 .LeadTeam_cardHeader__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_settled__Lt9K2 .LeadTeam_profileBio__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_settled__Lt9K2 .LeadTeam_profileSocial__Lt9K2 { opacity: 1 !important; margin-top: 0 !important; -webkit-transform: none !important; transform: none !important; will-change: auto !important; -webkit-animation: none !important; animation: none !important; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_settled__Lt9K2 .LeadTeam_avatarLink__Lt9K2::after { -webkit-transform: scale(1) !important; transform: scale(1) !important; -webkit-animation: none !important; animation: none !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardContent__Lt9K2 { position: relative !important; z-index: 1 !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; height: 100% !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; padding: 36px 28px 28px !important; /* Default: NOT a scroll container — wheel/touch pass through to page */ overflow: visible !important; overscroll-behavior: auto; touch-action: pan-y; scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, 0.25) transparent; } #LeadTeam_root__Lt9K2 .LeadTeam_profileCard__Lt9K2:has(.LeadTeam_profileBio__Lt9K2.LeadTeam_isExpanded__Lt9K2) .LeadTeam_cardContent__Lt9K2 { justify-content: flex-start !important; overflow-x: hidden !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; touch-action: pan-y; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 { width: auto !important; height: auto !important; padding: 0 0 16px !important; display: block !important; float: none !important; border-right: none !important; background: transparent !important; color: #ffffff !important; transform: translateY(50px); opacity: 0; text-align: center !important; border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important; flex-shrink: 0 !important; -webkit-animation: none; animation: none; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_cardHeader__Lt9K2 { -webkit-animation: LeadTeam_moveIn__Lt9K2 1s calc(3.1s + var(--delay)) ease forwards; animation: LeadTeam_moveIn__Lt9K2 1s calc(3.1s + var(--delay)) ease forwards; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 .LeadTeam_cardName__Lt9K2 { font-family: Univia Pro, system-ui, sans-serif !important; font-weight: 700 !important; letter-spacing: -0.02em !important; color: #ffffff !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 .LeadTeam_cardRole__Lt9K2 { font-family: Univia Pro, system-ui, sans-serif !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: 0.06em !important; text-transform: none !important; color: #4f8cff !important; line-height: 1.4 !important; max-width: 34em !important; margin-left: auto !important; margin-right: auto !important; white-space: normal !important; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarLink__Lt9K2 { display: inline-block !important; text-align: center !important; position: relative !important; margin: 12px 24px 14px !important; text-decoration: none !important; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarLink__Lt9K2::after { position: absolute !important; content: &quot;&quot; !important; bottom: -2px !important; right: -2px !important; width: 20px !important; height: 20px !important; border: 4px solid rgba(7, 11, 20, 0.7) !important; -webkit-transform: scale(0); transform: scale(0); background: linear-gradient(#4f8cff 0%, #4f8cff 50%, #7ca6ff 50%, #7ca6ff 100%) !important; -webkit-border-radius: 50%; border-radius: 50%; box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3) !important; -webkit-animation: none; animation: none; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_avatarLink__Lt9K2::after { -webkit-animation: LeadTeam_scaleIn__Lt9K2 0.3s calc(3.5s + var(--delay)) ease forwards; animation: LeadTeam_scaleIn__Lt9K2 0.3s calc(3.5s + var(--delay)) ease forwards; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarPhoto__Lt9K2 { width: clamp(120px, 16vw, 140px) !important; height: clamp(120px, 16vw, 140px) !important; max-width: 100% !important; -webkit-border-radius: 14px; border-radius: 14px; object-fit: cover !important; object-position: center top !important; display: block !important; transition: box-shadow 0.3s ease; box-shadow: 0px 0px 0px 8px rgba(255, 255, 255, 0.12) !important; border: 1px solid rgba(255, 255, 255, 0.28) !important; background: rgba(255, 255, 255, 0.06) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_profileBio__Lt9K2 { width: auto !important; height: auto !important; padding: 18px 8px 12px !important; display: block !important; float: none !important; background: transparent !important; color: rgba(255, 255, 255, 0.8) !important; transform: translateY(50px); text-align: left !important; opacity: 0; max-width: 420px !important; -webkit-animation: none; animation: none; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_profileBio__Lt9K2 { -webkit-animation: LeadTeam_moveIn__Lt9K2 1s calc(3.1s + var(--delay)) ease forwards; animation: LeadTeam_moveIn__Lt9K2 1s calc(3.1s + var(--delay)) ease forwards; } #LeadTeam_root__Lt9K2 .LeadTeam_bioText__Lt9K2 { font-family: Univia Pro, system-ui, sans-serif !important; font-size: clamp(13px, 1.6vw, 14px) !important; line-height: 1.6 !important; color: rgba(255, 255, 255, 0.82) !important; display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 5; line-clamp: 5; overflow: hidden !important; text-overflow: ellipsis !important; word-wrap: break-word !important; overflow-wrap: break-word !important; } #LeadTeam_root__Lt9K2 .LeadTeam_profileBio__Lt9K2.LeadTeam_isExpanded__Lt9K2 .LeadTeam_bioText__Lt9K2 { display: block !important; -webkit-line-clamp: unset; line-clamp: unset; overflow: visible !important; } #LeadTeam_root__Lt9K2 .LeadTeam_profileBio__Lt9K2.LeadTeam_isExpanded__Lt9K2 { overflow-y: visible !important; max-height: none !important; } #LeadTeam_root__Lt9K2 .LeadTeam_readMoreBtn__Lt9K2 { display: inline-flex !important; align-items: center !important; justify-content: center !important; margin-top: 10px !important; min-height: 36px !important; padding: 8px 16px !important; font-family: Univia Pro, system-ui, sans-serif !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0.02em !important; color: rgba(255, 255, 255, 0.78) !important; background: rgba(255, 255, 255, 0.08) !important; border: 1px solid rgba(255, 255, 255, 0.18) !important; border-radius: 999px !important; cursor: pointer !important; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); -webkit-tap-highlight-color: transparent; touch-action: manipulation; transition: background 0.28s cubic-bezier(0.19, 1, 0.22, 1), color 0.28s cubic-bezier(0.19, 1, 0.22, 1), border-color 0.28s cubic-bezier(0.19, 1, 0.22, 1); } #LeadTeam_root__Lt9K2 .LeadTeam_readMoreBtn__Lt9K2:active { color: #4f8cff !important; background: rgba(79, 140, 255, 0.12) !important; border-color: rgba(79, 140, 255, 0.4) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_readMoreBtn__Lt9K2:focus-visible { outline: 2px solid rgba(79, 140, 255, 0.55) !important; outline-offset: 2px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_profileSocial__Lt9K2 { width: 100% !important; display: block !important; float: none !important; margin: 0 !important; padding: 10px 8px 8px !important; background: transparent !important; transform: translateY(50px); text-align: center !important; opacity: 0; box-sizing: border-box !important; flex-shrink: 0 !important; -webkit-animation: none; animation: none; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_profileSocial__Lt9K2 { -webkit-animation: LeadTeam_moveIn__Lt9K2 1s calc(3.1s + var(--delay)) ease forwards; animation: LeadTeam_moveIn__Lt9K2 1s calc(3.1s + var(--delay)) ease forwards; } #LeadTeam_root__Lt9K2 .LeadTeam_socialItem__Lt9K2 { list-style: none !important; margin: -5px 0 0 0 !important; padding: 0 !important; display: inline-block !important; width: auto !important; text-align: center !important; } #LeadTeam_root__Lt9K2 .LeadTeam_socialLink__Lt9K2 { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; color: rgba(255, 255, 255, 0.9) !important; width: auto !important; height: auto !important; padding: 7px 14px !important; position: relative !important; overflow: hidden !important; border-radius: 20px !important; text-decoration: none !important; font-size: 12px !important; font-weight: 500 !important; background: rgba(255, 255, 255, 0.1) !important; border: 1px solid rgba(255, 255, 255, 0.2) !important; transition: background 0.2s ease, color 0.2s ease; } #LeadTeam_root__Lt9K2 .LeadTeam_socialLink__Lt9K2:active { background: rgba(255, 255, 255, 0.18) !important; color: #ffffff !important; } #LeadTeam_root__Lt9K2 .LeadTeam_socialIcon__Lt9K2 { width: 18px !important; height: 18px !important; fill: rgba(255, 255, 255, 0.9) !important; } /* Hover enhancements — desktop/trackpad only */ @media (hover: hover) and (pointer: fine) { #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2:hover { transform: translateY(-6px); z-index: 4 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2:hover .LeadTeam_stageBg__Lt9K2 { transform: scale(1.08); } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2:hover .LeadTeam_profileCard__Lt9K2 { border-color: rgba(255, 255, 255, 0.38) !important; -webkit-box-shadow: 0 16px 48px rgba(0, 0, 0, 0.45), 0 0 28px var(--accent-glow), inset 0 1px 0 rgba(255, 255, 255, 0.28) !important; box-shadow: 0 16px 48px rgba(0, 0, 0, 0.45), 0 0 28px var(--accent-glow), inset 0 1px 0 rgba(255, 255, 255, 0.28) !important; } /* R6: shape-specific hover removed — all cards use the shared rule below / in ROUND 6 block */ #LeadTeam_root__Lt9K2 .LeadTeam_avatarLink__Lt9K2:hover &gt; .LeadTeam_avatarPhoto__Lt9K2 { box-shadow: 0px 0px 0px 12px rgba(255, 255, 255, 0.2) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_readMoreBtn__Lt9K2:hover { color: #4f8cff !important; background: rgba(79, 140, 255, 0.12) !important; border-color: rgba(79, 140, 255, 0.4) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_socialLink__Lt9K2:hover { background: rgba(255, 255, 255, 0.18) !important; color: #ffffff !important; } } /* ========== RESPONSIVE ========== */ @media (max-width: 1024px) { #LeadTeam_root__Lt9K2 .LeadTeam_pageHero__Lt9K2 { padding: 32px 16px 22px !important; padding-top: calc(32px + env(safe-area-inset-top, 0px)) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_pageTitle__Lt9K2 { font-size: clamp(36px, 6.5vw, 60px) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_pageSub__Lt9K2 { font-size: 14px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_grid__Lt9K2 { gap: 16px !important; padding: 0 14px 28px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2 { height: min(78vh, 720px) !important; min-height: min(78vh, 720px) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardContent__Lt9K2 { padding: 28px 22px 22px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarPhoto__Lt9K2 { width: clamp(100px, 14vw, 112px) !important; height: clamp(100px, 14vw, 112px) !important; border-radius: 14px !important; -webkit-border-radius: 14px !important; } } @media (max-width: 720px) { #LeadTeam_root__Lt9K2 .LeadTeam_grid__Lt9K2 { grid-template-columns: 1fr !important; gap: 14px !important; padding: 0 12px 24px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_pageHero__Lt9K2 { padding: 28px 14px 18px !important; padding-top: calc(28px + env(safe-area-inset-top, 0px)) !important; max-width: 100% !important; } #LeadTeam_root__Lt9K2 .LeadTeam_pageTagline__Lt9K2 { margin-bottom: 14px !important; gap: 8px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_pageTaglineText__Lt9K2 { font-size: 10px !important; letter-spacing: 0.2em !important; } #LeadTeam_root__Lt9K2 .LeadTeam_pageTitle__Lt9K2 { font-size: clamp(32px, 10vw, 48px) !important; margin-bottom: 10px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_pageSub__Lt9K2 { font-size: 14px !important; padding: 0 4px !important; line-height: 1.5 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2 { height: min(620px, 88dvh) !important; min-height: 480px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardContent__Lt9K2 { padding: 24px 18px 18px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 { padding: 0 0 12px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 .LeadTeam_cardName__Lt9K2 { font-size: clamp(17px, 5vw, 20px) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 .LeadTeam_cardRole__Lt9K2 { font-size: 10px !important; letter-spacing: 0.14em !important; } #LeadTeam_root__Lt9K2 .LeadTeam_profileBio__Lt9K2 { padding: 14px 4px 10px !important; max-width: 100% !important; } #LeadTeam_root__Lt9K2 .LeadTeam_bioText__Lt9K2 { font-size: 13px !important; -webkit-line-clamp: 4; line-clamp: 4; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarPhoto__Lt9K2 { width: 100px !important; height: 100px !important; border-radius: 14px !important; -webkit-border-radius: 14px !important; box-shadow: 0px 0px 0px 6px rgba(255, 255, 255, 0.12) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_readMoreBtn__Lt9K2 { min-height: 44px !important; padding: 10px 18px !important; font-size: 13px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_socialLink__Lt9K2 { min-height: 40px !important; padding: 8px 14px !important; } } @media (max-width: 480px) { #LeadTeam_root__Lt9K2 .LeadTeam_pageHero__Lt9K2 { padding: 22px 12px 14px !important; padding-top: calc(22px + env(safe-area-inset-top, 0px)) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_pageTitle__Lt9K2 { font-size: clamp(28px, 11vw, 40px) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_pageSub__Lt9K2 { font-size: 13px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_grid__Lt9K2 { gap: 12px !important; padding: 0 10px 20px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2 { height: min(540px, 82dvh) !important; min-height: 420px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardContent__Lt9K2 { padding: 20px 14px 16px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 .LeadTeam_cardName__Lt9K2 { font-size: 17px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarPhoto__Lt9K2 { width: 96px !important; height: 96px !important; border-radius: 12px !important; -webkit-border-radius: 12px !important; box-shadow: 0px 0px 0px 5px rgba(255, 255, 255, 0.12) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarLink__Lt9K2 { margin: 8px 16px 10px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarLink__Lt9K2::after { width: 16px !important; height: 16px !important; border-width: 3px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_bioText__Lt9K2 { font-size: 12.5px !important; -webkit-line-clamp: 3; line-clamp: 3; } #LeadTeam_root__Lt9K2 .LeadTeam_readMoreBtn__Lt9K2 { min-height: 44px !important; } } /* Only short+narrow viewports — do not cap desktop height */ @media (max-height: 700px) and (max-width: 900px) { #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2 { height: min(560px, 88dvh) !important; min-height: 420px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_profileCard__Lt9K2:has(.LeadTeam_profileBio__Lt9K2.LeadTeam_isExpanded__Lt9K2) .LeadTeam_cardContent__Lt9K2 { overflow-y: auto !important; } } @media (prefers-reduced-motion: reduce) { #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2:active, #LeadTeam_root__Lt9K2 .LeadTeam_stageBg__Lt9K2 { transition: none !important; } /* Jump morph to the final card state (no dot, no reveal) */ #LeadTeam_root__Lt9K2 .LeadTeam_profileCard__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_profileCard__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stageMonir__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_profileCard__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stageAlireza__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_profileCard__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stageMohsen__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_profileCard__Lt9K2 { -webkit-animation: none !important; animation: none !important; opacity: 1 !important; border-color: rgba(255, 255, 255, 0.22) !important; -webkit-clip-path: inset(0 round 22px) !important; clip-path: inset(0 round 22px) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_morphTrack__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_morphFill__Lt9K2 { display: none !important; } #LeadTeam_root__Lt9K2 .LeadTeam_stageBg__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_stageBg__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_settled__Lt9K2 .LeadTeam_stageBg__Lt9K2 { -webkit-animation: none !important; animation: none !important; opacity: 0.9 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_profileBio__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_profileSocial__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_cardHeader__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_profileBio__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_profileSocial__Lt9K2 { -webkit-animation: none !important; animation: none !important; opacity: 1; margin-top: 0; -webkit-transform: none; transform: none; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarLink__Lt9K2::after, #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_morphGo__Lt9K2 .LeadTeam_avatarLink__Lt9K2::after { -webkit-animation: none !important; animation: none !important; -webkit-transform: scale(1); transform: scale(1); } } /* ========== KEYFRAMES (scoped names; morph props without !important) ========== */ @-webkit-keyframes LeadTeam_init__Lt9K2 { 0% { opacity: 0; -webkit-transform: translateY(70px) scale(0); } 100% { opacity: 1; -webkit-transform: translateY(0) scale(1); } } @keyframes LeadTeam_init__Lt9K2 { 0% { opacity: 0; transform: translateY(70px) scale(0); } 100% { opacity: 1; transform: translateY(0) scale(1); } } /* track height = stage height, so these % equal the old top: 50% -> 40% -> 100% -> 40% -> 50% */ @-webkit-keyframes LeadTeam_moveDown__Lt9K2 { 0% { -webkit-transform: translateY(0); } 50% { -webkit-transform: translateY(-10%); } 100% { -webkit-transform: translateY(50%); } } @keyframes LeadTeam_moveDown__Lt9K2 { 0% { transform: translateY(0); } 50% { transform: translateY(-10%); } 100% { transform: translateY(50%); } } @-webkit-keyframes LeadTeam_moveUp__Lt9K2 { 0% { -webkit-transform: translateY(50%); } 50% { -webkit-transform: translateY(-10%); } 100% { -webkit-transform: translateY(0); } } @keyframes LeadTeam_moveUp__Lt9K2 { 0% { transform: translateY(50%); } 50% { transform: translateY(-10%); } 100% { transform: translateY(0); } } @-webkit-keyframes LeadTeam_dotOut__Lt9K2 { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes LeadTeam_dotOut__Lt9K2 { 0% { opacity: 1; } 100% { opacity: 0; } } @-webkit-keyframes LeadTeam_revealCircle__Lt9K2 { 0% { opacity: 1; -webkit-clip-path: inset(calc(50% - 28px) calc(50% - 28px) round 28px); clip-path: inset(calc(50% - 28px) calc(50% - 28px) round 28px); } 100% { opacity: 1; -webkit-clip-path: inset(0 round 22px); clip-path: inset(0 round 22px); } } @keyframes LeadTeam_revealCircle__Lt9K2 { 0% { opacity: 1; -webkit-clip-path: inset(calc(50% - 28px) calc(50% - 28px) round 28px); clip-path: inset(calc(50% - 28px) calc(50% - 28px) round 28px); } 100% { opacity: 1; -webkit-clip-path: inset(0 round 22px); clip-path: inset(0 round 22px); } } @-webkit-keyframes LeadTeam_revealSquare__Lt9K2 { 0% { opacity: 1; -webkit-clip-path: inset(calc(50% - 28px) calc(50% - 28px) round 8px); clip-path: inset(calc(50% - 28px) calc(50% - 28px) round 8px); } 100% { opacity: 1; -webkit-clip-path: inset(0 round 22px); clip-path: inset(0 round 22px); } } @keyframes LeadTeam_revealSquare__Lt9K2 { 0% { opacity: 1; -webkit-clip-path: inset(calc(50% - 28px) calc(50% - 28px) round 8px); clip-path: inset(calc(50% - 28px) calc(50% - 28px) round 8px); } 100% { opacity: 1; -webkit-clip-path: inset(0 round 22px); clip-path: inset(0 round 22px); } } @-webkit-keyframes LeadTeam_revealTriangle__Lt9K2 { 0% { opacity: 1; -webkit-clip-path: polygon(50% calc(50% - 25.76px), calc(50% - 25.76px) calc(50% + 25.76px), calc(50% + 25.76px) calc(50% + 25.76px), 50% calc(50% - 25.76px)); clip-path: polygon(50% calc(50% - 25.76px), calc(50% - 25.76px) calc(50% + 25.76px), calc(50% + 25.76px) calc(50% + 25.76px), 50% calc(50% - 25.76px)); } 100% { opacity: 1; -webkit-clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 0); clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 0); } } @keyframes LeadTeam_revealTriangle__Lt9K2 { 0% { opacity: 1; -webkit-clip-path: polygon(50% calc(50% - 25.76px), calc(50% - 25.76px) calc(50% + 25.76px), calc(50% + 25.76px) calc(50% + 25.76px), 50% calc(50% - 25.76px)); clip-path: polygon(50% calc(50% - 25.76px), calc(50% - 25.76px) calc(50% + 25.76px), calc(50% + 25.76px) calc(50% + 25.76px), 50% calc(50% - 25.76px)); } 100% { opacity: 1; -webkit-clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 0); clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 0); } } @-webkit-keyframes LeadTeam_revealHex__Lt9K2 { 0% { opacity: 1; -webkit-clip-path: polygon(50% calc(50% - 28px), calc(50% + 24.08px) calc(50% - 14px), calc(50% + 24.08px) calc(50% + 14px), 50% calc(50% + 28px), calc(50% - 24.08px) calc(50% + 14px), calc(50% - 24.08px) calc(50% - 14px)); clip-path: polygon(50% calc(50% - 28px), calc(50% + 24.08px) calc(50% - 14px), calc(50% + 24.08px) calc(50% + 14px), 50% calc(50% + 28px), calc(50% - 24.08px) calc(50% + 14px), calc(50% - 24.08px) calc(50% - 14px)); } 100% { opacity: 1; -webkit-clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% 100%, 0 100%, 0 0); clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% 100%, 0 100%, 0 0); } } @keyframes LeadTeam_revealHex__Lt9K2 { 0% { opacity: 1; -webkit-clip-path: polygon(50% calc(50% - 28px), calc(50% + 24.08px) calc(50% - 14px), calc(50% + 24.08px) calc(50% + 14px), 50% calc(50% + 28px), calc(50% - 24.08px) calc(50% + 14px), calc(50% - 24.08px) calc(50% - 14px)); clip-path: polygon(50% calc(50% - 28px), calc(50% + 24.08px) calc(50% - 14px), calc(50% + 24.08px) calc(50% + 14px), 50% calc(50% + 28px), calc(50% - 24.08px) calc(50% + 14px), calc(50% - 24.08px) calc(50% - 14px)); } 100% { opacity: 1; -webkit-clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% 100%, 0 100%, 0 0); clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% 100%, 0 100%, 0 0); } } @-webkit-keyframes LeadTeam_fillOut__Lt9K2 { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes LeadTeam_fillOut__Lt9K2 { 0% { opacity: 1; } 100% { opacity: 0; } } @-webkit-keyframes LeadTeam_cardShow__Lt9K2 { 0% { opacity: 1; } 100% { opacity: 1; } } @keyframes LeadTeam_cardShow__Lt9K2 { 0% { opacity: 1; } 100% { opacity: 1; } } @-webkit-keyframes LeadTeam_cardBorderIn__Lt9K2 { 0% { opacity: 1; border-color: rgba(255, 255, 255, 0); } 100% { opacity: 1; border-color: rgba(255, 255, 255, 0.22); } } @keyframes LeadTeam_cardBorderIn__Lt9K2 { 0% { opacity: 1; border-color: rgba(255, 255, 255, 0); } 100% { opacity: 1; border-color: rgba(255, 255, 255, 0.22); } } @-webkit-keyframes LeadTeam_moveIn__Lt9K2 { 0% { -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes LeadTeam_moveIn__Lt9K2 { 0% { -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @-webkit-keyframes LeadTeam_scaleIn__Lt9K2 { 0% { -webkit-transform: scale(0); } 100% { -webkit-transform: scale(1); } } @keyframes LeadTeam_scaleIn__Lt9K2 { 0% { transform: scale(0); } 100% { transform: scale(1); } } @-webkit-keyframes LeadTeam_bgFadeIn__Lt9K2 { 0% { opacity: 0; } 100% { opacity: 0.9; } } @keyframes LeadTeam_bgFadeIn__Lt9K2 { 0% { opacity: 0; } 100% { opacity: 0.9; } } /* ========== MOBILE / COARSE PERF ========== */ @media (max-width: 720px), (pointer: coarse) { #LeadTeam_root__Lt9K2 .LeadTeam_orb__Lt9K2 { filter: blur(40px) !important; will-change: auto !important; animation: none !important; opacity: 0.12; } #LeadTeam_root__Lt9K2 .LeadTeam_orb4__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_orb5__Lt9K2 { display: none !important; } #LeadTeam_root__Lt9K2 .LeadTeam_bgFluidCanvas__Lt9K2 { opacity: 0.75; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2 { will-change: auto !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinCard__Lt9K2 { backdrop-filter: none; -webkit-backdrop-filter: none; background: rgba(255, 255, 255, 0.07) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_profileCard__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_settled__Lt9K2 .LeadTeam_profileCard__Lt9K2 { -webkit-backdrop-filter: blur(12px) saturate(110%) !important; backdrop-filter: blur(12px) saturate(110%) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_readMoreBtn__Lt9K2 { backdrop-filter: none; -webkit-backdrop-filter: none; } } @media (max-width: 720px) and (prefers-reduced-motion: reduce) { #LeadTeam_root__Lt9K2 .LeadTeam_bgFluidCanvas__Lt9K2 { opacity: 0.85; } } /* ========================================================================== Principles intro (above Leadership hero) ========================================================================== */ #LeadTeam_root__Lt9K2 .LeadTeam_principles__Lt9K2 { position: relative !important; z-index: 1 !important; width: 100% !important; max-width: 1200px !important; margin: 0 auto !important; padding: 56px 20px 24px !important; padding-top: calc(56px + env(safe-area-inset-top, 0px)) !important; display: block !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinBody__Lt9K2 { position: relative !important; width: 100% !important; text-align: center !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinTag__Lt9K2 { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 14px !important; margin: 0 auto 14px !important; max-width: 100% !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinTagText__Lt9K2 { font-family: Univia Pro, system-ui, sans-serif !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: 0.22em !important; text-transform: uppercase !important; color: #4f8cff !important; white-space: nowrap !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinTagLine__Lt9K2 { display: block !important; width: 72px !important; max-width: 28vw !important; height: 1px !important; background: linear-gradient(90deg, rgba(79, 140, 255, 0.85) 0%, rgba(79, 140, 255, 0) 100%) !important; flex-shrink: 1 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinHeading__Lt9K2 { margin: 0 0 22px !important; padding: 0 !important; font-family: Univia Pro, system-ui, sans-serif !important; font-style: italic !important; font-weight: 700 !important; font-size: clamp(26px, 4vw, 36px) !important; line-height: 1.15 !important; letter-spacing: -0.02em !important; color: #ffffff !important; text-align: center !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinGrid__Lt9K2 { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; align-items: stretch !important; gap: 16px !important; width: 100% !important; margin: 0 !important; padding: 0 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinCard__Lt9K2 { position: relative !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: flex-start !important; gap: 10px !important; height: 100% !important; min-height: 160px !important; margin: 0 !important; padding: 22px 20px 24px !important; text-align: center !important; background: rgba(255, 255, 255, 0.05) !important; border: 1px solid rgba(255, 255, 255, 0.16) !important; border-radius: 18px !important; box-shadow: 0 12px 36px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important; backdrop-filter: blur(18px) saturate(110%); -webkit-backdrop-filter: blur(18px) saturate(110%); overflow: hidden !important; transform: none; transition: border-color 0.35s ease, box-shadow 0.35s ease, transform 0.35s ease; } #LeadTeam_root__Lt9K2 .LeadTeam_prinCardTip__Lt9K2 { position: absolute !important; top: 0 !important; left: 0 !important; width: 64px !important; height: 3px !important; background: linear-gradient(90deg, #4f8cff 0%, rgba(79, 140, 255, 0) 100%) !important; border-radius: 0 0 4px 0 !important; pointer-events: none !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinCardTitle__Lt9K2 { margin: 4px 0 0 !important; padding: 0 !important; font-family: Univia Pro, system-ui, sans-serif !important; font-style: normal !important; font-weight: 600 !important; font-size: clamp(16px, 1.8vw, 18px) !important; line-height: 1.3 !important; color: #ffffff !important; text-align: center !important; width: 100% !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinCardText__Lt9K2 { margin: 0 !important; padding: 0 !important; font-family: Univia Pro, system-ui, sans-serif !important; font-size: 14px !important; line-height: 1.6 !important; color: rgba(255, 255, 255, 0.58) !important; text-align: center !important; width: 100% !important; } @media (hover: hover) and (pointer: fine) { #LeadTeam_root__Lt9K2 .LeadTeam_prinCard__Lt9K2:hover { border-color: rgba(79, 140, 255, 0.45) !important; box-shadow: 0 16px 44px rgba(0, 0, 0, 0.35), 0 0 24px rgba(79, 140, 255, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.18) !important; transform: translateY(-2px); } } @media (max-width: 900px) { #LeadTeam_root__Lt9K2 .LeadTeam_prinGrid__Lt9K2 { grid-template-columns: 1fr !important; gap: 12px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_principles__Lt9K2 { padding: 44px 16px 16px !important; padding-top: calc(44px + env(safe-area-inset-top, 0px)) !important; } } @media (max-width: 600px) { #LeadTeam_root__Lt9K2 .LeadTeam_prinTagLine__Lt9K2 { width: 48px !important; } } /* ========================================================================== ROUND 4 — team card inner layout (REF2) + principles (REF3). Appended last so it wins over the earlier responsive blocks; morph/animation properties untouched. ========================================================================== */ /* Card: dark glass (scene image only faintly through), thin border, 22px radius */ #LeadTeam_root__Lt9K2 .LeadTeam_profileCard__Lt9K2 { background-color: rgba(7, 10, 22, 0.72) !important; background-image: linear-gradient(180deg, rgba(10, 15, 32, 0.80) 0%, rgba(5, 8, 20, 0.90) 100%), var(--scene-url) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardContent__Lt9K2 { padding: 34px 7% 28px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 { position: relative !important; width: 100% !important; padding: 0 0 20px !important; border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important; } /* short blue bar sitting on the separator line */ #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2::after { content: '' !important; position: absolute !important; left: 50% !important; bottom: -2px !important; width: 36px !important; height: 3px !important; margin-left: -18px !important; border-radius: 3px !important; background: #4f8cff !important; box-shadow: 0 0 10px rgba(79, 140, 255, 0.55) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarLink__Lt9K2 { display: inline-block !important; margin: 0 0 20px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarLink__Lt9K2::after { display: none !important; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarPhoto__Lt9K2 { width: clamp(120px, 11.8vw, 170px) !important; height: clamp(120px, 11.8vw, 170px) !important; -webkit-border-radius: 20px !important; border-radius: 20px !important; border: none !important; background: #0d1220 !important; box-shadow: 0 0 0 5px rgba(14, 19, 32, 0.95), 0 0 0 6px rgba(255, 255, 255, 0.10), 0 10px 28px rgba(0, 0, 0, 0.5) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 .LeadTeam_cardName__Lt9K2 { margin: 0 0 10px !important; font-size: clamp(20px, 2.1vw, 30px) !important; font-weight: 700 !important; line-height: 1.2 !important; letter-spacing: -0.01em !important; color: #ffffff !important; text-align: center !important; } #LeadTeam_root__Lt9K2 .LeadTeam_nameDot__Lt9K2 { color: #4f8cff !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 .LeadTeam_cardRole__Lt9K2 { margin: 0 auto !important; max-width: 23em !important; font-size: clamp(13px, 1.18vw, 17px) !important; font-weight: 400 !important; line-height: 1.45 !important; letter-spacing: 0.02em !important; color: #5b8dff !important; text-align: center !important; } #LeadTeam_root__Lt9K2 .LeadTeam_profileBio__Lt9K2 { width: 100% !important; max-width: none !important; padding: 22px 4px 0 !important; text-align: left !important; } #LeadTeam_root__Lt9K2 .LeadTeam_bioText__Lt9K2 { font-size: clamp(13px, 1.2vw, 17px) !important; line-height: 1.6 !important; color: rgba(255, 255, 255, 0.86) !important; text-align: left !important; -webkit-line-clamp: 5; line-clamp: 5; } /* buttons row: Read more + LinkedIn centred side by side (own styles kept, heights matched) */ #LeadTeam_root__Lt9K2 .LeadTeam_profileSocial__Lt9K2 { display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: center !important; gap: 14px !important; padding: 24px 0 0 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_socialItem__Lt9K2 { margin: 0 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_readMoreBtn__Lt9K2 { margin: 0 !important; min-height: 40px !important; padding: 8px 20px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_socialLink__Lt9K2 { min-height: 40px !important; padding: 8px 18px !important; } @media (hover: hover) and (pointer: fine) { #LeadTeam_root__Lt9K2 .LeadTeam_avatarLink__Lt9K2:hover > .LeadTeam_avatarPhoto__Lt9K2 { box-shadow: 0 0 0 5px rgba(14, 19, 32, 0.95), 0 0 0 6px rgba(79, 140, 255, 0.45), 0 10px 28px rgba(0, 0, 0, 0.5) !important; } } @media (max-width: 1024px) { #LeadTeam_root__Lt9K2 .LeadTeam_avatarPhoto__Lt9K2 { width: 116px !important; height: 116px !important; -webkit-border-radius: 18px !important; border-radius: 18px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardContent__Lt9K2 { padding: 28px 22px 22px !important; } } @media (max-width: 720px) { #LeadTeam_root__Lt9K2 .LeadTeam_cardContent__Lt9K2 { padding: 24px 18px 18px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarPhoto__Lt9K2 { width: 104px !important; height: 104px !important; -webkit-border-radius: 16px !important; border-radius: 16px !important; box-shadow: 0 0 0 4px rgba(14, 19, 32, 0.95), 0 0 0 5px rgba(255, 255, 255, 0.10), 0 8px 22px rgba(0, 0, 0, 0.5) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarLink__Lt9K2 { margin: 0 0 14px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 { padding: 0 0 14px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 .LeadTeam_cardName__Lt9K2 { font-size: 20px !important; margin: 0 0 8px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 .LeadTeam_cardRole__Lt9K2 { font-size: 13px !important; letter-spacing: 0.02em !important; } #LeadTeam_root__Lt9K2 .LeadTeam_profileBio__Lt9K2 { padding: 16px 2px 0 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_bioText__Lt9K2 { font-size: 13px !important; -webkit-line-clamp: 5; line-clamp: 5; } #LeadTeam_root__Lt9K2 .LeadTeam_profileSocial__Lt9K2 { gap: 10px !important; padding: 18px 0 0 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_readMoreBtn__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_socialLink__Lt9K2 { min-height: 44px !important; } } @media (max-width: 480px) { #LeadTeam_root__Lt9K2 .LeadTeam_avatarPhoto__Lt9K2 { width: 96px !important; height: 96px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 .LeadTeam_cardName__Lt9K2 { font-size: 19px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_bioText__Lt9K2 { font-size: 12.5px !important; -webkit-line-clamp: 5; line-clamp: 5; } } /* ---- Principles (REF3) ---- */ #LeadTeam_root__Lt9K2 .LeadTeam_prinTag__Lt9K2 { gap: 16px !important; margin: 0 auto 14px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinTagText__Lt9K2 { font-size: 11px !important; font-weight: 500 !important; letter-spacing: 0.3em !important; color: #4f8cff !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinTagLine__Lt9K2 { width: 56px !important; background: linear-gradient(90deg, rgba(79, 140, 255, 0.85) 0%, rgba(79, 140, 255, 0.15) 100%) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinTagLineL__Lt9K2 { background: linear-gradient(90deg, rgba(79, 140, 255, 0.15) 0%, rgba(79, 140, 255, 0.85) 100%) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinHeading__Lt9K2 { margin: 0 0 34px !important; font-style: normal !important; font-weight: 700 !important; font-size: clamp(30px, 3.6vw, 48px) !important; line-height: 1.12 !important; letter-spacing: -0.015em !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinGrid__Lt9K2 { gap: 22px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinCard__Lt9K2 { align-items: flex-start !important; gap: 0 !important; min-height: 0 !important; padding: 26px 26px 28px !important; text-align: left !important; background: linear-gradient(180deg, rgba(18, 26, 52, 0.55) 0%, rgba(8, 12, 28, 0.55) 100%) !important; border: 1px solid rgba(110, 145, 255, 0.22) !important; border-radius: 16px !important; box-shadow: 0 14px 40px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinCardTip__Lt9K2 { display: none !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinIcon__Lt9K2 { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 46px !important; height: 46px !important; margin: 0 0 18px !important; border-radius: 12px !important; background: linear-gradient(180deg, rgba(79, 140, 255, 0.16) 0%, rgba(79, 140, 255, 0.06) 100%) !important; border: 1px solid rgba(110, 150, 255, 0.35) !important; box-shadow: 0 0 18px rgba(79, 140, 255, 0.18) !important; flex-shrink: 0 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinIconSvg__Lt9K2 { display: block !important; width: 22px !important; height: 22px !important; fill: #5b8dff !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinCardTitle__Lt9K2 { margin: 0 0 10px !important; font-size: clamp(17px, 1.5vw, 20px) !important; font-weight: 700 !important; text-align: left !important; } #LeadTeam_root__Lt9K2 .LeadTeam_prinCardText__Lt9K2 { font-size: 14px !important; line-height: 1.6 !important; color: rgba(255, 255, 255, 0.60) !important; text-align: left !important; } @media (max-width: 900px) { #LeadTeam_root__Lt9K2 .LeadTeam_prinCard__Lt9K2 { padding: 22px 20px 24px !important; } } @media (max-width: 600px) { #LeadTeam_root__Lt9K2 .LeadTeam_prinTagLine__Lt9K2 { width: 40px !important; } } /* ========================================================================== ROUND 5 — card proportions from REF2 (sizes follow each card's own width via cqi) ========================================================================== */ #LeadTeam_root__Lt9K2 .LeadTeam_grid__Lt9K2 { max-width: 1320px !important; gap: 40px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_profileCard__Lt9K2 { container-type: inline-size; } #LeadTeam_root__Lt9K2 .LeadTeam_cardContent__Lt9K2 { padding: 6cqi 6cqi 5cqi !important; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarPhoto__Lt9K2 { width: clamp(96px, 30cqi, 190px) !important; height: clamp(96px, 30cqi, 190px) !important; -webkit-border-radius: clamp(14px, 3.6cqi, 22px) !important; border-radius: clamp(14px, 3.6cqi, 22px) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarLink__Lt9K2 { margin: 0 0 clamp(14px, 3.6cqi, 24px) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 { padding: 0 0 clamp(14px, 3.6cqi, 24px) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 .LeadTeam_cardName__Lt9K2 { font-size: clamp(19px, 5.8cqi, 36px) !important; margin: 0 0 clamp(6px, 1.7cqi, 12px) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 .LeadTeam_cardRole__Lt9K2 { font-size: clamp(13px, 3.3cqi, 20px) !important; max-width: 24em !important; } #LeadTeam_root__Lt9K2 .LeadTeam_profileBio__Lt9K2 { padding: clamp(14px, 3.8cqi, 26px) 0 0 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_bioText__Lt9K2 { font-size: clamp(13px, 3.6cqi, 21px) !important; line-height: 1.6 !important; -webkit-line-clamp: 5; line-clamp: 5; } #LeadTeam_root__Lt9K2 .LeadTeam_profileSocial__Lt9K2 { gap: clamp(10px, 2.6cqi, 18px) !important; padding: clamp(16px, 4.2cqi, 28px) 0 0 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_readMoreBtn__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_socialLink__Lt9K2 { min-height: clamp(42px, 10cqi, 60px) !important; padding: 0 clamp(16px, 5.2cqi, 32px) !important; font-size: clamp(12.5px, 3.1cqi, 18px) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_socialIcon__Lt9K2 { width: clamp(16px, 3.3cqi, 21px) !important; height: clamp(16px, 3.3cqi, 21px) !important; } @media (max-width: 1024px) { #LeadTeam_root__Lt9K2 .LeadTeam_grid__Lt9K2 { gap: 20px !important; } } @media (max-width: 720px) { #LeadTeam_root__Lt9K2 .LeadTeam_grid__Lt9K2 { gap: 14px !important; } } /* R5B GPU: promote the morph fill only while its stage animates */ #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2.LeadTeam_animating__Lt9K2 .LeadTeam_morphFill__Lt9K2 { -webkit-transform: translateZ(0); transform: translateZ(0); } /* ========================================================================== ROUND 6 — compact card inner content (no overflow/cutoff) + unified hover ========================================================================== */ #LeadTeam_root__Lt9K2 .LeadTeam_profileCard__Lt9K2 { overflow: hidden !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardContent__Lt9K2 { padding: 4.2cqi 5cqi 3.6cqi !important; box-sizing: border-box !important; max-height: 100% !important; overflow: hidden !important; } #LeadTeam_root__Lt9K2 .LeadTeam_profileCard__Lt9K2:has(.LeadTeam_profileBio__Lt9K2.LeadTeam_isExpanded__Lt9K2) .LeadTeam_cardContent__Lt9K2 { overflow-x: hidden !important; overflow-y: auto !important; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarPhoto__Lt9K2 { width: clamp(88px, 25cqi, 148px) !important; height: clamp(88px, 25cqi, 148px) !important; -webkit-border-radius: clamp(12px, 3cqi, 18px) !important; border-radius: clamp(12px, 3cqi, 18px) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarLink__Lt9K2 { margin: 0 0 clamp(10px, 2.6cqi, 16px) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 { padding: 0 0 clamp(10px, 2.6cqi, 16px) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 .LeadTeam_cardName__Lt9K2 { font-size: clamp(17px, 4.6cqi, 26px) !important; margin: 0 0 clamp(4px, 1.2cqi, 8px) !important; line-height: 1.2 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 .LeadTeam_cardRole__Lt9K2 { font-size: clamp(11.5px, 2.6cqi, 15px) !important; max-width: 26em !important; line-height: 1.4 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_profileBio__Lt9K2 { padding: clamp(10px, 2.6cqi, 16px) 0 0 !important; flex: 0 1 auto !important; min-height: 0 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_bioText__Lt9K2 { font-size: clamp(12.5px, 2.8cqi, 15.5px) !important; line-height: 1.55 !important; -webkit-line-clamp: 5; line-clamp: 5; } #LeadTeam_root__Lt9K2 .LeadTeam_profileSocial__Lt9K2 { gap: clamp(8px, 2cqi, 12px) !important; padding: clamp(12px, 2.8cqi, 18px) 0 0 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_readMoreBtn__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_socialLink__Lt9K2 { min-height: clamp(36px, 8.4cqi, 46px) !important; padding: 0 clamp(14px, 4cqi, 24px) !important; font-size: clamp(12px, 2.7cqi, 14.5px) !important; } #LeadTeam_root__Lt9K2 .LeadTeam_socialIcon__Lt9K2 { width: clamp(14px, 2.8cqi, 18px) !important; height: clamp(14px, 2.8cqi, 18px) !important; } @media (max-width: 720px) { #LeadTeam_root__Lt9K2 .LeadTeam_cardContent__Lt9K2 { padding: 18px 16px 16px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_avatarPhoto__Lt9K2 { width: 92px !important; height: 92px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 .LeadTeam_cardName__Lt9K2 { font-size: 18px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_cardHeader__Lt9K2 .LeadTeam_cardRole__Lt9K2 { font-size: 12px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_bioText__Lt9K2 { font-size: 12.5px !important; } #LeadTeam_root__Lt9K2 .LeadTeam_readMoreBtn__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_socialLink__Lt9K2 { min-height: 40px !important; font-size: 12.5px !important; } } /* R6 unified hover: ONE effect for every settled card (remove shape-specific drop-shadow) */ @media (hover: hover) and (pointer: fine) { #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2:hover { transform: translate3d(0, -6px, 0); z-index: 4 !important; } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2:hover .LeadTeam_stageBg__Lt9K2 { transform: scale(1.08); } #LeadTeam_root__Lt9K2 .LeadTeam_stage__Lt9K2:hover .LeadTeam_profileCard__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stageAlireza__Lt9K2:hover .LeadTeam_profileCard__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stageMohsen__Lt9K2:hover .LeadTeam_profileCard__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stageMonir__Lt9K2:hover .LeadTeam_profileCard__Lt9K2, #LeadTeam_root__Lt9K2 .LeadTeam_stageFarhad__Lt9K2:hover .LeadTeam_profileCard__Lt9K2 { border-color: rgba(255, 255, 255, 0.38) !important; -webkit-filter: none !important; filter: none !important; -webkit-box-shadow: 0 16px 48px rgba(0, 0, 0, 0.45), 0 0 28px var(--accent-glow), inset 0 1px 0 rgba(255, 255, 255, 0.28) !important; box-shadow: 0 16px 48px rgba(0, 0, 0, 0.45), 0 0 28px var(--accent-glow), inset 0 1px 0 rgba(255, 255, 255, 0.28) !important; } } #destintel-footer, #destintel-footer .footer, #destintel-footer .footer *, #destintel-footer .footer *::before, #destintel-footer .footer *::after { margin: 0 !important; padding: 0 !important; box-sizing: border-box !important; font-family: &amp;amp;amp;amp;amp;amp;#039;Inter&amp;amp;amp;amp;amp;amp;#039;, -apple-system, BlinkMacSystemFont, &amp;amp;amp;amp;amp;amp;quot;Segoe UI&amp;amp;amp;amp;amp;amp;quot;, Roboto, Helvetica, Arial, sans-serif !important; } #destintel-footer .footer a { text-decoration: none !important; color: inherit !important; } #destintel-footer .footer ul { list-style: none !important; } #destintel-footer { background-color: #0b0f19 !important; color: #94a3b8 !important; line-height: 1.5 !important; } #destintel-footer .footer { padding: 60px 5% 20px !important; max-width: 1400px !important; margin: 0 auto !important; display: flex !important; flex-direction: column !important; position: relative !important; isolation: isolate !important; } #destintel-footer .footer-content { display: grid !important; grid-template-columns: 1.5fr 1fr 1fr 1fr !important; gap: 40px !important; margin-bottom: 60px !important; } #destintel-footer .footer-brand { display: flex !important; flex-direction: column !important; gap: 20px !important; } #destintel-footer .brand-header { margin-bottom: 10px !important; } #destintel-footer .brand-logo { width: 180px !important; height: auto !important; display: block !important; } #destintel-footer .brand-description { font-size: 14px !important; line-height: 1.6 !important; color: #94a3b8 !important; max-width: 300px !important; } #destintel-footer .social-icons { display: flex !important; gap: 12px !important; margin-top: 10px !important; } #destintel-footer .social-icon { width: 36px !important; height: 36px !important; border-radius: 50% !important; background-color: #1e293b !important; display: flex !important; align-items: center !important; justify-content: center !important; color: #ffffff !important; transition: background-color 0.3s !important; } #destintel-footer .social-icon:hover { background-color: #334155 !important; } #destintel-footer .social-icon svg { width: 16px !important; height: 16px !important; fill: currentColor !important; } #destintel-footer .footer-column h3 { font-size: 14px !important; font-weight: 700 !important; letter-spacing: 1px !important; color: #ffffff !important; text-transform: uppercase !important; margin-bottom: 24px !important; } #destintel-footer .footer-column ul { display: flex !important; flex-direction: column !important; gap: 16px !important; } #destintel-footer .footer-column ul li a { color: #94a3b8 !important; font-size: 14px !important; transition: color 0.3s !important; } #destintel-footer .footer-column ul li a:hover { color: #00d2be !important; } #destintel-footer .contact-list { display: flex !important; flex-direction: column !important; gap: 16px !important; margin-top: 24px !important; } #destintel-footer .contact-item { display: flex !important; align-items: center !important; gap: 12px !important; font-size: 14px !important; color: #94a3b8 !important; } #destintel-footer .contact-item a:hover { color: #00d2be !important; } #destintel-footer .contact-icon { width: 18px !important; height: 18px !important; fill: #00d2be !important; flex-shrink: 0 !important; } #destintel-footer .footer-bottom { border-top: 1px solid #1e293b !important; padding-top: 24px !important; display: flex !important; justify-content: space-between !important; align-items: center !important; font-size: 12px !important; font-weight: 600 !important; letter-spacing: 1px !important; color: #64748b !important; text-transform: uppercase !important; } #destintel-footer .certifications { display: flex !important; gap: 24px !important; } #destintel-footer .scroll-top { position: absolute !important; bottom: 30px !important; right: 5% !important; width: 44px !important; height: 44px !important; border-radius: 50% !important; background-color: #0f172a !important; border: 1px solid #1e293b !important; cursor: pointer !important; display: flex !important; align-items: center !important; justify-content: center !important; transition: all 0.3s ease !important; opacity: 0 !important; pointer-events: none !important; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1) !important; } #destintel-footer .scroll-top.visible { opacity: 1 !important; pointer-events: all !important; } #destintel-footer .scroll-top:hover { background-color: #1e293b !important; transform: translateY(-2px) !important; } #destintel-footer .scroll-top svg { width: 20px !important; height: 20px !important; fill: #00d2be !important; } @media (max-width: 900px) { #destintel-footer .footer-content { grid-template-columns: 1fr 1fr !important; gap: 30px !important; } #destintel-footer .brand-logo { width: 150px !important; } #destintel-footer .footer-bottom { flex-direction: column !important; gap: 16px !important; text-align: center !important; } } @media (max-width: 560px) { #destintel-footer .footer-content { grid-template-columns: 1fr !important; gap: 30px !important; } #destintel-footer .brand-logo { width: 140px !important; } #destintel-footer .footer { padding: 40px 5% 20px !important; } #destintel-footer .scroll-top { width: 40px !important; height: 40px !important; } #destintel-footer .scroll-top svg { width: 18px !important; height: 18px !important; } } body{ position: relative; } .dno{ display: none!important; } .public-header{ position: relative; transition:5s; } .absolute-container{ background-color: #ee273a; border-radius: 7px; position: fixed; top: 50%; left: 2%; transform: translateY(-50%); padding: 10px; z-index: 4900; } .social-absolute{ position: relative; padding: 10px 0; border-bottom: 1px solid rgba(0, 0, 0, .1); box-sizing: content-box; width: 24px; height: 24px; } .social-absolute:last-child { border-bottom: none !important; } .social-absolute img{ width: 24px; height: 24px; } .absolute-tooltip{ position: relative; transition: all 0.5s; border-radius: 0 7px 7px 0; font-size: 14px; overflow: hidden; white-space: nowrap; } .absolute-tooltip > span{ padding: 10px 20px; display: block; } .tooltip-shake{ display: block; width: 100%; height: 100%; } .tooltip-shake:before, .tooltip-shake:after { position: absolute; content: ""; opacity: 0; transition: all 0.4s ease; color: #fff; font-weight: bold; } .tooltip-shake:before { content: attr(data-tooltip); background: #0A0C10; width: 0; padding: 0; font-size: 0.9rem; top: 50%; left: calc(24px + 32px); border-radius: 5px; transform: translateY(-50%); overflow: hidden; white-space: nowrap; } .tooltip-shake:after { border-width: 8px 10px 8px 0; border-style: solid; border-color: transparent #0A0C10 transparent transparent; top: 50%; left: calc(24px + 24px); transform: translateY(-50%); } .tooltip-shake:hover::before, .tooltip-shake:hover::after { opacity: 1; overflow: hidden; white-space: nowrap; transform: translate(0, -50%); } .tooltip-shake:hover::before { width: max-content; padding: 10px 25px; } @keyframes shake { 0% { transform: rotate(2deg); } 50% { transform: rotate(-3deg); } 70% { transform: rotate(3deg); } 100% { transform: rotate(0deg); } } .social-absolute:hover { animation: shake 500ms ease-in-out forwards; } .public-header{ width: 100%; background: #0A0C10; background-size: auto; background-repeat: no-repeat; } .adv-banner-container{ width: 100%; height: 10px; } .adv-banner-container .adv-item{ width: 100%; height: 100%; object-fit: cover; } .top-bar-container{ width: 100%; min-height: 40px; height: 40px; background: #222 ; display: flex; flex-direction: row; justify-content: center; align-items: center; } .top-bar{ width: 1200px; height: 100%; margin: auto; padding: 0 8px; display: flex; flex-direction: row; justify-content: space-between; align-items: center; } .top-item{ height: 100%; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; } .info-container{ flex-direction: row; justify-content: flex-start; align-items: center; } .info-container img{ width: 16px; height: 16px; } .info-container > span{ display: inline-flex; } .top-info, .top-social{ display: flex; flex-direction: row; justify-content: flex-start; align-items: center; } .top-social{ padding: 5px 0; } .top-social li a img{ width: 32px; height: 32px; } .top-social li a span{ font-size: 0px; font-weight: 200; color: #777; } .top-list{ width: max-content; display: flex; flex-direction: row; justify-content: center; align-items: center; margin: 0 0px; } .top-list:hover{ color: ; } .top-list:first-child{ margin-left : 0; } .top-list:last-child{ margin-right : 0; } .arrow-menu-container{ display: flex; flex-direction: row; justify-content: center; align-items: center; } .top-list a span, .top-list span{ color: #777; font-weight: bold; font-size: 14px; } .top-list a img, .top-list span img{ margin: 0 5px; width: 24px; height: 24px; object-fit: contain; } .top-list:first-child a img, .top-list:first-child span img{ margin-left: 0; } .top-navbar{ height: 100%; background: transparent; } .top-nav-list{ position: relative; height: 100%; padding: 0 20px; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; } .top-nav-list a span, .top-nav-list span{ color: #000; font-size: 0px; font-weight: 200;search } .top-nav-list:hover{ background-color: #fff; } .top-nav-list .arrow-menu-container svg{ fill: #000; } .top-nav-list:hover a span, .top-nav-list:hover span, .top-nav-list:hover .arrow-menu-container svg{ color: #fff; fill: #fff; } .top-nav-list .icon-title-part{ padding-left: 5px; } .top-sub-nav > .top-sub-list a span, .top-sub-nav > .top-sub-list span{ color: #000; } .top-sub-nav > .top-sub-list:hover a span, .top-sub-nav > .top-sub-list:hover span{ color: #fff; } .top-sub-nav{ flex-direction: column; justify-content: center; align-content: flex-start; position: absolute; z-index: 4999; min-width: 150px; width: max-content; background: #2c3e50; clip: rect(1px, 1px, 1px, 1px); opacity: 0.1; transition: transform 0.5s cubic-bezier(0.2, 0, 0.2, 1), opacity 0.6s cubic-bezier(0.2, 0, 0.2, 1); transform: translateY(-10px) scaleY(0.5); transform-origin: top; border-radius: 0; } .top-nav-list:hover > .top-sub-nav{ display: flex; top: 100%; clip: auto; opacity: 1; transform: translateY(0) scaleY(1); } .top-nav-list:hover > .top-sub-nav{ left: 0; } .top-sub-list{ border-right: 5px solid #f00; } .top-sub-list{ width: 100%; padding: 8px 20px; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; } .top-sub-list:hover{ background: #fff; } .header-container{ display: grid; width: 1200px; margin: auto; height: auto; grid-template-rows: 1fr 1fr; grid-template-columns: 1fr 3fr 1fr; grid-template-areas: "top-1 top-2 top-3" "bottom-1 bottom-2 bottom-3"; padding-top: 8px; padding-bottom: 8px; padding-left: 8px; padding-right: 8px; } .top-section-1{ grid-area: top-1; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; } .top-section-2{ grid-area: top-2; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; } .top-section-3{ grid-area: top-3; display: flex; flex-direction: row; justify-content: flex-end; align-items: center; } .logo-container{ display: flex; flex-direction: row; justify-content: center; align-items: center; width: 100%; height: 100%; padding: 4px 4px; } .logo-container img{ display: block; width: 220px; height: 55px; max-width: 220px; max-height: 55px; object-fit: contain; } .nav-container{ display: flex; flex-direction: row; justify-content: flex-start; align-items: center; box-sizing: border-box; margin: 0 10px; } .nav-container > .navbar{ width: 100%; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; background: #0A0C10; box-sizing: border-box; border: px solid ; border-radius: 3px; padding: 0 !important; } .nav-container > .navbar{ margin-right: calc(0px + 10px); } .max-height{ height: 700px; overflow-x:hidden; overflow-y: auto; display:flex!important; flex-direction: column!important; justify-content: flex-start!important; } .nav-container .navbar .nav-list{ padding: 10px 18px; min-height: 45px; position: relative; list-style: none; display: flex; flex-direction: row; justify-content: space-between; align-content: center; box-sizing: border-box; } .nav-container .navbar .nav-list.active{ background-color: ; } .nav-container .navbar .nav-list.active a, .nav-container .navbar .nav-list.active span{ color: #4f8dff; } .nav-container .navbar .nav-list .icon-title-part{ display: flex; flex-direction: row; justify-content: flex-start; align-items: center; } .nav-container .navbar .nav-list .icon-title-part img{ width: 24px; height: 24px; margin: 0 5px; } .nav-container .navbar .nav-list .overflow-menu{ justify-content: center !important; } .nav-container .navbar .nav-list:hover{ background-color: ; box-sizing: border-box; } .nav-container .navbar .nav-list:hover a, .nav-container .navbar .nav-list:hover span{ color: #a2c0fa ; } .nav-container .navbar .nav-list img{ width: 32px; height: 32px; } .nav-container .navbar .nav-list a, .nav-container .navbar .nav-list span{ text-decoration: none; font-size: 14px; color: #fff; } .nav-container .navbar .nav-list.base-level:hover > .navbar.navbar-sub, .nav-container .navbar .nav-list:hover > .overflow-menu > .navbar.navbar-sub{ display: flex; top: 45px; clip: auto; opacity: 1; transform: translateY(0) scaleY(1); } .nav-container .navbar .nav-list:hover > .navbar.navbar-sub{ display: flex; right: calc(100% + 5px); top: 0; clip: auto; opacity: 1; transform: translateY(0) scaleY(1); } .nav-container .navbar.navbar-sub{ flex-direction: column; justify-content: center; align-content: flex-start; min-width: 150px; width: max-content; } .nav-container .navbar.navbar-sub .nav-list{ width: 100%; border-right: 5px solid red; } .nav-container .navbar.navbar-sub{ position: absolute; z-index: 4999; background: #fff; clip: rect(1px, 1px, 1px, 1px); opacity: 0.1; transition: transform 0.5s cubic-bezier(0.2, 0, 0.2, 1), opacity 0.6s cubic-bezier(0.2, 0, 0.2, 1); transform: translateY(-10px) scaleY(0.5); transform-origin: top; border-radius: 0; } .nav-container .navbar.navbar-sub{ flex-direction: column; justify-content: center; align-content: flex-start; min-width: 150px; width: max-content; } .nav-container .navbar .nav-list.base-level:hover > .navbar.navbar-sub, .nav-container .navbar .nav-list:hover > .overflow-menu > .navbar.navbar-sub{ left: 0; border-radius: 0 !important; } .nav-container .navbar .nav-list:hover > .navbar.navbar-sub{ left: calc(100% + 5px); } .nav-container .navbar.navbar-sub .nav-list{ width: 200px; border-right: 5px solid red; border-radius: 0 !important; } .nav-container .navbar .nav-list.base-level:hover > .navbar.navbar-sub, .nav-container .navbar .nav-list:hover > .overflow-menu > .navbar.navbar-sub{ left: 0; } .nav-container .navbar .nav-list:hover > .navbar.navbar-sub{ left: calc(100% + 5px); } .arrow-icon-menu{ width: 8px; height: 8px; } .arrow-icon-menu.arrow-bottom{ transform: rotate(90deg); } .arrow-menu-container{ margin-left: 5px; } .arrow-icon-menu.arrow-right, .overflow-list .arrow-icon-menu.arrow-bottom{ transform: rotate(0deg); } .nav-container .navbar .nav-list:first-child:hover{ border-radius: 3px 0 0 3px; } .nav-container .navbar .nav-list:last-child:hover{ border-radius: 0 3px 3px 0; } .nav-container .navbar .nav-list.base-level svg, .nav-container .navbar .nav-list .overflow-menu svg{ fill: #fff; } .nav-container .navbar .nav-list.base-level:hover svg{ fill: #a2c0fa; } .sub-menu-container{ position: absolute; min-width: 150px; background-color: #fff; color: #fff; top: 32px; right: 0; z-index: 4999; /* display: none;*/ } /*.sub-navbar{ width: 100%; height: 100%; }*/ .nav-container .navbar.navbar-sub .nav-list img{ width: 16px; height: 16px; } .nav-container .navbar.navbar-sub .nav-list a, .nav-container .navbar.navbar-sub .nav-list span{ color: #000; font-size: 12px; } .nav-list.with-sub-menu:hover .sub-menu-container{ display: block; } .nav-container .navbar.navbar-sub .nav-list .arrow-menu-container svg{ fill: #000; } .active{ background-color: ; } .active a{ color: #4f8dff; } .icon-container{ display: flex; flex-direction: row; justify-content: center; align-content: center; } .icon-container .icon-item{ display: flex; flex-direction: row; justify-content: center; align-content: center; box-sizing: border-box; min-height: 45px; margin: 0 5px; } .icon-container .icon-item:first-child{ margin-left: 0 !important; } .icon-container .icon-item:last-child{ margin-right: 0 !important; } .icon-container .icon-item a{ border: 0px solid ; } .icon-container .icon-item.basket-icon{ position: relative; color: #e84118; min-width: 45px; min-height: 45px; outline: none; border-radius: 3px; background: #2c3e50; display: flex; flex-direction: row; justify-content: center; align-items: center; cursor: pointer; text-decoration: none; margin: 0 10px; } .icon-container .icon-item .icon-shortcut{ color: #e84118; min-width: 45px; min-height: 45px; margin: 0; outline: none; border-radius: 3px; background: #2c3e50; display: flex; flex-direction: row; justify-content: center; align-items: center; transition: .4s; cursor: pointer; text-decoration: none; } .basket-shop{ display: flex; flex-direction: row; justify-content: center; align-items: center; width: 45px; height: 45px; border-radius: 3px; } .icon-container .icon-item .icon-shortcut:hover svg, .icon-container .icon-item .icon-shortcut:hover .add-item-to-cart.open span { fill: #fff; color: #fff; } .icon-container .icon-item.basket-icon .add-item-to-cart{ color: #e84118; border-radius: 3px; background: #2c3e50; display: flex; flex-direction: row; justify-content: center; align-items: center; transition: .4s; cursor: pointer; box-sizing: content-box; border: 0px solid ; } .icon-container .icon-item.basket-icon .add-item-to-cart{ border-right: none !important; } .border-basket{ border-left: none !important; } .icon-container .icon-item:hover > span, .icon-container .icon-item.login-icon:hover span{ color: #fff; } .icon-container .icon-item.basket-icon .icon-shortcut:hover, .icon-container .icon-item.login-icon .icon-shortcut:hover, .icon-container .icon-item.basket-icon .icon-shortcut:hover .add-item-to-cart{ background: #3e5772; } .icon-container .icon-item.basket-icon .add-item-to-cart.open{ width: 45px; border-radius: 0 3px 3px 0; display: flex; flex-direction: row; justify-content: center; align-items: center; } .icon-container .icon-item.basket-icon:hover .add-item-to-cart.open{ background: #3e5772; } .icon-container .icon-item.basket-icon .add-item-to-cart.open:hover span{ color: #fff; } .icon-container .icon-item.basket-icon .add-item-to-cart.open + .icon-shortcut{ border-radius: 3px 0 0 3px; } .icon-container .icon-item.lang-icon .icon-shortcut:hover{ background: #3e5772; } .icon-container .icon-item.search-icon .icon-shortcut .search-container .search-btn:hover{ background: #3e5772; } .icon-container .icon-item svg{ width: 25px; height: 25px; fill: #e84118; } .icon-container .icon-item.login-icon{ position: relative; } /*.icon-container .icon-item.login-icon .icon-shortcut{ width: 100%; height: 100%; }*/ .icon-container .icon-item.login-icon .icon-login{ width: 25px; height: 25px; } #div_profile_picture, #div_profile_picture_metro { display: block; width: 0 !important; height: 0 !important; line-height: unset !important; } #div_profile_picture .rShowLogin{ position: absolute; top: 0; left: 0; width: 0; height: 0; z-index: -1000; } #div_profile_picture .login-container{ display: none !important; } #div_profile_picture #profile_picture, #div_profile_picture #profile_exit{ display: none !important; } .icon-container .icon-item.login-icon{ color: #e84118; /*width: 90px !important;*/ min-height: 45px; outline: none; border-radius: 3px; display: flex; flex-direction: row; justify-content: center; align-items: center; cursor: pointer; text-decoration: none; box-sizing: content-box; border: 0px solid ; } .icon-container .icon-item.login-icon .status-user, .icon-container .icon-item.login-icon .icon-login{ display: flex; flex-direction: row; justify-content: center; align-items: center; text-align: center; margin: 0 5px; font-size:14px; } .public-header .bottom-section-1{ grid-area: bottom-1; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; } .public-header .bottom-section-2{ grid-area: bottom-2; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; } .public-header .bottom-section-3{ grid-area: bottom-3; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; } .icon-container .icon-item{ width: unset; height: unset; } .search-icon{ position: relative; } .search-container { display: flex; flex-direction: row; justify-content: flex-end; align-items: center; height: 100%; position: relative; border-radius: 3px; min-width: 45px; } .search-container > .search-btn svg, .search-container > .close-search-btn svg{ fill: #e84118; } .search-container > .search-btn:hover svg, .search-container > .close-search-btn:hover svg{ fill: #fff; } .search-btn { color: #fff; width: 45px; height: 45px; margin: 0; outline: none; border-radius: 3px; background: #2c3e50; display: flex; flex-direction: row; justify-content: center; align-items: center; transition: .8s; cursor: pointer; text-decoration: none; border: 0px solid transparent; } .icon-container .icon-item img{ width: 25px; height: 25px; object-fit:contain; } .search-container.open-search-box .search-btn{ border-radius: 0 3px 3px 0 !important; } .search-container.open-search-box .close-search-btn{ border-radius: 3px 0 0 3px !important; } .search-btn, .search-command, .close-search-btn{ box-sizing: content-box; } .search-btn > svg { fill: #fff; } .cls-pls::placeholder{ color: ; } .search-input { padding: 0; height: 100%; background: #2c3e50; color: #fff; font-size: 14px; font-weight: normal; transition: all 1s ease-in-out; width: 0; position: absolute; top: 0; overflow: hidden; white-space: nowrap; border: 0px solid transparent; } .open-search-box > .search-input{ padding : 10px 48px; } .search-input { right: calc(0px + 45px); border-right: none; border-left: none; } .search-container.open-search-box .search-btn{ border-radius: 0 3px 3px 0 !important; } .search-container.open-search-box .close-search-btn{ border-radius: 3px 0 0 3px !important; } .search-container.open-search-box .search-input{ border-radius: 3px 0 0 3px !important; } .close-search-btn{ position: absolute; color: #fff; width: 45px; height: 45px; margin: 0; outline: none; border-radius: 3px; background: #2c3e50; display: flex; flex-direction: row; justify-content: center; align-items: center; cursor: pointer; box-sizing: border-box; box-sizing: border-box; } .close-search-btn svg{ fill: #e84118; } .sticky{ width: 100vw; height: max-content; position: fixed; top: 0; right: 0; left: 0; z-index: 999; padding: 2vh 8vw; transition: .8s; background-color: #0A0C10 !important; } .public_sticky{ width: 100%; height: max-content; position: fixed; top: 0; right: 0; left: 0; z-index: 1001; } .d-none{ display: none !important; } .border-left-n{ border-left: none !important; } .border-right-n{ border-right: none !important; } .w-1200px{ width: 1200px !important; margin: auto; } .lang-icon{ position: relative; } .language-container .lang-btn{ width: 25px; height: 25px; } .lang-list-container{ width: max-content; height: max-content; padding-top: 20px; position: absolute; top: 35px; left: 50%; clip: rect(1px, 1px, 1px, 1px); opacity: 0.1; transition: transform 0.5s cubic-bezier(0.2, 0, 0.2, 1), opacity 0.6s cubic-bezier(0.2, 0, 0.2, 1); transform: translate(-50%, 0) scaleY(0.5); transform-origin: top; z-index: 100; } .lang-list{ position: relative; width: max-content; height: max-content; padding: 10px; background: #2c3e50; border-radius: 3px; } .lang-list::after{ content: ""; position: absolute; top: -8px; left: 50%; transform: translateX(-50%); border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #2c3e50; display: block; } .lang-nav{ display: flex; flex-direction: column; justify-content: center; align-items: flex-start; } .lang-nav .lang-li{ display: flex; flex-direction: row; justify-content: center; align-items: center; list-style: none; width: max-content; margin: 5px 0; } .lang-nav .lang-li a{ display: flex; flex-direction: row; justify-content: center; align-items: center; } .lang-nav .lang-li img{ width: 25px; height: 25px; object-fit: cover; margin: 0 4px; } .lang-nav .lang-li span{ text-transform: uppercase; line-height: 2.5; font-size: 14px; margin: 0 4px; color: #fff; } .lang-nav .lang-li a{ color: #fff; } .lang-nav .lang-li span:hover{ cursor: pointer; color: #fff; } .lang-nav .lang-li .lang-active{ font-weight: bold; color: #e84118; } .icon-item.lang-icon:hover .lang-list-container{ clip: auto; opacity: 1; transform: translate(-50%, 0) scaleY(1); } /*---------------------------------------------------------------------------------*/ .link-profile-container{ width: max-content; height: max-content; padding-top: 20px; position: absolute; top: 35px; left: 50%; clip: rect(1px, 1px, 1px, 1px); opacity: 0.1; transition: transform 0.5s cubic-bezier(0.2, 0, 0.2, 1), opacity 0.6s cubic-bezier(0.2, 0, 0.2, 1); transform: translate(-50%, 0) scaleY(0.5); transform-origin: top; z-index: 100; } .link-profile-container .link-wrapper{ position: relative; width: max-content; height: max-content; padding: 10px 25px; background: #2c3e50; border-radius: 3px; } .link-profile-container .link-wrapper a{ color: #fff; } .link-profile-container .link-wrapper a:hover{ cursor: pointer; color: #fff; } .link-profile-container .link-wrapper::after{ content: ""; position: absolute; top: -8px; left: 50%; transform: translateX(-50%); border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #2c3e50; display: block; } .icon-item.login-icon:hover .link-profile-container{ clip: auto; opacity: 1; transform: translate(-50%, 0) scaleY(1); } .backTop{ display: flex !important; } #back_to_top{ display: none; position: fixed; transition: 600ms; right: 16px; left: unset; bottom: 50px; z-index: 100; border-radius: 50%; border: 1px solid #000; padding: 15px; flex-direction: row; justify-content: center; align-items: center; background-color: #777 ; } #back_to_top svg{ width: 24px; height: 24px; fill: #fff ; } #back_to_top img{ width: 24px; height: 24px; fill: #fff ; object-fit:contain; } .search-btn img{ width: 25px; height: 25px; object-fit: contain; } .basket-shop img{ width: 25px; height: 25px; object-fit: contain; } .lang-btn img{ width: 25px; height: 25px; object-fit: contain; } .icon-login img{ width: 25px; height: 25px; object-fit: contain; } .header-container{ grid-template-rows: 1fr; grid-template-columns: 220px minmax(auto, 100%) 1fr; grid-template-areas: "top-1 top-2 top-3"; } .top-section-1{ justify-content: flex-start; } .top-section-2{ justify-content: flex-start; } .logo-container{ justify-content: flex-start; } .nav-container{ justify-content: flex-start; } .nav-container .navbar{ justify-content: flex-start; } .width-full{ width: 100% !important; } #msg_footer.msg_footer, #msg_footer_complete.msg_footer{ position: fixed; top: 50px; right: 10px; width: 400px; height: 50px; z-index: 10000; border-radius: 3px; } #msg_footer .d_flex, #msg_footer_complete .d_flex{ display: flex; flex-direction: row; justify-content: space-between; align-items: center; height: 100%; padding: 0 15px; } #msg_footer.green_msg_footer { background-color: #d4edda; border: 1px solid #c3e6cb; color: #155724; } #msg_footer.red_msg_footer, #msg_footer_complete.red_msg_footer{ background-color: #f8d7da; border: 1px solid #f5c6cb; color: #721c24; } #msg_footer .close_msg, #msg_footer_complete .close_msg{ cursor: pointer; font-size: 25px; padding-right: 15px; } #msg_footer .close_msg:hover, #msg_footer_complete .close_msg:hover{ color: #000; } .border_red{ border: 1px solid #e20000; } footer a{ color: inherit; } .dno{display:none!important;} #body_popup_1,#body_popup_2{ position:fixed; display:flex; text-align:center; top:0; bottom:0; right:0; left:0; z-index:99999; visibility:hidden; opacity: 0; background:rgba(0,0,0,0.5); } #body_popup_1.open-popup,#body_popup_2.open-popup{ visibility:visible; opacity: 1; } #body_popup_1 > div,#body_popup_2 > div{ display:block; background:#fff; padding:10px; margin:auto; transform:translateY(-150px); -webkit-transition:transform .3s;-moz-transition:transform .3s;-ms-transition:transform .3s;-o-transition:transform .3s;transition:transform .3s; text-align:center; border-radius:10px; position:relative; z-index:999999; } #body_popup_1.open-popup > div,#body_popup_1.open-popup > div{ transform:translateY(0); } #body_popup_1 .icon-close-popup{ position:absolute; font-size:30px; height:30px; width:30px; border-radius:50%; color:red; top:-10px; right:-10px; background-color:transparent; z-index:9999; } #body_popup_1 .icon-close-popup i{ position:absolute; top:0; right:0; } #body_popup_1 .container-html{ height:100%; overflow:auto; max-height:90vh; } #body_popup_1 .container-html::-webkit-scrollbar{ width:5px; height:100%; } #body_popup_1 .container-html::-webkit-scrollbar-track{ background-color:transparent; } #body_popup_1 .container-html::-webkit-scrollbar-thumb{ background-color:#777; border-radius:20%; } #body_popup_1 .icon-close-popup{ color:#fff; top:0; right:0; } #module_waiting_box{ position:fixed; background:rgba(256,256,256,0.8); width:100%; height:100%; -webkit-transition:.3s;-moz-transition:.3s;-ms-transition:.3s;-o-transition:.3s;transition:.3s; top:0; right:0; opacity:0; z-index:9999999999999; visibility:hidden; } #module_waiting_box.show-waiting{ visibility:visible; opacity:1; } #module_waiting_box .spinner { margin: 100px auto 0; width: 70px; text-align: center; } #module_waiting_box .spinner > div { width: 18px; height: 18px; background-color: #333; border-radius: 100%; display: inline-block; -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both; animation: sk-bouncedelay 1.4s infinite ease-in-out both; } #module_waiting_box .spinner .bounce1 { -webkit-animation-delay: -0.35s; animation-delay: -0.35s; } #module_waiting_box .spinner .bounce2 { -webkit-animation-delay: -0.16s; animation-delay: -0.16s; } @-webkit-keyframes sk-bouncedelay { 0%, 95%, 100% { -webkit-transform: scale(0) } 50% { -webkit-transform: scale(1.0) } } @keyframes sk-bouncedelay { 0%, 95%, 100% { -webkit-transform: scale(0); transform: scale(0); } 50% { -webkit-transform: scale(1.0); transform: scale(1.0); } } body{direction: ltr;text-align: left;}