/* Booked By Search — premium mobile hero v1 — 2026-09-12
   Mobile-only conversion polish. Desktop intentionally untouched. */
.mobile-premium-conversion{display:none}

@media(max-width:680px){
  .hero.hero-vsl-first{
    padding-top:74px;
    padding-bottom:34px;
  }

  /* Cleaner hero hierarchy */
  .hero-vsl-copy .availability-pill{
    max-width:330px;
    min-height:34px;
    padding:7px 12px;
    border-color:rgba(89,166,255,.42);
    background:linear-gradient(180deg,rgba(20,42,77,.86),rgba(10,27,56,.76));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 10px 30px rgba(0,0,0,.08);
  }
  .hero-vsl-copy .au-market-divider,
  .hero-vsl-copy [data-availability]{display:none!important}
  .hero-vsl-copy .au-market-copy{font-size:8.6px;letter-spacing:.12em}

  .hero-vsl-copy h1{
    margin:18px auto 12px;
    font-size:clamp(33px,10.6vw,41px);
    line-height:.98;
  }
  .hero-vsl-copy .hero-lead{
    max-width:340px;
    font-size:13.8px;
    line-height:1.45;
    color:#b9c7dd;
  }
  .hero-vsl-copy .hero-lead strong{color:#eff6ff}

  .hero-vsl-media{margin-top:19px}
  .hero-vsl-media .watch-label{
    margin-bottom:11px;
    font-size:8.8px;
    letter-spacing:.17em;
    color:#8fa8ca;
  }
  .hero-vsl-media .watch-label span{color:#57ddff;font-size:15px;margin-right:7px}

  /* Larger, cleaner video frame with subtle premium neon edge */
  .hero-vsl-media .video-stage{width:100%;margin:0}
  .hero-vsl-media .video-chrome{
    border-radius:20px;
    border:1px solid rgba(84,173,255,.42);
    box-shadow:0 22px 52px rgba(0,0,0,.42),0 0 30px rgba(41,154,255,.12),0 0 0 1px rgba(143,97,255,.08);
    overflow:hidden;
  }
  .hero-vsl-media .video-frame{margin:0 5px;border-radius:13px}
  .hero-vsl-media .video-bottom{height:27px}

  /* New trust → CTA → proof sequence immediately after VSL */
  .mobile-premium-conversion{
    display:flex;
    flex-direction:column;
    gap:15px;
    width:100%;
    margin-top:16px;
  }
  .mobile-premium-trust{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:6px;
    width:100%;
  }
  .mobile-premium-trust>span{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    min-width:0;
    color:#dce9fb;
    font-size:8.7px;
    line-height:1.2;
    text-align:left;
  }
  .mobile-premium-trust b{
    display:grid;
    place-items:center;
    flex:0 0 29px;
    width:29px;height:29px;
    border-radius:10px;
    color:#061326;
    background:linear-gradient(135deg,#49def8,#6f7cff 68%,#b66bff);
    box-shadow:0 7px 22px rgba(73,191,255,.18),inset 0 1px 0 rgba(255,255,255,.65);
    font-size:14px;
  }
  .mobile-premium-trust small{font:inherit;color:inherit}

  .mobile-premium-cta{
    width:100%;
    min-height:66px;
    margin:0;
    padding:0 26px;
    border-radius:20px;
    justify-content:center;
    gap:20px;
    font-size:19px;
    font-weight:900;
    background:linear-gradient(100deg,#55dfff 0%,#4c9cff 34%,#706fff 68%,#b36cff 100%);
    border:1px solid rgba(196,229,255,.74);
    box-shadow:0 18px 44px rgba(52,136,255,.32),0 0 34px rgba(126,85,255,.17),inset 0 1px 0 rgba(255,255,255,.82);
    animation:mobileHeroCtaPulse 2.9s ease-in-out infinite;
  }
  .mobile-premium-cta svg{width:24px;height:24px}
  @keyframes mobileHeroCtaPulse{
    0%,100%{box-shadow:0 18px 44px rgba(52,136,255,.28),0 0 28px rgba(126,85,255,.13),inset 0 1px 0 rgba(255,255,255,.82)}
    50%{box-shadow:0 23px 56px rgba(52,136,255,.40),0 0 42px rgba(126,85,255,.22),inset 0 1px 0 rgba(255,255,255,.88)}
  }

  .mobile-premium-social{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    color:#b9c9df;
    font-size:9.3px;
    line-height:1.25;
    text-align:left;
  }
  .mobile-premium-social strong{color:#edf6ff}
  .mobile-social-stack{display:flex;padding-left:8px}
  .mobile-social-stack i{
    display:grid;place-items:center;
    width:27px;height:27px;
    margin-left:-8px;
    border:2px solid #07162e;
    border-radius:50%;
    color:#07162e;
    background:linear-gradient(145deg,#5de7ff,#7d79ff 58%,#c06cff);
    font-size:10px;font-style:normal;font-weight:900;
    box-shadow:0 5px 14px rgba(0,0,0,.28);
  }

  /* Compact feature cards below conversion block */
  .hero-vsl-support{
    gap:12px;
    margin-top:18px;
  }
  .hero-vsl-support .system-pills{order:1;gap:9px}
  .hero-vsl-support .system-pills span{
    display:flex;
    align-items:flex-start;
    justify-content:flex-start;
    gap:9px;
    min-height:76px;
    padding:12px 11px;
    border-radius:16px;
    background:linear-gradient(180deg,rgba(14,32,60,.9),rgba(7,20,42,.88));
    border:1px solid rgba(72,165,255,.27);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 10px 24px rgba(0,0,0,.08);
    text-align:left;
  }
  .hero-vsl-support .system-pills span>b{
    display:block!important;
    flex:0 0 28px;
    width:28px;
    color:#58ddff;
    font-size:22px;
    line-height:1;
    text-align:center;
  }
  .hero-vsl-support .system-pills span>em{
    display:flex!important;
    flex-direction:column;
    gap:4px;
    min-width:0;
    font-style:normal;
  }
  .hero-vsl-support .system-pills strong{
    display:block;
    color:#f0f7ff!important;
    font-size:10px!important;
    font-weight:800;
    line-height:1.15;
  }
  .hero-vsl-support .system-pills small{
    display:block!important;
    color:#8fa6c7;
    font-size:8.2px;
    line-height:1.25;
  }

  /* One compact guarantee card after features */
  .hero-vsl-support .hero-guarantee-anchor-v26{order:2}
  .hero-vsl-support .hero-guarantee-badge-v23{
    min-height:69px;
    padding:10px 12px;
    border-radius:16px;
    background:linear-gradient(105deg,rgba(96,58,3,.35),rgba(17,24,43,.94) 30%,rgba(9,18,37,.95));
    border-color:rgba(246,181,48,.68);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 14px 34px rgba(0,0,0,.12);
  }
  .hero-vsl-support .hero-guarantee-star-v23{width:42px;height:42px;flex-basis:42px;font-size:19px;border-radius:12px}
  .hero-vsl-support .hero-guarantee-copy-v23 strong{font-size:10px;letter-spacing:.055em}
  .hero-vsl-support .hero-guarantee-copy-v23 small{font-size:8px;line-height:1.3}

  /* Remove the old duplicate text-heavy conversion pieces from the first mobile screen. */
  .hero.hero-vsl-first > .hero-guarantee-line-v23,
  .hero.hero-vsl-first > .hero-cta,
  .hero.hero-vsl-first > .hero-proof-strip{display:none!important}

  /* Keep sticky bottom CTA, but make it feel less bulky and more aligned with new UI. */
  .mobile-buybar{
    min-height:82px;
    padding:11px 16px calc(11px + env(safe-area-inset-bottom));
    background:rgba(3,11,24,.93);
    backdrop-filter:blur(18px);
    border-top:1px solid rgba(89,159,255,.18);
  }
  .mobile-buybar button{
    border-radius:17px;
    box-shadow:0 12px 32px rgba(63,140,255,.22),inset 0 1px 0 rgba(255,255,255,.72);
  }
}

@media(max-width:370px){
  .mobile-premium-trust>span{font-size:8px;gap:5px}
  .mobile-premium-trust b{width:26px;height:26px;flex-basis:26px}
  .mobile-premium-cta{min-height:61px;font-size:17px}
  .hero-vsl-support .system-pills span{min-height:72px;padding:10px 9px}
}


/* Mobile alignment refinement v2 — 2026-09-12 */
@media(max-width:680px){
  /* Three trust points: identical check treatment and truly even centering. */
  .mobile-premium-trust{
    grid-template-columns:repeat(3,1fr);
    gap:10px;
    align-items:start;
    padding:0 4px;
  }
  .mobile-premium-trust>span{
    display:grid;
    grid-template-rows:34px auto;
    justify-items:center;
    align-items:start;
    gap:7px;
    width:100%;
    min-width:0;
    text-align:center;
  }
  .mobile-premium-trust b{
    width:34px;
    height:34px;
    flex-basis:34px;
    border-radius:11px;
    font-size:16px;
    line-height:1;
  }
  .mobile-premium-trust small{
    display:block;
    width:100%;
    min-height:32px;
    font-size:8.9px;
    line-height:1.25;
    text-align:center;
  }

  /* Feature cards: consistent internal geometry so every card feels centred. */
  .hero-vsl-support .system-pills{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
    width:100%;
  }
  .hero-vsl-support .system-pills span{
    display:grid;
    grid-template-columns:28px minmax(0,1fr);
    align-items:center;
    justify-content:center;
    column-gap:10px;
    min-height:78px;
    padding:12px 13px;
  }
  .hero-vsl-support .system-pills span>b{
    width:28px;
    flex-basis:auto;
    align-self:center;
    justify-self:center;
    margin:0;
  }
  .hero-vsl-support .system-pills span>em{
    justify-content:center;
    align-self:center;
    text-align:left;
  }
  .hero-vsl-support .system-pills strong,
  .hero-vsl-support .system-pills small{
    text-align:left;
  }
}

@media(max-width:370px){
  .mobile-premium-trust{gap:5px;padding:0}
  .mobile-premium-trust b{width:30px;height:30px;flex-basis:30px}
  .mobile-premium-trust small{font-size:8px}
  .hero-vsl-support .system-pills span{padding:10px 9px;column-gap:7px}
}
