.elementor-kit-6{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */.bg-paper-plane {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: -1;
}

.wave-wrapper {
    animation: waveFly 40s linear infinite;
    position: absolute;
    top: 30%;  /* starting vertical position */
    left: -300px; /* start offscreen */
}

#paper-plane {
    width: 300px;  /* plane size */
    height: auto;
    opacity: 0.8;
    transform: translateX(var(--dx,0)) translateY(var(--dy,0)) rotate(0deg);
    transition: transform 0.15s ease;  /* faster dodge reaction */
}

/* Wave animation moves the wrapper */
@keyframes waveFly {
    0% { transform: translateX(0) translateY(0) rotate(-15deg); }
    25% { transform: translateX(25vw) translateY(-80px) rotate(40deg); }
    50% { transform: translateX(50vw) translateY(0) rotate(20deg); }
    75% { transform: translateX(75vw) translateY(30px) rotate(0deg); }
    100% { transform: translateX(120vw) translateY(0) rotate(-20deg); }
}

/* Make the link behave correctly */
.heart-link {
    display: inline-block;
    text-decoration: none;
}

/* Heart Button Container */
.heart-button {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 400px;   /* BIG HEART width */
    height: 400px;  /* BIG HEART height */
    cursor: pointer;
}

/* Main Heart */
.heart-button .heart-icon {
    width: 100%;
    height: 100%;
    fill: #c44e34;      /* heart color */
    z-index: 2;
}

/* Gradient Glow Heart */
.heart-button .heart-glow {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    filter: blur(50px);
    opacity: 0;
    transition: 0.3s;
}

/* Text inside heart */
.heart-button .button-label {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-weight: bold;
    font-size: 30px;
    max-width: 60%;      /* ensures text stays inside heart */
    text-align: center;
    word-wrap: break-word;
    z-index: 3;
    pointer-events: none;
}

/* Hover: show glow + pulse */
.heart-button:hover .heart-glow {
    opacity: 0.9;
    animation: pulseGlow 1.5s ease-in-out infinite;
}

/* Pulse animation */
@keyframes pulseGlow {
    0% { transform: scale(1); opacity: 0.6; }
    50% { transform: scale(1.25); opacity: 0.8; }
    100% { transform: scale(1); opacity: 0.6; }
}

/* Subtle slow shake animation */
@keyframes slowShake {
    0%   { transform: translate(0, 0) rotate(0deg); }
    25%  { transform: translate(-2px, 1px) rotate(-1deg); }
    50%  { transform: translate(2px, -1px) rotate(1deg); }
    75%  { transform: translate(-1px, 1px) rotate(0.5deg); }
    100% { transform: translate(0, 0) rotate(0deg); }
}

/* Apply the animation to the main heart */
.heart-button .heart-icon {
    animation: slowShake 3s ease-in-out infinite;  
}

/* Also apply to the glow so they move together */
.heart-button .heart-glow {
    animation: slowShake 3s ease-in-out infinite;
}

/* Breathing animation (expand + contract) */
@keyframes heartBreathe {
    0%   { transform: scale(1); }
    50%  { transform: scale(1.08); }
    100% { transform: scale(1); }
}

/* Apply breathing ONLY when hovered */
.heart-button:hover .heart-icon,
.heart-button:hover .heart-glow {
    animation: heartBreathe 1.5s ease-in-out infinite;
}

/* --- ZOOM TRANSITION + WHITE FLASH --- */
.page-portal-effect {
    animation: portalZoom 2s ease forwards;
    transform-origin: center center;
    position: relative;
    overflow: hidden;
}

/* Zoom-in warp effect */
@keyframes portalZoom {
    0% {
        transform: scale(1);
        filter: blur(0px);
        opacity: 1;
    }
    100% {
        transform: scale(4);
        filter: blur(20px);
        opacity: 0;
    }
}

/* White flash overlay */
.page-portal-effect::after {
    content: "";
    position: fixed;
    inset: 0;
    background: white;
    opacity: 0;
    pointer-events: none;
    animation: whiteFlash 3s ease forwards; /* increased duration */
}

/* Flash timing */
@keyframes whiteFlash {
    0%   { opacity: 0; }
    10%  { opacity: 1; }  /* fade in gradually */
    50%  { opacity: 0.8; } /* peak brightness sustained */
    100% { opacity: 1; }   /* fade out gradually */
}

/* Responsive: Tablet */
@media (max-width: 1024px) {
    .heart-button { width: 300px; height: 300px; }
    .heart-button .button-label { font-size: 20px; max-width: 60%; }
    .wave-wrapper { width: 200px; height: auto; }
}

/* Responsive: Mobile */
@media (max-width: 767px) {
    .heart-button { width: 150px; height: 150px; }
    .heart-button .button-label { font-size: 12px; max-width: 60%; }
    .wave-wrapper { width: 100px; height: auto; }
}/* End custom CSS */