.elementor-kit-601{--e-global-color-primary:#FEFFFF;--e-global-color-secondary:#0A0A09;--e-global-color-text:#E0E0E0;--e-global-color-accent:#9EDB1A;--e-global-color-a5491f0:#00000000;--e-global-color-d79c5f8:#535353;--e-global-color-91c1672:#1F1F1F;--e-global-color-56f8ecf:#0A0A0945;--e-global-color-1a6394f:#9EDB1A5E;--e-global-color-5bb6609:#ADEB69;--e-global-typography-primary-font-family:"Be Vietnam Pro";--e-global-typography-secondary-font-family:"Urbanist";--e-global-typography-text-font-family:"Urbanist";--e-global-typography-text-font-size:18px;--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:1.4em;--e-global-typography-accent-font-family:"Urbanist";--e-global-typography-accent-font-size:20px;--e-global-typography-accent-font-weight:600;--e-global-typography-accent-line-height:1em;--e-global-typography-e635b51-font-family:"Be Vietnam Pro";--e-global-typography-e635b51-font-size:85px;--e-global-typography-e635b51-font-weight:500;--e-global-typography-e635b51-line-height:1em;--e-global-typography-e635b51-letter-spacing:-5px;--e-global-typography-7ae5b1c-font-family:"Be Vietnam Pro";--e-global-typography-7ae5b1c-font-size:54px;--e-global-typography-7ae5b1c-font-weight:500;--e-global-typography-7ae5b1c-line-height:1em;--e-global-typography-7ae5b1c-letter-spacing:-4.3px;--e-global-typography-5fdcd42-font-family:"Be Vietnam Pro";--e-global-typography-5fdcd42-font-size:38px;--e-global-typography-5fdcd42-font-weight:500;--e-global-typography-5fdcd42-line-height:1em;--e-global-typography-5fdcd42-letter-spacing:-3.5px;--e-global-typography-8ce3cec-font-family:"Urbanist";--e-global-typography-8ce3cec-font-size:26px;--e-global-typography-8ce3cec-font-weight:600;--e-global-typography-8ce3cec-line-height:1em;--e-global-typography-8ce3cec-letter-spacing:-1px;--e-global-typography-a134e71-font-family:"Urbanist";--e-global-typography-a134e71-font-size:21px;--e-global-typography-a134e71-font-weight:600;--e-global-typography-a134e71-line-height:1em;--e-global-typography-845816e-font-family:"Urbanist";--e-global-typography-845816e-font-size:18px;--e-global-typography-845816e-line-height:1.2em;--e-global-typography-9d9902b-font-family:"Be Vietnam Pro";--e-global-typography-9d9902b-font-size:14px;--e-global-typography-9d9902b-font-weight:300;--e-global-typography-9d9902b-text-transform:uppercase;--e-global-typography-9d9902b-line-height:1.2em;background-color:var( --e-global-color-secondary );color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-601 button,.elementor-kit-601 input[type="button"],.elementor-kit-601 input[type="submit"],.elementor-kit-601 .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-size:var( --e-global-typography-accent-font-size );font-weight:var( --e-global-typography-accent-font-weight );line-height:var( --e-global-typography-accent-line-height );color:var( --e-global-color-secondary );border-style:solid;border-width:1px 1px 1px 1px;border-color:var( --e-global-color-accent );border-radius:999px 999px 999px 999px;padding:15px 30px 15px 30px;}.elementor-kit-601 button:hover,.elementor-kit-601 button:focus,.elementor-kit-601 input[type="button"]:hover,.elementor-kit-601 input[type="button"]:focus,.elementor-kit-601 input[type="submit"]:hover,.elementor-kit-601 input[type="submit"]:focus,.elementor-kit-601 .elementor-button:hover,.elementor-kit-601 .elementor-button:focus{background-color:var( --e-global-color-a5491f0 );color:var( --e-global-color-primary );border-style:solid;border-width:1px 1px 1px 1px;border-color:var( --e-global-color-primary );border-radius:999px 999px 999px 999px;}.elementor-kit-601 e-page-transition{background-color:#FFBC7D;}.elementor-kit-601 a{color:var( --e-global-color-accent );}.elementor-kit-601 h1{color:var( --e-global-color-primary );font-family:var( --e-global-typography-e635b51-font-family ), Sans-serif;font-size:var( --e-global-typography-e635b51-font-size );font-weight:var( --e-global-typography-e635b51-font-weight );line-height:var( --e-global-typography-e635b51-line-height );letter-spacing:var( --e-global-typography-e635b51-letter-spacing );}.elementor-kit-601 h2{color:var( --e-global-color-primary );font-family:var( --e-global-typography-7ae5b1c-font-family ), Sans-serif;font-size:var( --e-global-typography-7ae5b1c-font-size );font-weight:var( --e-global-typography-7ae5b1c-font-weight );line-height:var( --e-global-typography-7ae5b1c-line-height );letter-spacing:var( --e-global-typography-7ae5b1c-letter-spacing );}.elementor-kit-601 h3{color:var( --e-global-color-primary );font-family:var( --e-global-typography-5fdcd42-font-family ), Sans-serif;font-size:var( --e-global-typography-5fdcd42-font-size );font-weight:var( --e-global-typography-5fdcd42-font-weight );line-height:var( --e-global-typography-5fdcd42-line-height );letter-spacing:var( --e-global-typography-5fdcd42-letter-spacing );}.elementor-kit-601 h4{color:var( --e-global-color-primary );font-family:var( --e-global-typography-8ce3cec-font-family ), Sans-serif;font-size:var( --e-global-typography-8ce3cec-font-size );font-weight:var( --e-global-typography-8ce3cec-font-weight );line-height:var( --e-global-typography-8ce3cec-line-height );letter-spacing:var( --e-global-typography-8ce3cec-letter-spacing );}.elementor-kit-601 h5{color:var( --e-global-color-primary );font-family:var( --e-global-typography-a134e71-font-family ), Sans-serif;font-size:var( --e-global-typography-a134e71-font-size );font-weight:var( --e-global-typography-a134e71-font-weight );line-height:var( --e-global-typography-a134e71-line-height );}.elementor-kit-601 h6{color:var( --e-global-color-primary );font-family:var( --e-global-typography-845816e-font-family ), Sans-serif;font-size:var( --e-global-typography-845816e-font-size );line-height:var( --e-global-typography-845816e-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1400px;}.e-con{--container-max-width:1400px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-kit-601{--e-global-typography-text-font-size:16px;--e-global-typography-accent-font-size:18px;--e-global-typography-e635b51-font-size:70px;--e-global-typography-7ae5b1c-font-size:46px;--e-global-typography-5fdcd42-font-size:32px;--e-global-typography-a134e71-line-height:1em;font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-601 h1{font-size:var( --e-global-typography-e635b51-font-size );line-height:var( --e-global-typography-e635b51-line-height );letter-spacing:var( --e-global-typography-e635b51-letter-spacing );}.elementor-kit-601 h2{font-size:var( --e-global-typography-7ae5b1c-font-size );line-height:var( --e-global-typography-7ae5b1c-line-height );letter-spacing:var( --e-global-typography-7ae5b1c-letter-spacing );}.elementor-kit-601 h3{font-size:var( --e-global-typography-5fdcd42-font-size );line-height:var( --e-global-typography-5fdcd42-line-height );letter-spacing:var( --e-global-typography-5fdcd42-letter-spacing );}.elementor-kit-601 h4{font-size:var( --e-global-typography-8ce3cec-font-size );line-height:var( --e-global-typography-8ce3cec-line-height );letter-spacing:var( --e-global-typography-8ce3cec-letter-spacing );}.elementor-kit-601 h5{font-size:var( --e-global-typography-a134e71-font-size );line-height:var( --e-global-typography-a134e71-line-height );}.elementor-kit-601 h6{font-size:var( --e-global-typography-845816e-font-size );line-height:var( --e-global-typography-845816e-line-height );}.elementor-kit-601 button,.elementor-kit-601 input[type="button"],.elementor-kit-601 input[type="submit"],.elementor-kit-601 .elementor-button{font-size:var( --e-global-typography-accent-font-size );line-height:var( --e-global-typography-accent-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:90%;}.e-con{--container-max-width:90%;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}}@media(max-width:767px){.elementor-kit-601{--e-global-typography-e635b51-font-size:54px;--e-global-typography-7ae5b1c-font-size:40px;--e-global-typography-5fdcd42-font-size:28px;--e-global-typography-a134e71-line-height:1em;--e-global-typography-845816e-font-size:18px;--e-global-typography-845816e-line-height:1.2em;font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-601 h1{font-size:var( --e-global-typography-e635b51-font-size );line-height:var( --e-global-typography-e635b51-line-height );letter-spacing:var( --e-global-typography-e635b51-letter-spacing );}.elementor-kit-601 h2{font-size:var( --e-global-typography-7ae5b1c-font-size );line-height:var( --e-global-typography-7ae5b1c-line-height );letter-spacing:var( --e-global-typography-7ae5b1c-letter-spacing );}.elementor-kit-601 h3{font-size:var( --e-global-typography-5fdcd42-font-size );line-height:var( --e-global-typography-5fdcd42-line-height );letter-spacing:var( --e-global-typography-5fdcd42-letter-spacing );}.elementor-kit-601 h4{font-size:var( --e-global-typography-8ce3cec-font-size );line-height:var( --e-global-typography-8ce3cec-line-height );letter-spacing:var( --e-global-typography-8ce3cec-letter-spacing );}.elementor-kit-601 h5{font-size:var( --e-global-typography-a134e71-font-size );line-height:var( --e-global-typography-a134e71-line-height );}.elementor-kit-601 h6{font-size:var( --e-global-typography-845816e-font-size );line-height:var( --e-global-typography-845816e-line-height );}.elementor-kit-601 button,.elementor-kit-601 input[type="button"],.elementor-kit-601 input[type="submit"],.elementor-kit-601 .elementor-button{font-size:var( --e-global-typography-accent-font-size );line-height:var( --e-global-typography-accent-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:90%;}.e-con{--container-max-width:90%;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}}/* Start custom CSS *//* ========================================================= LUXURY GREEN DESIGN SYSTEM Elementor Pro Global CSS ========================================================= */ /* ========================================================= 1. LUXURY GREEN 3D BUTTON Class: luxury-green-button ========================================================= */ .luxury-green-button .elementor-button { position: relative; overflow: hidden; color: #ffffff; font-weight: 700; background: linear-gradient( 180deg, #e8ff9a 0%, #bfff32 12%, #72d900 38%, #45a900 62%, #2c7d00 100% ); border: 1px solid #a8ed25; border-radius: 10px; box-shadow: inset 0 1px 1px rgba(255,255,255,0.75), inset 0 -3px 5px rgba(0,0,0,0.20), 0 4px 0 #286e00, 0 7px 14px rgba(50,130,0,0.35); transform: translateY(0); transition: transform 0.25s ease, background 0.35s ease, box-shadow 0.25s ease; } /* Metallic shine */ .luxury-green-button .elementor-button::before { content: ""; position: absolute; top: 0; left: -120%; width: 70%; height: 100%; background: linear-gradient( 100deg, transparent 0%, rgba(255,255,255,0.08) 35%, rgba(255,255,255,0.65) 50%, rgba(255,255,255,0.08) 65%, transparent 100% ); transform: skewX(-20deg); transition: left 0.7s ease; } /* Hover */ .luxury-green-button .elementor-button:hover { background: linear-gradient( 180deg, #d7ff70 0%, #9be820 15%, #5fbd00 40%, #3f9200 65%, #286900 100% ); transform: translateY(2px); box-shadow: inset 0 1px 1px rgba(255,255,255,0.65), inset 0 -3px 5px rgba(0,0,0,0.25), 0 2px 0 #205800, 0 6px 15px rgba(45,120,0,0.40); } /* Shine animation on hover */ .luxury-green-button .elementor-button:hover::before { left: 150%; } /* Active / click */ .luxury-green-button .elementor-button:active { transform: translateY(5px); box-shadow: inset 0 2px 5px rgba(0,0,0,0.25), 0 0 0 #286e00, 0 3px 8px rgba(0,0,0,0.25); } /* ========================================================= 2. GREEN METALLIC CONTAINER Class: luxury-green-container ========================================================= */ .luxury-green-container { position: relative; background: linear-gradient( 145deg, #eaffb0 0%, #b7f238 8%, #76cf0b 30%, #4ca500 55%, #347900 78%, #214f00 100% ); border: 1px solid rgba(190,255,80,0.75); border-radius: 18px; box-shadow: inset 0 1px 2px rgba(255,255,255,0.75), inset 0 -5px 12px rgba(0,0,0,0.25), 0 8px 0 #245d00, 0 15px 30px rgba(35,100,0,0.30); transform: translateY(0); transition: transform 0.3s ease, box-shadow 0.3s ease; } /* Metallic highlight */ .luxury-green-container::before { content: ""; position: absolute; top: 0; left: 5%; width: 90%; height: 1px; background: rgba(255,255,255,0.85); border-radius: 100%; } /* Hover */ .luxury-green-container:hover { transform: translateY(-3px); box-shadow: inset 0 1px 2px rgba(255,255,255,0.8), inset 0 -5px 12px rgba(0,0,0,0.22), 0 10px 0 #245d00, 0 20px 35px rgba(35,100,0,0.35); } /* ========================================================= 3. ANIMATED GREEN GRADIENT TEXT Class: animated-green-text ========================================================= */ .animated-green-text { background: linear-gradient( 90deg, #245d00, #54a900, #aaff00, #eaff9a, #68c900, #2d7000, #aaff00 ); background-size: 300% auto; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; animation: luxuryGreenGradient 5s ease-in-out infinite; font-weight: 800; } /* Gradient movement */ @keyframes luxuryGreenGradient { 0% { background-position: 0% center; } 50% { background-position: 100% center; } 100% { background-position: 0% center; } } /* ========================================================= 4. PREMIUM METALLIC GREEN BOX Class: metallic-green-box ========================================================= */ .metallic-green-box { position: relative; background: linear-gradient( 135deg, #173b00 0%, #316f00 18%, #71c900 38%, #d5ff70 50%, #63b900 62%, #2d6900 82%, #142f00 100% ); border: 1px solid #9eea32; border-radius: 16px; box-shadow: inset 0 1px 3px rgba(255,255,255,0.65), inset 0 -8px 15px rgba(0,0,0,0.28), 0 7px 0 #193e00, 0 15px 30px rgba(20,70,0,0.35); transition: transform 0.3s ease, filter 0.3s ease; } /* Metallic light */ .metallic-green-box::after { content: ""; position: absolute; top: 8%; left: -20%; width: 35%; height: 84%; background: linear-gradient( 90deg, transparent, rgba(255,255,255,0.35), transparent ); transform: skewX(-20deg); transition: left 0.8s ease; pointer-events: none; } .metallic-green-box:hover { transform: translateY(-4px); filter: brightness(1.08); } .metallic-green-box:hover::after { left: 120%; } /* ========================================================= 5. SIMPLE GREEN GLOW TEXT Class: green-glow-text ========================================================= */ .green-glow-text { color: #aaff00; text-shadow: 0 0 5px rgba(170,255,0,0.35), 0 0 15px rgba(110,220,0,0.25); animation: greenGlow 3s ease-in-out infinite alternate; } @keyframes greenGlow { from { text-shadow: 0 0 5px rgba(170,255,0,0.25), 0 0 12px rgba(110,220,0,0.15); } to { text-shadow: 0 0 8px rgba(170,255,0,0.55), 0 0 22px rgba(110,220,0,0.35); } } /* ========================================================= 6. GREEN METALLIC BORDER Class: green-metal-border ========================================================= */ .green-metal-border { border: 1px solid transparent; background: linear-gradient(#111111, #111111) padding-box, linear-gradient( 135deg, #dfff8a, #7bd400, #286600, #aaff00 ) border-box; border-radius: 14px; } /* ========================================================= 7. PREMIUM GREEN GLOW BUTTON Class: green-glow-button ========================================================= */ .green-glow-button .elementor-button { background: linear-gradient( 135deg, #dfff83, #8ee500, #3f9500, #8ee500 ); background-size: 200% 200%; color: #ffffff; border: 1px solid #c8ff68; box-shadow: 0 0 10px rgba(130,220,0,0.30), 0 5px 0 #286500, 0 10px 25px rgba(70,150,0,0.30); transition: all 0.3s ease; } .green-glow-button .elementor-button:hover { background-position: 100% 50%; box-shadow: 0 0 18px rgba(150,255,0,0.50), 0 3px 0 #1e4e00, 0 12px 30px rgba(70,150,0,0.40); transform: translateY(2px); } /* ========================================================= 8. COLORFUL GRADIENT TEXT Class: colorful-gradient-text ========================================================= */ .colorful-gradient-text { background: linear-gradient( 90deg, #ff0055, #ff7a00, #ffe600, #39ff14, #00e5ff, #0066ff, #9b00ff, #ff0055 ); background-size: 400% auto; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; animation: colorfulGradient 6s linear infinite; font-weight: 800; } @keyframes colorfulGradient { 0% { background-position: 0% center; } 50% { background-position: 200% center; } 100% { background-position: 400% center; } } /* ========================================================= 9. ELECTRIC YELLOW TEXT Class: electric-yellow-text ========================================================= */ .electric-yellow-text { position: relative; display: inline-block; color: #fff900; background: linear-gradient( 180deg, #ffffff 0%, #fff900 25%, #ffd000 60%, #ff9d00 100% ); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; text-shadow: 0 0 5px rgba(255,240,0,0.7), 0 0 15px rgba(255,200,0,0.5), 0 0 30px rgba(255,180,0,0.3); animation: electricPulse 1.8s ease-in-out infinite; } /* Electric glow */ @keyframes electricPulse { 0%, 100% { filter: brightness(1); } 50% { filter: brightness(1.35); } } /* Small electric rays */ .electric-yellow-text::before, .electric-yellow-text::after { content: ""; position: absolute; width: 3px; height: 14px; background: #fff700; box-shadow: 0 0 5px #fff700, 0 0 12px #ffb700; opacity: 0; pointer-events: none; } /* Ray 1 */ .electric-yellow-text::before { top: 5%; right: -8px; transform: rotate(35deg); animation: electricRayOne 1.4s infinite; } /* Ray 2 */ .electric-yellow-text::after { bottom: 8%; left: -8px; transform: rotate(-40deg); animation: electricRayTwo 1.7s infinite; } @keyframes electricRayOne { 0%, 65%, 100% { opacity: 0; transform: rotate(35deg) scaleY(0.3); } 70% { opacity: 1; transform: rotate(35deg) scaleY(1); } 78% { opacity: 0; transform: rotate(25deg) scaleY(0.5); } } @keyframes electricRayTwo { 0%, 50%, 100% { opacity: 0; transform: rotate(-40deg) scaleY(0.3); } 55% { opacity: 1; transform: rotate(-40deg) scaleY(1); } 63% { opacity: 0; transform: rotate(-55deg) scaleY(0.5); } } /* ========================================================= 10. BLUE + CYAN TEXT Class: blue-cyan-text ========================================================= */ .blue-cyan-text { background: linear-gradient( 90deg, #003cff, #00aaff, #00eaff, #ffffff, #00c8ff, #0066ff, #003cff ); background-size: 350% auto; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; animation: blueCyanFlow 5s ease-in-out infinite; font-weight: 800; text-shadow: 0 0 12px rgba(0,190,255,0.18); } @keyframes blueCyanFlow { 0% { background-position: 0% center; } 50% { background-position: 100% center; } 100% { background-position: 0% center; } } /* ========================================================= 11. ORANGE GRADIENT TEXT Class: orange-gradient-text ========================================================= */ .orange-gradient-text { background: linear-gradient( 90deg, #7a2100, #c94400, #ff6a00, #ffb000, #fff0a0, #ff7200, #b83200, #7a2100 ); background-size: 350% auto; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; animation: orangeFlow 5s ease-in-out infinite; font-weight: 800; text-shadow: 0 0 12px rgba(255,100,0,0.15); } @keyframes orangeFlow { 0% { background-position: 0% center; } 50% { background-position: 100% center; } 100% { background-position: 0% center; } } /* ========================================================= 12. WHITE + GRAY METALLIC TEXT Class: white-gray-text ========================================================= */ .white-gray-text { background: linear-gradient( 110deg, #666666, #ffffff, #cfcfcf, #ffffff, #777777, #f8f8f8, #999999 ); background-size: 300% auto; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; animation: whiteGrayMetallic 5s ease-in-out infinite; font-weight: 800; text-shadow: 0 0 10px rgba(255,255,255,0.12); } @keyframes whiteGrayMetallic { 0% { background-position: 0% center; } 50% { background-position: 100% center; } 100% { background-position: 0% center; } } /* ========================================================= 13. OPTIONAL: STRONGER ELECTRIC EFFECT Class: electric-yellow-strong ========================================================= */ .electric-yellow-strong { position: relative; display: inline-block; color: #fff500; background: linear-gradient( 180deg, #ffffff 0%, #ffff00 20%, #ffe000 50%, #ff9500 100% ); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; text-shadow: 0 0 4px #fff700, 0 0 10px #fff000, 0 0 20px #ffb000, 0 0 40px rgba(255,150,0,0.5); animation: electricStrongPulse 1.2s ease-in-out infinite; } @keyframes electricStrongPulse { 0%, 100% { filter: brightness(1); } 45% { filter: brightness(1.15); } 50% { filter: brightness(1.7); } 55% { filter: brightness(1.05); } }/* End custom CSS */