/* mirror-fixes.css — compensates for the stripped framework JS.
   Loaded after the real brand bundles. Layout/branding only. */

/* Hide consent / analytics shells that no longer have their JS */
#onetrust-consent-sdk, #onetrust-banner-sdk, .ot-sdk-container,
.optanon-alert-box-wrapper, #ot-sdk-btn-floating,
noscript { display: none !important; }

/* Keep any "show more / less" collapsible copy fully expanded (JS toggled it) */
.show_moreless_content, .show_moreless_content.show { max-height: none !important; overflow: visible !important; }
.show_more_btn, .show_less_btn, .read_more_btn { display: none !important; }

/* Swiper carousels: without swiper.js, present them as native horizontal scrollers */
.swiper-container, .swiper { overflow-x: auto !important; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
.swiper-wrapper { display: flex !important; transform: none !important; width: auto !important; }
.two_column_slides .swiper-wrapper { flex-wrap: wrap; }
.small_slides .swiper-slide { flex: 0 0 clamp(280px, 32%, 380px) !important; }
.two_column_slides .swiper-slide { flex: 0 0 calc(50% - 12px) !important; }
.swiper-slide { height: auto !important; }

/* ---- Feature (superhero) banner: show the roulette+dealer image WHOLE ----
   Her head rises above the gold card, so nothing must clip the banner top. */
.superhero_float { display: none !important; }              /* dealer already in the image */
/* standalone banner now (no paired game-list column) -> span full width, don't float */
section.superherodesktop65, .box_content_50ondesk.superherodesktop65 { width: 100% !important; float: none !important; clear: both !important; overflow: visible !important; height: auto !important; }
.superhero_wrap {
  position: relative !important;
  padding-left: 5% !important; margin-top: 0 !important;
  overflow: visible !important; height: auto !important;
}
/* banner fills its column, just inset from the site edge (via wrap padding) */
.superhero_wrap .superhero_background {
  width: 96% !important; max-width: none; margin: 0 !important;
  overflow: visible !important; height: auto !important;
  border-radius: 14px !important; line-height: 0;
}
.superhero_wrap .superhero_background img {
  width: 100% !important; height: auto !important;
  max-width: 100% !important; display: block !important; border-radius: 14px;
}
/* heading text overlaid on the banner (top-left) — BLACK */
.superhero_wrap .superhero_title {
  position: absolute !important; top: 7%; left: calc(5% + 20px); z-index: 3;
  margin: 0 !important; font-weight: 600;
  font-size: clamp(12px, 1.1vw, 15px) !important; color: #1c2435 !important;
  text-shadow: 0 1px 2px rgba(255,255,255,.5) !important;
}
.superhero_wrap .superhero_header {
  position: absolute !important; top: calc(7% + 18px); left: calc(5% + 20px); z-index: 3;
  margin: 0 !important; font-weight: 800;
  font-size: clamp(20px, 2.2vw, 32px) !important; color: #0d0e0f !important;
  text-shadow: 0 1px 3px rgba(255,255,255,.55) !important;
}

/* ---- Distinct Register / Login icons ---- */
.ceiling_login img { width: 26px !important; height: 26px !important; }

/* Lazy-background game tiles: ensure the inlined background actually has size */
.slide_image.lazyBackground {
  aspect-ratio: 800 / 480;
  background-size: cover !important;
  background-position: center !important;
  min-height: 160px;
}

/* ---- User hero image: render at its true aspect, sharp & full-width ----
   brand sizes .background_hero to 129vw tall for a parallax layer that
   their (now-stripped) JS repositions. That upscales our banner ~3x and blurs
   it. Pin the hero to the image's real 2169x725 ratio and cover it cleanly. */
.hero.half_Height, header.hero {
  position: relative !important;
  width: 100%;
  overflow: hidden !important;
  background: none !important;
}
/* let the banner define the hero height at its natural full width (no crop, no gaps) */
#scene { position: static !important; width: 100% !important; height: auto !important; transform: none !important; }
.hero .background_hero,
.hero.half_Height .background_hero,
#scene .background_hero {
  position: static !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: auto !important;
  transform: none !important;
}
.hero .background_hero picture { display: block; width: 100%; }
.hero .background_hero img,
.hero .background_hero picture img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  object-fit: fill !important;
  image-rendering: auto;
}
/* Center the bonus text + CTA over the banner, fully inside the image box.
   brand sizes these in vw with big vw margins -> at wide screens the
   stack outgrows our shorter banner and spills into the white. Cap it. */
.hero.half_Height .offer_container {
  position: absolute !important;
  inset: 0 0 20% 0 !important;      /* keep text in the upper area; button sits below */
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.1em;
  z-index: 4;
  text-shadow: 0 2px 12px rgba(60,0,10,.45) !important;
}
/* the real (visible) Sign Up button lives in .mainBlock, pulled up over the hero.
   brand positions it with left:50% + translateX(-50%) + margin:auto which
   fight each other -> reset to clean centering. */
.mainBlock .floor_curve #hero_cta_btn,
.mainBlock .floor_curve .offer_cta {
  margin: -4vw auto 22px auto !important;
  box-shadow: 0 12px 26px rgba(0,0,0,.28) !important;
  position: relative !important;
  left: auto !important;
  transform: none !important;
  display: block !important;
  width: fit-content !important;
}
.hero .offer_line_1 { font-size: clamp(20px, 2.8vw, 40px) !important; margin: 0 !important; line-height: 1.05 !important; }
.hero .offer_line_2 { font-size: clamp(56px, 7.6vw, 132px) !important; margin: 0 !important; line-height: .95 !important; }
.hero .offer_line_3 { font-size: clamp(20px, 2.8vw, 42px) !important; margin: 0 !important; line-height: 1.05 !important; }
.hero .offer_cta, .hero #hero_cta_btn, .hero .offer_cta.will-tap {
  font-size: clamp(18px, 2.2vw, 28px) !important;
  padding: 0.7em 2.4em !important;
  margin: 0.6em 0 0 0 !important;
  border-radius: 999px !important;
  box-shadow: 0 12px 26px rgba(0,0,0,.28) !important;   /* replaces the white glow */
  position: relative !important; left: auto !important; transform: none !important;
  width: auto !important;
}

/* ---- Hero top spacing: remove brand's huge vw gap, keep a small one ----
   so the banner clears the nav bar (was overlapping the dealer's face). */
.hero.offer-area-minimal { padding-top: 0 !important; }
.offer-area-minimal #scene { margin-top: 0 !important; }
.hero #scene, .hero .background_hero { margin: 0 !important; }
.hero .background_hero img,
.hero .background_hero picture img { margin-top: 0 !important; padding-top: 0 !important; }
.hero.half_Height .background_hero { top: 0 !important; }
/* header is position:fixed in brand -> hero slid under it. Put it back in
   normal flow so the banner naturally sits below, with a small gap. */
.top_wrap_navy { position: relative !important; padding-bottom: 0 !important; }
.content-wrap { padding-top: 16px !important; background: #fff; }

/* ---- S-icon list bullets, flex-aligned to the first text line ----
   Scoped to .box_content_content so it never touches the footer links. */
.box_content_content ul li {
  background-image: none !important;
  display: block !important;         /* keep inline text flowing (no flex gaps) */
  position: relative !important;
  padding-left: 28px !important;
  list-style: none !important;
  line-height: 1.6 !important;
}
.box_content_content ul li::before {
  content: "" !important;
  position: absolute !important;
  left: 0; top: 0;
  width: 16px; height: 1.6em;        /* one line tall -> S centres on first line */
  background: url("assets/bullet-s-48.png") no-repeat left center / 16px 16px !important;
}

/* ---- Footer cleanup ---- */
/* No S bullets on footer link lists (they inherited .box_content) */
footer .footer_content ul li::before,
#quick_links_menu li::before,
#casino_link_menu li::before { content: none !important; display: none !important; background: none !important; }
footer .footer_content ul li,
#quick_links_menu li,
#casino_link_menu li { padding-left: 0 !important; }
/* SPIN logo on a white chip so it reads on the red footer */
#footer_logo img.logo-white,
#footer_logo .logo-white {
  background: #fff !important;
  padding: 9px 18px !important;
  border-radius: 12px !important;
  height: 50px !important;
  width: auto !important;
  box-sizing: content-box;
}

/* ---- "Live Dealer Games" list: vertical stack of rows (thumb + text + PLAY) ---- */
.two_column_slides .swiper-wrapper { display: block !important; transform: none !important; }
.two_column_slides .slide_wrap { display: block !important; width: 100% !important; max-width: none !important; height: auto !important; }
.two_column_slides .game {
  display: flex !important; align-items: center; gap: 16px;
  background: transparent !important; border: 0 !important; border-bottom: 1px solid #ececec !important;
  border-radius: 0 !important; padding: 16px 2px !important; height: auto !important;
}
.two_column_slides .game_img { flex: 0 0 auto !important; width: auto !important; }
.two_column_slides .game_img a { display: block; }
.two_column_slides .game_img img { width: 62px !important; height: 62px !important; border-radius: 12px; object-fit: cover; }
.two_column_slides .contain_info {
  flex: 1; display: flex !important; align-items: center; justify-content: space-between; gap: 14px;
  float: none !important; width: auto !important;
}
.two_column_slides .game_title_desc { flex: 1; min-width: 0; }
.two_column_slides .game_title { margin: 0 0 3px !important; font-size: 16px !important; font-weight: 800; }
.two_column_slides .game_title a { color: #1c2435 !important; }
.two_column_slides .game_desc { margin: 0 !important; font-size: 13px !important; }
.two_column_slides .game_desc a { color: #5a6073 !important; }
.two_column_slides .game_cta {
  margin: 0 !important; white-space: nowrap; float: none !important; display: inline-block !important;
  padding: 12px 30px !important; height: auto !important; width: auto !important;
  border-radius: 12px !important; font-weight: 800; color: #fff !important; font-size: 14px !important;
  background: linear-gradient(135deg,#de006f 0%,#f73736 100%) !important;
}
.two_column_slides .clear { display: none !important; }

/* ---- Carousel cards: spacing + card look (Top-Rated / Live Dealer sliders) ---- */
.small_slides .swiper-wrapper { display: flex !important; gap: 18px !important; transform: none !important; padding: 4px 2px 10px; }
.small_slides .swiper-slide {
  flex: 0 0 clamp(280px, 31%, 360px) !important;
  background: #fff; border: 1px solid #ececec; border-radius: 16px; overflow: hidden !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.07); height: auto !important;
}
.small_slides .slide_image, .small_slides .slide_image.lazyBackground {
  border-radius: 16px 16px 0 0 !important; margin: 0 !important; min-height: 170px;
}
.small_slides .slide_text { padding: 14px 16px 16px !important; }
.small_slides .slide_text_head { margin: 0 0 4px !important; }
.small_slides .slide_text_text { margin: 0 !important; }

/* ---- Carousel nav arrows: hide (non-functional without swiper JS; overlapped cards) ---- */
.small_slides .swiper-button-next,
.small_slides .swiper-button-prev,
.small_slides .arrows,
.section-body .swiper-button-next,
.section-body .swiper-button-prev,
.section-body .arrows { display: none !important; }

/* =====================  MOBILE OPTIMISATION  ===================== */
@media (max-width: 860px) {
  /* stack the two-column sections (superhero + game list) full width */
  .box_content_50ondesk, .box_content_100ondesk { width: 100% !important; float: none !important; }
  .superhero_wrap { padding-left: 0 !important; }
  .superhero_wrap .superhero_background { width: 100% !important; }
  .superhero_wrap .superhero_header { font-size: clamp(18px, 5vw, 26px) !important; }
  .superhero_wrap .superhero_title { font-size: 12px !important; }

  /* compact mobile header: burger (left) + centered logo + login (right) */
  .secondary_menu { display: none !important; }
  .ceiling_content { position: relative !important; display: flex !important; align-items: center; justify-content: space-between; padding: 10px 16px !important; }
  #header_brgr_menu, .ceiling_menu { display: flex !important; align-items: center; cursor: pointer; }
  #header_brgr_menu img { width: 26px !important; height: auto !important; filter: brightness(0); }
  .ceiling_logo { position: absolute !important; left: 50% !important; transform: translateX(-50%); margin: 0 !important; }
  .ceiling_logo img { height: 40px !important; width: auto !important; }
  #header_register { display: none !important; }
  #header_login { margin-left: auto !important; flex-direction: column; font-size: 10px !important; }
  #header_login img { width: 24px !important; height: 24px !important; }

  /* hero: give it height on mobile (wide banner is too short) + scale text */
  .hero.half_Height { min-height: 340px !important; }
  .hero .background_hero img, .hero .background_hero picture img {
    height: 340px !important; object-fit: cover !important; object-position: 32% center !important;
  }
  .hero.half_Height .offer_container { inset: 0 0 16% 0 !important; }
  .hero .offer_line_1 { font-size: clamp(15px, 4.4vw, 26px) !important; }
  .hero .offer_line_2 { font-size: clamp(42px, 13vw, 78px) !important; }
  .hero .offer_line_3 { font-size: clamp(15px, 4.4vw, 26px) !important; }
  .mainBlock .floor_curve #hero_cta_btn, .mainBlock .floor_curve .offer_cta { margin-top: -9vw !important; }

  /* game-list rows: keep tidy on small screens */
  .two_column_slides .game { gap: 12px; padding: 12px 2px !important; }
  .two_column_slides .game_img img { width: 50px !important; height: 50px !important; }
  .two_column_slides .game_cta { padding: 10px 20px !important; font-size: 13px !important; }
  .two_column_slides .contain_info { gap: 8px; }

  /* carousel cards: one-and-a-bit per view */
  .small_slides .swiper-slide { flex: 0 0 80% !important; }

  /* footer: single column */
  .footer_content .footer_text { width: 100% !important; float: none !important; }
}
@media (max-width: 480px) {
  .hero .offer_line_2 { font-size: clamp(40px, 15vw, 64px) !important; }
  .small_slides .swiper-slide { flex: 0 0 86% !important; }
}

/* ---- Game text: cleaner than default link-blue ---- */
.small_slides .slide_text_head, .small_slides .slide_text_head a { color: #1c2435 !important; font-weight: 800; }
.small_slides .slide_text_text, .small_slides .slide_text_text a { color: #5a6073 !important; }
.small_slides .slide_wrap:hover .slide_text_head,
.small_slides .slide_wrap:hover .slide_text_head a { color: #d61f4f !important; }

/* ===== Prevent horizontal overflow (brand uses 120-130vw decorative els) ===== */
html, body { overflow-x: clip !important; max-width: 100% !important; }
.site_wrapper, .content-wrap, .mainBlock, .box_content, .webpart_container { max-width: 100vw !important; overflow-x: clip; }

@media (max-width: 860px) {
  /* keep the game-list rows fully inside the screen (PLAY was pushed off) */
  .two_column_slides .slide_wrap, .two_column_slides .game { max-width: 100% !important; }
  .two_column_slides .contain_info { flex-wrap: nowrap !important; }
  .two_column_slides .game_title { font-size: 15px !important; }
  .two_column_slides .game_cta { padding: 9px 16px !important; font-size: 12px !important; }
  .box_content, .box_content_content { padding-left: 16px !important; padding-right: 16px !important; }
  .section, .webpart_container { padding-left: 16px !important; padding-right: 16px !important; }
}

/* ===== Kill side overflow from brand's oversized vw decorations ===== */
html, body, .site_wrapper { overflow-x: clip !important; }
.floor_curve, .hero .floor_curve, .mainBlock .floor_curve {
  width: 100vw !important; margin-left: 0 !important; left: 0 !important; max-width: 100vw !important;
}
.curve-bg { max-width: 100vw !important; }
.ceiling { width: 100% !important; margin-left: 0 !important; padding-left: 0 !important; }
/* belt-and-braces: nothing wider than the viewport */
.site_wrapper, .content-wrap, .mainBlock, .box_content, .box_content_content,
.section, .webpart_container, header.hero, .superhero_wrap, footer, .footer_content {
  max-width: 100vw !important;
}

/* ---- Mobile menu — styled like brand's (gradient top + login/register + dark links) ---- */
#m_menu { position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 9999; opacity: 0; visibility: hidden; transition: opacity .2s; }
#m_menu.open { opacity: 1; visibility: visible; }
#m_menu .m_menu_panel {
  position: absolute; top: 0; left: 50%;
  width: 100%; max-width: 440px; height: 100%; background: #2a1620;
  overflow-y: auto; -webkit-overflow-scrolling: touch;
  transform: translateX(-50%) translateY(-12px); opacity: 0;
  transition: transform .25s ease, opacity .25s ease;
}
#m_menu.open .m_menu_panel { transform: translateX(-50%); opacity: 1; }
#m_menu .m_menu_top {
  position: relative; display: flex; align-items: center; justify-content: center;
  padding: 20px; background: linear-gradient(135deg,#e6007e 0%,#f73736 100%);
}
#m_menu .m_logo { height: 34px; width: auto; background: #fff; padding: 6px 12px; border-radius: 8px; }
#m_menu #m_close { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); background: none; border: 0; color: #fff; font-size: 30px; line-height: 1; cursor: pointer; }
#m_menu .m_person { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); }
#m_menu .m_menu_cta { display: flex; flex-direction: column; gap: 12px; padding: 0 22px 22px; background: linear-gradient(135deg,#e6007e 0%,#f73736 100%); }
#m_menu .m_login, #m_menu .m_register {
  display: block; text-align: center; padding: 14px; border-radius: 12px;
  font-weight: 800; text-transform: uppercase; text-decoration: none; letter-spacing: .5px;
}
#m_menu .m_login { background: #fff; color: #d61f4f; }
#m_menu .m_register { background: linear-gradient(135deg,#e6007e 0%,#ff7a00 100%); color: #fff; box-shadow: 0 6px 16px rgba(230,0,126,.3); }
#m_menu .m_links { list-style: none; margin: 0; padding: 8px 0 40px; }
#m_menu .m_links li { border-bottom: 1px solid rgba(255,255,255,.08); }
#m_menu .m_links li a { display: block; text-align: center; color: #cbbfc6; padding: 18px; font-weight: 600; text-decoration: none; }
#m_menu .m_links li a:hover { color: #fff; }

/* ---- Mobile hero: centre the bonus text over the red (people to the side) ---- */
@media (max-width: 860px) {
  .hero .background_hero img, .hero .background_hero picture img { object-position: 18% center !important; }
  .hero.half_Height .offer_container { left: 0 !important; right: 0 !important; align-items: center !important; text-align: center !important; padding: 0 12px !important; }
  .hero .offer_line_1, .hero .offer_line_2, .hero .offer_line_3 { width: 100% !important; text-align: center !important; }
}

/* force the offer text block to be full-width & centred (brand sets an explicit width) */
.hero.half_Height .offer_container { width: 100% !important; max-width: 100% !important; margin: 0 auto !important; }
@media (max-width: 860px) {
  .hero.half_Height .offer_container { width: 100% !important; left: 0 !important; right: 0 !important; }
  .hero .offer_line_1, .hero .offer_line_2, .hero .offer_line_3 { margin-left: auto !important; margin-right: auto !important; }
}

/* ---- Final: dead-centre the hero offer text (kill overflow from width:100% lines) ---- */
.hero.half_Height .offer_container { padding: 0 !important; margin: 0 !important; width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; align-items: center !important; }
.hero .offer_line_1, .hero .offer_line_2, .hero .offer_line_3 {
  width: auto !important; max-width: 94% !important; margin-left: auto !important; margin-right: auto !important; text-align: center !important;
}

/* ===== Header + hero polish across mobile/tablet widths ===== */
/* don't let the ceiling curve clip the login/register icons */
.top_wrap_navy .ceiling { overflow: visible !important; }
@media (max-width: 860px) {
  #header_login { margin-right: 6px !important; }
  /* taller hero + more reserved space so SIGN UP never overlaps DEPOSIT BONUS */
  .hero.half_Height { min-height: 400px !important; }
  .hero .background_hero img, .hero .background_hero picture img { height: 400px !important; }
  .hero.half_Height .offer_container { inset: 0 0 24% 0 !important; }
  /* fixed (not vw) button pull so overlap is consistent at every width */
  .mainBlock .floor_curve #hero_cta_btn, .mainBlock .floor_curve .offer_cta { margin-top: -34px !important; }
}

/* ---- Header Register/Login: dark & bold (were low-contrast grey on white) ---- */
.top_wrap_navy .ceiling_login,
.top_wrap_navy .ceiling_login span,
#header_login, #header_register { color: #1c2435 !important; font-weight: 700 !important; opacity: 1 !important; }
#header_login img, #header_register img { opacity: 1 !important; }
.top_wrap_navy .ceiling_login:hover { color: #d61f4f !important; }

/* ---- Match brand: centre the body copy on mobile (lists stay left) ---- */
@media (max-width: 860px) {
  .box_content_content, .box_content_content p, .box_content .box_content_content { text-align: center !important; }
  .box_content_content ul, .box_content_content ul li, .box_content_content ol, .box_content_content ol li { text-align: left !important; }
  .box_content_content h3.subhead { text-align: center !important; }
}

/* Register/Login: pure black for max contrast */
.top_wrap_navy .ceiling_login, .top_wrap_navy .ceiling_login span,
#header_login, #header_register { color: #000 !important; }

/* ---- Fix content overflow/off-centre: padding must fit inside the width ---- */
.box_content, .box_content_content, .section, .webpart_container,
.two_column_slides, .Slide_Show_Full_Width_100 { box-sizing: border-box !important; }
@media (max-width: 860px) {
  .box_content, .box_content_content, .section, .webpart_container {
    box-sizing: border-box !important;
    width: 100% !important; max-width: 100% !important;
    margin-left: auto !important; margin-right: auto !important;
  }
}

/* ---- Header: white top (no grey corners); only the nav bar is dark ---- */
.top_wrap_navy { background: #fff !important; }
.secondary_menu { background: #2e2e36 !important; }

/* ---- Remove the grey nav bar entirely: white header, dark menu text ---- */
.secondary_menu { background: #ffffff !important; box-shadow: 0 1px 0 #ececf1; }
.secondary_menu_list > li > a { color: #1c2435 !important; }
.secondary_menu_list > li > a:hover { color: #d61f4f !important; background: #faf3f5 !important; }
.secondary_menu_list > li.active > a { color: #d61f4f !important; box-shadow: inset 0 -3px 0 #d61f4f !important; }
.secondary_menu_list .caret { color: #1c2435 !important; }
.top_wrap_navy { background: #fff !important; box-shadow: 0 2px 10px rgba(0,0,0,.06); }

/* =====================  FONT: Poppins (self-hosted, replaces Omnes)  ===================== */
@font-face { font-family:'Poppins'; font-style:normal; font-weight:400; font-display:swap; src:url('assets/fonts/poppins-400.woff2') format('woff2'); }
@font-face { font-family:'Poppins'; font-style:normal; font-weight:600; font-display:swap; src:url('assets/fonts/poppins-600.woff2') format('woff2'); }
@font-face { font-family:'Poppins'; font-style:normal; font-weight:700; font-display:swap; src:url('assets/fonts/poppins-700.woff2') format('woff2'); }
@font-face { font-family:'Poppins'; font-style:normal; font-weight:800; font-display:swap; src:url('assets/fonts/poppins-800.woff2') format('woff2'); }
body, body *:not(.fa):not([class*="icon-"]) {
  font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif !important;
}

/* ---- Bonus conditions: proper line-height + spacing (Poppins overflowed the vw line-height into the breadcrumb) ---- */
.offer-conditions {
  line-height: 1.5 !important;
  height: auto !important; min-height: 0 !important;
  margin: 10px auto 22px !important;
  position: relative !important; z-index: 2 !important;
  background: transparent !important;
}
.breadcrumbs_SRC, .breadcrumbs { clear: both !important; position: relative !important; z-index: 1 !important; margin-top: 6px !important; }
@media (max-width: 860px) {
  .offer-conditions { font-size: 12px !important; width: 90% !important; max-width: 90% !important; padding: 0 !important; }
}

/* ---- Fix bonus-text overlap: the .floor_curve holding it must grow with content ---- */
.mainBlock .floor_curve { height: auto !important; min-height: 0 !important; overflow: visible !important; }

/* ---- SIGN UP button: completely restyled (distinct from brand's plain pill) ---- */
.mainBlock .floor_curve #hero_cta_btn,
.mainBlock .floor_curve .offer_cta {
  background: linear-gradient(135deg,#ff2d78 0%,#ff7a00 100%) !important;
  border-radius: 14px !important;
  border: 2px solid rgba(255,255,255,.95) !important;
  box-shadow: 0 12px 30px rgba(255,45,120,.45) !important;
  text-transform: uppercase !important; letter-spacing: 1.5px !important;
  font-weight: 800 !important; color: #fff !important;
  padding: 16px 44px !important;
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease !important;
}
.mainBlock .floor_curve #hero_cta_btn:hover,
.mainBlock .floor_curve .offer_cta:hover { transform: translateY(-2px) scale(1.02); filter: brightness(1.05); box-shadow: 0 16px 38px rgba(255,45,120,.55) !important; }
.mainBlock .floor_curve #hero_cta_btn::after,
.mainBlock .floor_curve .offer_cta::after { content: " \2192"; }