.elementor-282 .elementor-element.elementor-element-132927b{--display:flex;--min-height:91vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--margin-top:100px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-282 .elementor-element.elementor-element-132927b:not(.elementor-motion-effects-element-type-background), .elementor-282 .elementor-element.elementor-element-132927b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background:url("https://lamonjamon.com/wp-content/uploads/2026/01/HOME-VERTICAL-scaled.jpg") 50% 50%;background-size:cover;}.elementor-282 .elementor-element.elementor-element-5206edb{--spacer-size:600px;}.elementor-282 .elementor-element.elementor-element-35618f7{--display:flex;--min-height:91vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--margin-top:100px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-282 .elementor-element.elementor-element-35618f7:not(.elementor-motion-effects-element-type-background), .elementor-282 .elementor-element.elementor-element-35618f7 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background:url("https://lamonjamon.com/wp-content/uploads/2026/01/HOME-HORIZONTAL-scaled.jpg") 50% 50%;background-size:cover;}.elementor-282 .elementor-element.elementor-element-456bfd3{--spacer-size:600px;}.elementor-282 .elementor-element.elementor-element-6929c08{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-282 .elementor-element.elementor-element-6929c08:not(.elementor-motion-effects-element-type-background), .elementor-282 .elementor-element.elementor-element-6929c08 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FDF5E0;}.elementor-282 .elementor-element.elementor-element-e600a0c{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-282 .elementor-element.elementor-element-8e9f6a0{text-align:end;}.elementor-282 .elementor-element.elementor-element-8e9f6a0 img{width:59%;}.elementor-282 .elementor-element.elementor-element-b0d9c37{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-282 .elementor-element.elementor-element-b0d9c37:not(.elementor-motion-effects-element-type-background), .elementor-282 .elementor-element.elementor-element-b0d9c37 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FDF5E0;}.elementor-282 .elementor-element.elementor-element-55ba8da{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-282 .elementor-element.elementor-element-5360f56{text-align:end;}.elementor-282 .elementor-element.elementor-element-5360f56 img{width:46%;}.elementor-282 .elementor-element.elementor-element-cd7dd24{--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-282 .elementor-element.elementor-element-e364078{--divider-border-style:solid;--divider-color:#000;--divider-border-width:1px;}.elementor-282 .elementor-element.elementor-element-e364078 .elementor-divider-separator{width:100%;}.elementor-282 .elementor-element.elementor-element-e364078 .elementor-divider{padding-block-start:15px;padding-block-end:15px;}.elementor-282 .elementor-element.elementor-element-f633d98{text-align:start;}.elementor-282 .elementor-element.elementor-element-f633d98 .elementor-heading-title{font-family:"mainfont", Sans-serif;font-size:70px;line-height:75px;letter-spacing:0px;-webkit-text-stroke-color:#000;stroke:#000;}.elementor-282 .elementor-element.elementor-element-461d31d .elementor-heading-title{font-family:"mainfont", Sans-serif;font-size:50px;line-height:55px;letter-spacing:0px;}.elementor-282 .elementor-element.elementor-element-98df502{--spacer-size:50px;}.elementor-282 .elementor-element.elementor-element-a978e9d{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:70px;--padding-bottom:70px;--padding-left:0px;--padding-right:0px;}.elementor-282 .elementor-element.elementor-element-a978e9d:not(.elementor-motion-effects-element-type-background), .elementor-282 .elementor-element.elementor-element-a978e9d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#4A001D;}.elementor-282 .elementor-element.elementor-element-2d844e5{--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;--justify-content:center;--align-items:flex-start;}.elementor-282 .elementor-element.elementor-element-acaa238{width:var( --container-widget-width, 100.23% );max-width:100.23%;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 40px) -40px;--container-widget-width:100.23%;--container-widget-flex-grow:0;}.elementor-282 .elementor-element.elementor-element-acaa238.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-282 .elementor-element.elementor-element-8226433 .elementor-heading-title{font-family:"principal THIN", Sans-serif;font-size:42px;font-weight:500;line-height:41px;letter-spacing:1.5px;word-spacing:7px;-webkit-text-stroke-color:#000;stroke:#000;color:#FFFFFF;}.elementor-282 .elementor-element.elementor-element-b4f6e86{--display:flex;--min-height:573px;--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-282 .elementor-element.elementor-element-b4f6e86:not(.elementor-motion-effects-element-type-background), .elementor-282 .elementor-element.elementor-element-b4f6e86 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://lamonjamon.com/wp-content/uploads/2026/01/21-scaled.jpg");background-size:cover;}.elementor-282 .elementor-element.elementor-element-6f0c7cf{--spacer-size:190px;}.elementor-282 .elementor-element.elementor-element-6919eb5{--display:flex;}.elementor-282 .elementor-element.elementor-element-2f3ae0c{--spacer-size:50px;}.elementor-282 .elementor-element.elementor-element-4c8743d{--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-282 .elementor-element.elementor-element-880bcf6{font-family:"principal THIN", Sans-serif;font-size:50px;line-height:55px;letter-spacing:0px;color:#FFFFFF;}.elementor-282 .elementor-element.elementor-element-ed0918e{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-282 .elementor-element.elementor-element-a4e22dd{--display:flex;--min-height:215px;--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-282 .elementor-element.elementor-element-dbd42ec{--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-282 .elementor-element.elementor-element-4180a5e{column-gap:0px;font-family:"principal THIN", Sans-serif;font-size:50px;line-height:45px;color:#FFFFFF;}.elementor-282 .elementor-element.elementor-element-4180a5e p{margin-block-end:21px;}.elementor-282 .elementor-element.elementor-element-6c32d4e{--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-282 .elementor-element.elementor-element-c987c50{font-family:"principal THIN", Sans-serif;font-size:50px;line-height:45px;color:#FFFFFF;}.elementor-282 .elementor-element.elementor-element-4fdf2e5{--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-282 .elementor-element.elementor-element-f1e5384.elementor-element{--align-self:center;}.elementor-282 .elementor-element.elementor-element-d69c4f1{--display:flex;}.elementor-282 .elementor-element.elementor-element-d2c7c5a{--spacer-size:50px;}.elementor-282 .elementor-element.elementor-element-6127f5b{--display:flex;--padding-top:40px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-282 .elementor-element.elementor-element-6127f5b:not(.elementor-motion-effects-element-type-background), .elementor-282 .elementor-element.elementor-element-6127f5b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#4A001D;}.elementor-282 .elementor-element.elementor-element-c817a7b{--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-282 .elementor-element.elementor-element-c817a7b:not(.elementor-motion-effects-element-type-background), .elementor-282 .elementor-element.elementor-element-c817a7b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#4A001D;}.elementor-282 .elementor-element.elementor-element-e62f213{--display:flex;}.elementor-282 .elementor-element.elementor-element-5be6253 .elementor-icon-box-wrapper{gap:15px;}.elementor-282 .elementor-element.elementor-element-5be6253.elementor-view-stacked .elementor-icon{background-color:#FFFFFF;}.elementor-282 .elementor-element.elementor-element-5be6253.elementor-view-framed .elementor-icon, .elementor-282 .elementor-element.elementor-element-5be6253.elementor-view-default .elementor-icon{fill:#FFFFFF;color:#FFFFFF;border-color:#FFFFFF;}.elementor-282 .elementor-element.elementor-element-5be6253 .elementor-icon-box-title, .elementor-282 .elementor-element.elementor-element-5be6253 .elementor-icon-box-title a{font-family:"principal THIN", Sans-serif;font-size:25px;}.elementor-282 .elementor-element.elementor-element-5be6253 .elementor-icon-box-title{color:#FFFFFF;}.elementor-282 .elementor-element.elementor-element-04e839a{--display:flex;}.elementor-282 .elementor-element.elementor-element-04e839a:not(.elementor-motion-effects-element-type-background), .elementor-282 .elementor-element.elementor-element-04e839a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#0C0C0C00;}.elementor-282 .elementor-element.elementor-element-8ff447f .elementor-icon-box-wrapper{gap:15px;}.elementor-282 .elementor-element.elementor-element-8ff447f.elementor-view-stacked .elementor-icon{background-color:#FFFFFF;}.elementor-282 .elementor-element.elementor-element-8ff447f.elementor-view-framed .elementor-icon, .elementor-282 .elementor-element.elementor-element-8ff447f.elementor-view-default .elementor-icon{fill:#FFFFFF;color:#FFFFFF;border-color:#FFFFFF;}.elementor-282 .elementor-element.elementor-element-8ff447f .elementor-icon-box-title, .elementor-282 .elementor-element.elementor-element-8ff447f .elementor-icon-box-title a{font-family:"principal THIN", Sans-serif;font-size:25px;}.elementor-282 .elementor-element.elementor-element-8ff447f .elementor-icon-box-title{color:#FFFFFF;}.elementor-282 .elementor-element.elementor-element-c227d35{--display:flex;}.elementor-282 .elementor-element.elementor-element-22617ad .elementor-icon-box-wrapper{gap:15px;}.elementor-282 .elementor-element.elementor-element-22617ad.elementor-view-stacked .elementor-icon{background-color:#FFFFFF;}.elementor-282 .elementor-element.elementor-element-22617ad.elementor-view-framed .elementor-icon, .elementor-282 .elementor-element.elementor-element-22617ad.elementor-view-default .elementor-icon{fill:#FFFFFF;color:#FFFFFF;border-color:#FFFFFF;}.elementor-282 .elementor-element.elementor-element-22617ad .elementor-icon-box-title, .elementor-282 .elementor-element.elementor-element-22617ad .elementor-icon-box-title a{font-family:"principal THIN", Sans-serif;font-size:25px;}.elementor-282 .elementor-element.elementor-element-22617ad .elementor-icon-box-title{color:#FFFFFF;}@media(min-width:768px){.elementor-282 .elementor-element.elementor-element-132927b{--content-width:100%;}.elementor-282 .elementor-element.elementor-element-35618f7{--content-width:100%;}.elementor-282 .elementor-element.elementor-element-e600a0c{--width:100%;}.elementor-282 .elementor-element.elementor-element-55ba8da{--width:100%;}.elementor-282 .elementor-element.elementor-element-a978e9d{--content-width:1600px;}.elementor-282 .elementor-element.elementor-element-2d844e5{--width:69%;}.elementor-282 .elementor-element.elementor-element-b4f6e86{--width:30%;}.elementor-282 .elementor-element.elementor-element-a4e22dd{--width:40%;}.elementor-282 .elementor-element.elementor-element-dbd42ec{--width:50%;}}@media(max-width:1024px) and (min-width:768px){.elementor-282 .elementor-element.elementor-element-2d844e5{--width:80%;}.elementor-282 .elementor-element.elementor-element-b4f6e86{--width:92%;}}@media(max-width:1024px){.elementor-282 .elementor-element.elementor-element-e600a0c{--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-282 .elementor-element.elementor-element-55ba8da{--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-282 .elementor-element.elementor-element-5360f56 img{width:57%;height:272px;}.elementor-282 .elementor-element.elementor-element-f633d98 .elementor-heading-title{font-size:45px;line-height:50px;letter-spacing:0px;-webkit-text-stroke-width:0px;stroke-width:0px;}.elementor-282 .elementor-element.elementor-element-461d31d .elementor-heading-title{font-size:25px;line-height:1.1em;}.elementor-282 .elementor-element.elementor-element-acaa238{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 20px) -30px;}.elementor-282 .elementor-element.elementor-element-8226433 .elementor-heading-title{font-size:25px;line-height:1.1em;letter-spacing:0px;word-spacing:0em;}.elementor-282 .elementor-element.elementor-element-b4f6e86:not(.elementor-motion-effects-element-type-background), .elementor-282 .elementor-element.elementor-element-b4f6e86 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://lamonjamon.com/wp-content/uploads/2025/11/2025-11-16-13_04_14-.png");background-size:cover;}.elementor-282 .elementor-element.elementor-element-b4f6e86{--min-height:439px;}.elementor-282 .elementor-element.elementor-element-6f0c7cf{--spacer-size:54px;}.elementor-282 .elementor-element.elementor-element-880bcf6{font-size:45px;line-height:50px;letter-spacing:0px;}}@media(max-width:767px){.elementor-282 .elementor-element.elementor-element-132927b{--min-height:81vh;}.elementor-282 .elementor-element.elementor-element-5206edb{--spacer-size:472px;}.elementor-282 .elementor-element.elementor-element-35618f7{--min-height:81vh;}.elementor-282 .elementor-element.elementor-element-456bfd3{--spacer-size:472px;}.elementor-282 .elementor-element.elementor-element-e600a0c{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-282 .elementor-element.elementor-element-8e9f6a0 img{width:100%;}.elementor-282 .elementor-element.elementor-element-b0d9c37{--width:100%;--min-height:261px;}.elementor-282 .elementor-element.elementor-element-55ba8da{--justify-content:flex-start;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-282 .elementor-element.elementor-element-5360f56 img{width:100%;max-width:82%;height:233px;}.elementor-282 .elementor-element.elementor-element-f633d98 .elementor-heading-title{font-size:35px;line-height:1.1em;letter-spacing:0px;}.elementor-282 .elementor-element.elementor-element-461d31d .elementor-heading-title{font-size:25px;line-height:1.1em;}.elementor-282 .elementor-element.elementor-element-a978e9d{--content-width:100%;--min-height:694px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-282 .elementor-element.elementor-element-2d844e5{--min-height:0px;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-282 .elementor-element.elementor-element-acaa238{margin:-0px -0px calc(var(--kit-widget-spacing, 0px) + 30px) 00px;}.elementor-282 .elementor-element.elementor-element-acaa238.elementor-element{--align-self:flex-start;}.elementor-282 .elementor-element.elementor-element-8226433 .elementor-heading-title{font-size:25px;line-height:30px;letter-spacing:0px;word-spacing:0em;}.elementor-282 .elementor-element.elementor-element-b4f6e86:not(.elementor-motion-effects-element-type-background), .elementor-282 .elementor-element.elementor-element-b4f6e86 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://lamonjamon.com/wp-content/uploads/2025/11/2025-11-16-13_04_14-.png");background-repeat:no-repeat;background-size:cover;}.elementor-282 .elementor-element.elementor-element-b4f6e86{--width:100%;--min-height:201px;}.elementor-282 .elementor-element.elementor-element-b4f6e86.e-con{--flex-grow:1;--flex-shrink:0;}.elementor-282 .elementor-element.elementor-element-987752b.elementor-element{--flex-grow:0;--flex-shrink:1;}.elementor-282 .elementor-element.elementor-element-6f0c7cf{--spacer-size:0px;}.elementor-282 .elementor-element.elementor-element-880bcf6{font-size:25px;line-height:30px;}.elementor-282 .elementor-element.elementor-element-4180a5e{font-size:25px;line-height:30px;}.elementor-282 .elementor-element.elementor-element-c987c50{column-gap:0px;font-size:25px;line-height:35px;letter-spacing:0px;}.elementor-282 .elementor-element.elementor-element-6127f5b{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:40px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}}/* Start custom CSS for html, class: .elementor-element-987752b */<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Efecto Humo de Vela</title>
    <style>
        .smoke-container {
            position: relative;
            width: 100%;
            max-width: 400px;
            height: 500px;
            margin: 0 auto;
            overflow: hidden;
            background: transparent;
        }

        .smoke-canvas {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

        .controls {
            text-align: center;
            margin: 20px 0;
            padding: 15px;
            background: #f5f5f5;
            border-radius: 8px;
        }

        .control-group {
            margin: 15px 0;
        }

        .control-group label {
            display: inline-block;
            width: 150px;
            text-align: left;
            font-family: Arial, sans-serif;
            font-size: 14px;
            color: #333;
        }

        .control-group input[type="range"] {
            width: 200px;
            vertical-align: middle;
        }

        .control-group span {
            display: inline-block;
            width: 50px;
            text-align: center;
            font-family: Arial, sans-serif;
            font-size: 14px;
            color: #666;
        }

        /* Responsive */
        @media (max-width: 768px) {
            .smoke-container {
                max-width: 300px;
                height: 400px;
            }
            
            .control-group label {
                width: 120px;
                font-size: 12px;
            }
            
            .control-group input[type="range"] {
                width: 150px;
            }
        }

        @media (max-width: 480px) {
            .smoke-container {
                max-width: 250px;
                height: 350px;
            }
            
            .controls {
                padding: 10px;
            }
            
            .control-group {
                margin: 10px 0;
            }
        }
    </style>
</head>
<body>
    <div class="controls">
        <div class="control-group">
            <label for="horizontalPos">Posición Horizontal:</label>
            <input type="range" id="horizontalPos" min="0" max="100" value="50">
            <span id="horizontalValue">50%</span>
        </div>
        <div class="control-group">
            <label for="verticalPos">Posición Vertical:</label>
            <input type="range" id="verticalPos" min="0" max="100" value="90">
            <span id="verticalValue">90%</span>
        </div>
        <div class="control-group">
            <label for="smokeIntensity">Intensidad del Humo:</label>
            <input type="range" id="smokeIntensity" min="1" max="10" value="5">
            <span id="intensityValue">5</span>
        </div>
    </div>

    <div class="smoke-container">
        <canvas class="smoke-canvas" id="smokeCanvas"></canvas>
    </div>

    <script>
        class SmokeParticle {
            constructor(x, y, canvas) {
                this.canvas = canvas;
                this.x = x;
                this.y = y;
                this.size = Math.random() * 15 + 5;
                this.speedX = (Math.random() - 0.5) * 2;
                this.speedY = -Math.random() * 2 - 1;
                this.opacity = Math.random() * 0.5 + 0.3;
                this.fadeRate = Math.random() * 0.005 + 0.002;
                this.growRate = Math.random() * 0.2 + 0.1;
            }

            update() {
                this.x += this.speedX;
                this.y += this.speedY;
                this.size += this.growRate;
                this.opacity -= this.fadeRate;
                
                // Efecto de turbulencia
                this.speedX += (Math.random() - 0.5) * 0.2;
                this.speedY -= 0.05;
            }

            draw(ctx) {
                ctx.save();
                ctx.globalAlpha = this.opacity;
                
                const gradient = ctx.createRadialGradient(
                    this.x, this.y, 0,
                    this.x, this.y, this.size
                );
                
                gradient.addColorStop(0, 'rgba(200, 200, 200, 1)');
                gradient.addColorStop(0.5, 'rgba(150, 150, 150, 0.8)');
                gradient.addColorStop(1, 'rgba(100, 100, 100, 0)');
                
                ctx.fillStyle = gradient;
                ctx.beginPath();
                ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);
                ctx.fill();
                ctx.restore();
            }

            isDead() {
                return this.opacity <= 0 || this.y < -50;
            }
        }

        class SmokeEffect {
            constructor(canvasId) {
                this.canvas = document.getElementById(canvasId);
                this.ctx = this.canvas.getContext('2d');
                this.particles = [];
                this.horizontalPos = 50;
                this.verticalPos = 90;
                this.intensity = 5;
                
                this.resizeCanvas();
                window.addEventListener('resize', () => this.resizeCanvas());
                
                this.animate();
            }

            resizeCanvas() {
                const container = this.canvas.parentElement;
                this.canvas.width = container.offsetWidth;
                this.canvas.height = container.offsetHeight;
            }

            setHorizontalPosition(value) {
                this.horizontalPos = value;
            }

            setVerticalPosition(value) {
                this.verticalPos = value;
            }

            setIntensity(value) {
                this.intensity = value;
            }

            createParticle() {
                const x = (this.canvas.width * this.horizontalPos) / 100;
                const y = (this.canvas.height * this.verticalPos) / 100;
                this.particles.push(new SmokeParticle(x, y, this.canvas));
            }

            animate() {
                this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);

                // Crear nuevas partículas según la intensidad
                for (let i = 0; i < this.intensity; i++) {
                    if (Math.random() < 0.3) {
                        this.createParticle();
                    }
                }

                // Actualizar y dibujar partículas
                this.particles = this.particles.filter(particle => {
                    particle.update();
                    particle.draw(this.ctx);
                    return !particle.isDead();
                });

                requestAnimationFrame(() => this.animate());
            }
        }

        // Inicializar el efecto
        const smokeEffect = new SmokeEffect('smokeCanvas');

        // Controles
        const horizontalSlider = document.getElementById('horizontalPos');
        const verticalSlider = document.getElementById('verticalPos');
        const intensitySlider = document.getElementById('smokeIntensity');
        
        const horizontalValue = document.getElementById('horizontalValue');
        const verticalValue = document.getElementById('verticalValue');
        const intensityValue = document.getElementById('intensityValue');

        horizontalSlider.addEventListener('input', (e) => {
            const value = e.target.value;
            smokeEffect.setHorizontalPosition(value);
            horizontalValue.textContent = value + '%';
        });

        verticalSlider.addEventListener('input', (e) => {
            const value = e.target.value;
            smokeEffect.setVerticalPosition(value);
            verticalValue.textContent = value + '%';
        });

        intensitySlider.addEventListener('input', (e) => {
            const value = e.target.value;
            smokeEffect.setIntensity(value);
            intensityValue.textContent = value;
        });
    </script>
</body>
</html>/* End custom CSS */
/* Start custom CSS for montoya_portfolio_overlapping_gallery, class: .elementor-element-b8469c5 */.slide-date {
    display: none !important;
}

.slide-title.primary-font-title {
    font-family: 'ZT Bros Oskon', Georgia, serif !important;
    font-weight: 400 !important;
    text-transform: capitalize !important;
    letter-spacing: 0.3px !important;
    line-height: 1.1 !important;
    font-size: 100px !important; /* Desktop por defecto */
}

/* Tablet */
@media (max-width: 1024px) {
    .slide-title.primary-font-title {
        font-size: 75px !important;
    }
}

/* Móvil */
@media (max-width: 767px) {
    .slide-title.primary-font-title {
        font-size: 70px !important;
    }
    
}
.elementor-282 .elementor-element.elementor-element-b8469c5 .slide{ position: relative; }

.elementor-282 .elementor-element.elementor-element-b8469c5 .slide-title{
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 100% !important;
    text-align: center !important;
    margin: 0 !important;
}/* End custom CSS */
/* Start custom CSS */.height-title.content-full-width.text-align-center {
    display: none !important;
}
.slide-cat{
    display: none !important;
}
/* Fullscreen para animaciones */
.grid__item-img--large {
    width: 100vw !important;
    height: 100vh !important;
    object-fit: cover !important;
    object-position: center !important;
}
/* Ocultar cuando no está activa */
.grid__item-img--large[style*="display: none"],
.grid__item-img--large[style*="opacity: 0"] {
    display: none !important;
    opacity: 0 !important;
    pointer-events: none !important;
    visibility: hidden !important;
}
/* Prevenir scroll durante carga */
html {
    scroll-behavior: auto !important;
}
body {
    overflow-x: hidden;
}
/* Asegurar que no queden imágenes visibles */
body:not(.portfolio-transition) .grid__item-img--large {
    display: none !important;
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'mainfont';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url('https://lamonjamon.com/wp-content/uploads/2025/10/SF-Pro-Display-Ultralight.ttf') format('truetype');
}
@font-face {
	font-family: 'mainfont';
	font-style: italic;
	font-weight: normal;
	font-display: auto;
	src: url('https://lamonjamon.com/wp-content/uploads/2026/01/SFPRODISPLAYULTRALIGHTITALIC.ttf') format('truetype');
}
/* End Custom Fonts CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'principal THIN';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url('https://lamonjamon.com/wp-content/uploads/2026/01/SF-Pro-Display-Thin.ttf') format('truetype');
}
/* End Custom Fonts CSS */