@font-face{ 
  font-family: 'Geist';
  src: url('../fonts/Geist-VariableFont_wght.ttf') format('ttf');
  font-optical-sizing: auto;
  font-weight: normal;
  font-style: normal;
}
@font-face{ 
  font-family: 'Geist', sans-serif;
  src: url('../fonts/InstrumentSerif-Italic.ttf') format('ttf');
  font-optical-sizing: auto;
  font-weight: normal;
  
}
:root {
      --gold: #C9A84C;
      --gold-light: #E2C27A;
      --gold-dim: #8A6E2F;
      --black: #0A0806;
      --dark: #110E09;
      --white: #F7F2EC;
      --text-muted: rgba(247,242,236,0.55);
    }
body {font-family: 'Geist', sans-serif;}
.section {
  height: auto;
  /* display: flex; */
  align-items: center;
  justify-content: center;
   /* Initial hidden state */
  opacity: 0;
  transform: translateY(60px);
  transition: all 0.8s ease;
}

/* When visible */
.section.show {
  opacity: 1;
  transform: translateY(0);
}
.py-10{padding-top: 8rem; padding-bottom: 8rem;}
.py-8 { padding-top: 6rem; padding-bottom: 6rem;}
/* Hero Carousel */
.hero, .carousel, .carousel-inner, .carousel-item { height: 80vh;}
.carousel-bg { position: absolute; inset: 0; background-size: cover; background-position: center;}
.carousel-overlay { position: absolute; inset: 0;
  background: linear-gradient(
    to right,
    rgba(0,0,0,0.65) 23%,
    rgba(0,0,0,0.1)
  ); z-index: 1;
}
.carousel-item > .container { position: relative; z-index: 2;}
.hero-subtitle {font-family: 'Geist', sans-serif; color: #c7a76c; margin-bottom: 15px;  letter-spacing: -1px;}
.text-gold { color: #c7a76c;}
.btn-gold { background: #c7a76c; color: #000; border: none;}
.btn-gold:hover { background: #b6965d;}
.btn-black { background: #000; color: #fff; border: none; transition: background 0.3s, transform 0.2s, box-shadow 0.3s;}
.btn-black:hover { background: #222; color: #fff; transform: translateY(-2px); box-shadow: 0 12px 36px rgba(0, 0, 0, 0.3);}
.section-title { color: #c7a76c; font-size: 2rem;}
.logo img{ max-width: 140px;}
.text-white h1{ font-family: 'Geist', sans-serif;}
/* What SIPN */
.what-sipn p:last-child{ margin-bottom: 0;}
/* Why SIPN Section */
.why-sipn h2 { font-size: 2.2rem; color: #111;}
.why-sipn h4 { font-size: 1.4rem; color: #111;}
.text-gold { color: #c7a76c;}
/* Feature list */
.feature-list { list-style: none; padding-left: 0;}
.feature-list li { position: relative; padding-left: 20px; margin-bottom: 12px; font-size: 14.5px; line-height: 1.6; color: #444;}
.feature-list li::before { content: "•"; position: absolute; left: 0; top: 0; color: #c7a76c; font-size: 22px; line-height: 1;}
/* Brands & Retailers Section */
.brands-section {
  background: radial-gradient(
    circle at top,
    #1a1a1a 0%,
    #000 70%
  );
  color: #fff;
}
.brands-section .brand-card img{height: 100%; object-fit: cover; transition: 0.5s;}
.brands-section .brand-card img:hover{    transform: scale(1.3);}
/* Menu */
.navbar-nav { display: flex; list-style: none; }
.navbar-nav a { text-decoration: none; color: var(--white); font-size: 16px; font-weight: 400; letter-spacing: 1px; opacity: 0.85; transition: color 0.3s, opacity 0.3s; position: relative; padding: 0 0 3px 0 !important; }
.navbar-nav a::after { content: ''; position: absolute; bottom: 3px; left: 0; width: 0; height: 1px; background: var(--gold); transition: width 0.3s; }
.navbar-nav a:hover { color: var(--gold); opacity: 1; }
.navbar-nav a:hover::after { width: 100%; }
.navbar-inner a.nav-link{ color: #000; }
.navbar-inner a.nav-link.active, .navbar-nav a.nav-link.active{ color: #BDA766; }
/* Menu  End*/
.brands-section h6 { font-size: 22px; font-weight: 600;}
.text-muted-light { color: rgba(255, 255, 255, 0.65); max-width: 700px; margin: 0 auto;}
/* Cards */
.brand-card h6 { font-size: 15px; font-weight: 500; line-height: 1.5; margin-top: 10px;}
.btn-gold { background: #c7a76c; color: #000; border: none;}
.btn-gold:hover { background: #b6965d; color: #000;}
/* Trusted Section */
.trusted-title { font-size: 2.2rem; font-weight: 600; color: #111;}
.trusted-text { font-size: 14.5px; color: #444; max-width: 320px;}

/* Slider wrapper */
.trusted-slider-wrapper { background: #000; border-radius: 28px; padding: 30px; position: relative; overflow: hidden;}
.slider-img { width: 32%; height: 260px; object-fit: cover; border-radius: 16px;}
.trusted-indicators { position: absolute; right: 20px; bottom: 15px; justify-content: flex-end; margin: 0;}
.trusted-indicators button { width: 18px; height: 4px; border-radius: 2px; background-color: #777;}
.trusted-indicators .active { background-color: #c7a76c;}
.bourbon-cta { padding: 50px 20px; background: #fff;}
.bourbon-cta-box { background: #c7b273; border-radius: 28px; padding: 25px 20px; text-align: center; margin: 0 auto;}
.bourbon-cta-title { font-size: 2.2rem; font-weight: 600; color: #000;}
.bourbon-cta-title .italic {  font-weight: 400; font-family: 'Geist', sans-serif;}
.bourbon-cta-text { font-size: 14px; color: #000; margin: 18px auto 35px; max-width: 80%;}
.store-buttons { display: flex; justify-content: center; gap: 18px; flex-wrap: wrap;}
.store-buttons img { height: 45px; transition: transform 0.2s ease;}
.store-buttons a:hover img { transform: translateY(-2px);}
.contact-section { padding: 80px 20px; background: #fff;}
.contact-container { max-width: 80%; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 140px; align-items: flex-start;}
.contact-form h2 { font-size: 2.5rem; font-weight: 700; margin-bottom: 10px;}
.subtitle { font-size: 14px; margin-bottom: 35px; color: #111;}
.form-group { margin-bottom: 18px;}
.form-group label { display: block; font-size: 13px; margin-bottom: 6px; font-weight: 600;}
.form-group input, .form-group textarea { width: 100%; padding: 14px 16px; border-radius: 14px; border: 1px solid #999; outline: none; font-size: 14px;}
.form-group textarea { resize: none;}
.submit-btn { margin-top: 20px; background: #c7b273; border: none; padding: 14px 26px; border-radius: 40px; font-size: 14px; font-weight: 600; display: inline-flex; align-items: center; gap: 10px; cursor: pointer; width: 100%; justify-content: center; position: relative; transition: background 0.3s, transform 0.2s, box-shadow 0.3s;}
.submit-btn:hover{transform: translateY(-2px); box-shadow: 0 12px 36px rgba(0, 0, 0, 0.3);}
.submit-btn span { background: #fff; border-radius: 50%; width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; position: absolute; right: 20px; color: #c7b273; font-size: 26px;}
.submit-btn span img{ max-width: 14px;}
.contact-media { display: flex; flex-direction: column; gap: 25px;}
.image-box { border-radius: 40px; overflow: hidden;}
.image-box img { width: 100%; height: 100%; object-fit: cover;transition: transform 0.6s ease;}
.image-box:hover img { transform: scale(1.04);}
/* Contact info */
.contact-info { border-top: 1px solid #aaa; padding-top: 18px; display: flex; gap: 30px; font-size: 13px; align-items: center;}
.info-item { display: flex; gap: 8px; align-items: flex-start;}
.info-item a{ color: #B9B9B9; text-decoration: none; font-size: 15px;}
.icon { font-size: 14px;}
.site-footer { background: #fff; padding: 70px 20px 0px; position: relative; overflow: hidden; border-top: 1px solid #ccc;}
.footer-container { max-width: 80%; margin: 0 auto; display: grid; grid-template-columns: 1.2fr 1fr; gap: 60px; position: relative; z-index: 2;}
.footer-left h2 { font-size: 2.6rem; font-weight: 700; line-height: 1.2;}
.footer-left h2 span { color: #c7b273; font-weight: 600;}
.footer-logo img { margin-top: 30px; max-width: 170px;}
.footer-right { display: flex; flex-direction: column;}
.footer-cta-text { font-size: 14px; margin-bottom: 14px;}
.footer-cta { display: flex; align-items: center; justify-content: center; gap: 20px; background: #000; color: #fff; padding: 22px 26px; border-radius: 14px; text-decoration: none; font-size: 18px; font-weight: 500; width: fit-content; margin-bottom: 40px; width: 300px;transition: background 0.3s, transform 0.2s, box-shadow 0.3s;}
.footer-cta:hover{transform: translateY(-2px); box-shadow: 0 12px 36px rgba(0, 0, 0, 0.3);}
.footer-cta span { color: #c7b273; font-size: 16px;}
.footer-cta span img{ max-width: 16px;}
.footer-links { display: grid; grid-template-columns: 1fr 1fr; gap: 40px;}
.link-group h4 { font-size: 16px; margin-bottom: 12px; text-decoration: underline;}
.link-group ul { list-style: none; padding: 0; margin: 0;}
.link-group li { margin-bottom: 8px;}
.link-group a { text-decoration: none; color: #111; font-size: 16px;}
.link-group a:hover{ color: #B8963E;}
.footer-bottom { margin: 50px 0; font-size: 18px; text-align: center; position: relative; z-index: 2; font-weight: 600;}
.footer-bottom a { color: #000; text-decoration: none;}
.footer-bottom a:hover{color: #B8963E;}
.footer-bg-logo{ display: flex; justify-content: center; align-items: center;}
.footer-bg-logo img{ max-width: 57%;}
.we-connect { background: #000; padding: 40px 20px 80px; text-align: center;}
.we-connect-title { color: #fff; font-size: 2.2rem; font-weight: 600; margin-bottom: 60px;}
.connect-cards { max-width: 80%; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 65px;}
.connect-card { background: #fff; border-radius: 22px; padding: 50px 30px; display: flex; align-items: center; justify-content: center;}
.connect-card p { font-size: 1.1rem; line-height: 1.5; color: #000; margin-bottom: 0;}
.connect-card strong { font-weight: 600;}
.connect-card span { display: block; margin-top: 6px; color: #c7b273; font-weight: 500;}
.why-brands { padding: 80px 20px; background: #fff;}
.why-brands h2{ color: #000}
.why-brands h2 span{color: #c7b273;}
.container { max-width: 80%; margin: 0 auto;}
.section-title { font-size: 3rem; font-weight: 700; margin-bottom: 50px;}
.section-title span { color: #c7b273; font-weight: 500;}
.brand-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px;}
.brand-card { position: relative; border-radius: 26px; overflow: hidden; height: 460px;}
.card-overlay { position: absolute; inset: 0;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.85),
    rgba(0, 0, 0, 0.15)
  );
  color: #fff; padding: 30px; display: flex; flex-direction: column; justify-content: flex-end;}
.card-overlay h3 { font-size: 1.5rem; margin-bottom: 12px; font-weight: 600;}
.card-overlay p { font-size: 14px; line-height: 1.6; max-width: 90%; font-weight: 400;}
.brand-footer { margin-top: 0px; display: flex; justify-content: end; align-items: center;}
/* Swiper */
.swiper { width: 100%; }
.swiper-slide { height: 420px; border-radius: 20px; overflow: hidden; background: #ccc; display: flex; align-items: center; justify-content: center; font-size: 40px; font-weight: bold; }
.nav { margin-top: 20px; display: flex; gap: 10px; justify-content: right; }
.swiper button { width: 40px; height: 40px; border-radius: 50%; border: none; background: #000; color: #fff; font-size: 18px; cursor: pointer; }
.swiper .brand-footer { font-weight: 600; }
.why-brands .swiper-slide img{ width: 100%; object-position: bottom; object-fit: cover; transition: 0.5s;}
.why-brands .swiper-slide:hover img{ transform: scale(1.3);}
/* Page App */
.app-hero-banner{ align-items: center;}
.app-hero{ padding-top: 77px;}
.app-features h3{ color: #000;}
.steps ol{ list-style: none; justify-content: left; align-items: flex-start; flex-direction: row; padding: 0; text-align: left;}
.steps img{ max-width: 70%; border-radius: 16px; }
.steps{ background: #FFFBF0; border-top: solid 1px #D8D8D8; padding: 60px 0;}
.steps .d-flex{ gap: 30px;}
.steps ul{ padding: 0; margin: 15px 0 0 20px; list-style: disc; font-size: 14px; line-height: 35px; }
.steps .number{ font-weight: 600; font-size: 35px;}
.steps h3{ font-weight: 600; font-size: 35px;}
.app-who-its-for{ background: linear-gradient(
    90deg,
    #7a6228 0%,
    #3a2f14 8%,
    #000000 20%,
    #000000 80%,
    #3a2f14 92%,
    #7a6228 100%
  ); padding: 80px 0; color: #fff;}
  .app-who-its-for .cta{ margin: 0 auto;}
  .app-who-its-for .d-flex{  justify-content: space-between; align-items: center; padding: 0 45px;}
  .app-who-its-for h3{ font-weight: 600; font-size: 60px; margin-bottom: 25px;}
  .app-who-its-for a{ padding: 18px 80px; border-radius: 14px; font-weight: 600; font-size: 18px; width: 100%;}
  .app-who-its-for ul{ font-size: 24px; font-weight: 600; line-height: 53px;}
  .app-android img{ max-width: 165px;}
  .app-android { margin-top: 15px;}
  .app-android a{ padding: 0;}
.dark-blue-text{ color: #1543b3;}
/* Page Brand Marketing */
.brand-hero{ background-image: url("../images/bg-brand.webp"); background-size: cover;  background-position: bottom center; background-repeat: repeat; padding: 60px 0; height: 80vh;}
.brand-hero .carousel-overlay{ height: 80vh;}
.brand-hero .container{ position: relative;}
.brand-hero-text h1, .brand-hero-text p{ color: #fff;}
.brand-hero img{ max-width: 490px;}
.brand-hero-banner{ padding: 120px 0 60px 0; align-items: center; width: 50%;}
.black{ background-color: black; padding: 60px 0; color: #fff;}
.black h2{ font-weight: 600; margin-bottom: 20px;}
.black span{  font-weight: 400; font-family: 'Geist', sans-serif;}
.black h3{ color: #BDA766; font-weight: 600; font-size: 35px;}
/* App Animation block */
 :root {
  --gap: 1.25rem;
  --speed: 0.55s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --closed: 5rem;
  --open: 30rem;
  --accent: #ff6b35;
}
/* Partnership Section */
.partnership-hero .container{ position: relative;}
/* .partnership-hero-text h1, .partnership-hero-text p{ color: #212529;} */
.partnership-hero img{ max-width: 490px;}
.partnership-hero-banner{ padding: 120px 0 60px 0; align-items: center;}
.brandm{ padding: 100px 0 0px 0;}
.brandm .head {max-width: 80%;margin: auto; padding: 70px 20px 40px; display: flex; justify-content: space-between; align-items: flex-end; gap: 2rem; display: none;}
.brandm .head h2 { font: 400 1.5rem/1.2 Inter, sans-serif; color: #fff;}
.brandm .nav-btn { width: 2.5rem; height: 2.5rem; border: none; border-radius: 50%; background: rgba(255, 255, 255, 0.12); color: #fff; font-size: 1.5rem; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: 0.3s;}
.brandm .nav-btn:hover { background: var(--accent);}
.brandm .nav-btn:disabled { opacity: 0.3; cursor: default;}
.brandm .slider { max-width: 100%; margin: auto; overflow: hidden;}
.brandm .controls {  /* display: flex; */ display: none; flex-direction: row; gap: 0.5rem;}
.brandm .track { display: flex; gap: var(--gap); align-items: flex-start; justify-content: center; scroll-behavior: smooth; scroll-snap-type: x mandatory; padding-bottom: 40px;}
.brandm .track::-webkit-scrollbar { display: none;}
.brandm .project-card { position: relative; flex: 0 0 var(--closed); height: 26rem; border-radius: 1rem; overflow: hidden; cursor: pointer; transition: flex-basis var(--speed), transform var(--speed);}
.brandm .project-card[active] { flex-basis: var(--open); transform: translateY(1px);  /* box-shadow: 0 18px 55px rgba(0, 0, 0, 0.45); */}
.brandm .project-card__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(0.75) saturate(75%); transition: filter 0.3s, transform var(--speed);}
.brandm .project-card:hover .project-card__bg { filter: brightness(0.9) saturate(100%); transform: scale(1.06);}
.brandm .project-card__content { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 0.7rem; padding: 0; background: linear-gradient(transparent 1%, rgba(0, 0, 0, 0.85) 100%); z-index: 2; color: #fff;}
.brandm .project-card__title { color: #fff; font-weight: 700; font-size: 1.35rem; writing-mode: vertical-rl; transform: rotate(180deg);}
.brandm .project-card__thumb,
.brandm .project-card__desc,
.brandm .project-card__btn { display: none;}
.brandm .project-card[active] .project-card__content { flex-direction: row; align-items: center; padding: 1.2rem 2rem; gap: 1.1rem;}
.brandm .project-card[active] .project-card__title { writing-mode: horizontal-tb; transform: none; font-size: 2.4rem;}
.brandm .project-card[active] .project-card__thumb,
.brandm .project-card[active] .project-card__desc,
.brandm .project-card[active] .project-card__btn { display: block;}
.brandm .project-card__desc span{ display: block; line-height: 29px;}
.brandm .project-card__desc span::before{ background-color: #fff; border-radius: 50%; width: 20px; height: 20px;}
.brandm .project-card__thumb { width: 133px; height: 269px; border-radius: 0.45rem; object-fit: cover; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4);}
.brandm .project-card__desc { color: #ddd; font-size: 1rem; line-height: 1.4; max-width: 100%;}
.brandm .project-card__desc span img{ margin-right: 5px;}
.brandm .project-card__btn { padding: 0.55rem 1.3rem; border: none; border-radius: 9999px; background: var(--accent); color: #fff; font-size: 0.9rem; font-weight: 600; cursor: pointer;}
.brandm .project-card__btn:hover { background: #ff824f;}
.brandm .dots { /* display: flex; */ display: none; gap: 0.5rem; justify-content: center; padding: 20px 0;}
.brandm .dot { width: 13px; height: 13px; border-radius: 50%; background: rgba(255, 255, 255, 0.35); cursor: pointer; transition: 0.3s;}
.brandm .dot.active { background: var(--accent); transform: scale(1.2);}
/* brand-sipn section */
.brand-sipn{ display: flex; flex-direction: row; align-items: center; justify-content: center; margin-top: 60px; gap: 25px;}
.feature-item { display: flex; flex-direction: column; align-items: center;}
.icon-circle { width: 140px; height: 140px; background: #000; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 48px; color: #c8a24c; /* gold color */ margin-bottom: 25px; transition: 0.3s ease;}
.feature-item h3 { font-size: 18px; font-weight: 600; color: #222; max-width: 250px; line-height: 1.4;}
/* Hover effect */
.icon-circle:hover { transform: translateY(-6px);}

/* Brand CTA Section */
.brand-cta-section{ background-image: url("../images/bg-brand-cta.png"); background-size: cover; background-position: center center; background-repeat: repeat; padding: 60px 0;}
.brand-cta-section .cta-section { position: relative; padding: 100px 20px; text-align: center; background: #e7dcc1; overflow: hidden;}
/* Decorative dotted pattern */
.brand-cta-section .cta-section::before,
.brand-cta-section .cta-section::after { content: ""; position: absolute; width: 450px; height: 450px; background-image: radial-gradient(circle, rgba(0,0,0,0.08) 2px, transparent 2px); background-size: 20px 20px; opacity: 0.4;}
.brand-cta-section .cta-section::before { top: -100px; left: -100px;}
.brand-cta-section .cta-section::after { bottom: -100px; right: -100px;}
.brand-cta-section .cta-container { position: relative; z-index: 2; max-width: 1000px; margin: auto;}
/* HEADING */
.brand-cta-section .cta-container h1 { font-size: 48px; font-weight: 600; color: #000; margin-bottom: 20px; line-height: 1.2;}
.brand-cta-section .cta-container .italic {  font-family: 'Geist', sans-serif; font-weight: 400;}
/* SUBTEXT */
.brand-cta-section .cta-container p { font-size: 18px; color: #333; margin-bottom: 40px;}
/* BUTTONS */
.brand-cta-section .cta-buttons { display: flex; justify-content: center; gap: 30px; flex-wrap: wrap;}
.brand-cta-section .btn { padding: 16px 40px; border-radius: 50px; text-decoration: none; font-weight: 600; font-size: 16px; transition: 0.3s ease; display: inline-block;}
/* Dark Button */
.brand-cta-section .btn-dark { background: #000; color: #fff;}
.brand-cta-section .btn-dark:hover { background: #333;}
/* Gold Button */
.brand-cta-section .btn-gold { background: #bfa45a; color: #000;}
.brand-cta-section .btn-gold:hover { background: #a88e47;}
/* Partners Page */
.partner-bg{width:100%; min-height:100vh; background-image: url("../images/bg-partner.webp"); background-size: cover; background-position-y: -200px; background-repeat: no-repeat; padding-top: 60px; align-items: center;}
.partner-logo-holder img{ max-width: 60%; margin: 30px 0;}
.parter-logos-text .red{ color: #EA0A2A; font-family: 'Geist', sans-serif;  font-size: 60px; font-weight: 400;}
.parter-logos-text h3{ font-weight: 600; font-size: 60px; margin-bottom: 30px;}
.parter-logos-text{ padding-bottom: 80px;}
.bc-powers{ background: linear-gradient(90deg, #7a000a -6%, #3a0004 13%,  #000 79%, #7a000a 100%);color: #fff; padding: 80px 0 40px;}
.bc-powers h3{ text-align: left; font-weight: 600; font-size: 54px;}
.bc-powers .d-flex{ justify-content: space-between; align-items: center; margin-bottom: 30px; text-align: left;}
.bc-powers .counter-box, .bc-across, .bc-users{ display: flex; align-items: center; gap: 15px; }
.bc-powers .icon {border-right: solid 3px #fff;  height: 100px; align-items: center; display: flex; padding-right: 20px;}
.bc-powers .counter-content h2 { font-size: 32px; margin: 0; font-weight: bold;}
.bc-powers .counter-content p, .across-text p, .bc-users p { margin: 0; font-size: 20px; font-weight: 600;}
.across-text span{ font-size: 32px;}
 /* unlocks section */
 .unlocks{ background: #000; color: #fff; padding: 60px; border-radius: 60px;margin: 80px auto; width: 80%;}
 .unlocks .d-flex{ justify-content: space-between;}
  .unlock-block { border: 2px solid transparent; border-radius: 30px; padding: 30px; margin-bottom: 30px; width: 45%;
  background:
    linear-gradient(#000, #000) padding-box,
    linear-gradient(358deg, #7a000a, #000) border-box;
}
.unlock-block img{ width: 22%; margin-bottom: 40px;}
.unlocks h3{ margin: 50px 0 0; font-size: 40px; font-weight: 600;}
.unlocks h3 span{ font-family: 'Geist', sans-serif; font-weight: 400;  color: #EA0A2A;}
.unlocks p{ font-weight: 600;}
/* partnership section */
.partnership-section .text-right{ text-align: right;}
.partnership-section h2{ font-weight: 600; font-size: 50px; }
.partnership-section h3{ font-weight: 500; }
.partnership-section h3 span{font-family: 'Geist', sans-serif; font-weight: 400;  color: #BDA766;}
.partnership-section .content{ padding-left: 80px;}
/* Delivers Section */
.delivers .feature-item{ border: solid 1px #BDA766; border-radius: 20px; padding: 20px; height: 200px; justify-content: center; gap: 15px; width: 30%; }
.delivers .feature-item img{ max-width: 60%;}
.delivers .brand-sipn{  justify-content: space-between; width: 80%; margin: 0 auto 30px auto;}
.delivers .feature-item h3{ font-size: 22px;}
.delivers .cta-buttons a{ border-radius: 22px; padding: 10px 50px; font-weight: 600;}
.delivers .cta-buttons { text-align: center;}
/* partnership Section */
.partnership-section{ padding: 60px 0 90px;}
.partnership-section .image-box{box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);}
.partnership-section ul{ list-style: none; margin: 30px 0 0 0; padding: 0;}
.partnership-section ul li{ margin-bottom: 30px; font-weight: 600;}
.partnership-section ul li span{ margin-right: 15px;  background-color: #BDA766; border-radius: 50%; padding: 10px 19px; }
.partnership-section ul li span.connects-pos{ background-image: url("../images/icon-partner-syncgo1.png"); background-repeat: no-repeat; background-size: 19px; background-position: center; vertical-align: middle;}
.partnership-section ul li span.syn-ippd{background-image: url("../images/icon-partner-syncgo2.png"); background-repeat: no-repeat; background-size: 19px; background-position: center; vertical-align: middle;}
.partnership-section ul li span.synchrony{background-image: url("../images/icon-partner-syncgo3.png"); background-repeat: no-repeat; background-size: 19px; background-position: center; vertical-align: middle;}
.partnership-section ul li span.manual-operation{background-image: url("../images/icon-partner-syncgo4.png"); background-repeat: no-repeat; background-size: 19px; background-position: center; vertical-align: middle;}
/* Why Syncgo */
.why-syncgo { margin-bottom: 100px;}
.why-syncgo h2{ font-weight: 600; font-size: 44px; margin-bottom: 30px;}
.syncgo-enable { background-color: #F5F5F5; border-top: solid 1px #D8D8D8; padding: 50px 0;}
.syncgo-enable h3{ font-size: 28px; font-weight: 600;}
.why-syncgo h4{ font-weight: 600; font-size: 37px; width: 80%; margin: 0px auto 30px;}
/* Sipn Eco system */
.sipn-ecosystem{ padding-bottom: 100px;}
.sipn-ecosystem h2{ text-align: center; font-weight: 600; font-size: 44px;}
.sipn-ecosystem h2 span{ color: #BDA766; display: block;}
.eco-block{ border-radius: 26px; padding: 80px 10px 10px;}
.eco-block h3{ text-align: center; color: #fff; font-size: 30px; font-weight: 500; margin: 0 auto 30px; width: 80%;}
.eco-block-white{ background-color: #fff; padding: 30px; border-radius: 26px;}
.spacebetween{ justify-content: center; width: 80%; gap: 60px; margin: auto; margin-bottom: 60px;}
.mt-80{ margin-top: 80px;}
.icon-enable{ background-color: #000; border-radius: 50%; padding: 10px; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;}
.icon-enable img{ max-width: 100%;}
.syncgo-enable .justify-content-center{ gap: 15px;}
.partnership-section .content.pl-0{ padding-left: 0;}
/* Top 3 Logos Layout */
.top-row{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:40px;}
/* Individual Block */
.partner-box{ flex:1; text-align:center;}
.partner-box img{ max-width:200px; width:100%; margin-bottom: 10px;}
.logo-bc img{ max-width: 55%;}
/* Text Styling */
.partner-box p{ font-size: 16px; line-height:1.6; color:#333; font-weight: 600;}
.partner-box span{ font-style: normal;font-weight: 600; font-style: normal; font-family: 'Geist', sans-serif;}
.red-text{ color:#e60012; font-weight:600;}
.blue-text{ color:#79b7e7; font-weight:600;}
.gold-text{ color:#b89b5e; font-weight:600;}
/* Center SIPN Box */
.center-box img{ max-width:180px;}
.center-box p{ margin-top:15px;}
.bottom-logo{ /* margin-top:40px; */ justify-content: center; display: flex;}
.bottom-logo img{ max-width:300px; width:100%;}
.partner-result{ padding: 80px 0 30px; text-align: center;}
.partner-result .card-wrapper{ position:relative; width:320px;}
.partner-result .card{ background:#ef0b23; border-radius:35px; padding:80px 30px 60px; text-align:center; color:#fff; z-index: 1; position: relative;}
.partner-result .icon-circle{ position:absolute; top:-45px; left:25%; transform:translateX(-50%); width:90px; height:90px; background:#55595c; border-radius:50%; display:flex; align-items:center; justify-content:center; z-index: 2;}
.partner-result .icon-circle img{ width:40px;}
.partner-result .card h3{ font-size:20px; font-weight:600; line-height:1.5;}
.partner-cta-section{ margin: 80px 0;}
.partner-cta-section h2{ font-size: 38px;}
.partner-cta-section h2 span{ font-family: 'Geist', sans-serif; font-weight: 400; }
.partner-cta-section a{ border-radius: 24px; padding: 8px 35px;}
.counter-section { background: linear-gradient(90deg, #7a000a -6%, #3a0004 13%,  #000 79%, #7a000a 100%);color: #fff; padding: 80px 0 40px;}
.counter-section h3{ text-align: left; font-weight: 600; font-size: 54px;}
.counter-box { margin: 20px; display: inline;}
.counter { font-size: 48px; font-weight: bold; margin: 0; display: inline-flex;}
.counter-box p { margin: 10px 0 5px; font-size: 20px;}
.counter-box small { font-size: 16px; opacity: 0.8;}
/* Blogs */
.blogs-main { width: 100%; float: left; margin-top: 20px; display: flex; flex-wrap: wrap; gap: 20px;}
.blogs-sub { width: calc(33.33% - 15px); background: #f3f3f1; padding: 16px; border: 1px solid #f3f3f1;}
.blogs-sub a, .blogs-sub a:hover {color: #3a3a3a;}
.blogs { width: 100%; float: left; padding: 12px; border-radius: 4px;}
.blogs-data { width: 100%; float: left;}
.blogs-data .main-text-div { font-size: 16px; margin-bottom: 12px; font-weight: 600; line-height: 22px;}
.blogs img{ max-width: 100%; margin-bottom: 20px;}
.read-more-blog { color: #c8a24c; font-weight: 600; font-size: 13px;}
.blogs-container{display: block; padding: 80px 50px; margin: auto;float: left;}
.blogs-container h1{ text-align: center;}
.blog-details-container {width: 100%; max-width: 800px; display: block; margin: 0 auto; float: none; padding: 80px 20px 30px;}
.blog-details-container img{ max-width: 80%; margin: 0 auto 30px; }
.blog-listing{ background: #fff;}
.blog-details-container h3{ font-size: 22px;}
/* Breadcrumb container */
.blog-entries .breadcrumb { display: flex; flex-wrap: wrap; list-style: none; padding: 0px; margin: 10px 0 15px 0;}
.breadcrumb li {display: flex; align-items: center; font-size: 14px;}
.breadcrumb li a { text-decoration: none; color: #c7b273;transition: 0.3s;}
.breadcrumb li a:hover { text-decoration: underline;}
.breadcrumb li + li::before { content: "›"; margin: 0 8px; color: #c7b273;}
.breadcrumb li.active { color: #555; pointer-events: none;}
@media (max-width: 600px) {
  .breadcrumb {font-size: 13px;}
} 
/* ------------------ */
/* RESPONSIVE */
/* ------------------ */
@media screen and (max-width: 1440px) and (min-width: 1200px) {
  .swiper-slide{ height: 310px;}
  .partner-bg{ background-position-y: -95px;}
}
@media screen and (max-width: 1199px) and (min-width: 992px) {
  .swiper-slide{ height: 310px;}
  .partner-bg{ background-position-y: -75px;}
}
@media (min-width: 1024px) {
  .brandm .head h2 { font-size: 2.25rem; }
}
@media (max-width: 992px) {
  .contact-container { grid-template-columns: 1fr; gap: 50px; }
  .footer-container { grid-template-columns: 1fr; gap: 50px; margin: 0; max-width: 100%; }
  .footer-bg-logo { font-size: 160px; right: -10px; }
  .connect-cards { grid-template-columns: 1fr; gap: 30px; }
  .connect-card { padding: 40px 20px; }
  .brand-cards { grid-template-columns: 1fr; }
  .brand-card { height: 420px; }
  .section-title { font-size: 2.3rem; }
  .navbar-toggler{ background-color: #c7a76c !important;}
  .navbar-collapse{background-color: #000; padding: 40px; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); border-radius: 25px;}
  .navbar-inner a.nav-link{ color: #fff;}
  .brand-sipn{ display: block;}
  .app-features{ padding-top: 2rem;}
  .brand-cta-section .btn{ width: 90%;}
  .top-row{ flex-direction:column; }
  .partner-box{ margin-bottom:40px;}
  .brand-cta-section .cta-container h1 {  font-size: 38px; }
  .container { grid-template-columns: repeat(2, 1fr); }
  .partner-box img{ max-width: 177px;}
  .brand-hero img, .app-hero-banner img{ max-width: 100%;}
  .app-hero-banner, .steps .d-flex, .app-who-its-for .d-flex, .bc-powers .d-flex, .unlocks .d-flex, .partnership-section .d-flex, .partner-result .d-flex{ display: block !important;}
  .app-hero{ padding-top: 120px;}
  .steps img{ margin: 10px 0;}
  .partner-bg{ background-position: center; min-height: auto;}
  .partner-logo-holder img{ max-width: 95%;}
  .parter-logos-text h3, .parter-logos-text .red{ font-size: 35px;}
  .bc-powers .counter-box, .bc-across, .bc-users{ justify-content: center; width: 260px; margin: 0 auto;}
  .bc-across.d-flex, .bc-users.d-flex{ display: flex !important; justify-content: center;}
  .bc-powers .counter-box, .partnership-section .image-box, .delivers .feature-item{ margin-bottom: 30px;}
  .across-text, .across-text, .counter-content{ width: 65%;}
  .bc-powers h3{ font-size: 32px; margin-bottom: 40px;}
  .unlock-block, .delivers .feature-item{ width: 100%;}
  .unlocks{ width: 100%;}
  .unlocks h3 { font-size: 33px;}
  .partnership-section .content{ padding-left: 0;}
  .partnership-section h2{ font-size: 40px;}
  .partnership-section{ padding-bottom: 80px;}
  .why-syncgo h2, .sipn-ecosystem h2{ font-size: 38px;}
  .syncgo-enable h3{ font-size: 25px; padding: 20px;}
  .why-syncgo h4, .eco-block h3{ font-size: 25px;}
  .center-box img{ margin: 0;}
  .partner-box{ flex: 1 1 140px;}
  .partner-result .card-wrapper{ margin-bottom: 60px;}
  .swiper-slide{ height: 337px;}
  .unlock-block img{ width: 45px;}
  .partner-bg{ background-position-y: -55px;}
}
@media (max-width: 768px) {
  .hero-subtitle { font-size: 1.6rem; }
  .why-sipn h2 { font-size: 1.8rem; }
  .brands-section h2 { font-size: 1.8rem;}
  .trusted-title { font-size: 1.8rem; }
  .trusted-text { max-width: 100%; }
  .slider-img { width: 100%; height: 220px; }
  .trusted-slider-wrapper { padding: 20px; }
  .bourbon-cta-box { padding: 50px 20px; }
  .bourbon-cta-title { font-size: 2rem; }
  .bourbon-cta-text { font-size: 13.5px; }
  .store-buttons img { height: 40px;}
  .swiper-wrapper, .swiper-slide{ height: 320px;}
  .swiper button{ width: 30px; height: 30px;}
  .brand-hero .brand-hero-banner{ display: block !important;}
  .footer-cta{ max-width: 100%;}
  .brand-cta-section .cta-section { padding: 80px 20px; }
  .brand-cta-section .cta-container h1 { font-size: 30px; }
  .brand-cta-section .cta-container p { font-size: 16px; }
  .brand-cta-section .cta-buttons { flex-direction: column; gap: 20px; }
  .brand-cta-section .btn { width: 100%; max-width: 320px; margin: auto;}
  .unlocks h3 { font-size: 23px;}
  .feature-item .icon-circle img{ max-width: 70%;}
  .unlock-block img{ width: 45px;}
  .show .container{ width: 100%; padding: 0;}
  .unlocks{ padding: 60px 20px;}
  .partner-result .card{ padding: 60px 30px 30px;}
}
@media (max-width: 767px) {
  :root {
    --closed: 100%;
    --open: 100%;
    --gap: 0.8rem;
  }
  :root {
    --closed: 4rem;
    --open: 22rem;
  }
  .brandm .head {  padding: 50px 20px 30px; }
  .brandm .track { flex-direction: column; scroll-snap-type: y mandatory; align-items: center; justify-content: flex-start; padding-bottom: 0;}
  .brandm .project-card {height: 20rem; }
  .brandm .project-card__title { font-size: 1.1rem; writing-mode: horizontal-tb; transform: none; text-align: center; padding-inline: 0.3rem; }
  .brandm .nav-btn { width: 2rem; height: 2rem; font-size: 1.2rem;}
  .brandm .head { padding: 30px 15px 20px; flex-direction: column; align-items: flex-start; gap: 1rem;}
  .brandm .slider { padding: 0 15px; }
  .brandm .track { flex-direction: column; scroll-snap-type: y mandatory; gap: 0.8rem; padding-bottom: 20px; }
  .brandm .project-card { height: auto; min-height: 80px; flex: 0 0 auto; width: 100%; scroll-snap-align: start; }
  .brandm .project-card[active] { min-height: 300px; transform: none; box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);  }
  .brandm .project-card__content { flex-direction: row; justify-content: flex-start; padding: 1rem; align-items: center; gap: 1rem;}
  .brandm .project-card__title { writing-mode: horizontal-tb; transform: none; font-size: 1.2rem; margin-right: auto; }
  .brandm .project-card__thumb,
  .brandm .project-card__desc,
  .brandm .project-card__btn { display: none; }
  .brandm .project-card[active] .project-card__content {  align-items: flex-start;  padding: 1.5rem; }
  .brandm .project-card[active] .project-card__title { font-size: 1.8rem; margin-bottom: 1rem; margin-top: 2rem; }
  .brandm .project-card[active] .project-card__thumb { width: 200px; height: 267px; border-radius: 0.35rem; margin-bottom: 1rem; }
  .brandm .project-card[active] .project-card__desc { font-size: 0.95rem; max-width: 100%; margin-bottom: 1rem; }
  .brandm .project-card[active] .project-card__btn { align-self: center; width: 100%; text-align: center; padding: 0.7rem; }
  .brandm .dots { display: none; }
  .brandm .controls {  width: 100%; justify-content: space-between; padding: 0 15px 20px; }
  .brandm .nav-btn { position: static; transform: none; }
  .contact-container{ max-width: 100%;}
  .why-brands .container{ margin: 0; padding: 0; max-width: 100%;}
  .partner-bg{ background-position-y: -65px;}
  .app-android img{ margin-top: 10px;}
  .brand-hero-banner{ width: 100%;}
  .brand-hero .carousel-overlay, .brand-hero{ height: 90vh;}
  .partnership-hero-banner{ flex-direction: column;}
  .blogs-sub{ width: 90%; margin: auto;}
}
@media (max-width: 576px) {
  .container { grid-template-columns: 1fr;}
  .icon-circle { width: 120px; height: 120px; font-size: 40px; }
  .partner-box p{ font-size:16px; }
}
@media (max-width: 480px) {
  .bourbon-cta-title { font-size: 1.7rem; }
  .store-buttons { flex-direction: column; }
  .contact-form h2 { font-size: 2rem; }
  .contact-info { flex-direction: column; align-items: flex-start; gap: 10px;}
  .footer-left h2 {font-size: 2rem;}
  .footer-links { grid-template-columns: 1fr; gap: 30px;}
  .footer-bg-logo { font-size: 120px; }
  .we-connect-title {font-size: 1.8rem;}
  .connect-card p { font-size: 1rem;}
  .what-sipn p{margin:0;}
  .swiper-wrapper, .swiper-slide{ height: 320px;}
  .swiper button{ width: 30px; height: 30px;}
  .partner-result .card-wrapper{ width:90%; }
  .footer-cta{width: 245px;}
  .bourbon-cta .container{ padding: 0; margin: 0; max-width: 100%;}
  .contact-container{ display: flex; align-items: center; flex-direction: column;}
}