.elementor-17 .elementor-element.elementor-element-a8170c7{--display:flex;--min-height:386px;--justify-content:flex-end;}.elementor-17 .elementor-element.elementor-element-a8170c7:not(.elementor-motion-effects-element-type-background), .elementor-17 .elementor-element.elementor-element-a8170c7 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-7cd825b );}.elementor-17 .elementor-element.elementor-element-a6fe5ce{--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;--margin-top:0px;--margin-bottom:0px;--margin-left:-20px;--margin-right:0px;}.elementor-17 .elementor-element.elementor-element-c102ca9{--display:flex;--justify-content:center;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-17 .elementor-element.elementor-element-4a84b52{width:var( --container-widget-width, 85% );max-width:85%;--container-widget-width:85%;--container-widget-flex-grow:0;}.elementor-17 .elementor-element.elementor-element-4a84b52 .elementor-heading-title{font-family:"Kanit", Sans-serif;font-size:32px;font-weight:400;line-height:32px;color:var( --e-global-color-text );}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-17 .elementor-element.elementor-element-ed91649{width:var( --container-widget-width, 71% );max-width:71%;margin:-10px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;--container-widget-width:71%;--container-widget-flex-grow:0;font-family:"Kanit", Sans-serif;font-weight:400;line-height:21px;color:#9E9A9A;}.elementor-17 .elementor-element.elementor-element-5e31fcc{--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;--align-items:center;--margin-top:0px;--margin-bottom:0px;--margin-left:-8px;--margin-right:0px;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-17 .elementor-element.elementor-element-3263ba4 .elementor-button{background-color:var( --e-global-color-primary );font-family:"Kanit", Sans-serif;font-size:16px;font-weight:400;border-radius:8px 8px 8px 8px;}.elementor-17 .elementor-element.elementor-element-3263ba4 .elementor-button:hover, .elementor-17 .elementor-element.elementor-element-3263ba4 .elementor-button:focus{background-color:var( --e-global-color-secondary );}.elementor-17 .elementor-element.elementor-element-26c686a .elementor-button{background-color:var( --e-global-color-7cd825b );font-family:"Kanit", Sans-serif;font-size:16px;font-weight:400;border-style:solid;border-width:1px 1px 1px 1px;border-radius:8px 8px 8px 8px;}.elementor-17 .elementor-element.elementor-element-26c686a .elementor-button:hover, .elementor-17 .elementor-element.elementor-element-26c686a .elementor-button:focus{background-color:var( --e-global-color-primary );}.elementor-17 .elementor-element.elementor-element-f9942c3{--display:flex;}.elementor-17 .elementor-element.elementor-element-a04debd{--display:flex;--min-height:204px;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-17 .elementor-element.elementor-element-a04debd:not(.elementor-motion-effects-element-type-background), .elementor-17 .elementor-element.elementor-element-a04debd > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-7cd825b );}.elementor-17 .elementor-element.elementor-element-791f4c8{text-align:center;}.elementor-17 .elementor-element.elementor-element-791f4c8 .elementor-heading-title{font-family:"Kanit", Sans-serif;font-size:20px;font-weight:400;color:var( --e-global-color-text );}.elementor-17 .elementor-element.elementor-element-c001157{--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:center;--align-items:center;--gap:75px 75px;--row-gap:75px;--column-gap:75px;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-17 .elementor-element.elementor-element-fe2f8c1{--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-17 .elementor-element.elementor-element-fe2f8c1:not(.elementor-motion-effects-element-type-background), .elementor-17 .elementor-element.elementor-element-fe2f8c1 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-7cd825b );}.elementor-17 .elementor-element.elementor-element-95ab9e1{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--border-radius:22px 22px 22px 22px;--padding-top:22px;--padding-bottom:22px;--padding-left:22px;--padding-right:22px;}.elementor-17 .elementor-element.elementor-element-95ab9e1:not(.elementor-motion-effects-element-type-background), .elementor-17 .elementor-element.elementor-element-95ab9e1 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#242424;}.elementor-17 .elementor-element.elementor-element-5f286a0{--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;--align-items:center;}.elementor-17 .elementor-element.elementor-element-0035e38{--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-17 .elementor-element.elementor-element-bbbccfa{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-17 .elementor-element.elementor-element-bbbccfa.elementor-element{--align-self:flex-start;}.elementor-17 .elementor-element.elementor-element-4cbfca4{width:var( --container-widget-width, 62% );max-width:62%;margin:-5px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;--container-widget-width:62%;--container-widget-flex-grow:0;}.elementor-17 .elementor-element.elementor-element-4cbfca4 .elementor-heading-title{font-family:"Kanit", Sans-serif;font-size:26px;font-weight:400;color:var( --e-global-color-text );}.elementor-17 .elementor-element.elementor-element-3f01157{--spacer-size:50px;width:var( --container-widget-width, 17.946% );max-width:17.946%;--container-widget-width:17.946%;--container-widget-flex-grow:0;}.elementor-17 .elementor-element.elementor-element-3f01157.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-17 .elementor-element.elementor-element-b689f83{width:var( --container-widget-width, 33% );max-width:33%;--container-widget-width:33%;--container-widget-flex-grow:0;text-align:end;font-family:"Kanit", Sans-serif;font-size:16px;font-weight:400;line-height:19px;}.elementor-17 .elementor-element.elementor-element-807107e{width:var( --container-widget-width, 98% );max-width:98%;--container-widget-width:98%;--container-widget-flex-grow:0;border-radius:22px 22px 22px 22px;}.elementor-17 .elementor-element.elementor-element-807107e .elementor-wrapper{--video-aspect-ratio:1.77777;}.elementor-17 .elementor-element.elementor-element-7288801 .elementor-button{background-color:var( --e-global-color-primary );font-family:"Kanit", Sans-serif;font-size:16px;font-weight:400;border-radius:8px 8px 8px 8px;}.elementor-17 .elementor-element.elementor-element-7288801 .elementor-button:hover, .elementor-17 .elementor-element.elementor-element-7288801 .elementor-button:focus{background-color:var( --e-global-color-secondary );}.elementor-17 .elementor-element.elementor-element-7288801{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 10px) 0px;}.elementor-17 .elementor-element.elementor-element-fc6f526{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:40px;--padding-bottom:40px;--padding-left:0px;--padding-right:0px;}.elementor-17 .elementor-element.elementor-element-fc6f526:not(.elementor-motion-effects-element-type-background), .elementor-17 .elementor-element.elementor-element-fc6f526 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-7cd825b );}.elementor-17 .elementor-element.elementor-element-9476fe3{width:var( --container-widget-width, 30% );max-width:30%;--container-widget-width:30%;--container-widget-flex-grow:0;text-align:center;}.elementor-17 .elementor-element.elementor-element-9476fe3 .elementor-heading-title{font-family:"Kanit", Sans-serif;font-size:22px;font-weight:400;color:var( --e-global-color-text );}.elementor-17 .elementor-element.elementor-element-175e098{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--overlay-opacity:1;--padding-top:39px;--padding-bottom:40px;--padding-left:0px;--padding-right:0px;}.elementor-17 .elementor-element.elementor-element-175e098::before, .elementor-17 .elementor-element.elementor-element-175e098 > .elementor-background-video-container::before, .elementor-17 .elementor-element.elementor-element-175e098 > .e-con-inner > .elementor-background-video-container::before, .elementor-17 .elementor-element.elementor-element-175e098 > .elementor-background-slideshow::before, .elementor-17 .elementor-element.elementor-element-175e098 > .e-con-inner > .elementor-background-slideshow::before, .elementor-17 .elementor-element.elementor-element-175e098 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:var( --e-global-color-7cd825b );--background-overlay:'';}.elementor-17 .elementor-element.elementor-element-6a467f8{width:var( --container-widget-width, 35% );max-width:35%;--container-widget-width:35%;--container-widget-flex-grow:0;text-align:center;}.elementor-17 .elementor-element.elementor-element-6a467f8 .elementor-heading-title{font-family:"Kanit", Sans-serif;font-size:22px;font-weight:400;color:var( --e-global-color-text );}.elementor-17 .elementor-element.elementor-element-a731cbd{width:var( --container-widget-width, 92% );max-width:92%;margin:20px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;--container-widget-width:92%;--container-widget-flex-grow:0;}.elementor-17 .elementor-element.elementor-element-a731cbd.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-17 .elementor-element.elementor-element-5dd3cb7 .elementor-button{background-color:var( --e-global-color-primary );font-family:"Kanit", Sans-serif;font-size:16px;font-weight:400;border-radius:8px 8px 8px 8px;}.elementor-17 .elementor-element.elementor-element-5dd3cb7 .elementor-button:hover, .elementor-17 .elementor-element.elementor-element-5dd3cb7 .elementor-button:focus{background-color:var( --e-global-color-secondary );}.elementor-17 .elementor-element.elementor-element-5dd3cb7{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 10px) 0px;}.elementor-17 .elementor-element.elementor-element-e8133ed{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;}.elementor-17 .elementor-element.elementor-element-e8133ed:not(.elementor-motion-effects-element-type-background), .elementor-17 .elementor-element.elementor-element-e8133ed > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-7cd825b );}.elementor-17 .elementor-element.elementor-element-134fd8c{width:var( --container-widget-width, 35% );max-width:35%;--container-widget-width:35%;--container-widget-flex-grow:0;text-align:center;}.elementor-17 .elementor-element.elementor-element-134fd8c .elementor-heading-title{font-family:"Kanit", Sans-serif;font-size:22px;font-weight:400;line-height:27px;color:var( --e-global-color-text );}.elementor-17 .elementor-element.elementor-element-59b291f{--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;}.elementor-17 .elementor-element.elementor-element-8c5ecfc{--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-17 .elementor-element.elementor-element-d383c5f{border-radius:22px 22px 22px 22px;}.elementor-17 .elementor-element.elementor-element-d383c5f .elementor-wrapper{--video-aspect-ratio:1;}.elementor-17 .elementor-element.elementor-element-e758b44{width:var( --container-widget-width, 54% );max-width:54%;--container-widget-width:54%;--container-widget-flex-grow:0;text-align:center;font-family:"Kanit", Sans-serif;font-size:18px;font-weight:400;}.elementor-17 .elementor-element.elementor-element-e758b44.elementor-element{--align-self:center;}.elementor-17 .elementor-element.elementor-element-72c9a3c{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;}.elementor-17 .elementor-element.elementor-element-0993e5a{border-radius:22px 22px 22px 22px;}.elementor-17 .elementor-element.elementor-element-0993e5a .elementor-wrapper{--video-aspect-ratio:1;}.elementor-17 .elementor-element.elementor-element-fe86a3d{width:var( --container-widget-width, 54% );max-width:54%;--container-widget-width:54%;--container-widget-flex-grow:0;text-align:center;font-family:"Kanit", Sans-serif;font-size:18px;font-weight:400;}.elementor-17 .elementor-element.elementor-element-fe86a3d.elementor-element{--align-self:center;}.elementor-17 .elementor-element.elementor-element-6ad9e1d{--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-17 .elementor-element.elementor-element-da824e3{border-radius:22px 22px 22px 22px;}.elementor-17 .elementor-element.elementor-element-da824e3 .elementor-wrapper{--video-aspect-ratio:1;}.elementor-17 .elementor-element.elementor-element-4c9dc20{width:var( --container-widget-width, 57% );max-width:57%;--container-widget-width:57%;--container-widget-flex-grow:0;text-align:center;font-family:"Kanit", Sans-serif;font-size:18px;font-weight:400;}.elementor-17 .elementor-element.elementor-element-4c9dc20.elementor-element{--align-self:center;}.elementor-17 .elementor-element.elementor-element-8f156ef{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:flex-start;}.elementor-17 .elementor-element.elementor-element-8f156ef:not(.elementor-motion-effects-element-type-background), .elementor-17 .elementor-element.elementor-element-8f156ef > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-7cd825b );}.elementor-17 .elementor-element.elementor-element-5861b6a{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--border-radius:22px 22px 22px 22px;--padding-top:22px;--padding-bottom:22px;--padding-left:22px;--padding-right:22px;}.elementor-17 .elementor-element.elementor-element-5861b6a:not(.elementor-motion-effects-element-type-background), .elementor-17 .elementor-element.elementor-element-5861b6a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(168deg, #4C4C4D 0%, #2E2E2E 100%);}.elementor-17 .elementor-element.elementor-element-0cf2e04{width:var( --container-widget-width, 22% );max-width:22%;--container-widget-width:22%;--container-widget-flex-grow:0;text-align:center;}.elementor-17 .elementor-element.elementor-element-0cf2e04 .elementor-heading-title{font-family:"Kanit", Sans-serif;font-size:24px;font-weight:400;color:var( --e-global-color-text );}.elementor-17 .elementor-element.elementor-element-2424b45{width:var( --container-widget-width, 36% );max-width:36%;margin:-8px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;--container-widget-width:36%;--container-widget-flex-grow:0;text-align:center;}.elementor-17 .elementor-element.elementor-element-a628a8a.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-17 .elementor-element.elementor-element-ab5bb8c.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-17 .elementor-element.elementor-element-ce150d5 .elementor-button{background-color:var( --e-global-color-primary );font-family:"Kanit", Sans-serif;font-size:16px;font-weight:400;border-radius:8px 8px 8px 8px;}.elementor-17 .elementor-element.elementor-element-ce150d5 .elementor-button:hover, .elementor-17 .elementor-element.elementor-element-ce150d5 .elementor-button:focus{background-color:var( --e-global-color-secondary );}.elementor-17 .elementor-element.elementor-element-ce150d5{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 10px) 0px;}.elementor-17 .elementor-element.elementor-element-2a6b2ae{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--padding-top:40px;--padding-bottom:40px;--padding-left:0px;--padding-right:0px;}.elementor-17 .elementor-element.elementor-element-2a6b2ae:not(.elementor-motion-effects-element-type-background), .elementor-17 .elementor-element.elementor-element-2a6b2ae > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-7cd825b );}.elementor-17 .elementor-element.elementor-element-cf6138d{width:var( --container-widget-width, 23% );max-width:23%;--container-widget-width:23%;--container-widget-flex-grow:0;text-align:center;}.elementor-17 .elementor-element.elementor-element-cf6138d .elementor-heading-title{font-family:"Kanit", Sans-serif;font-size:26px;font-weight:400;color:var( --e-global-color-text );}.elementor-17 .elementor-element.elementor-element-0863a4f.elementor-element{--align-self:center;}.elementor-17 .elementor-element.elementor-element-5dc5b21.elementor-element{--align-self:center;}.elementor-17 .elementor-element.elementor-element-bcc4553{--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:center;--align-items:center;}.elementor-17 .elementor-element.elementor-element-bcc4553:not(.elementor-motion-effects-element-type-background), .elementor-17 .elementor-element.elementor-element-bcc4553 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-7cd825b );}.elementor-17 .elementor-element.elementor-element-3064500{width:var( --container-widget-width, 36% );max-width:36%;--container-widget-width:36%;--container-widget-flex-grow:0;}.elementor-17 .elementor-element.elementor-element-3064500 .elementor-heading-title{font-family:"Kanit", Sans-serif;font-weight:400;color:var( --e-global-color-text );}.elementor-17 .elementor-element.elementor-element-29cd174{width:var( --container-widget-width, 57% );max-width:57%;--container-widget-width:57%;--container-widget-flex-grow:0;}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-17 .elementor-element.elementor-element-c102ca9{--justify-content:center;}}@media(max-width:767px){.elementor-17 .elementor-element.elementor-element-a8170c7{--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-17 .elementor-element.elementor-element-4a84b52{margin:30px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;text-align:center;}.elementor-17 .elementor-element.elementor-element-4a84b52.elementor-element{--align-self:center;}.elementor-17 .elementor-element.elementor-element-ed91649{--container-widget-width:245px;--container-widget-flex-grow:0;width:var( --container-widget-width, 245px );max-width:245px;text-align:center;}.elementor-17 .elementor-element.elementor-element-ed91649.elementor-element{--align-self:center;}.elementor-17 .elementor-element.elementor-element-5e31fcc{--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;--margin-top:-43px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-17 .elementor-element.elementor-element-5e31fcc.e-con{--align-self:center;}.elementor-17 .elementor-element.elementor-element-3263ba4.elementor-element{--align-self:center;}.elementor-17 .elementor-element.elementor-element-f9942c3{--min-height:264px;}.elementor-17 .elementor-element.elementor-element-408c830{width:var( --container-widget-width, 1000px );max-width:1000px;--container-widget-width:1000px;--container-widget-flex-grow:0;}.elementor-17 .elementor-element.elementor-element-c001157{--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:20px 8px;--row-gap:20px;--column-gap:8px;}.elementor-17 .elementor-element.elementor-element-f8d0959{width:var( --container-widget-width, 90px );max-width:90px;--container-widget-width:90px;--container-widget-flex-grow:0;}.elementor-17 .elementor-element.elementor-element-1215224{width:var( --container-widget-width, 90px );max-width:90px;--container-widget-width:90px;--container-widget-flex-grow:0;}.elementor-17 .elementor-element.elementor-element-52b00fb{width:var( --container-widget-width, 90px );max-width:90px;--container-widget-width:90px;--container-widget-flex-grow:0;}.elementor-17 .elementor-element.elementor-element-f459903{width:var( --container-widget-width, 66px );max-width:66px;--container-widget-width:66px;--container-widget-flex-grow:0;}.elementor-17 .elementor-element.elementor-element-ffcbea3{width:var( --container-widget-width, 90px );max-width:90px;--container-widget-width:90px;--container-widget-flex-grow:0;}.elementor-17 .elementor-element.elementor-element-e24a4a1{width:var( --container-widget-width, 81px );max-width:81px;--container-widget-width:81px;--container-widget-flex-grow:0;}.elementor-17 .elementor-element.elementor-element-5f286a0{--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-17 .elementor-element.elementor-element-0035e38{--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;}.elementor-17 .elementor-element.elementor-element-bbbccfa.elementor-element{--align-self:center;}.elementor-17 .elementor-element.elementor-element-4cbfca4{--container-widget-width:264px;--container-widget-flex-grow:0;width:var( --container-widget-width, 264px );max-width:264px;text-align:center;}.elementor-17 .elementor-element.elementor-element-b689f83{--container-widget-width:323px;--container-widget-flex-grow:0;width:var( --container-widget-width, 323px );max-width:323px;text-align:center;}.elementor-17 .elementor-element.elementor-element-9476fe3{--container-widget-width:228px;--container-widget-flex-grow:0;width:var( --container-widget-width, 228px );max-width:228px;}.elementor-17 .elementor-element.elementor-element-175e098{--margin-top:-58px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-17 .elementor-element.elementor-element-6a467f8{--container-widget-width:275px;--container-widget-flex-grow:0;width:var( --container-widget-width, 275px );max-width:275px;}.elementor-17 .elementor-element.elementor-element-a731cbd{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + -104px) 0px;padding:0px 0px 0px 0px;}.elementor-17 .elementor-element.elementor-element-5dd3cb7{margin:-38px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-17 .elementor-element.elementor-element-134fd8c{--container-widget-width:223px;--container-widget-flex-grow:0;width:var( --container-widget-width, 223px );max-width:223px;}.elementor-17 .elementor-element.elementor-element-5861b6a{--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-17 .elementor-element.elementor-element-5861b6a.e-con{--align-self:center;}.elementor-17 .elementor-element.elementor-element-0cf2e04{--container-widget-width:234px;--container-widget-flex-grow:0;width:var( --container-widget-width, 234px );max-width:234px;}.elementor-17 .elementor-element.elementor-element-2424b45{--container-widget-width:262px;--container-widget-flex-grow:0;width:var( --container-widget-width, 262px );max-width:262px;}.elementor-17 .elementor-element.elementor-element-a628a8a{width:var( --container-widget-width, 288px );max-width:288px;--container-widget-width:288px;--container-widget-flex-grow:0;}.elementor-17 .elementor-element.elementor-element-a628a8a.elementor-element{--align-self:center;}.elementor-17 .elementor-element.elementor-element-cf6138d{--container-widget-width:235px;--container-widget-flex-grow:0;width:var( --container-widget-width, 235px );max-width:235px;}.elementor-17 .elementor-element.elementor-element-bcc4553{--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-17 .elementor-element.elementor-element-3064500{--container-widget-width:300px;--container-widget-flex-grow:0;width:var( --container-widget-width, 300px );max-width:300px;text-align:center;}.elementor-17 .elementor-element.elementor-element-29cd174{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;}}@media(min-width:768px){.elementor-17 .elementor-element.elementor-element-c102ca9{--width:78%;}.elementor-17 .elementor-element.elementor-element-c001157{--width:84%;}.elementor-17 .elementor-element.elementor-element-0035e38{--width:45%;}}/* Start custom CSS for shortcode, class: .elementor-element-0963b40 *//* ====== WRAPPER ====== */
.logx-float-wrap{
  width: 100%;
  display: flex;
  justify-content: center;
}

/* “palco” com proporção responsiva */
.logx-float-stage{
  position: relative;
  width: min(1100px, 100%);
  aspect-ratio: 16 / 9;   /* mantém o look da composição */
  isolation: isolate;     /* garante z-index previsível */
}

/* ====== IMAGEM PRINCIPAL ====== */
.logx-main{
  position: absolute;
  inset: 0;
  border-radius: 22px;
  overflow: hidden;
  transform: translateZ(0);
  transition: transform .25s ease, filter .25s ease;
}

.logx-main img{
  width: 100%;
  height: 100%;
  object-fit: contain; /* se quiser “cobrir”, troca por cover */
  display: block;
}

/* efeito hover da imagem principal */
.logx-float-stage:hover .logx-main{
  transform: translateY(-6px) scale(1.01);
  filter: brightness(1.03);
}

/* ====== CARDS FLUTUANTES ====== */
.logx-float{
  position: absolute;
  z-index: 2;
  width: clamp(90px, 12vw, 150px); /* 🔽 bem menor */
  height: auto;
  border-radius: 14px;
  transform: translateZ(0);
  animation: floatY 6s ease-in-out infinite;
  filter: drop-shadow(0 14px 24px rgba(0,0,0,.38));
  pointer-events: none;
}

/* Variações pra parecer orgânico */
/* esquerda embaixo — mini card */
/* esquerda embaixo — bem discreto */
.logx-f1{
  left: 4%;
  bottom: 22%;
  width: clamp(60px, 7vw, 95px);
  opacity: 0.9;
}

/* direita em cima — detalhe sutil */
.logx-f2{
  right: 4%;
  top: 6%;
  width: clamp(55px, 6.5vw, 90px);
  opacity: 0.9;
}

/* centro inferior — ainda o maior, mas contido */
.logx-f3{
  left: 50%;
  bottom: -4%;
  transform: translateX(-50%);
  width: clamp(120px, 16vw, 190px);
  opacity: 0.95;
}


/* central inferior (a maior, mas ainda discreta) */
.logx-f3{
  left: 50%;
  bottom: -4%;
  transform: translateX(-50%);
  width: clamp(180px, 26vw, 320px);
}


/* animação base (leve) */
@keyframes floatY{
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-10px); }
  100% { transform: translateY(0); }
}

/* como o f3 já tem translateX, precisamos manter no keyframe */
.logx-f3{
  animation-name: floatYCenter;
}
@keyframes floatYCenter{
  0%   { transform: translateX(-50%) translateY(0); }
  50%  { transform: translateX(-50%) translateY(-10px); }
  100% { transform: translateX(-50%) translateY(0); }
}

/* ====== RESPONSIVO ====== */
@media (max-width: 820px){
  .logx-float-stage{
    aspect-ratio: 4 / 3;
  }

  .logx-f1{ left: -4%; bottom: 10%; }
  .logx-f2{ right: -4%; top: -6%; }
  .logx-f3{ bottom: -10%; width: clamp(220px, 64vw, 520px); }
}

@media (max-width: 520px){
  /* no mobile, reduz a “invasão” e a flutuação */
  .logx-float{ filter: drop-shadow(0 14px 26px rgba(0,0,0,.38)); }
  @keyframes floatY{ 50%{ transform: translateY(-6px); } }
  @keyframes floatYCenter{
    50%{ transform: translateX(-50%) translateY(-6px); }
  }
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-45e2213 *//* ====== WRAPPER ====== */
.logx-float-wrap{
  width: 100%;
  display: flex;
  justify-content: center;
}

/* “palco” com proporção responsiva */
.logx-float-stage{
  position: relative;
  width: min(1100px, 100%);
  aspect-ratio: 16 / 9;   /* mantém o look da composição */
  isolation: isolate;     /* garante z-index previsível */
}

/* ====== IMAGEM PRINCIPAL ====== */
.logx-main{
  position: absolute;
  inset: 0;
  border-radius: 22px;
  overflow: hidden;
  transform: translateZ(0);
  transition: transform .25s ease, filter .25s ease;
}

.logx-main img{
  width: 100%;
  height: 100%;
  object-fit: contain; /* se quiser “cobrir”, troca por cover */
  display: block;
}

/* efeito hover da imagem principal */
.logx-float-stage:hover .logx-main{
  transform: translateY(-6px) scale(1.01);
  filter: brightness(1.03);
}

/* ====== CARDS FLUTUANTES ====== */
.logx-float{
  position: absolute;
  z-index: 2;
  width: clamp(90px, 12vw, 150px); /* 🔽 bem menor */
  height: auto;
  border-radius: 14px;
  transform: translateZ(0);
  animation: floatY 6s ease-in-out infinite;
  filter: drop-shadow(0 14px 24px rgba(0,0,0,.38));
  pointer-events: none;
}

/* Variações pra parecer orgânico */
/* esquerda embaixo — mini card */
/* esquerda embaixo — bem discreto */
.logx-f1{
  left: 4%;
  bottom: 22%;
  width: clamp(60px, 7vw, 95px);
  opacity: 0.9;
}

/* direita em cima — detalhe sutil */
.logx-f2{
  right: 4%;
  top: 6%;
  width: clamp(55px, 6.5vw, 90px);
  opacity: 0.9;
}

/* centro inferior — ainda o maior, mas contido */
.logx-f3{
  left: 50%;
  bottom: -4%;
  transform: translateX(-50%);
  width: clamp(120px, 16vw, 190px);
  opacity: 0.95;
}


/* central inferior (a maior, mas ainda discreta) */
.logx-f3{
  left: 50%;
  bottom: -4%;
  transform: translateX(-50%);
  width: clamp(180px, 26vw, 320px);
}


/* animação base (leve) */
@keyframes floatY{
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-10px); }
  100% { transform: translateY(0); }
}

/* como o f3 já tem translateX, precisamos manter no keyframe */
.logx-f3{
  animation-name: floatYCenter;
}
@keyframes floatYCenter{
  0%   { transform: translateX(-50%) translateY(0); }
  50%  { transform: translateX(-50%) translateY(-10px); }
  100% { transform: translateX(-50%) translateY(0); }
}

/* ====== RESPONSIVO ====== */
@media (max-width: 820px){
  .logx-float-stage{
    aspect-ratio: 4 / 3;
  }

  .logx-f1{ left: -4%; bottom: 10%; }
  .logx-f2{ right: -4%; top: -6%; }
  .logx-f3{ bottom: -10%; width: clamp(220px, 64vw, 520px); }
}

@media (max-width: 520px){
  /* no mobile, reduz a “invasão” e a flutuação */
  .logx-float{ filter: drop-shadow(0 14px 26px rgba(0,0,0,.38)); }
  @keyframes floatY{ 50%{ transform: translateY(-6px); } }
  @keyframes floatYCenter{
    50%{ transform: translateX(-50%) translateY(-6px); }
  }
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-408c830 *//* =========================================================
   LOGX - LOGOS MARQUEE (MOBILE ONLY) - CONTROLES AQUI EM CIMA
   Mude só estas 3 linhas 👇
========================================================= */
.logx-logos{
  --logo-h: 35px;    /* ✅ ALTURA DO LOGO (troque para 10px, 11px, 12px...) */
  --gap: 22px;       /* espaço entre logos */
  --speed: 14s;      /* velocidade (menor = mais rápido) */
}

/* ---------- CONTAINER PRINCIPAL ---------- */
.logx-logos{
  width: 100%;
  background: transparent !important;
}

/* ---------- MÁSCARA / CORTE ---------- */
.logx-logos__mask{
  position: relative;
  overflow: hidden;
  padding: 10px 0;

  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
}

/* ---------- TRILHO ANIMADO ---------- */
.logx-logos__track{
  display: flex;
  align-items: center;
  gap: var(--gap);
  width: max-content;
  animation: logxMarquee var(--speed) linear infinite;
  will-change: transform;
}

/* ---------- LOGOS (FORÇADO) ---------- */
.logx-logos__img{
  height: var(--logo-h) !important; /* 🔒 aqui é o que manda */
  width: auto !important;
  max-width: none;
  opacity: .85;
  filter: grayscale(100%);
  transition: opacity .2s ease;
}

/* ---------- ANIMAÇÃO ---------- */
@keyframes logxMarquee{
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ---------- ACESSIBILIDADE ---------- */
@media (prefers-reduced-motion: reduce){
  .logx-logos__track{ animation: none; }
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-bbbccfa */.logx-ai-tag{
  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 10px 18px;

  font-family: "Kanit", system-ui, sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .08em;

  color: #fff;

  background: linear-gradient(
    135deg,
    #4F7DFF 0%,
    #1E4FF2 45%,
    #0B2FBF 100%
  );

  border-radius: 999px;

  box-shadow:
    0 12px 30px rgba(30,79,242,.45),
    inset 0 1px 0 rgba(255,255,255,.35);

  white-space: nowrap;
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-22ae3de *//* CONTAINER PRINCIPAL (blindado contra Elementor) */
.logx-video-container{
  position: relative !important;
  width: 100%;
  max-width: 100%;
  border-radius: 22px;
  overflow: hidden;
  background: #e6e6e6;
}

/* CONTROLE DE PROPORÇÃO (impede vídeo gigante) */
.logx-video-inner{
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9; /* ajuste se quiser: 21/9, 4/3 */
  overflow: hidden;
}

/* VÍDEO SEM ESTOURAR */
.logx-video-inner video{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* TAG / BADGE */
.logx-video-badge{
  position: absolute !important;
  top: 20px;
  left: 20px;
  z-index: 5;

  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 10px 16px;
  background: #1E4FF2;
  color: #fff;

  font-family: "Kanit", system-ui, sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .06em;

  border-radius: 999px;
  box-shadow:
    0 10px 30px rgba(30,79,242,.35),
    inset 0 1px 0 rgba(255,255,255,.25);
}

/* MOBILE */
@media (max-width: 768px){
  .logx-video-badge{
    top: 14px;
    left: 14px;
    font-size: 12px;
    padding: 8px 14px;
  }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-95ab9e1 *//* garante que estamos no elemento certo */
.logx-hero {
  position: relative;
  overflow: hidden;
}

/* pinta o overlay interno do Elementor */
.logx-hero .elementor-background-overlay {
  opacity: 1 !important;
  background: radial-gradient(
      circle at 55% 20%,
      rgba(30, 79, 242, 0.55) 0%,
      rgba(30, 79, 242, 0.18) 45%,
      rgba(0, 0, 0, 0.0) 70%
    ),
    linear-gradient(
      180deg,
      rgba(20, 24, 36, 0.92) 0%,
      rgba(0, 0, 0, 0.92) 100%
    ) !important;
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-926149d *//* Kanit */
@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@300;400;500;600;700&display=swap');

/* Container geral */
.logx-slider-wrapper {
  max-width: 1100px;
  margin: 40px auto;
  padding: 0 16px;
  font-family: 'Kanit', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  color: #ffffff;
}

/* Header com setas simples (sem círculo) */
.logx-slider-header {
  display: flex;
  justify-content: flex-end;
  gap: 18px;
  margin-bottom: 16px;
}

/* Botões de seta – aqui você pode usar o ícone que enviou como background */
.logx-arrow {
  width: 40px;
  height: 24px;
  border: none;
  background: transparent;
  cursor: pointer;
  position: relative;
  padding: 0;
}

/* Desenho da seta com linha (estilo do seu ícone) */

  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

/* Linha central */
.logx-arrow::before {
  left: 0;
  right: 0;
  height: 2px;
  background: #ffffff;
}

/* Pontas das setas */
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
}

/* Prev = seta apontando para a esquerda */
.logx-prev::after {
  left: 0;
  border-right: 8px solid #ffffff;
}

/* Next = seta apontando para a direita */
.logx-next::after {
  right: 0;
  border-left: 8px solid #ffffff;
}

/* Se quiser usar exatamente o PNG das setas, comente o bloco acima e use isso:
.logx-arrow {
  width: 169px;
  height: 29px;
  background: url('URL-ICONE-SETAS.png') center/contain no-repeat;
  border: none;
  cursor: pointer;
}
*/

/* Faixa de slides */
.logx-slider {
  display: flex;
  gap: 24px;
  overflow-x: auto;           /* ainda é auto pra poder scrollar via JS */
  scroll-snap-type: x mandatory;
  padding-bottom: 8px;
  scrollbar-width: none;      /* esconde scrollbar no Firefox */
}

.logx-slider::-webkit-scrollbar {
  display: none;              /* esconde scrollbar no Chrome/Safari/Edge */
}

/* Card base */
.logx-slide {
  position: relative;
  min-width: clamp(260px, 30vw, 320px);
  height: 380px;
  border-radius: 22px;
  overflow: hidden;
  scroll-snap-align: start;
}

/* Slide 1 – gradiente #FFFFFF → #999999 com 30% opacidade */
.slide-metrics {
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.3) 0%,
    rgba(153, 153, 153, 0.3) 100%
  );
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Conteúdo centralizado do slide de métricas */
.logx-metrics-content {
  text-align: center;
  color: #ffffff;
}

.logx-metric {
  margin-bottom: 4px; /* espaçamento de 44 entre blocos */
}

.logx-metric:last-child {
  margin-bottom: 0;
}

.logx-metric-value {
  display: block;
  font-size: 50px;
  font-weight: 600;
}

.logx-metric-label {
  display: block;
  font-size: 16px;
  font-weight: 300;
}

/* Slides 2–5 com imagens de fundo */
.slide-bg {
  background-position: center;
  background-size: cover;
}

/* Troque as URLs abaixo pelos links das imagens que subiu no WordPress */
.slide-bg-2 {
  background-image: url(https://narwallogx.com.br/wp-content/uploads/2025/12/quadro-2.png);
}
.slide-bg-3 {
  background-image: url(https://narwallogx.com.br/wp-content/uploads/2025/12/quadro-3.png);
}
.slide-bg-4 {
  background-image: url(https://narwallogx.com.br/wp-content/uploads/2025/12/quadro-4.png);
}
.slide-bg-5 {
  background-image: url(https://narwallogx.com.br/wp-content/uploads/2025/12/quadro-5.png);
}

/* Overlay leve pra garantir leitura do texto */
.slide-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at top, rgba(0, 33, 123, 0.45), rgba(4, 12, 46, 0.8));
}

/* Título dos slides 2–5: 75 px do topo e 45 da esquerda */
.logx-heading {
  position: absolute;
  top: 75px;
  left: 45px;
  right: 20px;
  margin: 0;
  font-size: 20px;
  line-height: 1.3;
  font-weight: 500;
  color: #ffffff;
  z-index: 1;
}

/* Responsivo */
@media (max-width: 768px) {
  .logx-slide {
    min-width: 82%;
    height: 360px;
  }

  .logx-heading {
    left: 24px;
    right: 16px;
    top: 60px;
    font-size: 18px;
  }

  .logx-metric-value {
    font-size: 32px;
  }

  .logx-metric-label {
    font-size: 14px;
  }
}
/* Botões de seta usando o PNG */
.logx-arrow {
  width: 50px;
  height: 29px;
  background: url(https://narwallogx.com.br/wp-content/uploads/2025/12/seta.png)
    center / contain no-repeat;
  border: none;
  cursor: pointer;
  padding: 0;
}

.logx-arrow:hover {
  background-color: transparent !important;
  box-shadow: none !important;
}

.logx-arrow {
  opacity: 0.35;     /* seta apagada */
  transition: opacity 0.2s ease;
}

.logx-arrow.active {
  opacity: 1;        /* seta acesa */
}


/* Inverte a seta da esquerda */
.logx-prev {
  transform: scaleX(-1);
}
/* Overlay leve padrão (quase invisível) */
.slide-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background: transparent;
  transition: background 0.25s ease, opacity 0.25s ease;
  z-index: 0;
}

/* Título dos slides 2–5: 75px do topo e 45 da esquerda */
.logx-heading {
  position: absolute;
  top: 75px;
  left: 45px;
  right: 45px;
  margin: 0;
  font-size: 20px;
  line-height: 1.3;
  font-weight: 500;
  color: #ffffff;
  z-index: 1;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

/* Camada com texto + botão que aparece no hover */
.logx-hover-layer {
  position: absolute;
  inset: auto 24px 24px 24px; /* 24px dos lados e de baixo */
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.25s ease, transform 0.25s ease;
  z-index: 2;
}

.logx-hover-layer p {
  margin: 0;
  font-size: 16px;
  font-weight: 500;
}

.logx-hover-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 8px;
  background: #ffffff;
  color: #111827;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
}

/* Efeito no hover: escurece fundo, esconde título, mostra overlay */
.slide-bg:hover::before {
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.1) 0%,
    rgba(0, 0, 0, 0.85) 100%
  );
}

.slide-bg:hover .logx-heading {
  opacity: 0;
  transform: translateY(-6px);
}

.slide-bg:hover .logx-hover-layer {
  opacity: 1;
  transform: translateY(0);
}

.logx-arrow {
  width: 32px;   /* antes: 50px */
  height: 18px;  /* antes: 29px */
  background-size: contain;
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-23be0cc *//* (Opcional) mesma fonte que você está usando no site */
@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@400;500;600&display=swap');

.badge-modais {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 6px 18px;
  background: #33363a;           /* fundo da pill */
  border-radius: 999px;
  color: #f9fafb;
  font-family: 'Kanit', system-ui, -apple-system, sans-serif;
  font-size: 14px;
  line-height: 1.3;
}

/* ícone com gradiente animado */
.badge-icon {
  font-size: 20px; /* tamanho do globo */
  display: inline-flex;
  align-items: center;
  justify-content: center;

  background: linear-gradient(
    120deg,
    #2563eb,
    #38bdf8,
    #2563eb
  );
  background-size: 200% 200%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent; /* deixa só o gradiente aparecer no globo */
  -webkit-text-fill-color: transparent;

  animation: globeGradient 3s linear infinite;
}

.badge-text strong {
  font-weight: 600;
}

/* animação do gradiente se movendo */
@keyframes globeGradient {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 200% 50%;
  }
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-f972aa7 */@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@400;500;600&display=swap');

/* MOBILE ONLY */
.logx-video-slider{
  font-family: 'Kanit', system-ui, sans-serif;
  padding: 0 16px;
}

/* trilho arrastável */
.logx-video-track{
  display: flex;
  gap: 18px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
  padding-bottom: 6px;
  scrollbar-width: none;
}
.logx-video-track::-webkit-scrollbar{
  display: none;
}

/* card */
.logx-video-card{
  flex: 0 0 78%;
  scroll-snap-align: start;
  color: #ffffff;
}

/* caixa do vídeo — RAIO 22 */
.logx-video-media{
  border-radius: 22px;
  overflow: hidden;
  background: #0b0b0b;
  box-shadow: 0 14px 40px rgba(0,0,0,.35);
}

/* 🔥 VÍDEO QUADRADO */
.logx-video{
  width: 100%;
  aspect-ratio: 1 / 1;     /* <<< AQUI está o ajuste */
  height: auto;
  display: block;
  object-fit: cover;
}

/* título abaixo */
.logx-video-title{
  margin: 14px 0 0;
  font-size: 16px;
  line-height: 1.2;
  font-weight: 600;
  text-align: center;
}

/* telas muito pequenas */
@media (max-width: 360px){
  .logx-video-card{
    flex-basis: 84%;
  }

  .logx-video-title{
    font-size: 15px;
  }
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-a628a8a */@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@400;500;600&display=swap');

/* container */
.logx-route-mobile{
  padding: 0 16px;
  font-family: 'Kanit', system-ui, sans-serif;
}

/* trilho arrastável */
.logx-route-mobile__track{
  display: flex;
  gap: 16px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.logx-route-mobile__track::-webkit-scrollbar{
  display: none;
}

/* CARD QUADRADO */
.logx-route-card{
  flex: 0 0 82%;
  aspect-ratio: 1 / 1;              /* 🔥 quadrado real */
  scroll-snap-align: start;
}

/* conteúdo interno */
.logx-route-card__inner{
  height: 100%;
  background: linear-gradient(135deg, #3B5A64, #465357);
  border-radius: 22px;
  padding: 16px;
  box-sizing: border-box;

  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 14px;

  color: #ffffff;
}

/* topo */
.logx-card-top{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

/* lane */
.logx-card-lane{
  background: #1E4FF2;
  padding: 7px 14px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

/* popular */
.logx-card-popular{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  opacity: .9;
}
.logx-card-popular img{
  width: 14px;
  height: 14px;
}

/* rota */
.logx-card-route{
  font-size: 14px;
  font-weight: 500;
  line-height: 1.25;
}

/* base */
.logx-card-bottom{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

/* preço */
.logx-card-price{
  background: #AFE592;
  color: #111;
  font-size: 14px;
  font-weight: 600;
  padding: 8px 14px;
  border-radius: 999px;
}

/* transit time */
.logx-card-tt{
  position: relative;
  display: flex;
  align-items: center;
  height: 34px;
  border-radius: 999px;
  overflow: hidden;
}

.logx-card-tt::before{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, #AFE592 0%, #0DAEE1 50%, #AFE592 100%);
  background-size: 200% 200%;
  animation: greenShift 4s ease-in-out infinite;
}

.logx-card-tt .tt-label{
  position: relative;
  z-index: 1;
  padding: 0 10px;
  font-size: 12px;
  color: #1B1B1B;
}

.logx-card-tt .tt-value{
  position: relative;
  z-index: 1;
  background: #ffffff;
  color: #000;
  font-size: 13px;
  font-weight: 700;
  padding: 0 12px;
  height: 100%;
  display: flex;
  align-items: center;
  border-radius: 999px;
}

/* animação */
@keyframes greenShift{
  0%{ background-position: 0% 50%; }
  50%{ background-position: 100% 50%; }
  100%{ background-position: 0% 50%; }
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-1a805e9 *//* --------------------------------------------------------
   CONTAINER PRINCIPAL
--------------------------------------------------------- */

.logx-route-pill {
  display: flex;
  align-items: center;
  gap: 36px; /* espaçamento geral entre itens */
  padding: 14px 24px;
  background: linear-gradient(135deg, #3B5A64, #465357);
  border-radius: 999px;
  font-family: 'Kanit', sans-serif;
  color: #ffffff;

  /* ✅ ALTERAÇÃO: largura fixa e consistente */
  width: 1140px;          /* ajuste para o tamanho que você quer padronizar */
  max-width: 100%;
  box-sizing: border-box;
  white-space: nowrap;    /* evita quebrar em duas linhas */
}

/* --------------------------------------------------------
   BLOCO AZUL (LANE)
--------------------------------------------------------- */

.logx-lane {
  background: #1E4FF2;
  padding: 10px 20px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  color: #ffffff;
}

/* --------------------------------------------------------
   INFORMAÇÃO DA ROTA
--------------------------------------------------------- */

.logx-route-info {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-right: 10px; /* separa melhor do divisor */
  font-size: 15px;
}

.logx-route-info .arrow {
  opacity: 0.7;
}

/* --------------------------------------------------------
   DIVISOR VISUAL |
--------------------------------------------------------- */

.logx-divider {
  opacity: 0.4;
  font-size: 24px;
}

/* --------------------------------------------------------
   CHIP DE PREÇO (VERDE)
--------------------------------------------------------- */

.logx-price-chip {
  margin-left: 6px;
  background: #AFE592;
  padding: 10px 20px;
  border-radius: 999px;
  font-size: 14px;
  color: #111;
  font-weight: 600;
  white-space: nowrap;
}

/* --------------------------------------------------------
   CHIP DE TRANSIT TIME (COM ANIMAÇÃO)
--------------------------------------------------------- */

.logx-tt-chip {
  position: relative;
  display: flex;
  align-items: stretch;
  border-radius: 999px;
  overflow: hidden;
  height: 40px; /* mesma altura do chip azul */
  padding: 0;
}

/* Fundo animado */
.logx-tt-chip::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(
    120deg,
    #AFE592 0%,
    #0DAEE1 50%,
    #AFE592 100%
  );
  background-size: 200% 200%;
  animation: greenShift 4s ease-in-out infinite;
  z-index: 1;
}

/* Label do transit */
.logx-tt-chip .tt-label {
  position: relative;
  z-index: 2; /* fica à frente do fundo animado */
  display: flex;
  align-items: center;
  padding: 0 14px;
  font-size: 14px;
  color: #1B1B1B;
  font-weight: 500;
  white-space: nowrap;
}

/* Bolinha branca com o número */
.logx-tt-chip .tt-value {
  position: relative;
  z-index: 2; /* conteúdo sempre acima do fundo */
  background: #ffffff;
  color: #000000;
  padding: 0 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 15px;
  height: 100%; /* encosta no topo e no fundo */
  border-radius: 999px;
  white-space: nowrap;
}

/* Animação suave da cor */
@keyframes greenShift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* --------------------------------------------------------
   ROTA POPULAR (ICONE + TEXTO)
--------------------------------------------------------- */

.logx-popular {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
}

.trend-icon {
  width: 18px;
  height: 18px;
  display: block;
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-ab5bb8c *//* --------------------------------------------------------
   CONTAINER PRINCIPAL
--------------------------------------------------------- */

.logx-route-pill {
  display: flex;
  align-items: center;
  gap: 36px; /* espaçamento geral entre itens */
  padding: 14px 24px;
  background: linear-gradient(135deg, #3B5A64, #465357);
  border-radius: 999px;
  font-family: 'Kanit', sans-serif;
  color: #ffffff;

  /* ✅ ALTERAÇÃO: largura fixa e consistente */
  width: 1140px;          /* ajuste para o tamanho que você quer padronizar */
  max-width: 100%;
  box-sizing: border-box;
  white-space: nowrap;    /* evita quebrar em duas linhas */
}

/* --------------------------------------------------------
   BLOCO AZUL (LANE)
--------------------------------------------------------- */

.logx-lane {
  background: #1E4FF2;
  padding: 10px 20px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  color: #ffffff;
}

/* --------------------------------------------------------
   INFORMAÇÃO DA ROTA
--------------------------------------------------------- */

.logx-route-info {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-right: 10px; /* separa melhor do divisor */
  font-size: 15px;
}

.logx-route-info .arrow {
  opacity: 0.7;
}

/* --------------------------------------------------------
   DIVISOR VISUAL |
--------------------------------------------------------- */

.logx-divider {
  opacity: 0.4;
  font-size: 24px;
}

/* --------------------------------------------------------
   CHIP DE PREÇO (VERDE)
--------------------------------------------------------- */

.logx-price-chip {
  margin-left: 6px;
  background: #AFE592;
  padding: 10px 20px;
  border-radius: 999px;
  font-size: 14px;
  color: #111;
  font-weight: 600;
  white-space: nowrap;
}

/* --------------------------------------------------------
   CHIP DE TRANSIT TIME (COM ANIMAÇÃO)
--------------------------------------------------------- */

.logx-tt-chip {
  position: relative;
  display: flex;
  align-items: stretch;
  border-radius: 999px;
  overflow: hidden;
  height: 40px; /* mesma altura do chip azul */
  padding: 0;
}

/* Fundo animado */
.logx-tt-chip::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(
    120deg,
    #AFE592 0%,
    #0DAEE1 50%,
    #AFE592 100%
  );
  background-size: 200% 200%;
  animation: greenShift 4s ease-in-out infinite;
  z-index: 1;
}

/* Label do transit */
.logx-tt-chip .tt-label {
  position: relative;
  z-index: 2; /* fica à frente do fundo animado */
  display: flex;
  align-items: center;
  padding: 0 14px;
  font-size: 14px;
  color: #1B1B1B;
  font-weight: 500;
  white-space: nowrap;
}

/* Bolinha branca com o número */
.logx-tt-chip .tt-value {
  position: relative;
  z-index: 2; /* conteúdo sempre acima do fundo */
  background: #ffffff;
  color: #000000;
  padding: 0 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 15px;
  height: 100%; /* encosta no topo e no fundo */
  border-radius: 999px;
  white-space: nowrap;
}

/* Animação suave da cor */
@keyframes greenShift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* --------------------------------------------------------
   ROTA POPULAR (ICONE + TEXTO)
--------------------------------------------------------- */

.logx-popular {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
}

.trend-icon {
  width: 18px;
  height: 18px;
  display: block;
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-3f38ab1 *//* --------------------------------------------------------
   CONTAINER PRINCIPAL
--------------------------------------------------------- */

.logx-route-pill {
  display: flex;
  align-items: center;
  gap: 36px; /* espaçamento geral entre itens */
  padding: 14px 24px;
  background: linear-gradient(135deg, #3B5A64, #465357);
  border-radius: 999px;
  font-family: 'Kanit', sans-serif;
  color: #ffffff;

  /* ✅ ALTERAÇÃO: largura fixa e consistente */
  width: 1140px;          /* ajuste para o tamanho que você quer padronizar */
  max-width: 100%;
  box-sizing: border-box;
  white-space: nowrap;    /* evita quebrar em duas linhas */
}

/* --------------------------------------------------------
   BLOCO AZUL (LANE)
--------------------------------------------------------- */

.logx-lane {
  background: #1E4FF2;
  padding: 10px 20px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  color: #ffffff;
}

/* --------------------------------------------------------
   INFORMAÇÃO DA ROTA
--------------------------------------------------------- */

.logx-route-info {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-right: 10px; /* separa melhor do divisor */
  font-size: 15px;
}

.logx-route-info .arrow {
  opacity: 0.7;
}

/* --------------------------------------------------------
   DIVISOR VISUAL |
--------------------------------------------------------- */

.logx-divider {
  opacity: 0.4;
  font-size: 24px;
}

/* --------------------------------------------------------
   CHIP DE PREÇO (VERDE)
--------------------------------------------------------- */

.logx-price-chip {
  margin-left: 6px;
  background: #AFE592;
  padding: 10px 20px;
  border-radius: 999px;
  font-size: 14px;
  color: #111;
  font-weight: 600;
  white-space: nowrap;
}

/* --------------------------------------------------------
   CHIP DE TRANSIT TIME (COM ANIMAÇÃO)
--------------------------------------------------------- */

.logx-tt-chip {
  position: relative;
  display: flex;
  align-items: stretch;
  border-radius: 999px;
  overflow: hidden;
  height: 40px; /* mesma altura do chip azul */
  padding: 0;
}

/* Fundo animado */
.logx-tt-chip::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(
    120deg,
    #AFE592 0%,
    #0DAEE1 50%,
    #AFE592 100%
  );
  background-size: 200% 200%;
  animation: greenShift 4s ease-in-out infinite;
  z-index: 1;
}

/* Label do transit */
.logx-tt-chip .tt-label {
  position: relative;
  z-index: 2; /* fica à frente do fundo animado */
  display: flex;
  align-items: center;
  padding: 0 14px;
  font-size: 14px;
  color: #1B1B1B;
  font-weight: 500;
  white-space: nowrap;
}

/* Bolinha branca com o número */
.logx-tt-chip .tt-value {
  position: relative;
  z-index: 2; /* conteúdo sempre acima do fundo */
  background: #ffffff;
  color: #000000;
  padding: 0 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 15px;
  height: 100%; /* encosta no topo e no fundo */
  border-radius: 999px;
  white-space: nowrap;
}

/* Animação suave da cor */
@keyframes greenShift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* --------------------------------------------------------
   ROTA POPULAR (ICONE + TEXTO)
--------------------------------------------------------- */

.logx-popular {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
}

.trend-icon {
  width: 18px;
  height: 18px;
  display: block;
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-1779a38 *//* --------------------------------------------------------
   CONTAINER PRINCIPAL
--------------------------------------------------------- */

.logx-route-pill {
  display: flex;
  align-items: center;
  gap: 36px; /* espaçamento geral entre itens */
  padding: 14px 24px;
  background: linear-gradient(135deg, #3B5A64, #465357);
  border-radius: 999px;
  font-family: 'Kanit', sans-serif;
  color: #ffffff;

  /* ✅ ALTERAÇÃO: largura fixa e consistente */
  width: 1140px;          /* ajuste para o tamanho que você quer padronizar */
  max-width: 100%;
  box-sizing: border-box;
  white-space: nowrap;    /* evita quebrar em duas linhas */
}

/* --------------------------------------------------------
   BLOCO AZUL (LANE)
--------------------------------------------------------- */

.logx-lane {
  background: #1E4FF2;
  padding: 10px 20px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  color: #ffffff;
}

/* --------------------------------------------------------
   INFORMAÇÃO DA ROTA
--------------------------------------------------------- */

.logx-route-info {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-right: 10px; /* separa melhor do divisor */
  font-size: 15px;
}

.logx-route-info .arrow {
  opacity: 0.7;
}

/* --------------------------------------------------------
   DIVISOR VISUAL |
--------------------------------------------------------- */

.logx-divider {
  opacity: 0.4;
  font-size: 24px;
}

/* --------------------------------------------------------
   CHIP DE PREÇO (VERDE)
--------------------------------------------------------- */

.logx-price-chip {
  margin-left: 6px;
  background: #AFE592;
  padding: 10px 20px;
  border-radius: 999px;
  font-size: 14px;
  color: #111;
  font-weight: 600;
  white-space: nowrap;
}

/* --------------------------------------------------------
   CHIP DE TRANSIT TIME (COM ANIMAÇÃO)
--------------------------------------------------------- */

.logx-tt-chip {
  position: relative;
  display: flex;
  align-items: stretch;
  border-radius: 999px;
  overflow: hidden;
  height: 40px; /* mesma altura do chip azul */
  padding: 0;
}

/* Fundo animado */
.logx-tt-chip::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(
    120deg,
    #AFE592 0%,
    #0DAEE1 50%,
    #AFE592 100%
  );
  background-size: 200% 200%;
  animation: greenShift 4s ease-in-out infinite;
  z-index: 1;
}

/* Label do transit */
.logx-tt-chip .tt-label {
  position: relative;
  z-index: 2; /* fica à frente do fundo animado */
  display: flex;
  align-items: center;
  padding: 0 14px;
  font-size: 14px;
  color: #1B1B1B;
  font-weight: 500;
  white-space: nowrap;
}

/* Bolinha branca com o número */
.logx-tt-chip .tt-value {
  position: relative;
  z-index: 2; /* conteúdo sempre acima do fundo */
  background: #ffffff;
  color: #000000;
  padding: 0 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 15px;
  height: 100%; /* encosta no topo e no fundo */
  border-radius: 999px;
  white-space: nowrap;
}

/* Animação suave da cor */
@keyframes greenShift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* --------------------------------------------------------
   ROTA POPULAR (ICONE + TEXTO)
--------------------------------------------------------- */

.logx-popular {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
}

.trend-icon {
  width: 18px;
  height: 18px;
  display: block;
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-0863a4f */.logx-pricing-scope{
  --logx-radius: 22px;
  --logx-bg: #07080b;
  --logx-card: rgba(255,255,255,.06);
  --logx-card-2: rgba(255,255,255,.04);
  --logx-border: rgba(255,255,255,.10);
  --logx-border-2: rgba(255,255,255,.16);
  --logx-text: rgba(255,255,255,.92);
  --logx-muted: rgba(255,255,255,.62);
  --logx-soft: rgba(255,255,255,.40);
  --logx-blue: #1E4FF2;
}

.logx-pricing-scope .logx-pricing{
  font-family: "Kanit", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: transparent;
}

.logx-pricing-scope .logx-pricing-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  align-items: stretch;
}

/* Card base */
.logx-pricing-scope .logx-price-card{
  position: relative;
  border-radius: var(--logx-radius);
  padding: 18px;
  color: var(--logx-text);
  background:
    radial-gradient(120% 140% at 20% 0%, rgba(255,255,255,.10) 0%, rgba(255,255,255,.02) 45%, rgba(0,0,0,.15) 100%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid var(--logx-border);
  box-shadow:
    0 16px 60px rgba(0,0,0,.55),
    inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  overflow: hidden;

  display: flex;
  flex-direction: column;
  align-items: stretch;
}

/* brilho borda */
.logx-pricing-scope .logx-price-card::before{
  content:"";
  position:absolute;
  inset: 0;
  border-radius: var(--logx-radius);
  padding: 1px;
  background: linear-gradient(135deg, rgba(255,255,255,.22), rgba(255,255,255,.02), rgba(255,255,255,.10));
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  opacity: .85;
}

.logx-pricing-scope .logx-price-head{
  display: grid;
  gap: 10px;
  padding: 6px 6px 14px 6px;
  width: 100%;
  flex: 0 0 auto;
}

.logx-pricing-scope .logx-plan-top{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
}

.logx-pricing-scope .logx-plan-name{
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--logx-soft);
  font-weight: 500;
}

.logx-pricing-scope .logx-badge{
  font-size: 11px;
  letter-spacing: .10em;
  text-transform: uppercase;
  padding: 6px 10px;
  border-radius: 8px;
  background: var(--logx-blue);
  border: 1px solid rgba(30,79,242,.95);
  color: #fff;
}

.logx-pricing-scope .logx-price-row{
  display:flex;
  align-items: baseline;
  gap: 6px;
}

.logx-pricing-scope .logx-currency{
  font-size: 18px;
  color: rgba(255,255,255,.85);
  font-weight: 500;
}

.logx-pricing-scope .logx-price{
  font-size: 56px;
  line-height: 1;
  letter-spacing: -0.02em;
  font-weight: 600;
}

.logx-pricing-scope .logx-period{
  font-size: 18px;
  color: var(--logx-muted);
  font-weight: 400;
}

.logx-pricing-scope .logx-mini{
  font-size: 12px;
  letter-spacing: .10em;
  text-transform: uppercase;
  color: rgba(255,255,255,.55);
}

.logx-pricing-scope .logx-subcopy{
  margin: 0;
  font-size: 14px;
  line-height: 1.35;
  color: rgba(255,255,255,.62);
}

/* CTA */
.logx-pricing-scope .logx-cta{
  margin-top: 4px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items:center;
  text-decoration:none;
  height: 48px;
  border-radius: 16px;

  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: 12px;

  background: var(--logx-blue);
  border: 1px solid rgba(30,79,242,.85);
  color: #fff;

  box-shadow: 0 10px 30px rgba(30,79,242,.25);
  transition: transform .15s ease, background .15s ease, color .15s ease, border-color .15s ease;
}

.logx-pricing-scope .logx-cta:hover{
  background: #fff;
  color: #07080b;
  border-color: rgba(255,255,255,.75);
  transform: translateY(-1px);
}

/* Includes */
.logx-pricing-scope .logx-includes{
  width: 100%;
  flex: 0 0 auto;
  margin-top: 14px;
  padding: 16px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.04));
  border: 1px solid rgba(255,255,255,.10);
}

.logx-pricing-scope .logx-includes-title{
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.92);
  margin-bottom: 10px;
}

.logx-pricing-scope .logx-includes-list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}

.logx-pricing-scope .logx-includes-list li{
  position: relative;
  padding-left: 34px;
  color: rgba(255,255,255,.70);
  font-size: 14px;
  line-height: 1.25;
  letter-spacing: .02em;
}

.logx-pricing-scope .logx-includes-list li::before{
  content: "✓";
  position: absolute;
  left: 0;
  top: 1px;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  font-size: 12px;

  background: rgba(30,79,242,.18);
  border: 1px solid rgba(30,79,242,.55);
  color: var(--logx-blue);
}

/* AI highlight */
.logx-pricing-scope .logx-ai{
  color: rgba(255,255,255,.92);
  font-weight: 500;
}

/* Popular card */
.logx-pricing-scope .logx-price-card.logx-popular{
  border-color: rgba(255,255,255,.18);
  background:
    radial-gradient(120% 140% at 20% 0%, rgba(255,255,255,.14) 0%, rgba(255,255,255,.03) 45%, rgba(0,0,0,.18) 100%),
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
}

/* Responsivo */
@media (max-width: 980px){
  .logx-pricing-scope .logx-pricing-grid{
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .logx-pricing-scope .logx-price{
    font-size: 52px;
  }
}

@media (max-width: 420px){
  .logx-pricing-scope .logx-price-card{
    padding: 16px;
  }
  .logx-pricing-scope .logx-includes{
    padding: 14px;
  }
  .logx-pricing-scope .logx-price{
    font-size: 46px;
  }
}

/* =========================
   TOGGLE Mensal / Anual (ajuste fino)
========================= */
.logx-pricing-scope .logx-billing-toggle{
  display: flex;
  justify-content: center;
  width: 100%;
  margin: 0 0 18px 0;
}

/* Container visual do toggle */
.logx-pricing-scope .logx-billing-toggle-inner{
  display: inline-flex;
  align-items: center;
  gap: 6px;

  padding: 6px;
  border-radius: 10px;                 /* ↓ mais quadrado */
  background: rgba(0,0,0,.55);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

/* Botões */
.logx-pricing-scope .logx-billing-btn{
  appearance: none;
  border: 0;
  background: transparent;

  font-family: "Kanit", system-ui, sans-serif;
  font-size: 14px;                     /* ↓ tipografia correta */
  font-weight: 500;
  letter-spacing: .01em;
  line-height: 1;

  color: rgba(255,255,255,.90);

  padding: 8px 14px;
  border-radius: 8px;                  /* ↓ menos arredondado */
  cursor: pointer;
  white-space: nowrap;

  transition: background .15s ease, color .15s ease, transform .15s ease;
}

.logx-pricing-scope .logx-billing-btn:hover{
  transform: translateY(-1px);
}

/* Ativo */
.logx-pricing-scope .logx-billing-btn.is-active{
  background: #fff;
  color: #07080b;
}

/* Texto auxiliar */
.logx-pricing-scope .logx-billing-save{
  font-size: 14px;
  font-weight: 500;
  opacity: .9;
}

/* Mobile */
@media (max-width: 980px){
  .logx-pricing-scope .logx-billing-toggle-inner{
    width: 100%;
    justify-content: space-between;
  }

  .logx-pricing-scope .logx-billing-btn{
    width: 50%;
    justify-content: center;
    display: inline-flex;
  }
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-5dc5b21 */.logx-pricing-scope{
  --logx-radius: 22px;
  --logx-bg: #07080b;
  --logx-card: rgba(255,255,255,.06);
  --logx-card-2: rgba(255,255,255,.04);
  --logx-border: rgba(255,255,255,.10);
  --logx-border-2: rgba(255,255,255,.16);
  --logx-text: rgba(255,255,255,.92);
  --logx-muted: rgba(255,255,255,.62);
  --logx-soft: rgba(255,255,255,.40);
  --logx-blue: #1E4FF2;
}

.logx-pricing-scope .logx-pricing{
  font-family: "Kanit", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: transparent;
}

/* =========================
   GRID (DESKTOP)
========================= */
.logx-pricing-scope .logx-pricing-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  align-items: stretch;
}

/* =========================
   CARD BASE
========================= */
.logx-pricing-scope .logx-price-card{
  position: relative;
  border-radius: var(--logx-radius);
  padding: 18px;
  color: var(--logx-text);
  background:
    radial-gradient(120% 140% at 20% 0%, rgba(255,255,255,.10) 0%, rgba(255,255,255,.02) 45%, rgba(0,0,0,.15) 100%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid var(--logx-border);
  box-shadow:
    0 16px 60px rgba(0,0,0,.55),
    inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  overflow: hidden;

  display: flex;
  flex-direction: column;
  align-items: stretch;

  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

/* Hover básico (desktop) */
@media (hover:hover){
  .logx-pricing-scope .logx-price-card:hover{
    transform: translateY(-2px);
    border-color: rgba(255,255,255,.18);
    box-shadow:
      0 20px 70px rgba(0,0,0,.62),
      inset 0 1px 0 rgba(255,255,255,.10);
  }
}

/* brilho borda */
.logx-pricing-scope .logx-price-card::before{
  content:"";
  position:absolute;
  inset: 0;
  border-radius: var(--logx-radius);
  padding: 1px;
  background: linear-gradient(135deg, rgba(255,255,255,.22), rgba(255,255,255,.02), rgba(255,255,255,.10));
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  opacity: .85;
}

/* =========================
   HEADER DO CARD
========================= */
.logx-pricing-scope .logx-price-head{
  display: grid;
  gap: 10px;
  padding: 6px 6px 14px 6px;
  width: 100%;
  flex: 0 0 auto;
}

.logx-pricing-scope .logx-plan-top{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
}

.logx-pricing-scope .logx-plan-name{
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--logx-soft);
  font-weight: 500;
}

.logx-pricing-scope .logx-badge{
  font-size: 11px;
  letter-spacing: .10em;
  text-transform: uppercase;
  padding: 6px 10px;
  border-radius: 8px;
  background: var(--logx-blue);
  border: 1px solid rgba(30,79,242,.95);
  color: #fff;
}

.logx-pricing-scope .logx-price-row{
  display:flex;
  align-items: baseline;
  gap: 6px;
}

.logx-pricing-scope .logx-currency{
  font-size: 18px;
  color: rgba(255,255,255,.85);
  font-weight: 500;
}

.logx-pricing-scope .logx-price{
  font-size: 56px;
  line-height: 1;
  letter-spacing: -0.02em;
  font-weight: 600;
}

.logx-pricing-scope .logx-period{
  font-size: 18px;
  color: var(--logx-muted);
  font-weight: 400;
}

.logx-pricing-scope .logx-mini{
  font-size: 12px;
  letter-spacing: .10em;
  text-transform: uppercase;
  color: rgba(255,255,255,.55);
}

.logx-pricing-scope .logx-subcopy{
  margin: 0;
  font-size: 14px;
  line-height: 1.35;
  color: rgba(255,255,255,.62);
}

/* CTA */
.logx-pricing-scope .logx-cta{
  margin-top: 4px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items:center;
  text-decoration:none;
  height: 48px;
  border-radius: 16px;

  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: 12px;

  background: var(--logx-blue);
  border: 1px solid rgba(30,79,242,.85);
  color: #fff;

  box-shadow: 0 10px 30px rgba(30,79,242,.25);
  transition: transform .15s ease, background .15s ease, color .15s ease, border-color .15s ease;
}

.logx-pricing-scope .logx-cta:hover{
  background: #fff;
  color: #07080b;
  border-color: rgba(255,255,255,.75);
  transform: translateY(-1px);
}

/* =========================
   INCLUDES
========================= */
.logx-pricing-scope .logx-includes{
  width: 100%;
  flex: 0 0 auto;
  margin-top: 14px;
  padding: 16px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.04));
  border: 1px solid rgba(255,255,255,.10);
}

.logx-pricing-scope .logx-includes-title{
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.92);
  margin-bottom: 10px;
}

.logx-pricing-scope .logx-includes-list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}

.logx-pricing-scope .logx-includes-list li{
  position: relative;
  padding-left: 34px;
  color: rgba(255,255,255,.70);
  font-size: 14px;
  line-height: 1.25;
  letter-spacing: .02em;
}

.logx-pricing-scope .logx-includes-list li::before{
  content: "✓";
  position: absolute;
  left: 0;
  top: 1px;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  font-size: 12px;

  background: rgba(30,79,242,.18);
  border: 1px solid rgba(30,79,242,.55);
  color: var(--logx-blue);
}

.logx-pricing-scope .logx-ai{
  color: rgba(255,255,255,.92);
  font-weight: 500;
}

/* Popular card */
.logx-pricing-scope .logx-price-card.logx-popular{
  border-color: rgba(255,255,255,.18);
  background:
    radial-gradient(120% 140% at 20% 0%, rgba(255,255,255,.14) 0%, rgba(255,255,255,.03) 45%, rgba(0,0,0,.18) 100%),
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
}

/* =========================
   TOGGLE Mensal / Anual (FINAL)
========================= */
.logx-pricing-scope .logx-billing-toggle{
  display: flex;
  justify-content: center;
  width: 100%;
  margin: 0 0 18px 0;
}

.logx-pricing-scope .logx-billing-toggle-inner{
  display: inline-flex;
  align-items: center;
  gap: 6px;

  padding: 6px;
  border-radius: 8px;
  background: rgba(0,0,0,.55);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

.logx-pricing-scope .logx-billing-btn{
  appearance: none;
  border: 0;
  background: transparent;

  font-family: "Kanit", system-ui, sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .01em;
  line-height: 1;

  color: rgba(255,255,255,.9);
  padding: 8px 14px;

  border-radius: 6px;
  cursor: pointer;
  white-space: nowrap;

  transition: background .15s ease, color .15s ease, transform .15s ease;
}

.logx-pricing-scope .logx-billing-btn:hover{
  transform: translateY(-1px);
}

.logx-pricing-scope .logx-billing-btn.is-active{
  background: #fff;
  color: #07080b;
  border-radius: 6px;
}

.logx-pricing-scope .logx-billing-save{
  font-size: 14px;
  font-weight: 500;
  opacity: .9;
}

/* =========================
   MOBILE: SWIPE (SEM BOTÕES)
   - vira faixa horizontal arrastável
========================= */
@media (max-width: 980px){

  /* toggle full width continua ok */
  .logx-pricing-scope .logx-billing-toggle-inner{
    width: 100%;
    justify-content: space-between;
  }
  .logx-pricing-scope .logx-billing-btn{
    width: 50%;
    display: inline-flex;
    justify-content: center;
  }

  /* GRID vira “carrossel” por swipe */
  .logx-pricing-scope .logx-pricing-grid{
    display: flex;
    gap: 14px;

    overflow-x: auto;
    -webkit-overflow-scrolling: touch;

    scroll-snap-type: x mandatory;
    scroll-padding-left: 16px;

    padding: 0 16px 8px 16px;
    margin: 0 -16px; /* faz o swipe ir até as bordas */
  }

  /* cada card ocupa “quase a tela toda” */
  .logx-pricing-scope .logx-price-card{
    flex: 0 0 86%;
    scroll-snap-align: start;
  }

  .logx-pricing-scope .logx-price{
    font-size: 52px;
  }

  /* esconde scrollbar */
  .logx-pricing-scope .logx-pricing-grid{
    scrollbar-width: none;
  }
  .logx-pricing-scope .logx-pricing-grid::-webkit-scrollbar{
    display: none;
  }
}

@media (max-width: 420px){
  .logx-pricing-scope .logx-price-card{
    padding: 16px;
    flex-basis: 90%;
  }

  .logx-pricing-scope .logx-includes{
    padding: 14px;
  }

  .logx-pricing-scope .logx-price{
    font-size: 46px;
  }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-bcc4553 */.white-full{
  background: #fff;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}/* End custom CSS */