:root{
  --rushd-navy:#0E1F3D;
  --rushd-red:#E43036;
  --rushd-cream:#F7F4EE;
  --rushd-ease:cubic-bezier(.22,.8,.22,1);
}

.rushd-mobile-bundle-section{
  --rushd-mobile-bundle-opacity:0;
  position:absolute;
  inset:0;
  z-index:30;
  display:none;
  opacity:var(--rushd-mobile-bundle-opacity);
  visibility:hidden;
  pointer-events:none;
  direction:rtl;
  transition:opacity .12s linear,visibility .12s linear;
}

.rushd-mobile-bundle-section.is-active{visibility:visible;}
.rushd-mobile-bundle-section.is-interactive{pointer-events:auto;}

.rushd-mobile-bundle-section__inner{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
}

/*
  SOURCE FRAME: 1080 x 1920
  Books end ~= y 767  (39.95%)
  Child head starts ~= y 991 (51.61%)
  CTA must stay inside this real 223px gap.
*/
.rushd-mobile-bundle-section__copy{
  position:absolute;
  left:50%;
  top:40.45%;
  width:min(82vw,520px);
  max-height:10.6%;
  transform:translateX(-50%) translateY(8px) scale(.985);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:2px;
  text-align:center;
  filter:blur(4px);
  pointer-events:none;
  transition:transform .48s var(--rushd-ease),filter .36s ease;
}

.rushd-mobile-bundle-section.is-active .rushd-mobile-bundle-section__copy{
  transform:translateX(-50%) translateY(0) scale(1);
  filter:blur(0);
}

.rushd-mobile-bundle-section__eyebrow{
  margin:0;
  color:var(--rushd-red);
  font-size:clamp(6px,1.85vw,10px);
  font-weight:900;
  line-height:1;
}

.rushd-mobile-bundle-section__title{
  margin:0;
  color:var(--rushd-navy);
  font-size:clamp(17px,4.9vw,30px);
  font-weight:900;
  line-height:.98;
  letter-spacing:-.03em;
}

.rushd-mobile-bundle-section__text{
  width:min(78vw,500px);
  margin:1px auto 0;
  color:#43526A;
  font-size:clamp(8px,2.05vw,12px);
  font-weight:500;
  line-height:1.25;
  text-align:center;
}

.rushd-mobile-bundle-section__button{
  position:relative;
  left:auto;
  top:auto;
  transform:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  margin-top:3px;
  padding:0 27px;
  color:var(--rushd-red);
  font-size:clamp(13px,3.45vw,18px);
  font-weight:900;
  text-decoration:none;
  white-space:nowrap;
  cursor:pointer;
  border:1px solid rgba(14,31,61,.13);
  border-radius:13px;
  background-image:
    linear-gradient(90deg,var(--rushd-navy) 0%,var(--rushd-navy) 100%),
    linear-gradient(135deg,rgba(255,255,255,.86),rgba(247,244,238,.64));
  background-size:0% 100%,100% 100%;
  background-position:left top,left top;
  background-repeat:no-repeat;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.86),
    0 5px 14px rgba(14,31,61,.08);
  -webkit-backdrop-filter:blur(10px) saturate(125%);
  backdrop-filter:blur(10px) saturate(125%);
  pointer-events:auto;
  transform-origin:center center;
  transition:
    transform .24s var(--rushd-ease),
    color .16s ease .08s,
    border-color .2s ease,
    background-size .32s cubic-bezier(.22,.8,.2,1);
}

.rushd-mobile-bundle-section__button:hover,
.rushd-mobile-bundle-section__button:focus-visible{
  color:var(--rushd-cream);
  transform:translateY(-2px) scale(1.012);
  border-color:rgba(228,48,54,.44);
  background-size:100% 100%,100% 100%;
}

@media(max-width:767px){
  .rushd-mobile-bundle-section{display:block;}
  .rushd-mobile-bundle-section__copy{
    top:40.45%;
    width:82vw;
  }
}

@media(min-width:768px) and (orientation:portrait){
  .rushd-mobile-bundle-section{display:block;}
  .rushd-mobile-bundle-section__copy{
    top:40.7%;
    width:min(68vw,520px);
  }
  .rushd-mobile-bundle-section__text{width:min(62vw,500px);}
}

@media(orientation:landscape){
  .rushd-mobile-bundle-section{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
  }
}


/* =========================================================
   V2 — LIFT CTA + NAVY WEB BUTTON
========================================================= */

@media(max-width:767px){

  /* Lift the entire CTA block away from the character hair */
  .rushd-mobile-bundle-section__copy{
    top:38.2% !important;
    bottom:auto !important;
  }

  /* Button lives inside the same visual gap */
  .rushd-mobile-bundle-section__button{
    top:47.1% !important;
    bottom:auto !important;

    color:#E43036 !important;

    border:
      1px solid rgba(228,48,54,.28) !important;

    background:
      repeating-conic-gradient(
        from 0deg at 50% 50%,
        rgba(255,255,255,.22) 0deg 1deg,
        transparent 1deg 24deg
      ),
      repeating-radial-gradient(
        circle at 50% 50%,
        transparent 0 8px,
        rgba(255,255,255,.18) 9px 10px,
        transparent 11px 22px
      ),
      linear-gradient(
        135deg,
        #081327 0%,
        #0E1F3D 55%,
        #081327 100%
      ) !important;

    background-blend-mode:
      screen,
      screen,
      normal !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.10),
      0 8px 22px rgba(14,31,61,.14),
      0 0 0 1px rgba(255,255,255,.03) !important;

    -webkit-backdrop-filter:
      blur(10px) saturate(130%);

    backdrop-filter:
      blur(10px) saturate(130%);
  }

  .rushd-mobile-bundle-section__button:hover,
  .rushd-mobile-bundle-section__button:focus-visible{
    color:#E43036 !important;

    transform:
      translateX(-50%)
      translateY(-2px)
      scale(1.015);

    border-color:
      rgba(228,48,54,.48) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.13),
      0 10px 24px rgba(14,31,61,.17),
      0 0 18px rgba(228,48,54,.10) !important;
  }
}


@media(min-width:768px) and (orientation:portrait){

  .rushd-mobile-bundle-section__copy{
    top:38% !important;
    bottom:auto !important;
  }

  .rushd-mobile-bundle-section__button{
    top:46.8% !important;
    bottom:auto !important;

    color:#E43036 !important;

    border:
      1px solid rgba(228,48,54,.28) !important;

    background:
      repeating-conic-gradient(
        from 0deg at 50% 50%,
        rgba(255,255,255,.22) 0deg 1deg,
        transparent 1deg 24deg
      ),
      repeating-radial-gradient(
        circle at 50% 50%,
        transparent 0 8px,
        rgba(255,255,255,.18) 9px 10px,
        transparent 11px 22px
      ),
      linear-gradient(
        135deg,
        #081327 0%,
        #0E1F3D 55%,
        #081327 100%
      ) !important;

    background-blend-mode:
      screen,
      screen,
      normal !important;
  }
}
