body {
  margin: 0;
  padding: 0;
  font-family: 'Manrope', sans-serif;
  background-color: #f9f9f9;
  color: #1A1A1A;
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
  font-weight: 600;
  margin-bottom: 1rem;
}

/* Links */
a {
  text-decoration: none;
  color: #000000;
}
a:hover {
  color: #ED0E47;
}

li{
  list-style: none !important;
}

ul{
    padding: 0px;
}


.primary-text{
    color: #ED0E47;
}

.secondary-text{
    color: #6B7280;
}

.primary-bg{
    background-color: #ED0E47;
}

.secondary-bg{
background-color: #FFE8EE;
}



/* Fluid title: 32px mobile -> 60px desktop */
.title{
    font-size: clamp(1.75rem, 1.3rem + 2.4vw, 3.75rem);
    line-height: 1.1;
    letter-spacing: -0.02em;
    overflow-wrap: break-word;
}

.sub-text{
    font-size: clamp(0.95rem, 0.85rem + 0.5vw, 1.25rem);
    color: #6B7280;
    line-height: 1.6;
}

/* Section headings: 50% on desktop, 100% on mobile/tablet */
.section-heading{
    width: 50%;
}

.section-sub{
    width: 50%;
}

.section-head{
    max-width: 100%;
}

@media (max-width: 991.98px){
    .section-heading,
    .section-sub{
        width: 100%;
    }
}

.icon-container {
    width: 84px;
    height: 84px;
    aspect-ratio: 1 / 1;
    background-color: #FFE8EE;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.icon-container img {
    width: 50%;
    height: 50%;
    object-fit: contain;
}

.tertiary-bg{
    background-color: #FDD1DB;
}

.app-buttons {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}


/* =========================================
   APP BUTTON
========================================= */

.app-button {
    width: 185px;
    max-width: 100%;
    height: 62px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 14px;
    background-color: #000000;
    color: #FFFFFF;
    border-radius: 10px;
    border: 1px solid #2b2b2b;
    cursor: pointer;
    box-sizing: border-box;
    flex-shrink: 0;
    transition: all 0.2s ease;
}

.app-button:hover {
    background-color: #151515;
    transform: translateY(-2px);
}


/* =========================================
   APP ICON
========================================= */

.app-button-icon {
    width: 28px;
    height: 32px;
    object-fit: contain;
    flex-shrink: 0;
}


/* =========================================
   APP TEXT
========================================= */

.app-btn-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}

.app-btn-content span {
    display: block;
    font-size: 9px;
    line-height: 1.2;
    color: #FFFFFF;
    white-space: nowrap;
}

.app-btn-content p {
    margin: 2px 0 0;
    font-size: 19px;
    line-height: 1.1;
    font-weight: 500;
    color: #FFFFFF;
    white-space: nowrap;
}


@media (max-width: 991.98px){
     .app-buttons{
        justify-content: center;
    }

}

@media (max-width: 767.98px){
    .app-buttons{
        width: 100%;
        justify-content: center;
    }

    .app-button{
        flex: 1 1 calc(50% - 6px);
        min-width: 150px;
        max-width: 220px;
        height: 58px;
    }

    .app-btn-content p{
        font-size: 16px;
    }

}

@media (max-width: 399.98px){
    .app-buttons{
        flex-direction: column;
        align-items: stretch;
    }

    .app-button{
        max-width: 100%;
        width: 100%;
        height: 56px;
        justify-content: center;
    }
}



/* info-list */

.info-list{
    padding-left: 2rem;
}

.info-list li {
    list-style: disc !important;

}



/* ============================================================
   PRIVACY POLICY PAGE
   Page-specific responsive CSS
   Prefix: pp-
============================================================ */


/* ============================================================
   DESKTOP
   992px and above
============================================================ */

@media (min-width: 992px) {

    .pp-content-row {
        align-items: flex-start;
    }

    /* Quick navigation */
    .pp-navigation-col {
        width: 25%;
    }

    .pp-navigation-card {
        position: sticky;
        top: 100px;
    }

    .pp-navigation-card .card-body {
        padding: 24px;
    }

    /* Main content */
    .pp-main-col {
        width: 75%;
    }

    .pp-main-card .card-body {
        padding: 32px;
    }

}


/* ============================================================
   TABLET
   768px - 991px
============================================================ */

@media (min-width: 768px) and (max-width: 991.98px) {

    /* Hide navigation on tablet */
    .pp-navigation-col {
        display: none;
    }

    /* Main content full width */
    .pp-main-col {
        width: 100%;
    }

    .pp-main-card .card-body {
        padding: 28px;
    }

    /* Reduce content indentation */
    .pp-main-col .ms-5 {
        margin-left: 1.5rem !important;
    }

    .pp-content-block h4 {
        font-size: 1.25rem;
        line-height: 1.4;
    }

}


/* ============================================================
   MOBILE
   Below 768px
============================================================ */

@media (max-width: 767.98px) {

    /* --------------------------------------------------------
       HERO
    -------------------------------------------------------- */

    .pp-hero {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important;
    }

    .pp-hero-content {
        width: 100%;
    }

    /* --------------------------------------------------------
       CONTENT SECTION
    -------------------------------------------------------- */

    .pp-content-section {
        padding-top: 2.5rem !important;
        padding-bottom: 2.5rem !important;
    }

    /* --------------------------------------------------------
       HIDE NAVIGATION
    -------------------------------------------------------- */

    .pp-navigation-col {
        display: none;
    }

    /* --------------------------------------------------------
       MAIN CONTENT
    -------------------------------------------------------- */

    .pp-main-col {
        width: 100%;
    }

    .pp-main-card {
        width: 100%;
    }

    .pp-main-card .card-body {
        padding: 20px;
    }

    /* --------------------------------------------------------
       REMOVE LARGE DESKTOP INDENTATION
    -------------------------------------------------------- */

    .pp-main-col .ms-5 {
        margin-left: 0 !important;
    }

    /* --------------------------------------------------------
       CONTENT HEADINGS
    -------------------------------------------------------- */

    .pp-content-block h4 {
        font-size: 1.15rem;
        line-height: 1.4;
        margin-bottom: 0.75rem;
    }

    /* --------------------------------------------------------
       CONTENT TEXT
    -------------------------------------------------------- */

    .pp-content-block p {
        font-size: 0.95rem;
        line-height: 1.6;
    }

    /* --------------------------------------------------------
       LIST
    -------------------------------------------------------- */

    .pp-content-block .info-list {
        padding-left: 1.25rem;
    }

    .pp-content-block .info-list li {
        font-size: 0.95rem;
        line-height: 1.6;
        margin-bottom: 0.5rem;
    }

}


/* ============================================================
   SMALL MOBILE
   Below 576px
============================================================ */

@media (max-width: 575.98px) {

    /* --------------------------------------------------------
       HERO
    -------------------------------------------------------- */

    .pp-hero {
        padding-top: 2.5rem !important;
        padding-bottom: 2.5rem !important;
    }

    .pp-hero .container {
        padding-left: 16px;
        padding-right: 16px;
    }

    /* --------------------------------------------------------
       CONTENT SECTION
    -------------------------------------------------------- */

    .pp-content-section {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }

    .pp-content-section .container {
        padding-left: 12px;
        padding-right: 12px;
    }

    /* --------------------------------------------------------
       MAIN CARD
    -------------------------------------------------------- */

    .pp-main-card .card-body {
        padding: 18px 16px;
    }

    /* --------------------------------------------------------
       HEADINGS
    -------------------------------------------------------- */

    .pp-content-block h4 {
        font-size: 1.05rem;
    }

    /* --------------------------------------------------------
       TEXT
    -------------------------------------------------------- */

    .pp-content-block p {
        font-size: 0.9rem;
        line-height: 1.55;
    }

    /* --------------------------------------------------------
       LIST
    -------------------------------------------------------- */

    .pp-content-block .info-list {
        padding-left: 1.15rem;
    }

    .pp-content-block .info-list li {
        font-size: 0.9rem;
        line-height: 1.55;
        margin-bottom: 0.45rem;
    }

}


/* ============================================================
   VERY SMALL MOBILE
   Below 400px
============================================================ */

@media (max-width: 399.98px) {

    .pp-hero .container {
        padding-left: 14px;
        padding-right: 14px;
    }

    .pp-content-section .container {
        padding-left: 8px;
        padding-right: 8px;
    }

    .pp-main-card .card-body {
        padding: 16px 14px;
    }

    .pp-content-block h4 {
        font-size: 1rem;
    }

    .pp-content-block p,
    .pp-content-block .info-list li {
        font-size: 0.875rem;
        margin-left: 1.5rem;
    }

}


/* ============================================================
   PRIVACY POLICY - QUICK NAVIGATION
============================================================ */

.pp-navigation-list {
    margin: 0;
    padding: 0;
}

.pp-navigation-list li {
    width: 100%;
    margin: 0;
    padding: 0;
}

.pp-navigation-list li a {
    display: block;
    width: 100%;
    padding: 10px 12px;
    border-radius: 6px;
    color: #1A1A1A !important;
    background-color: transparent;
    transition: background-color 0.2s ease, color 0.2s ease;
}

/* Hover */
.pp-navigation-list li a:hover {
    color: #ED0E47 !important;
    background-color: #FFE8EE !important;
}

/* Active */
.pp-navigation-list li a.pp-active {
    color: #ED0E47 !important;
    background-color: #FFE8EE !important;
    font-weight: 600;
}

