.elementor-1961 .elementor-element.elementor-element-655c30a5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1961 .elementor-element.elementor-element-8323c3b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:5px 5px;--row-gap:5px;--column-gap:5px;}.elementor-1961 .elementor-element.elementor-element-23e294e.elementor-element{--align-self:center;--flex-grow:0;--flex-shrink:1;}.elementor-1961 .elementor-element.elementor-element-23e294e{text-align:center;font-size:14px;font-weight:700;color:#5C8FDF;}.elementor-1961 .elementor-element.elementor-element-bec1a9f{text-align:center;}.elementor-1961 .elementor-element.elementor-element-bec1a9f .elementor-heading-title{font-weight:600;}.elementor-1961 .elementor-element.elementor-element-ab6d551{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-1961 .elementor-element.elementor-element-0b025d3{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1961 .elementor-element.elementor-element-2250ca6{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1961 .elementor-element.elementor-element-c258e29{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1961 .elementor-element.elementor-element-793a633{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1961 .elementor-element.elementor-element-4ec755f4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-1961 .elementor-element.elementor-element-39d3780{text-align:center;}.elementor-1961 .elementor-element.elementor-element-3070355{text-align:center;}.elementor-1961 .elementor-element.elementor-element-3070355 .elementor-heading-title{font-weight:600;}.elementor-1961 .elementor-element.elementor-element-5e10f9e7{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1961 .elementor-element.elementor-element-19505d1{text-align:center;}.elementor-1961 .elementor-element.elementor-element-5d7d1e2{text-align:center;}.elementor-1961 .elementor-element.elementor-element-5d7d1e2 .elementor-heading-title{font-weight:600;}.elementor-1961 .elementor-element.elementor-element-36235070{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-1961 .elementor-element.elementor-element-87cae9f{text-align:center;}.elementor-1961 .elementor-element.elementor-element-3802ca6{text-align:center;}.elementor-1961 .elementor-element.elementor-element-3802ca6 .elementor-heading-title{font-weight:600;}.elementor-1961 .elementor-element.elementor-element-42c8fb00{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;}.elementor-1961 .elementor-element.elementor-element-42c8fb00.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-1961 .elementor-element.elementor-element-bc1e960{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-1961 .elementor-element.elementor-element-99da318{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:10px 10px;--row-gap:10px;--column-gap:10px;}.elementor-1961 .elementor-element.elementor-element-0805c17 .elementor-icon-list-icon i{color:#1D4ED8;transition:color 0.3s;}.elementor-1961 .elementor-element.elementor-element-0805c17 .elementor-icon-list-icon svg{fill:#1D4ED8;transition:fill 0.3s;}.elementor-1961 .elementor-element.elementor-element-0805c17{--e-icon-list-icon-size:24px;--icon-vertical-offset:0px;}.elementor-1961 .elementor-element.elementor-element-0805c17 .elementor-icon-list-text{transition:color 0.3s;}.elementor-1961 .elementor-element.elementor-element-db4e1db .elementor-heading-title{font-weight:700;}.elementor-1961 .elementor-element.elementor-element-5cc7dca{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:10px 10px;--row-gap:10px;--column-gap:10px;}.elementor-1961 .elementor-element.elementor-element-9908d7b .elementor-icon-box-wrapper{align-items:center;gap:10px;}.elementor-1961 .elementor-element.elementor-element-9908d7b .elementor-icon-box-title{margin-block-end:5px;}.elementor-1961 .elementor-element.elementor-element-9908d7b.elementor-view-stacked .elementor-icon{background-color:#1D4ED8;}.elementor-1961 .elementor-element.elementor-element-9908d7b.elementor-view-framed .elementor-icon, .elementor-1961 .elementor-element.elementor-element-9908d7b.elementor-view-default .elementor-icon{fill:#1D4ED8;color:#1D4ED8;border-color:#1D4ED8;}.elementor-1961 .elementor-element.elementor-element-9908d7b .elementor-icon{font-size:30px;}.elementor-1961 .elementor-element.elementor-element-9908d7b .elementor-icon-box-title, .elementor-1961 .elementor-element.elementor-element-9908d7b .elementor-icon-box-title a{font-size:16px;font-weight:600;}.elementor-1961 .elementor-element.elementor-element-c9f3f97 .elementor-icon-box-wrapper{align-items:center;gap:15px;}.elementor-1961 .elementor-element.elementor-element-c9f3f97 .elementor-icon-box-title{margin-block-end:5px;}.elementor-1961 .elementor-element.elementor-element-c9f3f97.elementor-view-stacked .elementor-icon{background-color:#1D4ED8;}.elementor-1961 .elementor-element.elementor-element-c9f3f97.elementor-view-framed .elementor-icon, .elementor-1961 .elementor-element.elementor-element-c9f3f97.elementor-view-default .elementor-icon{fill:#1D4ED8;color:#1D4ED8;border-color:#1D4ED8;}.elementor-1961 .elementor-element.elementor-element-c9f3f97 .elementor-icon{font-size:30px;}.elementor-1961 .elementor-element.elementor-element-c9f3f97 .elementor-icon-box-title, .elementor-1961 .elementor-element.elementor-element-c9f3f97 .elementor-icon-box-title a{font-size:16px;font-weight:600;}.elementor-1961 .elementor-element.elementor-element-91be901 .elementor-icon-box-wrapper{align-items:center;gap:15px;}.elementor-1961 .elementor-element.elementor-element-91be901 .elementor-icon-box-title{margin-block-end:5px;}.elementor-1961 .elementor-element.elementor-element-91be901.elementor-view-stacked .elementor-icon{background-color:#1D4ED8;}.elementor-1961 .elementor-element.elementor-element-91be901.elementor-view-framed .elementor-icon, .elementor-1961 .elementor-element.elementor-element-91be901.elementor-view-default .elementor-icon{fill:#1D4ED8;color:#1D4ED8;border-color:#1D4ED8;}.elementor-1961 .elementor-element.elementor-element-91be901 .elementor-icon{font-size:30px;}.elementor-1961 .elementor-element.elementor-element-91be901 .elementor-icon-box-title, .elementor-1961 .elementor-element.elementor-element-91be901 .elementor-icon-box-title a{font-size:16px;font-weight:600;}.elementor-1961 .elementor-element.elementor-element-622901e .elementor-icon-box-wrapper{align-items:center;gap:15px;}.elementor-1961 .elementor-element.elementor-element-622901e .elementor-icon-box-title{margin-block-end:5px;}.elementor-1961 .elementor-element.elementor-element-622901e.elementor-view-stacked .elementor-icon{background-color:#1D4ED8;}.elementor-1961 .elementor-element.elementor-element-622901e.elementor-view-framed .elementor-icon, .elementor-1961 .elementor-element.elementor-element-622901e.elementor-view-default .elementor-icon{fill:#1D4ED8;color:#1D4ED8;border-color:#1D4ED8;}.elementor-1961 .elementor-element.elementor-element-622901e .elementor-icon{font-size:30px;}.elementor-1961 .elementor-element.elementor-element-622901e .elementor-icon-box-title, .elementor-1961 .elementor-element.elementor-element-622901e .elementor-icon-box-title a{font-size:16px;font-weight:600;}.elementor-1961 .elementor-element.elementor-element-d6b56fe .elementor-icon-box-wrapper{align-items:center;gap:15px;}.elementor-1961 .elementor-element.elementor-element-d6b56fe .elementor-icon-box-title{margin-block-end:5px;}.elementor-1961 .elementor-element.elementor-element-d6b56fe.elementor-view-stacked .elementor-icon{background-color:#1D4ED8;}.elementor-1961 .elementor-element.elementor-element-d6b56fe.elementor-view-framed .elementor-icon, .elementor-1961 .elementor-element.elementor-element-d6b56fe.elementor-view-default .elementor-icon{fill:#1D4ED8;color:#1D4ED8;border-color:#1D4ED8;}.elementor-1961 .elementor-element.elementor-element-d6b56fe .elementor-icon{transition-duration:0s;font-size:30px;}.elementor-1961 .elementor-element.elementor-element-d6b56fe .elementor-icon i{transform:rotate(0deg);}.elementor-1961 .elementor-element.elementor-element-d6b56fe .elementor-icon-box-title, .elementor-1961 .elementor-element.elementor-element-d6b56fe .elementor-icon-box-title a{font-size:16px;font-weight:600;}.elementor-1961 .elementor-element.elementor-element-09c86b0 .elementor-button{background-color:#6134B7;}.elementor-1961 .elementor-element.elementor-element-924fc80{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1961 .elementor-element.elementor-element-926ff65{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-1961 .elementor-element.elementor-element-76926e6{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:15px 15px;--row-gap:15px;--column-gap:15px;}.elementor-1961 .elementor-element.elementor-element-18e19f7{font-weight:600;}.elementor-1961 .elementor-element.elementor-element-028864f .elementor-heading-title{font-weight:700;}.elementor-1961 .elementor-element.elementor-element-c30bad4{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-1961 .elementor-element.elementor-element-9ad0ccc .elementor-icon-box-wrapper{gap:10px;}.elementor-1961 .elementor-element.elementor-element-9ad0ccc .elementor-icon{font-size:40px;}.elementor-1961 .elementor-element.elementor-element-9ad0ccc .elementor-icon-box-title, .elementor-1961 .elementor-element.elementor-element-9ad0ccc .elementor-icon-box-title a{font-size:20px;font-weight:600;}.elementor-1961 .elementor-element.elementor-element-b6e4464 .elementor-icon-box-wrapper{align-items:start;gap:10px;}.elementor-1961 .elementor-element.elementor-element-b6e4464 .elementor-icon{font-size:40px;}.elementor-1961 .elementor-element.elementor-element-b6e4464 .elementor-icon-box-title, .elementor-1961 .elementor-element.elementor-element-b6e4464 .elementor-icon-box-title a{font-size:20px;font-weight:600;}.elementor-1961 .elementor-element.elementor-element-c54ce99 .elementor-icon-box-wrapper{align-items:start;gap:10px;}.elementor-1961 .elementor-element.elementor-element-c54ce99 .elementor-icon{font-size:40px;}.elementor-1961 .elementor-element.elementor-element-c54ce99 .elementor-icon-box-title, .elementor-1961 .elementor-element.elementor-element-c54ce99 .elementor-icon-box-title a{font-size:20px;font-weight:600;}.elementor-1961 .elementor-element.elementor-element-281e0d1 .elementor-icon-box-wrapper{align-items:start;gap:10px;}.elementor-1961 .elementor-element.elementor-element-281e0d1 .elementor-icon{font-size:40px;}.elementor-1961 .elementor-element.elementor-element-281e0d1 .elementor-icon-box-title, .elementor-1961 .elementor-element.elementor-element-281e0d1 .elementor-icon-box-title a{font-size:20px;font-weight:600;}.elementor-1961 .elementor-element.elementor-element-c65aea4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1961 .elementor-element.elementor-element-26e7f92{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-1961 .elementor-element.elementor-element-7e07ef5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;}.elementor-1961 .elementor-element.elementor-element-e9ce16e .elementor-icon-box-wrapper{align-items:start;gap:15px;}.elementor-1961 .elementor-element.elementor-element-e9ce16e .elementor-icon-box-title, .elementor-1961 .elementor-element.elementor-element-e9ce16e .elementor-icon-box-title a{font-size:32px;font-weight:600;}.elementor-1961 .elementor-element.elementor-element-ada56d4{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:center;}.elementor-1961 .elementor-element.elementor-element-2203437{width:100%;max-width:100%;}.elementor-1961 .elementor-element.elementor-element-2203437 .elementor-button .elementor-button-content-wrapper{justify-content:center;}.elementor-1961 .elementor-element.elementor-element-0b51e25{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-1961 .elementor-element.elementor-element-0b51e25:not(.elementor-motion-effects-element-type-background), .elementor-1961 .elementor-element.elementor-element-0b51e25 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://myonlinetutor.ae/wp-content/uploads/2026/07/Background.png");}.elementor-1961 .elementor-element.elementor-element-7cd7568{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1961 .elementor-element.elementor-element-419b035{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:5px 5px;--row-gap:5px;--column-gap:5px;}.elementor-1961 .elementor-element.elementor-element-60660fd{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:5px 5px;--row-gap:5px;--column-gap:5px;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-1961 .elementor-element.elementor-element-8323c3b{--content-width:1350px;}.elementor-1961 .elementor-element.elementor-element-0b025d3{--width:25%;}.elementor-1961 .elementor-element.elementor-element-2250ca6{--width:25%;}.elementor-1961 .elementor-element.elementor-element-c258e29{--width:25%;}.elementor-1961 .elementor-element.elementor-element-793a633{--width:25%;}.elementor-1961 .elementor-element.elementor-element-4ec755f4{--content-width:1350px;}.elementor-1961 .elementor-element.elementor-element-5e10f9e7{--content-width:1350px;}.elementor-1961 .elementor-element.elementor-element-36235070{--content-width:1350px;}.elementor-1961 .elementor-element.elementor-element-bc1e960{--content-width:1350px;}.elementor-1961 .elementor-element.elementor-element-99da318{--width:40%;}.elementor-1961 .elementor-element.elementor-element-924fc80{--width:60%;}.elementor-1961 .elementor-element.elementor-element-926ff65{--content-width:1350px;}.elementor-1961 .elementor-element.elementor-element-76926e6{--width:65%;}.elementor-1961 .elementor-element.elementor-element-c65aea4{--width:35%;}.elementor-1961 .elementor-element.elementor-element-7e07ef5{--width:70%;}.elementor-1961 .elementor-element.elementor-element-ada56d4{--width:30%;}.elementor-1961 .elementor-element.elementor-element-7cd7568{--width:100%;}.elementor-1961 .elementor-element.elementor-element-419b035{--width:75%;}.elementor-1961 .elementor-element.elementor-element-60660fd{--width:75%;}}@media(max-width:1024px) and (min-width:768px){.elementor-1961 .elementor-element.elementor-element-99da318{--width:1600px;}.elementor-1961 .elementor-element.elementor-element-76926e6{--width:1600px;}}@media(max-width:1250px){.elementor-1961 .elementor-element.elementor-element-42c8fb00{width:var( --container-widget-width, 1191px );max-width:1191px;--container-widget-width:1191px;--container-widget-flex-grow:0;}}@media(max-width:1024px){.elementor-1961 .elementor-element.elementor-element-99da318{--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}}@media(max-width:767px){.elementor-1961 .elementor-element.elementor-element-76926e6{--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-1961 .elementor-element.elementor-element-18e19f7{text-align:center;}}/* Start custom CSS for html, class: .elementor-element-347e6994 *//* ===============================
   MyOnlineTutor Home Hero – FINAL CLEAN
   Color Updated Based on Premium-Luxury Palette
================================ */

.mot-home-hero-new{
  width:100vw !important;
  max-width:none !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;

  position:relative !important;
  overflow:hidden !important;

  min-height:680px !important;
  padding:80px 8vw 100px !important;

  background:
    linear-gradient(
      90deg,
      rgba(252,251,248,.94) 0%,
      rgba(252,251,248,.82) 0%,
      rgba(248,246,240,.40) 6%,
      rgba(248,246,240,0) 10%
    ),
    url("https://myonlinetutor.ae/wp-content/uploads/2026/08/Hero-Homepage.png") !important;

  background-size:cover !important;
  background-position:center right !important;
  background-repeat:no-repeat !important;
}

/* Disable old fog/noise overlay */
.mot-home-hero-new::after{
  display:none !important;
}

/* Layout */
.mot-home-hero-inner{
  width:min(1380px,100%) !important;
  min-height:50px !important;
  margin:0 auto !important;

  display:grid !important;
  grid-template-columns:.92fr 1.08fr !important;
  align-items:center !important;
  gap:56px !important;

  position:relative !important;
  z-index:2 !important;
}

.mot-home-hero-content{
  max-width:680px !important;
}

/* Badge */
.mot-hero-badge{
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
  padding:12px 18px !important;
  margin-bottom:24px !important;
  border-radius:999px !important;
  background:linear-gradient(90deg,#E9DDFB,#F8F6F0) !important;
  color:#6134B7 !important;
  font-size:15px !important;
  font-weight:700 !important;
  box-shadow:0 14px 35px rgba(97,52,183,.12) !important;
}

.mot-home-hero-new .mot-hero-title{
  margin:0 !important;
  max-width:720px !important;

  font-family:Inter, Arial, sans-serif !important;
  font-size:clamp(34px,4vw,54px) !important;
  line-height:1.02 !important;
  font-weight:720 !important;
  letter-spacing:-1.8px !important;
  color:#222222 !important;

  text-wrap:balance !important;
}

.mot-home-hero-new .mot-hero-title span{
  display:block !important;
  margin-top:4px !important;
}

.mot-home-hero-new .mot-hero-title-dark{
  color:#16191F !important;
  background:none !important;
  -webkit-text-fill-color:#16191F !important;
}

.mot-home-hero-new .mot-hero-title-gradient{
  background:linear-gradient(
    90deg,
    #4B22A8 0%,
    #6134B7 25%,
    #7A3EF2 48%,
    #B58A9A 72%,
    #D8B34F 100%
  ) !important;

  -webkit-background-clip:text !important;
  background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
  color:transparent !important;
}

.mot-home-hero-new .mot-hero-subtitle{
  margin:20px 0 0 !important;
  max-width:650px !important;

  font-size:18px !important;
  line-height:1.65 !important;
  font-weight:400 !important;
  color:#6B6B6B !important;
}

/* Buttons */
.mot-home-actions{
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:14px !important;
  margin-top:26px !important;
}

.mot-home-btn{
  min-height:56px !important;
  padding:0 28px !important;

  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:9px !important;

  position:relative !important;
  overflow:hidden !important;

  border-radius:16px !important;
  text-decoration:none !important;
  font-size:16px !important;
  font-weight:700 !important;
  line-height:1 !important;

  transition:all .25s ease !important;
}

.mot-home-btn-primary,
.mot-home-btn-secondary{
  background:linear-gradient(135deg,#6134B7 0%,#452197 100%) !important;
  color:#ffffff !important;
  border:1px solid rgba(97,52,183,.88) !important;

  box-shadow:
    0 16px 34px rgba(97,52,183,.30),
    inset 0 1px 0 rgba(255,255,255,.38) !important;

  text-shadow:0 1px 1px rgba(0,0,0,.14) !important;
}

.mot-home-btn-primary::before,
.mot-home-btn-secondary::before{
  content:"" !important;
  position:absolute !important;
  top:-45% !important;
  left:-85% !important;
  width:55% !important;
  height:190% !important;

  background:linear-gradient(
    120deg,
    transparent 0%,
    rgba(255,255,255,.18) 35%,
    rgba(255,255,255,.88) 50%,
    rgba(255,255,255,.18) 65%,
    transparent 100%
  ) !important;

  transform:skewX(-22deg) !important;
  transition:left .65s ease !important;
  pointer-events:none !important;
}

.mot-home-btn-primary:hover,
.mot-home-btn-secondary:hover{
  transform:translateY(-3px) !important;
  background:linear-gradient(135deg,#7A3EF2 0%,#6134B7 100%) !important;
  color:#ffffff !important;

  box-shadow:
    0 20px 42px rgba(97,52,183,.42),
    inset 0 1px 0 rgba(255,255,255,.50) !important;
}

.mot-home-btn-primary:hover::before,
.mot-home-btn-secondary:hover::before{
  left:130% !important;
}

/* Trust Strip */
.mot-home-hero-new .mot-hero-trust-strip{
  margin-top:26px !important;
  max-width:610px !important;
  padding:9px 12px !important;

  display:grid !important;
  grid-template-columns:repeat(4,1fr) !important;
  gap:6px !important;

  background:rgba(248,246,240,.68) !important;
  border:1px solid rgba(184,160,90,.22) !important;
  border-radius:16px !important;

  box-shadow:
    0 12px 32px rgba(69,33,151,.08),
    inset 0 1px 0 rgba(255,255,255,.75) !important;

  backdrop-filter:blur(16px) !important;
  -webkit-backdrop-filter:blur(16px) !important;
}

.mot-home-hero-new .mot-trust-item{
  display:flex !important;
  align-items:center !important;
  gap:7px !important;

  padding:4px 8px !important;
  border-radius:12px !important;
  border-right:1px solid rgba(184,160,90,.18) !important;

  transition:transform .28s ease, background .28s ease, box-shadow .28s ease !important;
}

.mot-home-hero-new .mot-trust-item:last-child{
  border-right:none !important;
}

.mot-home-hero-new .mot-trust-item:hover{
  transform:translateY(-3px) scale(1.015) !important;
  background:rgba(255,255,255,.58) !important;
  box-shadow:0 10px 24px rgba(97,52,183,.11) !important;
}

.mot-home-hero-new .mot-trust-icon{
  width:27px !important;
  height:27px !important;
  min-width:27px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  border-radius:10px !important;
  background:radial-gradient(circle at 30% 20%,#ffffff 0%,#F8F6F0 42%,#E9DDFB 100%) !important;

  box-shadow:
    0 7px 14px rgba(97,52,183,.14),
    inset 0 1px 0 rgba(255,255,255,.95),
    inset 0 -1px 0 rgba(184,160,90,.14) !important;

  font-size:14px !important;
  line-height:1 !important;

  animation:motTrustFloat 4.5s ease-in-out infinite !important;
  transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease, filter .35s ease !important;
}

.mot-home-hero-new .mot-trust-item:nth-child(2) .mot-trust-icon{ animation-delay:.5s !important; }
.mot-home-hero-new .mot-trust-item:nth-child(3) .mot-trust-icon{ animation-delay:1s !important; }
.mot-home-hero-new .mot-trust-item:nth-child(4) .mot-trust-icon{ animation-delay:1.5s !important; }

.mot-home-hero-new .mot-trust-item:hover .mot-trust-icon{
  transform:translateY(-2px) rotateX(14deg) rotateY(-16deg) scale(1.08) !important;

  box-shadow:
    0 12px 22px rgba(97,52,183,.20),
    inset 0 1px 0 rgba(255,255,255,1),
    inset 0 -2px 0 rgba(184,160,90,.16) !important;

  filter:saturate(1.15) !important;
}

.mot-home-hero-new .mot-trust-item strong{
  display:block !important;
  margin-bottom:1px !important;

  font-size:10.8px !important;
  line-height:1.15 !important;
  font-weight:750 !important;
  color:#222222 !important;
  white-space:nowrap !important;
}

.mot-home-hero-new .mot-trust-item p{
  margin:0 !important;
  font-size:9.4px !important;
  line-height:1.28 !important;
  color:#6B6B6B !important;
  white-space:nowrap !important;
}

/* Visual image column */
.mot-home-visual{
  position:relative !important;
  max-height:720px !important;
  perspective:1400px !important;
  isolation:isolate !important;
}

.mot-home-visual::before{
  content:"" !important;
  position:absolute !important;
  inset:18% 10% 8% 10% !important;
  z-index:0 !important;
  pointer-events:none !important;

  background:radial-gradient(circle,rgba(97,52,183,.18),transparent 65%) !important;
  filter:blur(55px) !important;
}

.mot-visual-card{
  position:relative !important;
  z-index:2 !important;

  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  padding:0 !important;
  overflow:visible !important;

  transform-style:preserve-3d !important;
  animation:motPremiumFloat 10s ease-in-out infinite !important;
  will-change:transform !important;
}

.mot-visual-card img{
  width:100% !important;
  max-height:700px !important;
  display:block !important;

  object-fit:contain !important;
  border-radius:0 !important;
  box-shadow:none !important;

  filter:saturate(1.04) contrast(1.01) !important;
}

/* Animations */
@keyframes motPremiumFloat{
  0%,100%{ transform:translate3d(0,0,0); }
  20%{ transform:translate3d(8px,-6px,0); }
  45%{ transform:translate3d(14px,4px,0); }
  70%{ transform:translate3d(-8px,-10px,0); }
}

@keyframes motTrustFloat{
  0%,100%{ transform:translateY(0) rotateZ(0deg); }
  50%{ transform:translateY(-2px) rotateZ(2deg); }
}

/* Tablet */
@media(max-width:1024px){
  .mot-home-hero-new{
    min-height:auto !important;
    padding:56px 5vw 64px !important;
    background-position:center right !important;
  }

  .mot-home-hero-inner{
    min-height:auto !important;
    grid-template-columns:1fr !important;
    gap:0 !important;
    text-align:center !important;
  }

  .mot-home-hero-content{
    max-width:760px !important;
    margin:0 auto !important;
  }

  .mot-home-actions{
    justify-content:center !important;
  }

  .mot-home-hero-new .mot-hero-trust-strip{
    margin:24px auto 0 !important;
  }

  .mot-home-visual,
  .mot-visual-card,
  .mot-visual-card img{
    display:none !important;
    visibility:hidden !important;
    height:0 !important;
    max-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
  }
}

/* Mobile */
@media(max-width:767px){
  .mot-home-hero-new{
    padding:34px 22px 38px !important;
  }

  .mot-hero-badge{
    display:none !important;
  }

  .mot-home-hero-new .mot-hero-title{
    font-size:34px !important;
    line-height:1.1 !important;
    letter-spacing:-1px !important;
  }

  .mot-home-hero-new .mot-hero-subtitle{
    margin-top:16px !important;
    font-size:15.5px !important;
    line-height:1.55 !important;
  }

  .mot-home-actions{
    width:100% !important;
    margin-top:22px !important;
    gap:12px !important;
  }

  .mot-home-btn{
    width:100% !important;
    min-height:52px !important;
    border-radius:15px !important;
  }

  .mot-home-hero-new .mot-hero-trust-strip{
    grid-template-columns:repeat(2,1fr) !important;
    max-width:100% !important;
    padding:10px !important;
    gap:8px !important;
  }

  .mot-home-hero-new .mot-trust-item{
    border-right:none !important;
    padding:6px 8px !important;
  }
}

.mot-hero-script{
  margin:14px 0 0 !important;

  font-family:'Dancing Script', cursive !important;
 font-size:clamp(26px,3.6vw,38px) !important;
  line-height:1.05 !important;
  font-weight:700 !important;

  color:#ffffff !important;
  letter-spacing:.1px !important;

  text-shadow:0 8px 20px rgba(184,160,90,.22) !important;
}

@media(max-width:767px){

  .mot-home-hero-content{
    position:relative !important;
    z-index:2 !important;

    padding:26px 18px 22px !important;
    border-radius:28px !important;

    background:rgba(248,246,240,.58) !important;
    backdrop-filter:blur(10px) saturate(1.15) !important;
    -webkit-backdrop-filter:blur(10px) saturate(1.15) !important;

    border:1px solid rgba(255,255,255,.55) !important;

    box-shadow:
      0 20px 45px rgba(69,33,151,.16),
      inset 0 1px 0 rgba(255,255,255,.75) !important;
  }

  .mot-home-hero-new .mot-hero-title{
    color:#222222 !important;
    text-shadow:0 2px 12px rgba(255,255,255,.50) !important;
  }

  .mot-home-hero-new .mot-hero-subtitle{
    color:#444444 !important;
    font-weight:500 !important;
    text-shadow:0 1px 8px rgba(255,255,255,.58) !important;
  }

  .mot-hero-script{
    color:#ffffff !important;
    text-shadow:0 2px 14px rgba(255,255,255,.58) !important;
  }
}


/* =========================================================
   MyOnlineTutor Home Hero – TABLET FIX
   Range: 768px to 1024px
========================================================= */

@media (min-width:768px) and (max-width:1024px){

  .mot-home-hero-new{
    width:100vw !important;
    min-height:auto !important;

    padding:52px 34px 58px !important;

    background:
      linear-gradient(
        90deg,
        rgba(252,251,248,.94) 0%,
        rgba(252,251,248,.90) 42%,
        rgba(248,246,240,.78) 68%,
        rgba(248,246,240,.62) 100%
      ),
      url("https://myonlinetutor.com/wp-content/uploads/2026/06/N-Home-page.png") !important;

    background-size:cover !important;
    background-position:68% center !important;
    background-repeat:no-repeat !important;
  }

  .mot-home-hero-inner{
    width:100% !important;
    max-width:900px !important;
    min-height:auto !important;

    display:block !important;
    margin:0 auto !important;

    text-align:center !important;
  }

  .mot-home-hero-content{
    width:100% !important;
    max-width:720px !important;
    margin:0 auto !important;

    position:relative !important;
    z-index:5 !important;

    padding:34px 36px 30px !important;
    border-radius:30px !important;

    background:rgba(255,255,255,.72) !important;

    border:1px solid rgba(255,255,255,.82) !important;

    box-shadow:
      0 24px 60px rgba(69,33,151,.16),
      inset 0 1px 0 rgba(255,255,255,.95) !important;

    backdrop-filter:blur(16px) saturate(1.08) !important;
    -webkit-backdrop-filter:blur(16px) saturate(1.08) !important;
  }

  .mot-hero-badge{
    margin-bottom:20px !important;
    padding:10px 17px !important;

    font-size:14px !important;
  }

  .mot-home-hero-new .mot-hero-title{
    max-width:680px !important;
    margin:0 auto !important;

    font-size:clamp(38px,5vw,50px) !important;
    line-height:1.06 !important;
    letter-spacing:-1.4px !important;

    color:#16191f !important;
    text-shadow:0 2px 14px rgba(255,255,255,.80) !important;
  }

  .mot-home-hero-new .mot-hero-subtitle{
    max-width:620px !important;
    margin:18px auto 0 !important;

    font-size:17px !important;
    line-height:1.6 !important;
    font-weight:500 !important;

    color:#454545 !important;
  }

  .mot-home-actions{
    width:100% !important;

    justify-content:center !important;
    flex-wrap:wrap !important;

    margin-top:24px !important;
    gap:13px !important;
  }

  .mot-home-btn{
    min-width:205px !important;
    min-height:54px !important;

    padding:0 25px !important;
  }

  .mot-home-hero-new .mot-hero-trust-strip{
    width:100% !important;
    max-width:610px !important;

    grid-template-columns:repeat(2,minmax(0,1fr)) !important;

    margin:24px auto 0 !important;
    padding:11px !important;
    gap:8px !important;

    background:rgba(255,255,255,.72) !important;
  }

  .mot-home-hero-new .mot-trust-item{
    min-width:0 !important;

    padding:7px 10px !important;

    border-right:none !important;
    text-align:left !important;
  }

  .mot-home-hero-new .mot-trust-item strong{
    font-size:11px !important;
    white-space:normal !important;
  }

  .mot-home-hero-new .mot-trust-item p{
    font-size:9.5px !important;
    white-space:normal !important;
  }

  /*
   * Visual column is intentionally disabled on tablet,
   * because the image is already used as Hero background.
   */
  .mot-home-visual,
  .mot-visual-card,
  .mot-visual-card img{
    display:none !important;
    visibility:hidden !important;

    width:0 !important;
    height:0 !important;
    max-height:0 !important;

    margin:0 !important;
    padding:0 !important;
  }
}





/* =========================================================
   MyOnlineTutor Hero
   PREMIUM CINEMATIC ENTRANCE 2026
   ========================================================= */


/* 1. Badge - enters softly from left */
@keyframes motHeroRevealLeft {
  0% {
    opacity: 0;
    transform: translate3d(-28px, 10px, 0);
    filter: blur(5px);
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    filter: blur(0);
  }
}


/* 2. Main content - elegant upward reveal */
@keyframes motHeroRevealUp {
  0% {
    opacity: 0;
    transform: translate3d(0, 18px, 0);
    filter: blur(4px);
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    filter: blur(0);
  }
}


/* 3. CTA Buttons - subtle premium spring */
@keyframes motHeroButtonsReveal {
  0% {
    opacity: 0;
    transform: translate3d(0, 18px, 0) scale(.965);
  }

  70% {
    opacity: 1;
    transform: translate3d(0, -2px, 0) scale(1.008);
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}


/* 4. Trust strip - glass panel reveal */
@keyframes motHeroTrustReveal {
  0% {
    opacity: 0;
    transform: translate3d(0, 16px, 0) scale(.975);
    filter: blur(4px);
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
  }
}


/* 5. Small trust items */
@keyframes motHeroTrustItemReveal {
  0% {
    opacity: 0;
    transform: translateY(7px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}


/* =========================================================
   STAGGER SEQUENCE
   PREMIUM SLOW VERSION
   Total visual sequence ≈ 2.3s
   ========================================================= */


/* Badge */
.mot-home-hero-new .mot-hero-badge {
  animation:
    motHeroRevealLeft
    .95s
    cubic-bezier(.16, 1, .3, 1)
    .05s
    both !important;
}


/* First headline */
.mot-home-hero-new .mot-hero-title-dark {
  animation:
    motHeroRevealUp
    1.05s
    cubic-bezier(.16, 1, .3, 1)
    .25s
    both !important;
}


/* Gradient headline */
.mot-home-hero-new .mot-hero-title-gradient {
  animation:
    motHeroRevealUp
    1.08s
    cubic-bezier(.16, 1, .3, 1)
    .45s
    both !important;
}


/* Subtitle */
.mot-home-hero-new .mot-hero-subtitle {
  animation:
    motHeroRevealUp
    .98s
    cubic-bezier(.16, 1, .3, 1)
    .70s
    both !important;
}


/* CTA group */
.mot-home-hero-new .mot-home-actions {
  animation:
    motHeroButtonsReveal
    .98s
    cubic-bezier(.16, 1, .3, 1)
    .95s
    both !important;
}


/* Trust container */
.mot-home-hero-new .mot-hero-trust-strip {
  animation:
    motHeroTrustReveal
    1s
    cubic-bezier(.16, 1, .3, 1)
    1.18s
    both !important;
}


/* Individual Trust items */

.mot-home-hero-new .mot-trust-item:nth-child(1) {
  animation:
    motHeroTrustItemReveal
    .72s
    cubic-bezier(.16, 1, .3, 1)
    1.40s
    both !important;
}

.mot-home-hero-new .mot-trust-item:nth-child(2) {
  animation:
    motHeroTrustItemReveal
    .72s
    cubic-bezier(.16, 1, .3, 1)
    1.50s
    both !important;
}

.mot-home-hero-new .mot-trust-item:nth-child(3) {
  animation:
    motHeroTrustItemReveal
    .72s
    cubic-bezier(.16, 1, .3, 1)
    1.60s
    both !important;
}

.mot-home-hero-new .mot-trust-item:nth-child(4) {
  animation:
    motHeroTrustItemReveal
    .72s
    cubic-bezier(.16, 1, .3, 1)
    1.70s
    both !important;
}



/* =========================================================
   TABLET + MOBILE
   centered content should rise instead of coming from side
   ========================================================= */

@media (max-width: 1024px) {

  .mot-home-hero-new .mot-hero-badge {
    animation-name: motHeroRevealUp !important;
  }

}


/* =========================================================
   ACCESSIBILITY
   Respect user's Reduced Motion preference
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  .mot-home-hero-new .mot-hero-badge,
  .mot-home-hero-new .mot-hero-title-dark,
  .mot-home-hero-new .mot-hero-title-gradient,
  .mot-home-hero-new .mot-hero-subtitle,
  .mot-home-hero-new .mot-home-actions,
  .mot-home-hero-new .mot-hero-trust-strip,
  .mot-home-hero-new .mot-trust-item,
  .mot-home-hero-new .mot-trust-icon {

    animation: none !important;

    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
  }

}




/* =========================================================
   MyOnlineTutor Hero
   BACKGROUND FIRST → CONTENT AFTER
   CSS ONLY
   ========================================================= */

/*
 * Give the hero background a short visual head-start
 * before the entrance animations begin.
 */

.mot-home-hero-new{
    background-color:#F8F6F0 !important;
}


/* Badge */
.mot-home-hero-new .mot-hero-badge{
    animation-delay:.80s !important;
}


/* First headline */
.mot-home-hero-new .mot-hero-title-dark{
    animation-delay:1.00s !important;
}


/* Gradient headline */
.mot-home-hero-new .mot-hero-title-gradient{
    animation-delay:1.20s !important;
}


/* Subtitle */
.mot-home-hero-new .mot-hero-subtitle{
    animation-delay:1.45s !important;
}


/* Buttons */
.mot-home-hero-new .mot-home-actions{
    animation-delay:1.70s !important;
}


/* Trust Strip */
.mot-home-hero-new .mot-hero-trust-strip{
    animation-delay:1.95s !important;
}


/* Trust Items */
.mot-home-hero-new .mot-trust-item:nth-child(1){
    animation-delay:2.15s !important;
}

.mot-home-hero-new .mot-trust-item:nth-child(2){
    animation-delay:2.25s !important;
}

.mot-home-hero-new .mot-trust-item:nth-child(3){
    animation-delay:2.35s !important;
}

.mot-home-hero-new .mot-trust-item:nth-child(4){
    animation-delay:2.45s !important;
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-23e294e */.elementor-1961 .elementor-element.elementor-element-23e294e{
    position:relative;
    overflow:hidden;
    padding:10px 28px;
    border-radius:999px;

    background:#fff;
    border:1px solid #e8ecff;

    box-shadow:
      0 10px 30px rgba(20,40,90,.08);

    transition:.35s;
}

.elementor-1961 .elementor-element.elementor-element-23e294e:before{
    content:"";
    position:absolute;
    top:0;
    left:-100%;
    width:100%;
    height:100%;

    background:linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,.8),
      transparent
    );

    transition:.8s;
}

.elementor-1961 .elementor-element.elementor-element-23e294e:hover:before{
    left:100%;
}

.elementor-1961 .elementor-element.elementor-element-23e294e:hover{
    transform:translateY(-4px);
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-bec1a9f */.elementor-1961 .elementor-element.elementor-element-bec1a9f{
  position: relative;
  display: inline-block;
  padding-bottom: 26px;
}

.elementor-1961 .elementor-element.elementor-element-bec1a9f::after{
  content: "✦";
  position: absolute;
  left: 50%;
  bottom: 2px;
  transform: translateX(-50%);

  color: #d4af37;
  font-size: 15px;
  text-shadow: 0 0 14px rgba(212,175,55,.6);
}

.elementor-1961 .elementor-element.elementor-element-bec1a9f::before{
  content: "";
  position: absolute;
  left: 50%;
  bottom: 10px;
  transform: translateX(-50%);

  width: 220px;
  height: 2px;

  background: linear-gradient(
    90deg,
    transparent,
    #d4af37,
    #fff1a8,
    transparent,
    #fff1a8,
    #d4af37,
    transparent
  );

  border-radius: 999px;
  box-shadow: 0 0 16px rgba(212,175,55,.38);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-ab6d551 */.mot-feature-card{
  text-align: center;
  padding: 24px 18px;
}

.mot-feature-card img{
  width: 100%;
  max-width: 220px;
  height: auto;
  margin: 0 auto 18px;
  display: block;
}

.mot-feature-card h3{
  font-size: 22px;
  font-weight: 700;
  color: #102A43;
  margin: 0 0 10px;
}

.mot-feature-card p{
  font-size: 15px;
  line-height: 1.6;
  color: #5F6C7B;
  margin: 0;
}
.mot-features-parent{
  align-items: stretch !important;
}

.mot-features-parent > .e-con,
.mot-features-parent > .elementor-element{
  display: flex !important;
}

.mot-feature-card{
  position: relative;
  height: 100%;
  min-height: 430px;
  padding: 18px 18px 30px;
  text-align: center;
  border-radius: 28px;
  overflow: hidden;

  background:
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,251,255,.88));
  border: 1px solid rgba(255,255,255,.75);

  box-shadow:
    0 22px 55px rgba(15, 35, 60, .13),
    inset 0 1px 0 rgba(255,255,255,.95);

  transform: translateY(0);
  transition: all .45s ease;
}

.mot-feature-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 20% 0%, rgba(120,160,255,.22), transparent 35%),
    radial-gradient(circle at 85% 18%, rgba(255,205,120,.20), transparent 32%);
  opacity:.75;
  pointer-events:none;
}

.mot-feature-card:hover{
  transform: translateY(-12px) scale(1.025);
  box-shadow:
    0 32px 75px rgba(15, 35, 60, .20),
    0 10px 25px rgba(80,120,200,.13);
}

.mot-feature-card img{
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 250px;
  height: 160px;
  object-fit: cover;
  display: block;
  margin: 0 auto 24px;
  border-radius: 22px;

  box-shadow:
    0 18px 35px rgba(15,35,60,.18),
    0 4px 12px rgba(255,255,255,.8);

  transition: all .45s ease;
}

.mot-feature-card:hover img{
  transform: translateY(-6px) scale(1.04);
  box-shadow:
    0 25px 45px rgba(15,35,60,.25);
}

.mot-feature-card h4{
  position: relative;
  z-index: 2;
  font-size: 25px;
  line-height: 1.18;
  font-weight: 850;
  color: #102A43;
  margin: 0 0 14px;
  letter-spacing: -0.6px;
}

.mot-feature-card p{
  position: relative;
  z-index: 2;
  font-size: 16px;
  line-height: 1.75;
  color: #5F6C7B;
  margin: 0 auto;
  max-width: 260px;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-3070355 */.elementor-1961 .elementor-element.elementor-element-3070355{
  position: relative;
  display: inline-block;
  padding-bottom: 26px;
}

.elementor-1961 .elementor-element.elementor-element-3070355::after{
  content: "✦";
  position: absolute;
  left: 50%;
  bottom: 2px;
  transform: translateX(-50%);

  color: #d4af37;
  font-size: 15px;
  text-shadow: 0 0 14px rgba(212,175,55,.6);
}

.elementor-1961 .elementor-element.elementor-element-3070355::before{
  content: "";
  position: absolute;
  left: 50%;
  bottom: 10px;
  transform: translateX(-50%);

  width: 220px;
  height: 2px;

  background: linear-gradient(
    90deg,
    transparent,
    #d4af37,
    #fff1a8,
    transparent,
    #fff1a8,
    #d4af37,
    transparent
  );

  border-radius: 999px;
  box-shadow: 0 0 16px rgba(212,175,55,.38);
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-10564f97 */.mot-home-popular-subjects {
    max-width: 1280px;
    margin: 55px auto;
    padding: 20px 22px 45px;
    font-family: Inter, Arial, sans-serif;
    text-align: center;
}

.mot-home-subjects-head {
    text-align: center;
    margin-bottom: 34px;
}

.mot-home-subjects-badge {
    display: none !important;
}

.mot-home-subjects-head h2 {
    margin: 0 0 12px;
    font-size: clamp(30px, 3vw, 38px);
    line-height: 1.15;
    font-weight: 800;
    color: #07123f;
    letter-spacing: -0.025em;
}

.mot-home-subjects-head p {
    margin: 0 auto;
    max-width: 620px;
    color: #40516f;
    font-size: 16px;
    line-height: 1.6;
}

.mot-home-subjects-grid {
    display: grid !important;
    grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
    gap: 16px !important;
    max-width: 1200px;
    margin: 34px auto 0;
    align-items: stretch;
}

.mot-home-subject-card {
    position: relative;
    min-height: 135px !important;
    padding: 22px 10px 18px !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    border: 1px solid #e5ebf6 !important;
    box-shadow: 0 10px 26px rgba(15, 35, 80, 0.045) !important;
    text-decoration: none !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden;
    transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}

.mot-home-subject-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        120deg,
        transparent 20%,
        rgba(49, 92, 246, 0.08),
        transparent 80%
    );
    transform: translateX(-120%);
    transition: transform .65s ease;
    pointer-events: none;
}

.mot-home-subject-card:hover {
    transform: translateY(-5px);
    border-color: #315cf6 !important;
    box-shadow: 0 18px 42px rgba(49, 92, 246, 0.13) !important;
}

.mot-home-subject-card:hover::before {
    transform: translateX(120%);
}

.mot-home-subject-card.is-featured {
    border-color: #e5ebf6 !important;
}

.mot-home-subject-icon {
    width: 48px !important;
    height: 48px !important;
    border-radius: 12px !important;
    background: #f5f8ff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 16px !important;
    box-shadow: inset 0 0 0 1px #e2e9f6 !important;
    position: relative;
    z-index: 2;
}

.mot-home-subject-icon img {
    width: 28px !important;
    height: 28px !important;
    object-fit: contain !important;
    display: block !important;
}

.mot-home-subject-icon span {
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #315cf6 !important;
}

.mot-home-subject-card h3 {
    margin: 0 !important;
    color: #07123f !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
    text-align: center !important;
    position: relative;
    z-index: 2;
}

.mot-home-subjects-footer {
    text-align: center;
    margin-top: 28px;
}

.mot-home-subjects-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;
    min-height: 46px !important;
    padding: 0 24px !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    color: #315cf6 !important;
    border: 1px solid #dfe7f5 !important;
    text-decoration: none !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    box-shadow: 0 8px 22px rgba(15, 35, 80, 0.04) !important;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.mot-home-subjects-btn:hover {
    transform: translateY(-2px);
    border-color: #315cf6 !important;
    box-shadow: 0 14px 32px rgba(49, 92, 246, 0.12) !important;
}

.mot-home-subjects-btn span {
    font-size: 20px;
    line-height: 1;
}

.mot-home-subjects-footer p {
    display: none !important;
}

/* Tablet */
@media (max-width: 1200px) {
    .mot-home-subjects-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        max-width: 760px;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .mot-home-popular-subjects {
        margin: 42px auto;
        padding: 12px 16px 35px;
    }

    .mot-home-subjects-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 14px !important;
        max-width: 100%;
    }

    .mot-home-subject-card {
        min-height: 125px !important;
    }
}

/* Small Mobile */
@media (max-width: 420px) {
    .mot-home-subjects-grid {
        grid-template-columns: 1fr !important;
    }
}
.mot-home-subjects-head {
    text-align: center;
    margin-bottom: 30px;
}

.mot-home-subjects-head h2 {
    margin: 0 0 10px !important;
    font-size: 32px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    color: #0b2a5b !important;
    letter-spacing: -0.015em !important;
}

.mot-home-subjects-head p {
    margin: 0 auto !important;
    max-width: 560px !important;
    color: #51627f !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    font-weight: 400 !important;
}
/* Reduce top/bottom spacing - Popular Subjects */
.mot-home-popular-subjects {
  margin: 25px auto !important;
  padding: 8px 22px 22px !important;
}

.mot-home-subjects-head {
  margin-bottom: 20px !important;
}

.mot-home-subjects-grid {
  margin-top: 22px !important;
}

.mot-home-subjects-footer {
  margin-top: 20px !important;
}
/* FIX FONT WEIGHT */

.mot-home-subject-card h3 {
  font-weight: 600 !important;
}

.mot-home-subjects-head h2 {
  font-weight: 700 !important;
}
/* Icon hover animation - Popular Subjects */

.mot-home-subject-icon {
  transition: transform .45s ease, box-shadow .45s ease, background .45s ease !important;
}

.mot-home-subject-icon img,
.mot-home-subject-icon span {
  transition: transform .45s ease !important;
}

.mot-home-subject-card:hover .mot-home-subject-icon {
  transform: translateY(-6px) rotate(8deg) scale(1.08) !important;
  background: #eef4ff !important;
  box-shadow: 0 12px 26px rgba(49, 92, 246, 0.16) !important;
}

.mot-home-subject-card:hover .mot-home-subject-icon img,
.mot-home-subject-card:hover .mot-home-subject-icon span {
  transform: rotate(-14deg) scale(1.12) !important;
}



.mot-home-subjects-head h2{
  position: relative;
  display: inline-block;
  padding-bottom: 28px !important;
}

/* Gold Diamond */
.mot-home-subjects-head h2::before{
  content:"✦";
  position:absolute;
  left:50%;
  bottom:2px;
  transform:translateX(-50%);

  color:#D4AF37;
  font-size:14px;

  text-shadow:
    0 0 10px rgba(212,175,55,.45);
}

/* Premium Double Line */
.mot-home-subjects-head h2::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:10px;
  transform:translateX(-50%);

  width:180px;
  height:2px;

  background:
  linear-gradient(
    90deg,
    transparent 0%,
    #D4AF37 20%,
    #F8E39B 40%,
    transparent 50%,
    #F8E39B 60%,
    #D4AF37 80%,
    transparent 100%
  );

  border-radius:999px;

  box-shadow:
    0 0 14px rgba(212,175,55,.30);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-4ec755f4 */.mot-subjects-section{

    background-image:url("https://myonlinetutor.com/wp-content/uploads/2026/06/myonlinetutor-Popular-Subjects.png");

    background-position:center center;
    background-repeat:no-repeat;
    background-size:cover;

    border-radius:32px;

    padding:8px 40px;

    overflow:hidden;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-5d7d1e2 */.elementor-1961 .elementor-element.elementor-element-5d7d1e2{
  position: relative;
  display: inline-block;
  padding-bottom: 26px;
}

.elementor-1961 .elementor-element.elementor-element-5d7d1e2::after{
  content: "✦";
  position: absolute;
  left: 50%;
  bottom: 2px;
  transform: translateX(-50%);

  color: #d4af37;
  font-size: 15px;
  text-shadow: 0 0 14px rgba(212,175,55,.6);
}

.elementor-1961 .elementor-element.elementor-element-5d7d1e2::before{
  content: "";
  position: absolute;
  left: 50%;
  bottom: 10px;
  transform: translateX(-50%);

  width: 220px;
  height: 2px;

  background: linear-gradient(
    90deg,
    transparent,
    #d4af37,
    #fff1a8,
    transparent,
    #fff1a8,
    #d4af37,
    transparent
  );

  border-radius: 999px;
  box-shadow: 0 0 16px rgba(212,175,55,.38);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-63f75def */.mot-how-strip {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background: #ffffff;
  padding: 48px 20px 58px;
  font-family: Inter, Arial, sans-serif;
}

.mot-how-inner {
  max-width: 1280px;
  margin: 0 auto;
}

.mot-how-head {
  text-align: center;
  margin-bottom: 42px;
}

.mot-how-head h2 {
  margin: 0 0 10px;
  font-size: 31px;
  font-weight: 800;
  color: #222222;
  letter-spacing: -0.03em;
}

.mot-how-head p {
  margin: 0;
  font-size: 15px;
  color: #6B6B6B;
}

.mot-how-row {
  display: grid;
  grid-template-columns: 1fr 90px 1fr 90px 1fr;
  align-items: center;
  gap: 8px;
}

.mot-how-item {
  display: grid;
  grid-template-columns: 34px 100px 1fr;
  align-items: center;
  gap: 16px;
}

.mot-num {
  width: 29px;
  height: 29px;
  border-radius: 50%;
  background: #F7F4FD;
  color: #6134B7;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 800;
}

.mot-icon {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #ffffff, #F7F4FD);
  border: 1px solid rgba(97,52,183,.12);
  box-shadow:
    0 10px 25px rgba(97,52,183,.09),
    inset 0 0 0 1px rgba(255,255,255,0.85);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  transition: box-shadow 0.35s ease, border-color 0.35s ease;
  animation: mot-float-strong 2.8s ease-in-out infinite;
}

.mot-icon::after {
  content: "";
  position: absolute;
  width: 112%;
  height: 112%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(97,52,183,0.16), transparent 70%);
  opacity: 0.42;
  z-index: 0;
  animation: mot-glow-pulse 2.8s ease-in-out infinite;
}

.mot-icon svg {
  width: 42px;
  height: 42px;
  fill: none;
  stroke: #6134B7;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  position: relative;
  z-index: 2;
  transition: transform 0.3s ease;
}

.mot-how-item:hover .mot-icon {
  animation-play-state: paused;
  transform: translateY(-12px) scale(1.06);
  border-color: rgba(97,52,183,.22);
  box-shadow:
    0 22px 52px rgba(97,52,183,.18),
    0 0 0 7px rgba(233,221,251,.45);
}

.mot-how-item:hover .mot-icon::after {
  opacity: 1;
}

.mot-how-item:hover .mot-icon svg {
  transform: scale(1.1);
}

@keyframes mot-float-strong {
  0%, 100% {
    transform: translateY(0) scale(1);
  }

  50% {
    transform: translateY(-12px) scale(1.03);
  }
}

@keyframes mot-glow-pulse {
  0%, 100% {
    opacity: 0.28;
    transform: scale(0.95);
  }

  50% {
    opacity: 0.52;
    transform: scale(1.08);
  }
}

.mot-how-item h3 {
  margin: 0 0 9px;
  color: #222222;
  font-size: 17px;
  font-weight: 800;
}

.mot-how-item p {
  margin: 0;
  color: #6B6B6B;
  font-size: 14px;
  line-height: 1.65;
  max-width: 260px;
}

.mot-dots {
  border-top: 3px dotted #D8DDE8;
  width: 100%;
}

@media (max-width: 900px) {
  .mot-how-row {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .mot-dots {
    display: none;
  }

  .mot-how-item {
    max-width: 520px;
    margin: 0 auto;
  }
}

@media (max-width: 560px) {
  .mot-how-strip {
    padding: 38px 18px;
  }

  .mot-how-head h2 {
    font-size: 25px;
  }

  .mot-how-item {
    grid-template-columns: 30px 76px 1fr;
    gap: 12px;
  }

  .mot-icon {
    width: 72px;
    height: 72px;
  }

  .mot-icon svg {
    width: 34px;
    height: 34px;
  }
}

/* Premium Gold Divider */

.mot-how-head h2{
  position: relative;
  display: inline-block;
  padding-bottom: 30px;
}

.mot-how-head h2::before{
  content:"✦";
  position:absolute;
  left:50%;
  bottom:2px;
  transform:translateX(-50%);

  color:#B8A05A;
  font-size:14px;

  text-shadow:
    0 0 12px rgba(184,160,90,.35);
}

.mot-how-head h2::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:10px;
  transform:translateX(-50%);

  width:180px;
  height:2px;

  background:
  linear-gradient(
    90deg,
    transparent 0%,
    #B8A05A 20%,
    #D8C28A 40%,
    transparent 50%,
    #D8C28A 60%,
    #B8A05A 80%,
    transparent 100%
  );

  border-radius:999px;

  box-shadow:
    0 0 14px rgba(184,160,90,.22);
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-3802ca6 */.elementor-1961 .elementor-element.elementor-element-3802ca6{
  position: relative;
  display: inline-block;
  padding-bottom: 26px;
}

.elementor-1961 .elementor-element.elementor-element-3802ca6::after{
  content: "✦";
  position: absolute;
  left: 50%;
  bottom: 2px;
  transform: translateX(-50%);

  color: #d4af37;
  font-size: 15px;
  text-shadow: 0 0 14px rgba(212,175,55,.6);
}

.elementor-1961 .elementor-element.elementor-element-3802ca6::before{
  content: "";
  position: absolute;
  left: 50%;
  bottom: 10px;
  transform: translateX(-50%);

  width: 220px;
  height: 2px;

  background: linear-gradient(
    90deg,
    transparent,
    #d4af37,
    #fff1a8,
    transparent,
    #fff1a8,
    #d4af37,
    transparent
  );

  border-radius: 999px;
  box-shadow: 0 0 16px rgba(212,175,55,.38);
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-42c8fb00 *//* ===============================
   Featured Tutors Home - FINAL
================================ */

.mot-featured-tutors-home {
  width: 100% !important;
  max-width: 100% !important;
  margin: 45px auto 55px !important;
  padding: 0 !important;
  font-family: Inter, Arial, sans-serif;
  text-align: center !important;
  overflow: hidden !important;
}

.mot-featured-tutors-head {
  position: relative !important;
  max-width: 1180px !important;
  margin: 0 auto 22px !important;
  text-align: center !important;
}

.mot-featured-tutors-head h2 {
  margin: 0 0 8px !important;
  font-size: 26px !important;
  font-weight: 800 !important;
  color: #10264f !important;
  letter-spacing: -0.03em !important;
}

.mot-featured-tutors-head p {
  margin: 0 !important;
  font-size: 13.5px !important;
  color: #6b7a90 !important;
}

.mot-featured-view-all {
  position: absolute !important;
  right: 0 !important;
  top: 10px !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: #315cf6 !important;
  text-decoration: none !important;
}

/* Main carousel wrapper */
.mot-featured-carousel-wrap {
  width: 100% !important;
  max-width: 1420px !important;
  margin: 0 auto !important;
  position: relative !important;
  overflow: visible !important;
  padding: 0 20px !important;
  box-sizing: border-box !important;
}

/* Scroll carousel */
.mot-featured-tutors-carousel {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 22px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-behavior: smooth !important;
  scrollbar-width: none !important;
  padding: 4px 0 18px !important;
}

.mot-featured-tutors-carousel::-webkit-scrollbar {
  display: none !important;
}

/* Tutor card */
.mot-featured-tutor-card {
  flex: 0 0 240px !important;
  width: 240px !important;
  max-width: 240px !important;
  margin: 0 !important;
  scroll-snap-align: start !important;
  background: #fff !important;
  border: 1px solid #e7edf6 !important;
  border-radius: 13px !important;
  overflow: hidden !important;
  box-shadow: 0 10px 26px rgba(15, 35, 80, 0.055) !important;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease !important;
}

.mot-featured-tutor-card:hover {
  transform: translateY(-4px) !important;
  border-color: rgba(49,92,246,.22) !important;
  box-shadow: 0 18px 40px rgba(49, 92, 246, 0.12) !important;
}

/* Image */
.mot-featured-img {
  position: relative !important;
  display: block !important;
  height: 180px !important;
  overflow: hidden !important;
  background: linear-gradient(135deg, #f4f7fc, #eef3fb) !important;
}

.mot-featured-img img,
.mot-featured-img img.avatar {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: none !important;
  background: #f4f7fc !important;
}

/* Remove online badge */
.mot-featured-img::after {
  display: none !important;
  content: none !important;
}

/* Body */
.mot-featured-body {
  padding: 12px 13px 14px !important;
}

.mot-featured-body h3 {
  margin: 0 0 5px !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  font-weight: 750 !important;
  color: #10264f !important;
}

.mot-featured-body h3 a {
  color: inherit !important;
  text-decoration: none !important;
}

.mot-featured-subject {
  margin: 0 0 13px !important;
  font-size: 12px !important;
  color: #6b7a90 !important;
  line-height: 1.35 !important;
}

.mot-featured-meta {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 13px !important;
  min-height: 20px !important;
}

.mot-featured-rating {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  min-width: 0 !important;
}

.mot-featured-rating .mot-stars {
  position: relative !important;
  display: inline-block !important;
  font-size: 12px !important;
  line-height: 1 !important;
  letter-spacing: 1px !important;
}

.mot-featured-rating .mot-stars-bg {
  color: #d8dee9 !important;
}

.mot-featured-rating .mot-stars-fill {
  color: #f5a623 !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

.mot-featured-rating .mot-review-count {
  font-size: 11.5px !important;
  color: #6b7a90 !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
}

.mot-new-tutor {
  font-size: 11.5px !important;
  color: #6b7a90 !important;
  font-weight: 700 !important;
}

.mot-featured-price {
  font-size: 12.5px !important;
  font-weight: 800 !important;
  color: #10264f !important;
  white-space: nowrap !important;
}

.mot-featured-actions {
  display: flex !important;
  gap: 9px !important;
}

.mot-profile-btn,
.mot-book-now-btn {
  flex: 1 !important;
  text-align: center !important;
  padding: 9px 0 !important;
  border-radius: 8px !important;
  font-size: 11.5px !important;
  font-weight: 750 !important;
  text-decoration: none !important;
  transition: all .25s ease !important;
}

.mot-profile-btn {
  border: 1px solid #dfe8f6 !important;
  color: #10264f !important;
  background: #fff !important;
}

.mot-profile-btn:hover {
  border-color: #315cf6 !important;
  color: #315cf6 !important;
}

.mot-book-now-btn {
  color: #fff !important;
  background: linear-gradient(135deg,#6134B7,#452197) !important;
  box-shadow: 0 8px 18px rgba(97,52,183,.22) !important;
}

.mot-book-now-btn:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 26px rgba(97,52,183,.30) !important;
}

/* Arrows */
.mot-featured-arrow {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 50 !important;

  width: 42px !important;
  height: 42px !important;
  border-radius: 12px !important;

  background: #fff !important;
  color: #315cf6 !important;
  border: 1px solid #e2e9f6 !important;
  box-shadow: 0 10px 25px rgba(15, 35, 80, 0.10) !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  font-size: 24px !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

.mot-featured-arrow:hover {
  background: #315cf6 !important;
  color: #fff !important;
  border-color: #315cf6 !important;
}

.mot-featured-prev {
  left: -64px !important;
}

.mot-featured-next {
  right: -64px !important;
}

/* Responsive */
@media (max-width: 1200px) {
  .mot-featured-carousel-wrap {
    max-width: calc(100vw - 120px) !important;
  }

  .mot-featured-prev {
    left: -52px !important;
  }

  .mot-featured-next {
    right: -52px !important;
  }
}



@media (max-width: 900px) {

  .mot-featured-tutors-home {
    margin: 38px auto 48px !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  .mot-featured-tutors-head {
    max-width: 100% !important;
    margin: 0 0 18px !important;
    padding: 0 20px !important;
    text-align: left !important;
    box-sizing: border-box !important;
  }

  .mot-featured-tutors-head h2 {
    font-size: 32px !important;
    line-height: 1.12 !important;
  }

  .mot-featured-tutors-head p {
    font-size: 15px !important;
    line-height: 1.55 !important;
  }

  .mot-featured-view-all {
    position: static !important;
    display: inline-block !important;
    margin-top: 10px !important;
    font-size: 14px !important;
  }

  .mot-featured-carousel-wrap {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  .mot-featured-tutors-carousel {
    width: 100% !important;
    gap: 16px !important;
    padding: 8px 20px 22px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory !important;
    box-sizing: border-box !important;
  }

  .mot-featured-tutor-card {
    flex: 0 0 82vw !important;
    width: 82vw !important;
    max-width: 340px !important;
    min-width: 280px !important;
    scroll-snap-align: start !important;
  }

  .mot-featured-img {
    height: 165px !important;
  }

  .mot-featured-body {
    padding: 14px 14px 16px !important;
  }

  .mot-featured-body h3 {
    font-size: 15px !important;
  }

  .mot-featured-subject {
    font-size: 13px !important;
  }

  .mot-featured-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 9px !important;
  }

  .mot-profile-btn,
  .mot-book-now-btn {
    font-size: 12.5px !important;
    padding: 11px 0 !important;
  }

  .mot-featured-arrow {
    display: none !important;
  }
}

.mot-featured-img{
  position:relative !important;
  height:150px !important;
  overflow:hidden !important;
  background:#eef3fb !important;
}

/* ===============================
   Featured Tutor Image - FINAL FIX
================================ */

.mot-featured-img {
  position: relative !important;
  display: block !important;
  height: 180px !important;
  overflow: hidden !important;
  background: #eef3fb !important;
}

/* عکس اصلی به عنوان بک‌گراند پشت کل کادر */
.mot-featured-img img.mot-featured-bg-img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  filter: blur(18px) !important;
  transform: scale(1.22) !important;
  opacity: 0.65 !important;
  z-index: 1 !important;
}

/* عکس واقعی Tutor در جلو */
.mot-featured-img img.mot-featured-main-img {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  filter: none !important;
  opacity: 1 !important;
  background: transparent !important;
  transform: none !important;
  display: block !important;
}

/* برای اینکه قانون قبلی همه img ها خراب نکند */
.mot-featured-img img {
  background: transparent !important;
}
      

/* ===============================
   FEATURED TUTORS IMAGE PREMIUM
================================ */

/* Container image */
.mot-featured-img{
  position:relative !important;
  height:260px !important;
  overflow:hidden !important;
  background:#eef3fb !important;
}

/* عکس بک گراند پشت */
.mot-featured-bg-img{
  position:absolute !important;
  inset:0 !important;

  width:100% !important;
  height:100% !important;

  object-fit:cover !important;
  object-position:center center !important;

  transform:scale(1.12) !important;

  filter:
    blur(10px)
    brightness(.82)
    saturate(1.1) !important;

  opacity:.95 !important;

  z-index:1 !important;
}

/* لایه تیره شیشه‌ای برای Premium شدن */
.mot-featured-img::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;

  background:
    linear-gradient(
      to top,
      rgba(0,0,0,.22) 0%,
      rgba(0,0,0,.05) 45%,
      rgba(255,255,255,.04) 100%
    ) !important;

  z-index:2 !important;
}

/* عکس اصلی Tutor */
.mot-featured-main-img{
  position:relative !important;
  z-index:3 !important;

  width:100% !important;
  height:100% !important;

  object-fit:contain !important;
  object-position:center bottom !important;

  transform:scale(1.02) !important;

  display:block !important;
  background:transparent !important;

  filter:
    drop-shadow(0 10px 22px rgba(0,0,0,.18)) !important;
}

/* حذف تنظیمات قبلی خراب کننده */
.mot-featured-img img{
  background:transparent !important;
}

/* Hover حرفه‌ای */
.mot-featured-tutor-card:hover .mot-featured-bg-img{
  transform:scale(1.16) !important;

  filter:
    blur(8px)
    brightness(.78)
    saturate(1.15) !important;

  transition:all .45s ease !important;
}

.mot-featured-tutor-card:hover .mot-featured-main-img{
  transform:scale(1.04) translateY(-2px) !important;
  transition:all .35s ease !important;
}

/* ===============================
   MOT Featured Tutors Carousel - FINAL OVERRIDE
   فقط برای چرخش با فلش، بدون تغییر PHP
================================ */

.mot-featured-carousel-wrap{
  max-width:1420px !important;
  width:100% !important;
  margin:0 auto !important;
  position:relative !important;
  padding:0 64px !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
}

.mot-featured-tutors-carousel{
  display:flex !important;
  flex-wrap:nowrap !important;
  gap:24px !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  scroll-behavior:smooth !important;
  scrollbar-width:none !important;
  padding:8px 0 28px !important;
}

.mot-featured-tutors-carousel::-webkit-scrollbar{
  display:none !important;
}

.mot-featured-tutor-card{
  flex:0 0 300px !important;
  width:300px !important;
  min-width:300px !important;
  max-width:300px !important;
  margin:0 !important;
}

.mot-featured-arrow{
  position:absolute !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  z-index:99999 !important;
  display:flex !important;
}

.mot-featured-prev{
  left:8px !important;
  right:auto !important;
}

.mot-featured-next{
  right:8px !important;
  left:auto !important;
}

/* ===============================
   Mobile Featured Tutors Fix
================================ */
@media (max-width: 900px){

  .mot-featured-tutors-home{
    overflow:hidden !important;
  }

  .mot-featured-carousel-wrap{
    width:100% !important;
    max-width:100% !important;
    padding:0 !important;
    overflow:hidden !important;
  }

  .mot-featured-tutors-carousel{
    width:100% !important;
    padding:8px 20px 24px !important;
    gap:16px !important;
    box-sizing:border-box !important;
    overflow-x:auto !important;
    scroll-snap-type:x mandatory !important;
  }

  .mot-featured-tutor-card{
    flex:0 0 calc(100vw - 40px) !important;
    width:calc(100vw - 40px) !important;
    min-width:calc(100vw - 40px) !important;
    max-width:340px !important;
    scroll-snap-align:center !important;
  }

  .mot-featured-img{
    height:240px !important;
  }

  .mot-featured-arrow{
    display:none !important;
  }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-36235070 */.mot-featured-section-bg{
  width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;

  padding:30px 0 50px !important;

  background-image:
    linear-gradient(rgba(255,255,255,.60), rgba(255,255,255,.60)),
    url("https://myonlinetutor.com/wp-content/uploads/2026/06/Background-Featured-Tutors.png") !important;

  background-size:100% 100% !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;

  overflow:hidden !important;
}

.mot-featured-section-bg .mot-featured-tutors-home{
  background:transparent !important;
  margin:0 !important;
  padding:0 !important;
}

.mot-featured-section-bg .mot-featured-carousel-wrap{
  background:transparent !important;
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-0805c17 */.mot-badge{
    width:auto !important;
}

.mot-badge .elementor-icon-list-items{
    display:inline-flex !important;

    padding:5px 30px !important;

    background:linear-gradient(
        180deg,
        #f7faff 0%,
        #eef4ff 100%
    ) !important;

    border-radius:999px !important;

    box-shadow:
        0 12px 30px rgba(37,99,235,.08),
        inset 0 1px 0 rgba(255,255,255,.9);

    transition:.35s ease;
}

.mot-badge .elementor-icon-list-items:hover{
    transform:translateY(-3px);
    box-shadow:
        0 18px 40px rgba(37,99,235,.12),
        inset 0 1px 0 rgba(255,255,255,.9);
}

.mot-badge .elementor-icon-list-item{
    margin:0 !important;
}

.mot-badge .elementor-icon-list-icon{
    width:42px !important;
    height:42px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    background:#fff !important;

    border-radius:50% !important;

    box-shadow:
        0 8px 20px rgba(37,99,235,.12);
}

.mot-badge .elementor-icon-list-icon i{
    color:#6134B7 !important;
    font-size:20px !important;
}

.mot-badge .elementor-icon-list-text{
    color:#6134B7 !important;
    font-size:18px !important;
    font-weight:700 !important;
    padding-left:12px !important;
    font-family:Inter,sans-serif !important;
}

.mot-badge .elementor-icon-list-icon i,
.mot-badge .elementor-icon-list-icon svg,
.mot-badge .elementor-icon-list-icon svg path{
    color:#6134B7 !important;
    fill:#6134B7 !important;
    stroke:#6134B7 !important;
    font-size:20px !important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-5cc7dca *//* Clean Premium Feature Icons */

.mot-features .elementor-icon-box-wrapper{
    align-items:flex-start !important;
    gap:18px !important;
}

.mot-features .elementor-icon-box-icon{
    margin-top:4px !important;
}

.mot-features .elementor-icon-box-icon .elementor-icon{
    width:48px !important;
    height:48px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    border-radius:14px !important;

    background:linear-gradient(135deg,#f8fbff 0%,#eef5ff 100%) !important;
    border:1px solid rgba(37,99,235,.10) !important;

    box-shadow:
        0 10px 22px rgba(15,35,75,.06),
        inset 0 1px 0 rgba(255,255,255,.9) !important;

    transition:all .28s ease !important;
}

.mot-features .elementor-icon-box-icon i,
.mot-features .elementor-icon-box-icon svg{
    color:#6134B7 !important;
    font-size:22px !important;
}

.mot-features .elementor-icon-box-title{
    margin-bottom:4px !important;
}

.mot-features .elementor-icon-box-description{
    font-size:17px !important;
    line-height:1.45 !important;
    color:#222222 !important;
}

.mot-features .elementor-icon-box-wrapper:hover .elementor-icon{
    transform:translateY(-3px) !important;
    background:linear-gradient(135deg,#ffffff 0%,#f6fbff 100%) !important;
    box-shadow:
        0 16px 32px rgba(31,94,219,.12),
        inset 0 1px 0 rgba(255,255,255,1) !important;
}


@media(max-width:767px){

  .elementor-1961 .elementor-element.elementor-element-5cc7dca{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    text-align:center !important;
  }

  .elementor-1961 .elementor-element.elementor-element-5cc7dca .elementor-icon-box-wrapper{
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
  }

  .elementor-1961 .elementor-element.elementor-element-5cc7dca .elementor-icon-box-icon{
    margin:0 auto 14px auto !important;
  }

  .elementor-1961 .elementor-element.elementor-element-5cc7dca .elementor-icon-box-content{
    text-align:center !important;
  }
}

.mot-features .elementor-icon-box-icon .elementor-icon,
.mot-features .elementor-icon-box-icon .elementor-icon i,
.mot-features .elementor-icon-box-icon .elementor-icon svg,
.mot-features .elementor-icon-box-icon .elementor-icon svg path{
  color:#6134B7 !important;
  fill:#6134B7 !important;
  stroke:#6134B7 !important;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-4d8f0f6 *//* =========================================================
   MYONLINETUTOR
   UAE IMAGE COLLAGE
   PREMIUM / COMPACT / RESPONSIVE
   ========================================================= */


/* =========================================================
   COLLAGE
   ========================================================= */

.mot-collage{
    width:100%;
    max-width:780px;

    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:14px;

    margin:0 auto;

    position:relative;
}


/* =========================================================
   CARD BASE
   ========================================================= */

.mot-card{
    position:relative;

    width:100%;

    /* IMPORTANT:
       Portrait images are shown
       inside landscape frames */
    aspect-ratio:4 / 3;

    overflow:hidden;

    border-radius:24px;

    background:#f4f1eb;

    box-shadow:
        0 16px 38px rgba(25,20,35,.12);

    transition:
        transform .35s cubic-bezier(.22,1,.36,1),
        box-shadow .35s ease;

    cursor:pointer;

    isolation:isolate;
}


/* =========================================================
   IMAGE
   NO STRETCH
   ========================================================= */

.mot-card img{
    display:block;

    width:100%;
    height:100%;

    object-fit:cover;

    transform:scale(1.01);

    transition:
        transform .55s cubic-bezier(.22,1,.36,1),
        filter .35s ease;
}


/* =========================================================
   INDIVIDUAL IMAGE POSITION
   Adjust crop for each photo
   ========================================================= */

/* Progress Tracking */

.mot-card-1 img{
    object-position:center 42%;
}


/* 24/7 Support */

.mot-card-2 img{
    object-position:center 42%;
}


/* Flexible Scheduling */

.mot-card-3 img{
    object-position:center 35%;
}


/* Personalized Matching */

.mot-card-4 img{
    object-position:center 38%;
}


/* =========================================================
   SUBTLE COLLAGE POSITIONING
   ========================================================= */

.mot-card-1{
    transform:translate3d(5px,5px,0);
    z-index:2;
}

.mot-card-2{
    transform:translate3d(-5px,5px,0);
    z-index:1;
}

.mot-card-3{
    transform:translate3d(5px,-5px,0);
    z-index:1;
}

.mot-card-4{
    transform:translate3d(-5px,-5px,0);
    z-index:2;
}


/* =========================================================
   HOVER
   ========================================================= */

@media (hover:hover) and (pointer:fine){

    .mot-card:hover{
        z-index:10;

        box-shadow:
            0 24px 55px rgba(25,20,35,.18);
    }


    .mot-card-1:hover{
        transform:
            translate3d(5px,-2px,0)
            scale(1.025);
    }


    .mot-card-2:hover{
        transform:
            translate3d(-5px,-2px,0)
            scale(1.025);
    }


    .mot-card-3:hover{
        transform:
            translate3d(5px,-12px,0)
            scale(1.025);
    }


    .mot-card-4:hover{
        transform:
            translate3d(-5px,-12px,0)
            scale(1.025);
    }


    .mot-card:hover img{
        transform:scale(1.055);
    }

}


/* =========================================================
   LIGHT SHINE
   ========================================================= */

.mot-card::after{
    content:"";

    position:absolute;

    top:0;
    bottom:0;

    left:-75%;

    width:40%;

    background:linear-gradient(
        115deg,
        transparent 0%,
        rgba(255,255,255,.06) 35%,
        rgba(255,255,255,.38) 50%,
        rgba(255,255,255,.06) 65%,
        transparent 100%
    );

    transform:skewX(-20deg);

    transition:left .7s ease;

    pointer-events:none;

    z-index:2;
}


@media (hover:hover) and (pointer:fine){

    .mot-card:hover::after{
        left:135%;
    }

}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width:1024px){

    .mot-collage{
        max-width:680px;
        gap:12px;
    }

    .mot-card{
        border-radius:20px;
        aspect-ratio:4 / 3;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width:767px){

    .mot-collage{
        max-width:100%;
        gap:10px;
    }


    .mot-card{
        aspect-ratio:1 / 1;

        border-radius:17px;

        transform:none !important;

        box-shadow:
            0 10px 25px rgba(25,20,35,.10);
    }


    .mot-card img{
        transform:none;
    }


    .mot-card::after{
        display:none;
    }

}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-18e19f7 */.elementor-1961 .elementor-element.elementor-element-18e19f7{
  display:inline-flex !important;
  flex-direction:column;
  align-items:center;
  width:auto !important;

  margin-left:0 !important;
  margin-right:auto !important;

  color:#C79A2B;
  font-size:14px;
  font-weight:700;
  letter-spacing:2px;
  text-transform:uppercase;

  position:relative;
  padding-bottom:8px;
  text-align:left !important;
}

.elementor-1961 .elementor-element.elementor-element-18e19f7:before{
  content:"";
  position:absolute;
  left:0;
  bottom:0;

  width:145px;
  height:1px;

  background:#D7B15A;
}

.elementor-1961 .elementor-element.elementor-element-18e19f7:after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-4px;

  transform:translateX(-50%) rotate(45deg);

  width:8px;
  height:8px;

  background:#C79A2B;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-f9c8729 */.elementor-1961 .elementor-element.elementor-element-f9c8729 .elementor-button{
   background:linear-gradient(
    135deg,
    #7A3EF2 0%,
    #6134B7 50%,
    #452197 100%
) !important;

    color:#fff !important;

    border:none !important;
    border-radius:18px !important;

    padding:10px 36px !important;

    box-shadow:
        0 10px 30px rgba(212,168,55,.35),
        inset 0 1px 1px rgba(255,255,255,.45);

    font-weight:600 !important;

    transition:.3s ease;
}

.elementor-1961 .elementor-element.elementor-element-f9c8729 .elementor-button:hover{
    transform:translateY(-2px);

    box-shadow:
        0 16px 40px rgba(212,168,55,.45),
        inset 0 1px 1px rgba(255,255,255,.55);
}

.elementor-1961 .elementor-element.elementor-element-f9c8729 .elementor-button,
.elementor-1961 .elementor-element.elementor-element-f9c8729 .elementor-button-text,
.elementor-1961 .elementor-element.elementor-element-f9c8729 .elementor-button-icon{
    color:#fff !important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-c30bad4 *//* ===== Premium Trust Icons - NEW BRAND PALETTE ===== */

.elementor-1961 .elementor-element.elementor-element-c30bad4{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:50px;
}

/* Icon Box */
.elementor-1961 .elementor-element.elementor-element-c30bad4 .elementor-icon-box-wrapper{
    display:flex !important;
    align-items:flex-start !important;
    gap:18px;
}

/* Premium Purple Circle */
.elementor-1961 .elementor-element.elementor-element-c30bad4 .elementor-icon-box-icon{
    flex-shrink:0;
}

.elementor-1961 .elementor-element.elementor-element-c30bad4 .elementor-icon-box-icon span{
    width:58px;
    height:58px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:linear-gradient(
        135deg,
        #F2ECFD 0%,
        #E9DDFB 100%
    ) !important;

    border:1px solid rgba(97,52,183,.12) !important;

    box-shadow:
        0 10px 24px rgba(97,52,183,.12),
        inset 0 2px 4px rgba(255,255,255,.65);

    transition:.35s;
}

/* Purple Icons */
.elementor-1961 .elementor-element.elementor-element-c30bad4 .elementor-icon{
    color:#6134B7 !important;
    font-size:24px;
}

.elementor-1961 .elementor-element.elementor-element-c30bad4 .elementor-icon-box-icon i,
.elementor-1961 .elementor-element.elementor-element-c30bad4 .elementor-icon-box-icon svg,
.elementor-1961 .elementor-element.elementor-element-c30bad4 .elementor-icon-box-icon path{
    color:#6134B7 !important;
    fill:#6134B7 !important;
    stroke:#6134B7 !important;
}

/* Hover */
.elementor-1961 .elementor-element.elementor-element-c30bad4 .elementor-widget-icon-box:hover .elementor-icon-box-icon span{
    transform:translateY(-3px);

    background:linear-gradient(
        135deg,
        #E9DDFB 0%,
        #DCCBFA 100%
    ) !important;

    box-shadow:
        0 16px 32px rgba(97,52,183,.18),
        inset 0 2px 4px rgba(255,255,255,.75);
}

/* Title */
.elementor-1961 .elementor-element.elementor-element-c30bad4 .elementor-icon-box-title{
    margin-bottom:4px !important;
}

.elementor-1961 .elementor-element.elementor-element-c30bad4 .elementor-icon-box-title,
.elementor-1961 .elementor-element.elementor-element-c30bad4 .elementor-icon-box-title a{
    color:#222222 !important;
    font-size:18px !important;
    font-weight:700 !important;
    line-height:1.2;
}

/* Description */
.elementor-1961 .elementor-element.elementor-element-c30bad4 .elementor-icon-box-description{
    color:#6B6B6B !important;
    font-size:15px !important;
    line-height:1.7 !important;
}

/* Divider */
.elementor-1961 .elementor-element.elementor-element-c30bad4 .elementor-widget-icon-box{
    position:relative;
}

.elementor-1961 .elementor-element.elementor-element-c30bad4 .elementor-widget-icon-box:not(:last-child)::after{
    content:"";
    position:absolute;
    top:5px;
    right:-25px;

    width:1px;
    height:55px;

    background:rgba(97,52,183,.10);
}

/* Mobile */
@media(max-width:767px){

  .elementor-1961 .elementor-element.elementor-element-c30bad4{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    text-align:center !important;
  }

  .elementor-1961 .elementor-element.elementor-element-c30bad4 .elementor-icon-box-wrapper{
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
  }

  .elementor-1961 .elementor-element.elementor-element-c30bad4 .elementor-icon-box-icon{
    margin:0 auto 14px auto !important;
  }

  .elementor-1961 .elementor-element.elementor-element-c30bad4 .elementor-icon-box-content{
    text-align:center !important;
  }

  .elementor-1961 .elementor-element.elementor-element-c30bad4 .elementor-widget-icon-box:not(:last-child)::after{
      display:none !important;
  }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-c65aea4 */.iec-soft-image-fade{
  position: relative;
  overflow: hidden;
  border-radius: 0;
}

.iec-soft-image-fade img{
  width: 100%;
  display: block;
  object-fit: cover;
}

/* محو شدن دور تصویر مثل ابر */
.iec-soft-image-fade::after{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;

  background:
    linear-gradient(to right, #ffffff 0%, rgba(255,255,255,.85) 6%, rgba(255,255,255,0) 20%),
    linear-gradient(to bottom, #ffffff 0%, rgba(255,255,255,.65) 7%, rgba(255,255,255,0) 18%),
    linear-gradient(to left, #ffffff 0%, rgba(255,255,255,.65) 5%, rgba(255,255,255,0) 16%),
    linear-gradient(to top, #ffffff 0%, rgba(255,255,255,.9) 8%, rgba(255,255,255,0) 22%);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-26e7f92 */.mot-home-final-cta{
  max-width: 1180px !important;
  margin: 55px auto 35px !important;
  padding: 1px 36px !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, #061b58 0%, #082b82 55%, #07184a 100%) !important;
  box-shadow: 0 18px 45px rgba(7, 24, 74, 0.22) !important;
  overflow: hidden !important;
}

.mot-home-final-cta .elementor-container,
.mot-home-final-cta .e-con-inner{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 28px !important;
}

.mot-home-final-cta .elementor-icon-box-wrapper{
  display: flex !important;
  align-items: center !important;
  gap: 22px !important;
  text-align: left !important;
}

.mot-home-final-cta .elementor-icon{
  width: 64px !important;
  height: 64px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(135deg, #6134B7, #452197) !important;
}

.mot-home-final-cta .elementor-icon i,
.mot-home-final-cta .elementor-icon svg{
  color: #ffffff !important;
  fill: #ffffff !important;
  font-size: 30px !important;
}

.mot-home-final-cta .elementor-icon-box-title{
  margin: 0 0 8px !important;
  color: #ffffff !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

.mot-home-final-cta .elementor-icon-box-description{
  color: rgba(255,255,255,0.86) !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
}

.mot-home-final-cta .elementor-button{
  min-width: 170px !important;
  padding: 15px 28px !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, #38b6ff, #6d5dfc) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  box-shadow: 0 12px 25px rgba(109, 93, 252, 0.35) !important;
  transition: all .25s ease !important;
}

.mot-home-final-cta .elementor-button{
  min-width: 170px !important;
  padding: 15px 28px !important;
  border-radius: 8px !important;

  background: linear-gradient(135deg, #6134B7, #452197) !important;

  color: #ffffff !important;

  box-shadow: 0 12px 25px rgba(97,52,183,.30) !important;

  transition: all .25s ease !important;
}

@media (max-width: 768px){
  .mot-home-final-cta{
    margin: 35px 18px !important;
    padding: 28px 22px !important;
    text-align: center !important;
  }

  .mot-home-final-cta .elementor-container,
  .mot-home-final-cta .e-con-inner{
    flex-direction: column !important;
  }

  .mot-home-final-cta .elementor-icon-box-wrapper{
    flex-direction: column !important;
    text-align: center !important;
  }

  .mot-home-final-cta .elementor-button{
    width: 100% !important;
  }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-0b51e25 */.mot-next-section {
    position: relative;
    display: grid;

    grid-template-columns:
        minmax(360px, 1fr)
        295px
        295px;

    column-gap: 14px;
    row-gap: 14px;

    align-items: stretch;

    width: 100%;
    max-width: 1200px;
    margin: 40px auto 50px;
    padding: 22px;

    background:
        radial-gradient(
            circle at 12% 15%,
            rgba(122, 62, 242, 0.12),
            transparent 30%
        ),
        radial-gradient(
            circle at 88% 80%,
            rgba(97, 52, 183, 0.10),
            transparent 28%
        ),
        linear-gradient(
            135deg,
            #ffffff 0%,
            #fbf9ff 52%,
            #f5f0ff 100%
        );

    border: 1px solid rgba(97, 52, 183, 0.12);
    border-radius: 26px;
    box-shadow:
        0 24px 60px rgba(42, 20, 90, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);

    overflow: hidden;
    isolation: isolate;
}

.mot-next-section::before {
    content: "";
    position: absolute;
    width: 340px;
    height: 340px;
    left: -180px;
    bottom: -220px;

    border: 1px solid rgba(122, 62, 242, 0.15);
    border-radius: 50%;
    box-shadow:
        0 0 0 35px rgba(122, 62, 242, 0.025),
        0 0 0 75px rgba(122, 62, 242, 0.018);

    pointer-events: none;
    z-index: -1;
}

.mot-next-section::after {
    content: "";
    position: absolute;
    width: 220px;
    height: 220px;
    right: -80px;
    top: -100px;

    background: radial-gradient(
        circle,
        rgba(122, 62, 242, 0.13),
        transparent 68%
    );

    filter: blur(8px);
    pointer-events: none;
    z-index: -1;
}


/* Intro column */

.mot-next-intro {
    min-height: 100%;
    padding: 30px 24px 26px;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;

    border-radius: 20px;
}

.mot-next-eyebrow {
    display: inline-flex;
    align-items: center;
    width: fit-content;

    padding: 8px 13px;
    margin-bottom: 20px;

    background: rgba(97, 52, 183, 0.08);
    border: 1px solid rgba(97, 52, 183, 0.11);
    border-radius: 999px;

    color: #6134B7;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.mot-next-eyebrow::before {
    content: "✦";
    margin-right: 7px;
    font-size: 12px;
    color: #7A3EF2;
}

.mot-next-heading {
    margin: 0 0 18px;
    max-width: 470px;

    font-size: clamp(28px, 3vw, 42px);
    line-height: 1.08;
    font-weight: 750;
    letter-spacing: -1.2px;
    color: #080B35;
}

.mot-next-heading strong,
.mot-next-heading span {
    background: linear-gradient(
        90deg,
        #6134B7 0%,
        #7A3EF2 55%,
        #9A62FF 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.mot-next-description {
    max-width: 470px;
    margin-bottom: 24px;

    color: #4D536E;
    font-size: 16px;
    line-height: 1.72;
}

.mot-next-description p {
    margin: 0;
}


/* Button */

.mot-next-button .elementor-button {
    min-height: 52px;
    padding: 14px 22px;

    background: linear-gradient(
        135deg,
        #6134B7 0%,
        #7A3EF2 100%
    );

    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 14px;

    font-size: 15px;
    font-weight: 700;

    box-shadow:
        0 12px 28px rgba(97, 52, 183, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.20);

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        filter 0.25s ease;
}

.mot-next-button .elementor-button:hover {
    transform: translateY(-2px);
    filter: brightness(1.04);

    box-shadow:
        0 18px 34px rgba(97, 52, 183, 0.30),
        inset 0 1px 0 rgba(255, 255, 255, 0.25);
}


/* Feature cards */

.mot-next-card {
    position: relative;

    width: 295px;
    max-width: 295px;
    min-width: 295px;

    justify-self: start;

    padding: 14px 14px 22px;

    background: rgba(255, 255, 255, 0.74);
    border: 1px solid rgba(97, 52, 183, 0.13);
    border-radius: 22px;

    box-shadow:
        0 14px 34px rgba(31, 20, 67, 0.075),
        inset 0 1px 0 rgba(255, 255, 255, 0.88);

    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);

    overflow: hidden;
}

.mot-next-card:hover {
    transform: translateY(-6px);

    border-color: rgba(97, 52, 183, 0.24);

    box-shadow:
        0 24px 46px rgba(45, 22, 94, 0.13),
        inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.mot-next-card::before {
    content: "";
    position: absolute;
    width: 150px;
    height: 150px;
    right: -70px;
    top: -70px;

    background: radial-gradient(
        circle,
        rgba(122, 62, 242, 0.14),
        transparent 70%
    );

    pointer-events: none;
}




/* Images */

.mot-next-image {
    position: relative;
    margin-bottom: 20px;
    border-radius: 17px;
    overflow: hidden;

    background: linear-gradient(
        145deg,
        #f8f5ff 0%,
        #eee7ff 100%
    );
}

.mot-next-image img {
    width: 100%;
    height: 220px;
    display: block;

    object-fit: cover;
    object-position: center;

    border-radius: 17px;

    transition:
        transform 0.4s ease,
        filter 0.4s ease;
}

.mot-next-card:hover .mot-next-image img {
    transform: scale(1.035);
    filter: saturate(1.04);
}


/* Coming soon badge */

.mot-next-badge {
    display: inline-flex;
    align-items: center;
    width: fit-content;

    margin: 0 4px 13px;
    padding: 7px 11px;

    background: linear-gradient(
        135deg,
        rgba(97, 52, 183, 0.10),
        rgba(122, 62, 242, 0.14)
    );

    border: 1px solid rgba(97, 52, 183, 0.13);
    border-radius: 999px;

    color: #6134B7;
    font-size: 11px;
    line-height: 1;
    font-weight: 750;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.mot-next-badge::before {
    content: "";
    width: 7px;
    height: 7px;
    margin-right: 7px;

    background: #7A3EF2;
    border-radius: 50%;

    box-shadow: 0 0 0 5px rgba(122, 62, 242, 0.11);
}


/* Titles and text */

.mot-next-card-title {
    margin: 0 4px 12px;

    color: #090C39;
    font-size: clamp(22px, 2vw, 28px);
    line-height: 1.16;
    font-weight: 750;
    letter-spacing: -0.6px;
}

.mot-next-card-text {
    margin: 0 4px;

    color: #50566F;
    font-size: 15px;
    line-height: 1.65;
}

.mot-next-card-text p {
    margin: 0;
}


/* Tablet */

@media (max-width: 1024px) {
    .mot-next-section {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
    }

    .mot-next-intro {
        grid-column: 1 / -1;
    }

    .mot-next-card {
        width: 100%;
        max-width: none;
        min-width: 0;
    }
}


/* Mobile */

@media (max-width: 767px) {
    .mot-next-section {
        grid-template-columns: 1fr;
        gap: 14px;

        margin: 24px auto 34px;
        padding: 14px;
        border-radius: 22px;
    }

    .mot-next-intro {
        padding: 22px 12px 18px;
    }

    .mot-next-heading {
        font-size: 30px;
        line-height: 1.1;
        letter-spacing: -0.7px;
    }

    .mot-next-description {
        font-size: 15px;
        line-height: 1.65;
    }

    .mot-next-button,
    .mot-next-button .elementor-button {
        width: 100%;
    }

    .mot-next-button .elementor-button {
        justify-content: center;
    }

    .mot-next-card {
        padding: 12px 12px 20px;
        border-radius: 19px;
    }

    .mot-next-image img {
        height: 210px;
    }

    .mot-next-card-title {
        font-size: 24px;
    }
}



/* =====================================================
   FINAL DESKTOP LAYOUT
   Separate control for:
   1. Intro-to-card gap
   2. Card-to-card gap
===================================================== */

@media (min-width: 1025px) {

    .mot-next-section {
        /*
         * 430px = عرض ستون متن
         * 38px  = فاصله متن تا کارت AI
         * 295px = عرض کارت AI
         * 16px  = فاصله میان دو کارت
         * 295px = عرض کارت Mobile
         */
        grid-template-columns:
            430px
            38px
            295px
            16px
            295px !important;

        justify-content: center !important;
        align-items: stretch !important;

        column-gap: 0 !important;
    }

    /* ستون متن */
    .mot-next-intro {
        grid-column: 1;

        width: 430px !important;
        max-width: 430px !important;

        padding: 28px 20px 26px 20px !important;

        justify-self: stretch !important;
        align-self: stretch !important;
    }

    /* کارت AI */
    .mot-next-section > .mot-next-card:nth-child(2) {
        grid-column: 3;
    }

    /* کارت Mobile */
    .mot-next-section > .mot-next-card:nth-child(3) {
        grid-column: 5;
    }

    .mot-next-card {
        width: 295px !important;
        min-width: 295px !important;
        max-width: 295px !important;

        margin: 0 !important;

        justify-self: stretch !important;
        align-self: stretch !important;
    }

    .mot-next-intro > .elementor-element,
    .mot-next-intro > .e-con-inner {
        width: 100% !important;
        max-width: 100% !important;
    }

    .mot-next-eyebrow,
    .mot-next-heading,
    .mot-next-description,
    .mot-next-button {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .mot-next-heading {
        max-width: 400px !important;
    }

    .mot-next-description {
        max-width: 400px !important;
    }
}


/* =====================================================
   COMPACT BANNER VERSION
   Reduce total section height
===================================================== */

@media (min-width: 1025px) {

    .mot-next-section {
        max-width: 1180px !important;

        margin-top: 24px !important;
        margin-bottom: 32px !important;

        padding: 16px 20px !important;

        border-radius: 22px !important;

        align-items: center !important;
    }

    .mot-next-intro {
        min-height: auto !important;

        padding:
            18px
            20px
            18px
            20px !important;

        justify-content: center !important;
    }

    .mot-next-eyebrow {
        margin-bottom: 12px !important;
        padding: 6px 11px !important;
    }

    .mot-next-heading {
        margin-bottom: 10px !important;
    }

    .mot-next-description {
        margin-bottom: 15px !important;
    }

    .mot-next-button .elementor-button {
        min-height: 46px !important;
        padding: 12px 19px !important;
    }

    .mot-next-card {
        min-height: auto !important;

        padding:
            10px
            10px
            14px !important;

        border-radius: 19px !important;

        align-self: center !important;
    }

    .mot-next-image {
        margin-bottom: 10px !important;
        border-radius: 14px !important;
    }

    .mot-next-image img {
        height: 150px !important;
        border-radius: 14px !important;
    }

    .mot-next-badge {
        margin-bottom: 8px !important;
        padding: 6px 10px !important;
    }

    .mot-next-card-title {
        margin-bottom: 6px !important;
    }

    .mot-next-card-text {
        line-height: 1.5 !important;
    }
}

/* =====================================================
   FINAL WIDTH + EQUAL CARD HEIGHT FIX
===================================================== */

@media (min-width: 1025px) {

    /* Parent banner wider */
    .mot-next-section {
        max-width: 1360px !important;
        width: calc(100% - 48px) !important;

        grid-template-columns:
            430px
            48px
            295px
            16px
            295px !important;

        padding-left: 28px !important;
        padding-right: 28px !important;
    }

    /* Both cards same exact height */
    .mot-next-card {
        height: 355px !important;
        min-height: 355px !important;
        max-height: 355px !important;

        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-start !important;
    }

    /* Image area same in both cards */
    .mot-next-image {
        flex: 0 0 150px !important;
        height: 150px !important;
        min-height: 150px !important;
        max-height: 150px !important;
    }

    .mot-next-image img {
        height: 150px !important;
    }

    /* Title area same height */
    .mot-next-card-title {
        min-height: 56px !important;
        display: flex !important;
        align-items: flex-start !important;
    }

    /* Description area same height */
    .mot-next-card-text {
        min-height: 72px !important;
    }
}

/* =====================================================
   REMOVE LARGE GAP BETWEEN CARD TITLE AND TEXT
===================================================== */

@media (min-width: 1025px) {

    .mot-next-card {
        gap: 0 !important;
        --gap: 0px !important;
    }

    .mot-next-card-title {
        min-height: 0 !important;
        height: auto !important;

        margin-top: 0 !important;
        margin-bottom: 7px !important;

        display: block !important;
    }

    .mot-next-card-title .elementor-widget-container,
    .mot-next-card-title .elementor-heading-title {
        margin: 0 !important;
        padding: 0 !important;
    }

    .mot-next-card-text {
        min-height: 0 !important;
        height: auto !important;

        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    .mot-next-card-text .elementor-widget-container,
    .mot-next-card-text p {
        margin: 0 !important;
        padding: 0 !important;
    }
}/* End custom CSS */