.elementor-28687 .elementor-element.elementor-element-a08e703{--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;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS for container, class: .elementor-element-a08e703 */<style>
  /* SissyHive 2025 palette */
  :root{
    --bg: #fceafd;
    --primary: #ffb6e6;
    --hot: #f759c5;
    --lav: #c79ee7;
    --plum: #3d1c3e;
    --pearl: #fefbff;
    --border: #ffe6f5;
  }

  /* Blur Elementor sections marked locked */
  body:not(.hive-unlocked) .hive-lock{
    filter: blur(8px);
    opacity: 0.45;
    pointer-events: none;
    user-select: none;
    transition: filter .16s ease, opacity .16s ease;
  }

  /* Overlay (FAST) */
  .hive-lock-overlay{
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: rgba(61,28,62,0.72); /* deep plum tint */
  }
  body:not(.hive-unlocked) .hive-lock-overlay{ display:flex; }

  /* Soft glow without backdrop-filter */
  .hive-lock-overlay:before{
    content:"";
    position:absolute;
    inset:-30%;
    background:
      radial-gradient(circle at 25% 10%, rgba(247,89,197,0.18), transparent 58%),
      radial-gradient(circle at 80% 90%, rgba(199,158,231,0.16), transparent 62%),
      radial-gradient(circle at 50% 55%, rgba(255,182,230,0.10), transparent 60%);
    pointer-events:none;
  }

  /* Card (same size/feel, upgraded design) */
  .hive-lock-box{
    position: relative;
    width: min(520px, 100%);
    border-radius: 22px;
    padding: 18px 16px 16px;
    background: rgba(254,251,255,0.94); /* pearl */
    border: 1px solid rgba(255,182,230,0.70);
    box-shadow: 0 22px 70px rgba(61,28,62,0.35);
    overflow: hidden;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    text-align: center;
    color: var(--plum);
  }

  /* Feminine sheen + faint sparkles (lightweight) */
  .hive-lock-box:before{
    content:"";
    position:absolute; inset:0;
    background:
      linear-gradient(135deg, rgba(255,182,230,0.20), rgba(254,251,255,0) 62%),
      radial-gradient(circle at 18% 20%, rgba(247,89,197,0.08), transparent 52%),
      radial-gradient(circle at 82% 8%, rgba(199,158,231,0.08), transparent 55%);
    pointer-events:none;
  }
  .hive-lock-box:after{
    content:"";
    position:absolute; inset:0;
    opacity: 0.22;
    background:
      radial-gradient(circle, rgba(247,89,197,0.35) 2px, transparent 3px) 12px 18px / 150px 150px,
      radial-gradient(circle, rgba(199,158,231,0.35) 2px, transparent 3px) 70px 95px / 170px 170px;
    pointer-events:none;
  }

  /* Lips (slightly bigger) */
  .hive-lock-lips{
    width: clamp(105px, 28vw, 145px);
    max-width: 46%;
    margin: 0 auto 8px;
    display:block;
    filter: drop-shadow(0 12px 18px rgba(247,89,197,0.22));
    position: relative;
    z-index: 2;
  }

  .hive-lock-title{
    margin: 2px 0 6px;
    font-weight: 900;
    font-size: 16px;
    letter-spacing: 0.1px;
    position: relative;
    z-index: 2;
  }

  .hive-lock-copy{
    margin: 0 0 10px;
    font-size: 13px;
    line-height: 1.45;
    color: rgba(61,28,62,0.80);
    position: relative;
    z-index: 2;
  }

  /* Sale line (short + punchy) */
  .hive-sale{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
    padding: 8px 10px;
    border-radius: 999px;
    border: 1px solid rgba(247,89,197,0.24);
    background: rgba(255,182,230,0.18);
    color: var(--plum);
    font-weight: 900;
    font-size: 12.5px;
  }
  .hive-sale b{ color: var(--hot); }
  .hive-sale s{
    color: rgba(61,28,62,0.45);
    font-weight: 800;
  }
  .hive-sale .dot{
    width: 7px; height: 7px; border-radius: 999px;
    background: var(--hot);
    box-shadow: 0 0 0 4px rgba(247,89,197,0.11);
  }

  /* Row */
  .hive-lock-row{
    display:flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    margin-top: 12px;
    position: relative;
    z-index: 2;
  }

  .hive-pass-wrap{
    position: relative;
    flex: 1;
    min-width: 240px;
  }

  /* Upgraded input */
  .hive-lock-input{
    width: 100%;
    padding: 13px 44px 13px 14px;
    border-radius: 16px;
    border: 1px solid rgba(255,182,230,0.90);
    background: rgba(252,234,253,0.62);
    color: var(--plum);
    outline: none;
    font-size: 14px;
    transition: box-shadow .15s ease, border-color .15s ease;
  }
  .hive-lock-input:focus{
    border-color: rgba(247,89,197,0.55);
    box-shadow: 0 0 0 5px rgba(247,89,197,0.10);
  }
  .hive-lock-input::placeholder{ color: rgba(61,28,62,0.45); }

  /* Eye toggle (SVG button, looks premium) */
  .hive-eye{
    position:absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 34px;
    height: 34px;
    border-radius: 14px;
    border: 1px solid rgba(247,89,197,0.20);
    background: rgba(254,251,255,0.80);
    display:flex;
    align-items:center;
    justify-content:center;
    cursor: pointer;
    padding: 0;
    color: var(--hot);
  }
  .hive-eye:active{ transform: translateY(-50%) scale(0.98); }
  .hive-eye svg{ width: 18px; height: 18px; }
  .hive-eye .eye-off{ display:none; }

  /* Unlock button (cute, not huge) */
  .hive-lock-btn{
    padding: 13px 14px;
    border-radius: 16px;
    border: 1px solid rgba(247,89,197,0.22);
    background: linear-gradient(135deg, rgba(255,182,230,0.30), rgba(247,89,197,0.10));
    color: var(--plum);
    font-weight: 950;
    font-size: 14px;
    cursor: pointer;
    white-space: nowrap;
    box-shadow: 0 14px 30px rgba(247,89,197,0.10);
  }
  .hive-lock-btn:hover{ filter: brightness(1.03); }

  /* CTA under input (small + conversion friendly) */
  .hive-mini-cta{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    padding: 9px 12px;
    border-radius: 999px;
    border: 1px solid rgba(247,89,197,0.25);
    background: rgba(255,182,230,0.18);
    color: var(--hot);
    font-weight: 950;
    font-size: 12.8px;
    text-decoration: none;
    position: relative;
    z-index: 2;
    box-shadow: 0 12px 24px rgba(247,89,197,0.10);
  }
  .hive-mini-cta .mini-dot{
    width: 8px; height: 8px; border-radius: 999px;
    background: var(--hot);
    box-shadow: 0 0 0 5px rgba(247,89,197,0.11);
  }
  .hive-mini-cta:hover{ filter: brightness(1.04); }

  .hive-lock-error{
    display:none;
    margin-top: 8px;
    font-size: 12.5px;
    color: var(--hot);
    font-weight: 850;
    position: relative;
    z-index: 2;
  }

  .hive-lock-sign{
    margin-top: 10px;
    font-size: 12px;
    color: rgba(61,28,62,0.68);
    position: relative;
    z-index: 2;
    line-height: 1.35;
  }

  /* Mobile stacking */
  @media (max-width: 420px){
    .hive-pass-wrap{ min-width: 100%; }
    .hive-lock-btn{ width: 100%; }
  }
</style>

<div class="hive-lock-overlay" id="hiveOverlay">
  <div class="hive-lock-box" id="hiveBox">
    <img
      class="hive-lock-lips"
      src="https://sissyhive.com/wp-content/uploads/2026/02/toppng.com-lips-png-red-color-lips-773x519-1.png"
      alt="Kiss"
      loading="eager"
      decoding="async"
    />

    <div class="hive-lock-title">Hi sweetie 💋</div>

    <div class="hive-lock-copy">
      Enter your secret password to see Mistress Lexie’s content for you.
      <div class="hive-sale">
        <span class="dot"></span>
        Lifetime access: <b>$9</b> today <span style="font-weight:800;">•</span> <s>$49</s>
      </div>
    </div>

    <div class="hive-lock-row">
      <div class="hive-pass-wrap">
        <input
          class="hive-lock-input"
          id="hivePass"
          type="password"
          placeholder="Your secret password…"
          autocomplete="current-password"
        />

        <button class="hive-eye" id="hiveEye" type="button" aria-label="Show password" title="Show password">
          <!-- Eye ON -->
          <svg class="eye-on" viewBox="0 0 24 24" fill="none" aria-hidden="true">
            <path d="M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7Z" stroke="currentColor" stroke-width="2"/>
            <circle cx="12" cy="12" r="3" stroke="currentColor" stroke-width="2"/>
          </svg>
          <!-- Eye OFF -->
          <svg class="eye-off" viewBox="0 0 24 24" fill="none" aria-hidden="true">
            <path d="M3 3l18 18" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
            <path d="M2 12s3.5-7 10-7c2.2 0 4.1.7 5.7 1.7M22 12s-3.5 7-10 7c-2.2 0-4.1-.7-5.7-1.7" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
            <path d="M10 10a3 3 0 0 0 4 4" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
          </svg>
        </button>
      </div>

      <button class="hive-lock-btn" id="hiveUnlock" type="button">Unlock</button>
    </div>

    <a class="hive-mini-cta" id="hiveShopLink" href="#">
      <span class="mini-dot"></span>
      Get your password ↗
    </a>

    <div class="hive-lock-error" id="hiveErr">Wrong password, sweetheart.</div>

    <div class="hive-lock-sign">
      Love, hugs & kisses 💕<br>
      — Mistress Lexie
    </div>
  </div>
</div>

<script>
  (function(){
    // ✅ Change these:
    const PASSWORD = "lovesissyhive";
    const SHOP_URL = "https://stan.store/themistresssletter/p/get-30-affirmations--hive-pass-now-";

    const pass = document.getElementById("hivePass");
    const btn  = document.getElementById("hiveUnlock");
    const eye  = document.getElementById("hiveEye");
    const err  = document.getElementById("hiveErr");
    const shop = document.getElementById("hiveShopLink");

    shop.href = SHOP_URL;

    // Remember unlock per page
    const KEY = "hive_unlock_" + location.pathname;

    function unlock(){
      document.body.classList.add("hive-unlocked");
      try{ localStorage.setItem(KEY,"1"); }catch(e){}
    }

    // Auto-unlock if saved
    try{
      if(localStorage.getItem(KEY) === "1") unlock();
    }catch(e){}

    function attempt(){
      err.style.display = "none";
      if((pass.value || "").trim() === PASSWORD){
        unlock();
      }else{
        err.style.display = "block";
        pass.focus();
        pass.select();
      }
    }

    btn.addEventListener("click", attempt);
    pass.addEventListener("keydown", (e)=>{ if(e.key === "Enter") attempt(); });

    // Eye toggle (switch input type + swap icons)
    eye.addEventListener("click", ()=>{
      const onIcon = eye.querySelector(".eye-on");
      const offIcon = eye.querySelector(".eye-off");

      if(pass.type === "password"){
        pass.type = "text";
        onIcon.style.display = "none";
        offIcon.style.display = "block";
        eye.setAttribute("aria-label","Hide password");
        eye.title = "Hide password";
      }else{
        pass.type = "password";
        onIcon.style.display = "block";
        offIcon.style.display = "none";
        eye.setAttribute("aria-label","Show password");
        eye.title = "Show password";
      }
    });
  })();
</script>/* End custom CSS */