/* BandRoadie marketing site — custom styles */
/* Auto-extracted from index.html */

body,*{font-family:"Inter",sans-serif!important}

/* ── Hero: image LEFT 33%, text RIGHT 66% ── */
.hero-section-wrapper{flex-flow:row!important;align-items:flex-start!important;justify-content:center!important;gap:0!important;padding-top:0!important;padding-bottom:0}
.hero-section-title{display:flex!important;flex-flow:row!important;flex:1 1 0!important;width:auto!important;min-width:0!important;min-height:20vh!important;align-items:flex-start!important;height:auto!important;overflow:visible!important}
.hero-sticky{order:2!important;flex:1 1 0!important;min-width:0!important;width:auto!important;top:80px!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important}
.sticky-holder{align-items:flex-start!important;justify-content:flex-start!important}
.hero-big-heading{position:relative!important;align-items:flex-start!important;width:100%!important}
.big-heading{text-align:left!important;white-space:normal!important}
.first-heading .big-heading,.second-heading .big-heading{text-align:left!important}
.mobile-holder{order:1!important;width:33%!important;flex-shrink:0!important;height:auto!important;min-height:0!important;margin-top:0!important;align-self:flex-start!important;padding-top:0!important;padding-right:40px!important;padding-bottom:0!important;padding-left:0!important;position:relative;z-index:1;opacity:0;animation:brHeroPhoneFadeIn 1.1s cubic-bezier(0.22,1,0.36,1) 0.4s forwards;}
@keyframes brHeroPhoneFadeIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
.mobile-image{width:100%!important;max-width:100%!important;height:auto!important;object-fit:contain!important}
.br-chevron{display:inline-flex;align-items:center;transition:transform .2s}
.br-nav-btn.open .br-chevron{transform:rotate(180deg)}
.br-nav-dropdown{display:none;position:absolute;top:calc(100% + 8px);right:0;background:#1a1a1a;border:1px solid rgba(255,255,255,.12);border-radius:10px;min-width:220px;overflow:hidden;z-index:9999;box-shadow:0 8px 32px rgba(0,0,0,.5)}
.br-nav-dropdown.open{display:block}
.br-nav-dropdown-item{display:flex;align-items:center;gap:12px;padding:12px 16px;color:#fff;text-decoration:none;font-size:14px;font-weight:500;transition:background .15s;justify-content:flex-start;text-align:left}
.br-nav-dropdown-item:hover{background:rgba(255,255,255,.08)}
.br-nav-item-icon{display:flex;align-items:center;flex-shrink:0;color:#fff;opacity:.85}

/* Mobile line break — hidden on desktop */
.mobile-br{display:none;}

/* ── Hide Webflow badge ── */
.w-webflow-badge{display:none!important;visibility:hidden!important}

/* ── BandRoadie badge buttons ── */
.br-badge-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:flex-start;margin-top:0;width:100%}
.br-badge-sticky{position:sticky;bottom:40px;z-index:10;display:flex;justify-content:center;padding:0 24px}
.br-badge-under-image{display:flex;justify-content:flex-start;padding:20px 0 0;width:100%}
.hero-button-wrapper.br-badge-row{display:flex!important;flex-flow:row!important;flex-wrap:nowrap!important;justify-content:flex-start!important;align-items:center!important;max-width:none!important}
.br-badge{display:inline-flex;align-items:center;gap:10px;padding:0 16px;background:#000;border:1px solid #fff;border-radius:8px;text-decoration:none;color:#fff;transition:opacity .2s,transform .18s;cursor:pointer;height:56px;width:200px;box-sizing:border-box;flex-shrink:0}
.br-badge:hover{opacity:.85;transform:translateY(-2px)}
.br-badge-icon{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:28px}
.br-badge-icon svg{display:block}
.br-badge-text{display:flex;flex-direction:column;gap:2px}
.br-badge-sub{font-size:12px;color:rgba(255,255,255,.9);font-weight:400;line-height:1;letter-spacing:normal;text-transform:none}
.br-badge-name{font-size:18px;font-weight:600;line-height:1.2;color:#fff;letter-spacing:normal}

/* ── Hero image: preserve aspect ratio (consolidated above) ── */
.hero-section{overflow:visible!important;padding-top:0!important;padding-bottom:80px!important;margin-top:0!important}
.hero-color-overlay{display:none!important}

/* ── Hero heading: rose gradient ── */
.big-heading{
  background-image: linear-gradient(180deg, #ffffff 35%, #ffb3c1 60%, #F43F5E 80%, #BE123C 100%) !important;
  font-family: "Inter", sans-serif !important;
  font-weight: 900 !important;
  letter-spacing: -.04em !important;
  white-space: nowrap !important;
  line-height: 1.15 !important;
  padding-bottom: 0.1em !important;
}
.hero-big-heading, .first-heading, .second-heading, .sticky-holder{overflow:visible!important}
@keyframes brSlideInRight{from{opacity:0;transform:translateX(48px)}to{opacity:1;transform:translateX(0)}}.br-hero-subtitle{font-family:"Inter",sans-serif!important;font-size:clamp(18px,1.8vw,26px)!important;font-weight:650!important;color:rgba(255,255,255,0.82)!important;line-height:1.4!important;margin:18px 0 0 0!important;padding:0!important;letter-spacing:-0.015em!important;text-align:left!important;max-width:100%!important;opacity:0;animation:brSlideInRight 0.65s cubic-bezier(0.25,0.46,0.45,0.94) forwards;animation-delay:1.3s}
.first-heading .big-heading,
.second-heading .big-heading{
  background-image:linear-gradient(
    135deg,
    #ffffff    0%,
    #ffe4ec   18%,
    #F43F5E   36%,
    #ffffff   52%,
    #ffb3c1   68%,
    #BE123C   84%,
    #ffffff  100%
  )!important;
  background-size:300% 300%!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
  color:transparent!important;
  animation:br-title-flow 14s ease-in-out infinite!important;
}

/* ── Responsive overrides ── */

/* Tablet: 768–991px */
@media screen and (max-width:991px){
  .hero-sticky{top:80px!important}
  .mobile-holder{width:36%!important;padding-right:24px!important}
  .mobile-image{width:100%!important;max-width:100%!important}
  .br-nav-dropdown-wrap{margin-left:40px}
  .br-badge{width:180px}
  .br-badge-name{font-size:16px}
}

/* Mobile: ≤767px */
@media screen and (max-width:767px){
  .hero-section-wrapper{flex-flow:column!important}
  .hero-section-title{flex-flow:column!important;width:100%!important;min-height:0!important}
  .mobile-holder{order:0!important;width:80%!important;padding-top:24px!important;padding-right:0!important;align-self:center!important}
  .hero-sticky{order:0!important}
  .hero-big-heading{align-items:center!important}
  .big-heading{text-align:center!important}

  .hero-sticky{position:relative!important;top:0!important;padding-top:64px;padding-left:20px!important;padding-right:20px!important}
  .hero-section-title{height:auto!important;min-height:0!important}
  .sticky-holder{align-items:flex-start!important;padding:0!important}
  .br-hero-subtitle{font-size:clamp(16px,4.5vw,20px)!important;text-align:center!important;max-width:100%!important;margin:14px 0 0 0!important;animation-delay:1.0s}
  .big-heading{white-space:normal!important;letter-spacing:-.02em!important;font-size:clamp(32px,10vw,64px)!important;line-height:1.1!important}
  
  .mobile-holder{margin-top:24px!important}
  .mobile-image{width:75%!important;max-width:75%!important}
  .br-badge-under-image{padding:20px 16px 0}
  .hero-button-wrapper.br-badge-row{flex-wrap:wrap!important;gap:12px!important;justify-content:center}
  .br-badge{width:calc(50% - 6px)!important;min-width:140px}
  .br-nav-dropdown-wrap{margin-left:12px}
  .br-nav-btn{padding:8px 12px;font-size:13px}
  .sticky-orange-white{max-height:none!important;height:auto!important;overflow:visible!important;}
  .sticky-orange-white .sticky-card-grid{height:auto!important;min-height:0!important;}
  .sticky-orange-white .sticky-left,.sticky-orange-white .sticky-right{height:auto!important;}
}

/* Small mobile: ≤479px */
@media screen and (max-width:479px){
  .hero-sticky{padding-top:54px}
  .big-heading{font-size:clamp(28px,9vw,48px)!important;letter-spacing:-.015em!important}
  .mobile-image{width:88%!important;max-width:88%!important}
  .br-badge{width:100%!important}
  .br-badge-name{font-size:15px}
  .br-trust-heading{white-space:normal!important;font-size:clamp(14px,4vw,24px)!important}
}

.white-circle{background-color:#F43F5E!important}
.orange-circle{background-color:#BE123C!important}
.inner-card-holder-orange{background-color:#be123c!important}
.sticky-orange-black .sticky-black-heading{color:#fff!important}
.sticky-orange-black .body-16px,.sticky-orange-black .body-16px.black{color:#fff!important}
.sticky-orange-black .body-18px,.sticky-orange-black .body-18px.black{color:#fff!important}
.sticky-orange-black .text-24px,.sticky-orange-black .text-24px.black{color:#fff!important}
.sticky-orange-black p{color:#fff!important}
.sticky-orange-black .sticky-icon-black{color:#fff!important}
.sticky-orange-black .sticky-iconwrapper-black{border-color:#fff!important}
.sticky-orange-black svg{color:#fff!important}
.sticky-heading,.sticky-black-heading{font-weight:900!important;text-align:center!important;line-height:1.15!important;color:#fff!important;background:none!important;-webkit-text-fill-color:unset!important;animation:none!important;}
.sticky-orange-white .sticky-black-heading{color:#F43F5E!important;-webkit-text-fill-color:#F43F5E!important;}
.sticky-orange-white{max-height:658px!important;overflow:clip!important;}
.header-wrapper{max-width:none!important;width:100%!important;}
.how-it-work-section{z-index:10!important;}
@keyframes brBadgeFadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.br-hero-sticky-group{width:100%;z-index:5;opacity:0;transform:translateY(8px);transition:opacity 0.2s ease,transform 0.2s ease}
.br-hero-sticky-group.br-badges-visible{opacity:1!important;transform:translateY(0)!important}
.show-hero-badges .br-hero-sticky-group{position:relative;top:auto;left:auto;width:100%;}
.br-trust-wrapper.br-badges-visible{opacity:1!important;transform:translateY(0)!important}
.br-hero-badges-placeholder{display:none}
.show-hero-badges .br-hero-badges-placeholder{display:block}
.br-trust-wrapper{display:flex;justify-content:center;align-items:center;width:100%;background-color:#000;padding:18px 24px;box-sizing:border-box;opacity:0;transform:translateY(8px);transition:opacity 0.2s ease,transform 0.2s ease}
/* Trust bar phrase/separator spans */
.br-trust-sep{display:inline-flex;align-items:center;padding:0 10px;color:#F43F5E;flex-shrink:0;}
.br-trust-item{display:inline;}

/* ── Trust heading: single-line, s-title font ── */
.br-trust-heading span{color:#fff!important;transition:color 0.6s ease}
.br-hero-sticky-group.is-stuck .br-trust-heading span{color:#F43F5E!important}
.br-trust-heading{font-family:"Inter",sans-serif!important;font-weight:900!important;letter-spacing:-.025em!important;line-height:1.06!important;white-space:nowrap!important;font-size:clamp(11px,2vw,36px)!important;background-image:none!important;-webkit-text-fill-color:#fff!important;color:#fff!important;text-align:center;margin:0!important}

}

/* ── FAQ: centered header + 2-column accordion grid ── */
.faq-grid{display:flex!important;flex-direction:column!important;align-items:center!important;gap:40px!important;width:100%!important}
.faq-header{text-align:center!important;max-width:640px!important;width:100%!important}
h2.faq-header,h2.faq{text-align:center!important}
p.body-16px.faq{text-align:center!important}
.faq-list{width:100%!important;max-width:100%!important}
.faq-list-grid{display:grid!important;grid-template-columns:1fr 1fr!important;column-gap:40px!important;row-gap:0!important;align-items:start!important}
@media screen and (max-width:767px){
  .faq-list-grid{grid-template-columns:1fr!important;column-gap:0!important}
}

/* ── Testimonial quote icons: rose ── */
.testimonial-icon{filter:brightness(0) invert(28%) sepia(96%) saturate(2094%) hue-rotate(327deg) brightness(105%)!important}

/* ── Testimonial quote icon borders: rose ── */
.testimonial-icon-wrapper{border-color:#F43F5E!important;box-shadow:0 0 0 1px #F43F5E!important}

/* ── FAQ heading: full-width centered ── */
.faq-section .testimonial-header{width:100%!important;max-width:100%!important;text-align:center!important;display:block!important}
.faq-section .audience-heading{text-align:center!important;width:100%!important;display:block!important}
.faq-section .audience-paragraph{text-align:center!important;width:100%!important}
.faq-section .body-16px{text-align:center!important}

/* ── All H2 section titles: 800 weight ── */
h2{font-weight:800!important;}
/* ── CTA "Your data is yours" — larger text ── */
.cta-heading{font-size:clamp(36px,5vw,72px)!important;line-height:1.05!important}
.cta-cubheading{color:#F43F5E!important;font-size:clamp(20px,2vw,28px)!important;font-weight:600!important;font-style:normal!important;line-height:1.5!important;letter-spacing:-.03px!important;margin-top:12px!important}
.cta-paragraph{font-size:clamp(15px,1.3vw,20px)!important;line-height:1.65!important}

/* ── CTA section: B&W parallax background ── */
.cta-section{
  background:none!important;
  background-color:#111!important;
  position:relative!important;
  overflow:visible!important;
  padding-top:0!important;
  padding-bottom:0!important;
}
.cta-section::before{
  content:'';
  position:absolute;inset:-10px;
  background-image:url('images/cta_bg.jpg');
  background-attachment:fixed;
  background-size:cover;
  background-position:center center;
  filter:grayscale(100%) brightness(0.45) blur(5px);
  z-index:0;
}
.cta-section .container{position:relative!important;z-index:1!important}
@media(max-width:767px){
  .cta-section::before{background-attachment:scroll;}
}
.cta-wrapper{background:none!important;background-color:transparent!important;border:none!important;box-shadow:none!important;min-height:unset!important;padding-top:0!important;padding-bottom:0!important}
.cta-section .container{padding-top:60px!important;padding-bottom:60px!important}
.left-orange-gradient,.right-orange-gradient,.left-gradient,.right-white-gradient,
.mobile-rotate,.mobile-rotate-bottom,.cta-mobile-orange,.cta-mobile-white{display:none!important}
.cta-left,.cta-right{display:none!important}
.cta-button-wrapper{display:none!important}
.cta-grid{display:block!important}
.cta-center{width:100%!important;max-width:100%!important;grid-column:1/-1!important;text-align:center!important;padding-top:24px!important;padding-bottom:24px!important;min-height:unset!important}

/* ── Footer: centered logo + social ── */
.footer-header{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;gap:24px!important;padding-bottom:32px!important;}
.footer-logo{display:block!important;width:100%;max-width:380px;}
.footer-logo.w--current{max-width:380px!important;max-height:none!important;overflow:visible!important;opacity:0.18;}
.footer-infinity{display:none!important;}

/* ── Hero logo: slide-in on scroll ── */
.hero-logo-lockup {
  opacity: 0;
  transform: translateY(-36px);
  transition: opacity 0.7s cubic-bezier(0.22,1,0.36,1), transform 0.7s cubic-bezier(0.22,1,0.36,1);
}
.hero-logo-lockup.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ── Hero headings: clean entrance (replaces Webflow IX2) ── */
@keyframes brHeadingIn {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}
.first-heading.br-animate,
.second-heading.br-animate {
  opacity: 0;
  animation: brHeadingIn 0.75s cubic-bezier(0.22,1,0.36,1) forwards;
}
.first-heading.br-animate  { animation-delay: 0.2s; }
.second-heading.br-animate { animation-delay: 0.45s; }

/* ── Testimonial infinite horizontal scroll — full bleed ── */
.testimonial-section .w-container {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.testimonial-section .testimonial-wrapper {
  overflow: hidden;
}
.testimonial-section .testimonial-header {
  padding-left: clamp(24px, 5vw, 80px) !important;
  padding-right: clamp(24px, 5vw, 80px) !important;
}
.testimonial-holder {
  width: 100% !important;
  max-width: 100% !important;
}
.first-infinity-wrapper {
  width: 100% !important;
  max-width: 100% !important;
}
.vertical-wrapper-holder {
  overflow: hidden;
  width: 100%;
}
.vertical-wrapper {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  opacity: 1 !important;
  width: max-content;
  will-change: transform;
}
.vertical-wrapper .testimonial-card {
  flex-shrink: 0;
  width: 340px;
  margin-right: 20px;
}
@keyframes br-testimonial-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.vertical-wrapper.br-scroll-ready {
  animation: br-testimonial-scroll 32s linear infinite;
}
.vertical-wrapper.br-scroll-ready:hover {
  animation-play-state: paused;
}
/* Ensure parent wrappers are visible */
.testimonial-section .testimonial-holder,
.testimonial-section .first-infinity-wrapper {
  opacity: 1 !important;
}

/* ── Testimonial cards: always visible on mobile (let transform run for scroll) ── */
@media screen and (max-width:767px){
  .testimonial-section .vertical-wrapper{opacity:1!important;}
  .testimonial-section .testimonial-holder{opacity:1!important;}
  .testimonial-section .first-infinity-wrapper{opacity:1!important;}
}

/* ── Animated rose gradient — all section titles ── */
@keyframes br-title-flow {
  0%   { background-position: 0%   0%;   }
  20%  { background-position: 100% 30%;  }
  40%  { background-position: 70%  100%; }
  60%  { background-position: 10%  80%;  }
  80%  { background-position: 90%  10%;  }
  100% { background-position: 0%   0%;   }
}
.cta-heading,
.testimonial-section .audience-heading {
  white-space: nowrap !important;
  font-size: clamp(32px, 5vw, 72px) !important;
}
.audience-heading,
.how-it-work-section h2,
.faq-section h2 {
  background-image: linear-gradient(
    135deg,
    #ffffff    0%,
    #ffe4ec   18%,
    #F43F5E   36%,
    #ffffff   52%,
    #ffb3c1   68%,
    #BE123C   84%,
    #ffffff  100%
  ) !important;
  background-size: 300% 300% !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  animation: br-title-flow 14s ease-in-out infinite !important;
  font-size: clamp(36px,5vw,72px) !important;
  line-height: 1.05 !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
}

/* ── "Real feedback from real people." ── */
.testimonial-section .audience-paragraph .body-16px{color:#F43F5E!important;font-size:clamp(20px,2vw,28px)!important;font-weight:600!important;}
/* ── Footer copyright center ── */
.footer-right-text,.footer-license-text{text-align:center!important;width:100%!important;}
.footer-lower{justify-content:center!important;}

/* ── Testimonial quote text: white + bold ── */
.testimonial-card p.testimonial{color:#ffffff!important;font-weight:700!important;}

/* ── Hero section: band rehearsal background ── */
.hero-section{
  position:relative!important;
  background-color:#1a1a1a!important;
}
.hero-section::before{
  content:'';
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.6)),url('images/hero_bg.jpg');
  background-size:cover;
  background-position:center top;
  background-attachment:fixed;
  z-index:0;
  pointer-events:none;
}
.hero-section > *{position:relative;z-index:1;}
@media(max-width:767px){
  .hero-section::before{background-attachment:scroll;}
}

/* ── Tools section: background image with dark overlay ── */
.tools-section{
  position:relative!important;
  background-color:#1a1a1a!important;
}
.tools-section::before{
  content:'';
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(0,0,0,0.65),rgba(0,0,0,0.65)),url('images/section2_bg.jpg');
  background-size:cover;
  background-position:center center;
  background-attachment:fixed;
  z-index:0;
  pointer-events:none;
}
.tools-section > *{position:relative;z-index:1;}
@media(max-width:767px){
  .tools-section::before{background-attachment:scroll;}
}

/* ── How It Works: all text white ── */
.how-it-work-section,.how-it-work-section *{color:#fff!important;}

/* ── How It Works section: background image ── */
.how-it-work-section{
  position:relative!important;
  background-color:#1a1a1a!important;
}
.how-it-work-section::before{
  content:'';
  position:absolute;
  inset:-10px;
  background-image:url('images/howitworks_bg.jpg');
  background-color:#BE1E3D;
  background-blend-mode:multiply;
  background-size:cover;
  background-position:center center;
  background-attachment:fixed;
  opacity:0.85;
  z-index:0;
  pointer-events:none;
}
.how-it-work-section > *{position:relative;z-index:1;}
@media(max-width:767px){
  .how-it-work-section::before{background-attachment:scroll;}
}

/* ── How It Works: widen container to fill the page ── */
.how-it-work-section .w-container{
  max-width:1400px!important;
  padding-left:40px!important;
  padding-right:40px!important;
}

/* ── Testimonial section: background image ── */
.testimonial-section{
  position:relative!important;
  background-color:#1a1a1a!important;
}
.testimonial-section::before{
  content:'';
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(0,0,0,0.65),rgba(0,0,0,0.65)),url('images/testimonial_bg.jpg');
  background-size:cover;
  background-position:center center;
  background-attachment:fixed;
  z-index:0;
  pointer-events:none;
}
.testimonial-section > *{position:relative;z-index:1;}
@media(max-width:767px){
  .testimonial-section::before{background-attachment:scroll;}
}

/* ── Remove gap between hero logo and heading ── */
.hero-big-heading { margin-top: 0 !important; padding-top: 0 !important; }
.first-heading, .first-heading.br-animate { margin-top: 0 !important; padding-top: 0 !important; }
.big-heading { margin-top: 0 !important; padding-top: 0 !important; }
.testimonial-card{height:auto!important;min-height:unset!important;}

/* ── Hero: 50/50 · full viewport height · trust bar pinned to bottom ── */

/* Section fills exactly one viewport */
.hero-section{height:100vh!important;height:100dvh!important;min-height:unset!important;padding-bottom:0!important;display:flex!important;flex-direction:column!important;box-sizing:border-box!important;}

/* Container stretches to fill space between content and trust bar */
section.hero-section>.w-layout-blockcontainer{flex:1 1 0!important;display:flex!important;flex-direction:column!important;min-height:0!important;padding-bottom:0!important;}

/* Wrapper row fills the container; 80px top offset for fixed nav */
section.hero-section .hero-section-wrapper{flex:1 1 0!important;min-height:0!important;padding-top:24px!important;align-items:stretch!important;}

/* Title row is the 50/50 flex parent; clips oversized images */
section.hero-section .hero-section-title{flex:1 1 0!important;min-height:0!important;align-items:stretch!important;height:auto!important;overflow:hidden!important;}

/* Left 50%: phone image */
section.hero-section .mobile-holder{order:1!important;width:40%!important;flex:0 0 40%!important;align-self:stretch!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:0!important;margin-top:0!important;height:auto!important;box-sizing:border-box!important;}
section.hero-section .mobile-image{width:auto!important;max-width:100%!important;height:100%!important;max-height:100%!important;object-fit:contain!important;}

/* Right 50%: logo + headings + badges, vertically centered */
section.hero-section .hero-sticky{order:2!important;width:60%!important;flex:0 0 60%!important;align-self:stretch!important;display:flex!important;flex-direction:column!important;justify-content:flex-start!important;align-items:flex-start!important;top:0!important;position:relative!important;min-width:0!important;padding:24px 16px 24px 16px!important;box-sizing:border-box!important;}

/* Trust bar: pinned to bottom edge of hero section */
section.hero-section>.br-trust-wrapper{flex-shrink:0!important;width:100%!important;margin-top:0!important;}

/* ── Fluid scaling: all hero content sizes relative to viewport ── */

/* Logo matches heading width */
.hero-logo-lockup img{width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important;}
.hero-logo-lockup{width:100%!important;margin-bottom:clamp(4px,1vh,14px)!important;}

/* Headings vertical rhythm */
.first-heading,.second-heading{margin-bottom:clamp(2px,0.4vh,6px)!important;}

/* Subtitle */
.br-hero-subtitle{font-size:clamp(12px,min(2.5vw,3.5dvh),36px)!important;margin:clamp(6px,1.2vh,18px) 0 0 0!important;max-width:100%!important;}

/* Badge row spacing */
.br-badge-row{gap:clamp(5px,0.5vw,10px)!important;}
.br-badge-under-image{padding-top:clamp(8px,1.5vh,20px)!important;}

/* Badge sizing — scales with vh */
.hero-button-wrapper.br-badge-row{flex-wrap:wrap!important;}
.br-badge{width:200px!important;height:clamp(36px,5.5dvh,56px)!important;padding:0 16px!important;gap:10px!important;flex:none!important;}
.br-badge-name{font-size:clamp(11px,1.8dvh,18px)!important;}
.br-badge-sub{font-size:clamp(8px,1.2dvh,12px)!important;}
.br-badge-icon{width:clamp(16px,2.5dvh,28px)!important;}
.br-badge-icon svg{width:clamp(16px,2.5dvh,28px)!important;height:clamp(16px,2.5dvh,28px)!important;}

/* Right column top/bottom padding scales with vh */
section.hero-section .hero-sticky{padding-top:clamp(12px,2vh,24px)!important;padding-bottom:clamp(12px,2vh,24px)!important;}

/* Wrapper top padding scales with vh */
section.hero-section .hero-section-wrapper{padding-top:clamp(12px,2vh,24px)!important;}

/* Tablet tweaks */
@media screen and (max-width:991px){
section.hero-section .mobile-holder{width:40%!important;flex:0 0 40%!important;padding:20px 8px 20px 0!important;}
section.hero-section .hero-sticky{width:60%!important;flex:0 0 60%!important;padding:20px 0 20px 16px!important;}
}

/* Mobile: stacked layout */
@media screen and (max-width:767px){
.hero-section{height:auto!important;}
section.hero-section>.w-layout-blockcontainer{flex:none!important;display:block!important;}
section.hero-section .hero-section-wrapper{flex:none!important;align-items:flex-start!important;flex-flow:column!important;}
section.hero-section .hero-section-title{flex:none!important;height:auto!important;overflow:visible!important;flex-flow:column!important;}
/* Logo + headings first, phone image hidden on mobile */
section.hero-section .hero-sticky{order:1!important;width:100%!important;flex:none!important;padding:24px 20px 16px!important;justify-content:flex-start!important;align-items:center!important;}
.hero-button-wrapper.br-badge-row{justify-content:center!important;}
.first-heading .big-heading,.second-heading .big-heading{text-align:center!important;}
.hero-big-heading{text-align:center!important;align-items:center!important;}
.mobile-br{display:block!important;}
section.hero-section .mobile-holder{display:none!important;}
section.hero-section .mobile-image{width:100%!important;height:auto!important;max-height:none!important;}
/* Subtitle smaller on mobile */
.br-hero-subtitle{font-size:26px!important;}
/* Trust bar: stack vertically with bolt as separator */
.br-trust-wrapper{padding:16px 24px!important;}
.br-trust-heading{display:flex!important;flex-direction:column!important;align-items:center!important;white-space:normal!important;gap:4px!important;font-size:28px!important;}
.br-trust-item{display:block!important;text-align:center!important;}
.br-trust-sep{display:flex!important;justify-content:center!important;padding:4px 0!important;}
}

:root{--rose:#f43f5e}.setlist-section,.feature-section,[class*="setlist"],[class*="pink"],[class*="rose"]{background-color:#f43f5e!important}.setlist-section *,[class*="setlist"] *{color:#fff!important}

:root{--color--primary:#f43f5e!important;--color--heading-gradient:#f43f5e!important}
@media screen and (max-width:991px){.body,.heading-4{--color--primary:#f43f5e!important;--color--heading-gradient:#f43f5e!important}}
@media screen and (max-width:767px){.body,.heading-4{--color--primary:#f43f5e!important;--color--heading-gradient:#f43f5e!important}}
@media screen and (max-width:479px){.body{--color--primary:#f43f5e!important;--color--heading-gradient:#f43f5e!important}}

/* ── Feature card scroll-driven scale ── */
.sticky-card-black,
.sticky-orange-black,
.sticky-orange-white {
  will-change: transform, opacity;
  transform-origin: center center;
}

/* ── Phone frame mockup ── */
.br-phone-frame {
  position: relative;
  width: 280px;
  background: #1a1a1a;
  border-radius: 44px;
  padding: 10px;
  box-shadow:
    0 0 0 2px #3a3a3a,
    0 0 0 4px #111,
    0 30px 80px rgba(0,0,0,0.5);
  margin: 0 auto;
}
/* No notch */
.br-phone-frame::before {
  content: none;
}
/* Home indicator */
.br-phone-frame::after {
  content: '';
  position: absolute;
  bottom: 8px;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  height: 4px;
  background: #555;
  border-radius: 2px;
}
.br-phone-inner {
  border-radius: 34px;
  overflow: hidden;
  background: #000;
  aspect-ratio: 9/19.5;
  position: relative;
}
.br-phone-screen {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 34px;
}

/* ── Value grid: injected last so nothing can win ── */
#br-value-wrapper {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  padding: 80px 0 !important;
}
#br-value-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 24px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
#br-value-grid .br-value-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 16px !important;
  padding: 28px 24px !important;
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 16px !important;
  box-sizing: border-box !important;
  text-align: left !important;
}
#br-value-grid .br-value-icon {
  width: 52px !important;
  height: 52px !important;
  border-radius: 12px !important;
  background: rgba(244,63,94,0.18) !important;
  border: 1px solid rgba(244,63,94,0.3) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
#br-value-grid .br-value-title {
  font-size: clamp(15px,1.3vw,20px) !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin: 0 !important;
  line-height: 1.2 !important;
}
#br-value-grid .br-value-desc {
  font-size: clamp(13px,1vw,15px) !important;
  color: rgba(255,255,255,0.55) !important;
  line-height: 1.6 !important;
  margin: 0 !important;
}
@media (max-width: 767px) {
  #br-value-grid { grid-template-columns: repeat(2,1fr) !important; }
}
@media (max-width: 480px) {
  #br-value-grid { grid-template-columns: 1fr !important; }
}


/* ── Testimonial card body row ── */
.testimonial-card-body {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

/* ── Testimonial quote text ── */
.testimonial-card .body-16px.testimonial {
  font-size: 19px;
  font-weight: 700;
  line-height: 1.5;
  margin: 0;
  flex: 1;
}

/* ── Footer social media row ── */
.footer-social-media {
  display: flex;
  gap: 24px;
  align-items: center;
  justify-content: center;
}

/* ── Footer header ── */
.footer-header {
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  gap: 24px !important;
}

/* ── Footer logo image ── */
.footer-logo img {
  width: 100%;
  max-width: 380px;
  height: auto;
  display: block;
}

/* ── Hero logo image ── */
.hero-logo-lockup img {
  width: 100%;
  height: auto;
  display: block;
}

/* ── Zero-height placeholder ── */
.br-zero-height { height: 0; }

.br-mb-0 { margin-bottom: 0; }
.br-sticky-group-inner {
  margin-bottom: 60px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  width: 100%;
}
.br-text-center-full { margin: 0; width: 100%; text-align: center; }
.br-hero-tagline {
  color: #ffffff;
  font-size: clamp(20px, 2vw, 28px);
  margin: 16px 0 0;
  font-weight: 600;
}

.br-nav-divider { width: 100%; margin-top: 0; border-radius: 0; position: relative; z-index: 1; }
.br-trust-sep-icon { display: inline-flex; align-items: center; padding: 0 10px; color: #F43F5E; flex-shrink: 0; }