{"id":2033,"date":"2026-08-13T10:31:07","date_gmt":"2026-08-13T10:31:07","guid":{"rendered":"https:\/\/whynotsa.co.za\/?page_id=2033"},"modified":"2026-10-15T14:00:54","modified_gmt":"2026-10-15T14:00:54","slug":"homepage-2","status":"publish","type":"page","link":"https:\/\/whynotsa.co.za\/","title":{"rendered":"Homepage"},"content":{"rendered":"\n<style data-wp-block-html=\"css\">\n\/* =========================================\n   WHY NOT SA - HEADER CSS\n   ========================================= *\/\n\n:root {\n    --wnsa-teal: #0D7C93;\n    --wnsa-dark-teal: #075C68;\n    --wnsa-gold: #C8AF92;\n    --wnsa-light-gold: #EADAB7;\n    --wnsa-cream: #F6F1E6;\n    --wnsa-white: #FFFDF8;\n    --wnsa-text: #26383A;\n}\n\n\n\/* ================================\n   HEADER\n   ================================ *\/\n\n.wnsa-header {\n    width: 100%;\n    position: relative;\n    z-index: 1000;\n    background: var(--wnsa-cream);\n}\n\n\n\/* ================================\n   TOP ANNOUNCEMENT BAR\n   ================================ *\/\n\n.wnsa-top-bar {\n    width: 100%;\n    min-height: 38px;\n    background: var(--wnsa-dark-teal);\n    color: #ffffff;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    position: relative;\n\n    font-family: Arial, sans-serif;\n    font-size: 13px;\n    letter-spacing: 0.4px;\n}\n\n.wnsa-top-bar-inner {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n}\n\n.wnsa-top-divider {\n    color: var(--wnsa-gold);\n}\n\n\n\/* SOCIAL ICONS *\/\n\n.wnsa-social-links {\n    position: absolute;\n    right: 35px;\n\n    display: flex;\n    align-items: center;\n    gap: 12px;\n}\n\n.wnsa-social-links a {\n    width: 22px;\n    height: 22px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 50%;\n\n    background: #ffffff;\n    color: var(--wnsa-dark-teal);\n\n    text-decoration: none;\n\n    font-size: 12px;\n    font-weight: 600;\n\n    transition: 0.3s ease;\n}\n\n.wnsa-social-links a:hover {\n    background: var(--wnsa-light-gold);\n    color: var(--wnsa-dark-teal);\n}\n\n\n\/* ================================\n   MAIN NAVIGATION\n   ================================ *\/\n\n.wnsa-navbar {\n    width: 100%;\n    min-height: 105px;\n\n    padding: 0 55px;\n\n    display: flex;\n    align-items: center;\n\n    position: relative;\n\n    background: rgba(246, 241, 230, 0.97);\n}\n\n\n\/* ================================\n   LOGO\n   ================================ *\/\n\n.wnsa-logo {\n    flex-shrink: 0;\n\n    display: flex;\n    align-items: center;\n}\n\n.wnsa-logo a {\n    display: block;\n    line-height: 0;\n}\n\n.wnsa-logo img {\n    width: 115px;\n    height: auto;\n\n    display: block;\n\n    object-fit: contain;\n}\n\n\n\/* ================================\n   NAVIGATION\n   ================================ *\/\n\n.wnsa-nav {\n    display: flex;\n    align-items: center;\n\n    gap: 38px;\n\n    margin-left: auto;\n    margin-right: 35px;\n}\n\n.wnsa-nav a {\n    position: relative;\n\n    color: var(--wnsa-text);\n\n    text-decoration: none;\n\n    font-family: Arial, sans-serif;\n    font-size: 13px;\n    font-weight: 600;\n\n    text-transform: uppercase;\n    letter-spacing: 0.6px;\n\n    padding: 10px 0;\n\n    transition: color 0.3s ease;\n}\n\n.wnsa-nav a:hover,\n.wnsa-nav a.active {\n    color: var(--wnsa-teal);\n}\n\n\n\/* GOLD UNDERLINE *\/\n\n.wnsa-nav a::after {\n    content: \"\";\n\n    position: absolute;\n\n    left: 0;\n    bottom: 0;\n\n    width: 0;\n    height: 2px;\n\n    background: var(--wnsa-gold);\n\n    transition: width 0.3s ease;\n}\n\n.wnsa-nav a:hover::after,\n.wnsa-nav a.active::after {\n    width: 100%;\n}\n\n\n\/* ================================\n   HEADER ACTIONS\n   ================================ *\/\n\n.wnsa-header-actions {\n    display: flex;\n    align-items: center;\n\n    gap: 22px;\n\n    flex-shrink: 0;\n}\n\n\n\/* CART *\/\n\n.wnsa-cart {\n    position: relative;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    color: var(--wnsa-dark-teal);\n\n    text-decoration: none;\n\n    width: 36px;\n    height: 36px;\n}\n\n.wnsa-cart-icon {\n    font-size: 21px;\n}\n\n.wnsa-cart-count {\n    position: absolute;\n\n    top: -2px;\n    right: -4px;\n\n    width: 17px;\n    height: 17px;\n\n    border-radius: 50%;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    background: var(--wnsa-gold);\n    color: #ffffff;\n\n    font-size: 9px;\n    font-weight: bold;\n}\n\n\n\/* ================================\n   SHOP NOW BUTTON\n   ================================ *\/\n\n.wnsa-shop-button {\n    display: inline-flex;\n\n    align-items: center;\n    justify-content: center;\n\n    min-width: 125px;\n    height: 43px;\n\n    padding: 0 25px;\n\n    border-radius: 30px;\n\n    background: var(--wnsa-dark-teal);\n    color: #ffffff;\n\n    text-decoration: none;\n\n    font-family: Arial, sans-serif;\n    font-size: 12px;\n    font-weight: 700;\n\n    text-transform: uppercase;\n    letter-spacing: 0.6px;\n\n    transition: all 0.3s ease;\n}\n\n.wnsa-shop-button:hover {\n    background: var(--wnsa-teal);\n    transform: translateY(-2px);\n}\n\n\n\/* ================================\n   TABLET\n   ================================ *\/\n\n@media (max-width: 1000px) {\n\n    .wnsa-navbar {\n        padding: 0 30px;\n    }\n\n    .wnsa-nav {\n        gap: 20px;\n        margin-right: 20px;\n    }\n\n    .wnsa-nav a {\n        font-size: 11px;\n    }\n\n    .wnsa-logo img {\n        width: 95px;\n    }\n\n    .wnsa-shop-button {\n        min-width: 105px;\n        padding: 0 18px;\n    }\n}\n\n\n\/* ================================\n   MOBILE\n   ================================ *\/\n\n@media (max-width: 768px) {\n\n    .wnsa-top-bar {\n        min-height: 34px;\n        font-size: 11px;\n    }\n\n    .wnsa-social-links {\n        display: none;\n    }\n\n    .wnsa-navbar {\n        min-height: 80px;\n        padding: 0 20px;\n    }\n\n    .wnsa-logo img {\n        width: 85px;\n    }\n\n    .wnsa-nav {\n        display: none;\n    }\n\n    .wnsa-header-actions {\n        margin-left: auto;\n        gap: 12px;\n    }\n\n    .wnsa-cart {\n        width: 32px;\n        height: 32px;\n    }\n\n    .wnsa-cart-icon {\n        font-size: 19px;\n    }\n\n    .wnsa-shop-button {\n        min-width: 95px;\n        height: 38px;\n\n        padding: 0 16px;\n\n        font-size: 10px;\n    }\n}\n\/* =========================================\n   WHY NOT SA - HERO SECTION\n   ========================================= *\/\n\n.wnsa-hero {\n    position: relative;\n    overflow: hidden;\n\n    background:\n        radial-gradient(\n            circle at 75% 45%,\n            rgba(234, 218, 183, 0.45),\n            transparent 30%\n        ),\n        var(--wnsa-cream);\n\n    min-height: 680px;\n}\n\n\n\/* HERO CONTAINER *\/\n\n.wnsa-hero-container {\n    max-width: 1250px;\n\n    min-height: 620px;\n\n    margin: 0 auto;\n\n    padding: 70px 55px;\n\n    display: grid;\n\n    grid-template-columns: 1fr 1fr;\n\n    align-items: center;\n\n    gap: 40px;\n}\n\n\n\/* =========================================\n   LEFT CONTENT\n   ========================================= *\/\n\n.wnsa-hero-content {\n    position: relative;\n    z-index: 5;\n\n    max-width: 570px;\n}\n\n\n\/* EYEBROW *\/\n\n.wnsa-hero-eyebrow {\n    display: inline-block;\n\n    margin-bottom: 18px;\n\n    color: var(--wnsa-teal);\n\n    font-family: Arial, sans-serif;\n\n    font-size: 11px;\n\n    font-weight: 700;\n\n    letter-spacing: 2.5px;\n}\n\n\n\/* MAIN HEADING *\/\n\n.wnsa-hero h1 {\n    margin: 0;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: clamp(55px, 6vw, 88px);\n\n    line-height: 0.92;\n\n    font-weight: 500;\n\n    letter-spacing: -3px;\n}\n\n.wnsa-hero h1 span {\n    display: block;\n\n    color: var(--wnsa-teal);\n}\n\n\n\/* TAGLINE *\/\n\n.wnsa-hero-tagline {\n    margin: 28px 0 12px;\n\n    color: var(--wnsa-text);\n\n    font-family: Georgia, serif;\n\n    font-size: 25px;\n\n    line-height: 1.3;\n}\n\n\n\/* DESCRIPTION *\/\n\n.wnsa-hero-description {\n    max-width: 500px;\n\n    margin: 0 0 25px;\n\n    color: #617173;\n\n    font-family: Arial, sans-serif;\n\n    font-size: 15px;\n\n    line-height: 1.8;\n}\n\n\n\/* =========================================\n   HERO BENEFITS\n   ========================================= *\/\n\n.wnsa-hero-benefits {\n    display: flex;\n\n    flex-wrap: wrap;\n\n    gap: 18px;\n\n    margin-bottom: 32px;\n}\n\n.wnsa-hero-benefit {\n    display: flex;\n\n    align-items: center;\n\n    gap: 7px;\n}\n\n.wnsa-hero-benefit span {\n    color: var(--wnsa-gold);\n\n    font-size: 15px;\n}\n\n.wnsa-hero-benefit p {\n    margin: 0;\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 12px;\n\n    font-weight: 700;\n}\n\n\n\/* =========================================\n   BUTTONS\n   ========================================= *\/\n\n.wnsa-hero-buttons {\n    display: flex;\n\n    align-items: center;\n\n    gap: 15px;\n}\n\n\n.wnsa-primary-button {\n    display: inline-flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    gap: 15px;\n\n    min-width: 155px;\n\n    height: 50px;\n\n    padding: 0 25px;\n\n    border-radius: 30px;\n\n    background: var(--wnsa-dark-teal);\n\n    color: #ffffff;\n\n    text-decoration: none;\n\n    font-size: 12px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n\n    transition: 0.3s ease;\n}\n\n.wnsa-primary-button:hover {\n    background: var(--wnsa-teal);\n\n    transform: translateY(-2px);\n}\n\n.wnsa-primary-button span {\n    font-size: 17px;\n}\n\n\n.wnsa-secondary-button {\n    display: inline-flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    min-width: 130px;\n\n    height: 50px;\n\n    padding: 0 22px;\n\n    border: 1px solid var(--wnsa-gold);\n\n    border-radius: 30px;\n\n    color: var(--wnsa-dark-teal);\n\n    text-decoration: none;\n\n    font-size: 12px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n\n    transition: 0.3s ease;\n}\n\n.wnsa-secondary-button:hover {\n    background: var(--wnsa-light-gold);\n}\n\n\n\/* =========================================\n   PRODUCT AREA\n   ========================================= *\/\n\n.wnsa-hero-product {\n    position: relative;\n\n    min-height: 520px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n}\n\n\n\/* LARGE CIRCLE *\/\n\n.wnsa-hero-circle {\n    position: absolute;\n\n    width: 470px;\n\n    height: 470px;\n\n    border-radius: 50%;\n\n    background: #EADAB7;\n\n    opacity: 0.7;\n}\n\n\n\/* SECOND CIRCLE *\/\n\n.wnsa-hero-circle::after {\n    content: \"\";\n\n    position: absolute;\n\n    width: 390px;\n\n    height: 390px;\n\n    top: 40px;\n\n    left: 40px;\n\n    border-radius: 50%;\n\n    border: 1px solid rgba(13, 124, 147, 0.25);\n}\n\n\n\/* PRODUCT IMAGE *\/\n\n.wnsa-product-image {\n    position: relative;\n\n    z-index: 3;\n\n    width: 330px;\n\n    transform: rotate(-3deg);\n\n    filter: drop-shadow(\n        0 25px 25px rgba(39, 56, 58, 0.18)\n    );\n\n    transition: transform 0.5s ease;\n}\n\n.wnsa-product-image:hover {\n    transform: rotate(0deg) translateY(-8px);\n}\n\n.wnsa-product-image img {\n    width: 100%;\n\n    height: auto;\n\n    display: block;\n\n    object-fit: contain;\n}\n\n\n\/* =========================================\n   PRODUCT LABEL\n   ========================================= *\/\n\n.wnsa-product-label {\n    position: absolute;\n\n    right: 15px;\n\n    bottom: 75px;\n\n    z-index: 5;\n\n    width: 145px;\n\n    padding: 18px;\n\n    background: #ffffff;\n\n    border-radius: 12px;\n\n    box-shadow:\n        0 12px 35px rgba(39, 56, 58, 0.12);\n\n    display: flex;\n\n    flex-direction: column;\n\n    gap: 5px;\n}\n\n.wnsa-label-small {\n    color: var(--wnsa-gold);\n\n    font-size: 9px;\n\n    font-weight: 700;\n\n    letter-spacing: 1.5px;\n}\n\n.wnsa-product-label strong {\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 15px;\n}\n\n.wnsa-label-weight {\n    color: #7A8584;\n\n    font-size: 11px;\n}\n\n\n\/* DECORATION *\/\n\n.wnsa-hero-decoration {\n    position: absolute;\n\n    top: 65px;\n\n    right: 65px;\n\n    z-index: 4;\n\n    color: var(--wnsa-gold);\n\n    font-size: 35px;\n\n    transform: rotate(15deg);\n}\n\n\n\/* =========================================\n   TRUST STRIP\n   ========================================= *\/\n\n.wnsa-hero-trust {\n    max-width: 1150px;\n\n    margin: 0 auto;\n\n    padding: 18px 30px;\n\n    border-top: 1px solid rgba(13, 124, 147, 0.15);\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: space-between;\n}\n\n.wnsa-trust-item {\n    display: flex;\n\n    align-items: center;\n\n    gap: 8px;\n}\n\n.wnsa-trust-item span {\n    color: var(--wnsa-gold);\n\n    font-size: 14px;\n}\n\n.wnsa-trust-item p {\n    margin: 0;\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 11px;\n\n    font-weight: 700;\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 900px) {\n\n    .wnsa-hero-container {\n        grid-template-columns: 1fr;\n\n        text-align: center;\n\n        padding: 60px 30px 40px;\n    }\n\n    .wnsa-hero-content {\n        max-width: 650px;\n\n        margin: 0 auto;\n    }\n\n    .wnsa-hero-description {\n        margin-left: auto;\n        margin-right: auto;\n    }\n\n    .wnsa-hero-benefits {\n        justify-content: center;\n    }\n\n    .wnsa-hero-buttons {\n        justify-content: center;\n    }\n\n    .wnsa-hero-product {\n        min-height: 470px;\n    }\n\n    .wnsa-hero-trust {\n        flex-wrap: wrap;\n\n        justify-content: center;\n\n        gap: 20px 40px;\n    }\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-hero {\n        min-height: auto;\n    }\n\n    .wnsa-hero-container {\n        padding: 45px 20px 25px;\n    }\n\n    .wnsa-hero h1 {\n        font-size: 52px;\n\n        letter-spacing: -2px;\n    }\n\n    .wnsa-hero-tagline {\n        font-size: 21px;\n    }\n\n    .wnsa-hero-description {\n        font-size: 14px;\n\n        line-height: 1.7;\n    }\n\n    .wnsa-hero-buttons {\n        flex-direction: column;\n\n        width: 100%;\n    }\n\n    .wnsa-primary-button,\n    .wnsa-secondary-button {\n        width: 100%;\n    }\n\n    .wnsa-hero-product {\n        min-height: 390px;\n    }\n\n    .wnsa-hero-circle {\n        width: 330px;\n        height: 330px;\n    }\n\n    .wnsa-hero-circle::after {\n        width: 270px;\n        height: 270px;\n    }\n\n    .wnsa-product-image {\n        width: 250px;\n    }\n\n    .wnsa-product-label {\n        right: 5px;\n        bottom: 35px;\n\n        width: 120px;\n\n        padding: 14px;\n    }\n\n    .wnsa-hero-decoration {\n        top: 35px;\n        right: 20px;\n    }\n\n    .wnsa-hero-trust {\n        padding: 20px;\n\n        display: grid;\n\n        grid-template-columns: 1fr 1fr;\n\n        gap: 15px;\n    }\n\n    .wnsa-trust-item p {\n        font-size: 10px;\n    }\n}\n\/* =========================================\n   WHY NOT SA - BENEFITS SECTION\n   ========================================= *\/\n\n.wnsa-benefits {\n    position: relative;\n\n    padding: 110px 30px;\n\n    background: #FFFDF8;\n\n    overflow: hidden;\n}\n\n\n\/* DECORATIVE BACKGROUND *\/\n\n.wnsa-benefits::before {\n    content: \"\";\n\n    position: absolute;\n\n    width: 350px;\n    height: 350px;\n\n    left: -180px;\n    top: 80px;\n\n    border-radius: 50%;\n\n    border: 1px solid rgba(13, 124, 147, 0.12);\n}\n\n.wnsa-benefits::after {\n    content: \"\";\n\n    position: absolute;\n\n    width: 220px;\n    height: 220px;\n\n    right: -100px;\n    bottom: 50px;\n\n    border-radius: 50%;\n\n    background: rgba(234, 218, 183, 0.35);\n}\n\n\n\/* =========================================\n   CONTAINER\n   ========================================= *\/\n\n.wnsa-benefits-container {\n    position: relative;\n\n    z-index: 2;\n\n    max-width: 1200px;\n\n    margin: 0 auto;\n}\n\n\n\/* =========================================\n   SECTION HEADING\n   ========================================= *\/\n\n.wnsa-section-heading {\n    max-width: 680px;\n\n    margin: 0 auto 65px;\n\n    text-align: center;\n}\n\n\n.wnsa-section-eyebrow {\n    display: inline-block;\n\n    margin-bottom: 15px;\n\n    color: var(--wnsa-teal);\n\n    font-family: Arial, sans-serif;\n\n    font-size: 11px;\n\n    font-weight: 700;\n\n    letter-spacing: 2.5px;\n}\n\n\n.wnsa-section-heading h2 {\n    margin: 0;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: clamp(40px, 5vw, 62px);\n\n    line-height: 1.05;\n\n    font-weight: 500;\n}\n\n\n.wnsa-section-heading h2 span {\n    display: block;\n\n    color: var(--wnsa-teal);\n\n    font-style: italic;\n}\n\n\n.wnsa-section-heading p {\n    max-width: 580px;\n\n    margin: 25px auto 0;\n\n    color: #6D7979;\n\n    font-family: Arial, sans-serif;\n\n    font-size: 15px;\n\n    line-height: 1.8;\n}\n\n\n\/* =========================================\n   BENEFITS GRID\n   ========================================= *\/\n\n.wnsa-benefits-grid {\n    display: grid;\n\n    grid-template-columns: repeat(4, 1fr);\n\n    gap: 18px;\n}\n\n\n\/* =========================================\n   BENEFIT CARD\n   ========================================= *\/\n\n.wnsa-benefit-card {\n    position: relative;\n\n    min-height: 330px;\n\n    padding: 35px 28px;\n\n    background: var(--wnsa-cream);\n\n    border: 1px solid rgba(13, 124, 147, 0.08);\n\n    border-radius: 18px;\n\n    overflow: hidden;\n\n    transition:\n        transform 0.35s ease,\n        box-shadow 0.35s ease;\n}\n\n\n.wnsa-benefit-card:hover {\n    transform: translateY(-8px);\n\n    box-shadow:\n        0 20px 45px rgba(39, 56, 58, 0.10);\n}\n\n\n\/* FEATURED CARD *\/\n\n.wnsa-benefit-featured {\n    background: var(--wnsa-dark-teal);\n}\n\n.wnsa-benefit-featured h3,\n.wnsa-benefit-featured p {\n    color: #ffffff;\n}\n\n.wnsa-benefit-featured a {\n    color: var(--wnsa-light-gold);\n}\n\n\n\/* NUMBER *\/\n\n.wnsa-benefit-number {\n    position: absolute;\n\n    top: 20px;\n    right: 25px;\n\n    color: rgba(13, 124, 147, 0.25);\n\n    font-family: Georgia, serif;\n\n    font-size: 12px;\n\n    font-weight: 700;\n\n    letter-spacing: 1px;\n}\n\n.wnsa-benefit-featured .wnsa-benefit-number {\n    color: rgba(255, 255, 255, 0.25);\n}\n\n\n\/* ICON *\/\n\n.wnsa-benefit-icon {\n    width: 55px;\n    height: 55px;\n\n    margin-bottom: 30px;\n\n    display: flex;\n\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 50%;\n\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 25px;\n}\n\n.wnsa-benefit-featured .wnsa-benefit-icon {\n    background: rgba(234, 218, 183, 0.18);\n\n    color: var(--wnsa-light-gold);\n}\n\n\n\/* TITLE *\/\n\n.wnsa-benefit-card h3 {\n    margin: 0 0 15px;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 25px;\n\n    font-weight: 500;\n}\n\n\n\/* TEXT *\/\n\n.wnsa-benefit-card p {\n    margin: 0 0 25px;\n\n    color: #687676;\n\n    font-family: Arial, sans-serif;\n\n    font-size: 13px;\n\n    line-height: 1.75;\n}\n\n\n\/* LINK *\/\n\n.wnsa-benefit-card a {\n    position: absolute;\n\n    left: 28px;\n    bottom: 28px;\n\n    color: var(--wnsa-teal);\n\n    text-decoration: none;\n\n    font-family: Arial, sans-serif;\n\n    font-size: 11px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n}\n\n.wnsa-benefit-card a:hover {\n    color: var(--wnsa-dark-teal);\n}\n\n\n\/* =========================================\n   BOTTOM STATEMENT\n   ========================================= *\/\n\n.wnsa-benefits-bottom {\n    display: flex;\n\n    align-items: center;\n\n    gap: 20px;\n\n    margin-top: 65px;\n}\n\n\n.wnsa-benefits-bottom p {\n    flex-shrink: 0;\n\n    margin: 0;\n\n    color: #899392;\n\n    font-size: 9px;\n\n    font-weight: 700;\n\n    letter-spacing: 2px;\n\n    text-align: center;\n}\n\n\n.wnsa-benefits-line {\n    width: 100%;\n\n    height: 1px;\n\n    background: rgba(13, 124, 147, 0.15);\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 1000px) {\n\n    .wnsa-benefits {\n        padding: 90px 25px;\n    }\n\n    .wnsa-benefits-grid {\n        grid-template-columns: repeat(2, 1fr);\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-benefits {\n        padding: 75px 20px;\n    }\n\n    .wnsa-section-heading {\n        margin-bottom: 45px;\n    }\n\n    .wnsa-section-heading h2 {\n        font-size: 42px;\n    }\n\n    .wnsa-section-heading p {\n        font-size: 14px;\n    }\n\n    .wnsa-benefits-grid {\n        grid-template-columns: 1fr;\n\n        gap: 15px;\n    }\n\n    .wnsa-benefit-card {\n        min-height: 300px;\n\n        padding: 30px 25px;\n    }\n\n    .wnsa-benefits-bottom {\n        display: none;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - PRODUCT SECTION\n   ========================================= *\/\n\n.wnsa-product-section {\n    position: relative;\n\n    padding: 115px 30px;\n\n    background: var(--wnsa-cream);\n\n    overflow: hidden;\n}\n\n\n\/* =========================================\n   CONTAINER\n   ========================================= *\/\n\n.wnsa-product-container {\n    max-width: 1180px;\n\n    margin: 0 auto;\n\n    display: grid;\n\n    grid-template-columns: 1fr 1fr;\n\n    align-items: center;\n\n    gap: 80px;\n}\n\n\n\/* =========================================\n   PRODUCT SHOWCASE\n   ========================================= *\/\n\n.wnsa-product-showcase {\n    position: relative;\n\n    min-height: 570px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n}\n\n\n\/* BACKGROUND CIRCLE *\/\n\n.wnsa-product-bg-circle {\n    position: absolute;\n\n    width: 500px;\n    height: 500px;\n\n    border-radius: 50%;\n\n    background: #EADAB7;\n\n    opacity: 0.65;\n}\n\n.wnsa-product-bg-circle::before {\n    content: \"\";\n\n    position: absolute;\n\n    inset: 30px;\n\n    border-radius: 50%;\n\n    border: 1px solid rgba(13, 124, 147, 0.25);\n}\n\n\n\/* PRODUCT IMAGE *\/\n\n.wnsa-main-product-image {\n    position: relative;\n\n    z-index: 3;\n\n    width: 370px;\n\n    filter: drop-shadow(\n        0 30px 25px rgba(39, 56, 58, 0.20)\n    );\n\n    transition: transform 0.5s ease;\n}\n\n.wnsa-main-product-image:hover {\n    transform: translateY(-10px) rotate(2deg);\n}\n\n.wnsa-main-product-image img {\n    display: block;\n\n    width: 100%;\n\n    height: auto;\n}\n\n\n\/* PRODUCT BADGE *\/\n\n.wnsa-product-badge {\n    position: absolute;\n\n    top: 45px;\n    left: 20px;\n\n    z-index: 5;\n\n    width: 95px;\n    height: 95px;\n\n    border-radius: 50%;\n\n    background: var(--wnsa-dark-teal);\n\n    color: #ffffff;\n\n    display: flex;\n\n    flex-direction: column;\n\n    align-items: center;\n\n    justify-content: center;\n\n    transform: rotate(-12deg);\n\n    box-shadow:\n        0 12px 25px rgba(39, 56, 58, 0.15);\n}\n\n.wnsa-product-badge span {\n    font-size: 9px;\n\n    letter-spacing: 2px;\n\n    color: var(--wnsa-light-gold);\n}\n\n.wnsa-product-badge strong {\n    font-family: Georgia, serif;\n\n    font-size: 13px;\n\n    letter-spacing: 0.5px;\n}\n\n\n\/* =========================================\n   PRODUCT INFORMATION\n   ========================================= *\/\n\n.wnsa-product-info {\n    max-width: 530px;\n}\n\n\n.wnsa-product-eyebrow {\n    display: inline-block;\n\n    margin-bottom: 15px;\n\n    color: var(--wnsa-teal);\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    letter-spacing: 2px;\n}\n\n\n.wnsa-product-info h2 {\n    margin: 0;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: clamp(42px, 5vw, 64px);\n\n    font-weight: 500;\n\n    line-height: 1.05;\n}\n\n.wnsa-product-info h2 span {\n    display: block;\n\n    color: var(--wnsa-teal);\n\n    font-style: italic;\n}\n\n\n\/* STARS *\/\n\n.wnsa-product-stars {\n    display: flex;\n\n    align-items: center;\n\n    gap: 12px;\n\n    margin: 22px 0;\n\n    color: var(--wnsa-gold);\n\n    font-size: 15px;\n\n    letter-spacing: 2px;\n}\n\n.wnsa-product-stars span {\n    color: #788483;\n\n    font-size: 10px;\n\n    letter-spacing: 0;\n\n    font-weight: 600;\n}\n\n\n\/* INTRO *\/\n\n.wnsa-product-intro {\n    margin: 0 0 28px;\n\n    color: #697676;\n\n    font-size: 15px;\n\n    line-height: 1.8;\n}\n\n\n\/* =========================================\n   PRODUCT FEATURES\n   ========================================= *\/\n\n.wnsa-product-features {\n    display: grid;\n\n    grid-template-columns: 1fr 1fr;\n\n    gap: 13px 25px;\n\n    padding-bottom: 28px;\n\n    border-bottom: 1px solid rgba(13, 124, 147, 0.13);\n}\n\n\n.wnsa-product-feature {\n    display: flex;\n\n    align-items: center;\n\n    gap: 9px;\n}\n\n.wnsa-product-feature span {\n    width: 21px;\n    height: 21px;\n\n    flex-shrink: 0;\n\n    display: flex;\n\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 50%;\n\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 11px;\n\n    font-weight: bold;\n}\n\n.wnsa-product-feature p {\n    margin: 0;\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 11px;\n\n    font-weight: 600;\n}\n\n\n\/* =========================================\n   PRICE\n   ========================================= *\/\n\n.wnsa-product-price-area {\n    display: flex;\n\n    align-items: center;\n\n    gap: 15px;\n\n    margin: 25px 0;\n}\n\n.wnsa-price-label {\n    color: #8B9492;\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    letter-spacing: 1px;\n}\n\n.wnsa-product-price {\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 30px;\n\n    font-weight: 500;\n}\n\n\n\/* =========================================\n   BUY AREA\n   ========================================= *\/\n\n.wnsa-product-buy {\n    display: flex;\n\n    align-items: center;\n\n    gap: 12px;\n}\n\n\n\/* QUANTITY *\/\n\n.wnsa-quantity {\n    height: 50px;\n\n    display: flex;\n\n    align-items: center;\n\n    border: 1px solid rgba(13, 124, 147, 0.25);\n\n    border-radius: 30px;\n\n    background: #ffffff;\n}\n\n.wnsa-quantity button {\n    width: 38px;\n\n    height: 48px;\n\n    border: none;\n\n    background: transparent;\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 18px;\n\n    cursor: pointer;\n}\n\n.wnsa-quantity-value {\n    min-width: 20px;\n\n    text-align: center;\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 13px;\n\n    font-weight: 700;\n}\n\n\n\/* ADD TO CART *\/\n\n.wnsa-add-to-cart {\n    flex: 1;\n\n    height: 50px;\n\n    padding: 0 25px;\n\n    border: none;\n\n    border-radius: 30px;\n\n    background: var(--wnsa-dark-teal);\n\n    color: #ffffff;\n\n    font-size: 11px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 1px;\n\n    cursor: pointer;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    gap: 15px;\n\n    transition: 0.3s ease;\n}\n\n.wnsa-add-to-cart:hover {\n    background: var(--wnsa-teal);\n\n    transform: translateY(-2px);\n}\n\n\n\/* =========================================\n   PRODUCT NOTES\n   ========================================= *\/\n\n.wnsa-product-notes {\n    display: flex;\n\n    align-items: flex-start;\n\n    gap: 10px;\n\n    margin-top: 20px;\n}\n\n.wnsa-product-notes span {\n    color: var(--wnsa-gold);\n\n    font-size: 14px;\n}\n\n.wnsa-product-notes p {\n    margin: 0;\n\n    color: #7D8786;\n\n    font-size: 10px;\n\n    line-height: 1.6;\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 900px) {\n\n    .wnsa-product-section {\n        padding: 90px 25px;\n    }\n\n    .wnsa-product-container {\n        grid-template-columns: 1fr;\n\n        gap: 50px;\n    }\n\n    .wnsa-product-info {\n        max-width: 650px;\n\n        margin: 0 auto;\n\n        text-align: center;\n    }\n\n    .wnsa-product-stars {\n        justify-content: center;\n    }\n\n    .wnsa-product-features {\n        text-align: left;\n    }\n\n    .wnsa-product-notes {\n        justify-content: center;\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-product-section {\n        padding: 75px 20px;\n    }\n\n    .wnsa-product-showcase {\n        min-height: 400px;\n    }\n\n    .wnsa-product-bg-circle {\n        width: 330px;\n        height: 330px;\n    }\n\n    .wnsa-product-bg-circle::before {\n        inset: 20px;\n    }\n\n    .wnsa-main-product-image {\n        width: 250px;\n    }\n\n    .wnsa-product-badge {\n        top: 20px;\n        left: 0;\n\n        width: 75px;\n        height: 75px;\n    }\n\n    .wnsa-product-badge span {\n        font-size: 7px;\n    }\n\n    .wnsa-product-badge strong {\n        font-size: 10px;\n    }\n\n    .wnsa-product-info h2 {\n        font-size: 42px;\n    }\n\n    .wnsa-product-features {\n        grid-template-columns: 1fr;\n\n        text-align: left;\n    }\n\n    .wnsa-product-buy {\n        flex-direction: column;\n\n        align-items: stretch;\n    }\n\n    .wnsa-quantity {\n        justify-content: center;\n    }\n\n    .wnsa-add-to-cart {\n        flex: none;\n\n        width: 100%;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - ABOUT SECTION\n   ========================================= *\/\n\n.wnsa-about {\n    position: relative;\n\n    padding: 120px 30px;\n\n    background: #FFFDF8;\n\n    overflow: hidden;\n}\n\n\n\/* =========================================\n   CONTAINER\n   ========================================= *\/\n\n.wnsa-about-container {\n    max-width: 1180px;\n\n    margin: 0 auto;\n\n    display: grid;\n\n    grid-template-columns: 0.95fr 1.05fr;\n\n    align-items: center;\n\n    gap: 90px;\n}\n\n\n\/* =========================================\n   VISUAL\n   ========================================= *\/\n\n.wnsa-about-visual {\n    position: relative;\n\n    min-height: 560px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n}\n\n\n\/* IMAGE FRAME *\/\n\n.wnsa-about-image {\n    position: relative;\n\n    width: 430px;\n    height: 500px;\n\n    overflow: hidden;\n\n    border-radius: 220px 220px 25px 25px;\n\n    background: var(--wnsa-light-gold);\n\n    box-shadow:\n        0 25px 60px rgba(39, 56, 58, 0.12);\n}\n\n.wnsa-about-image img {\n    width: 100%;\n    height: 100%;\n\n    display: block;\n\n    object-fit: cover;\n}\n\n\n\/* GOLD FRAME *\/\n\n.wnsa-about-image::after {\n    content: \"\";\n\n    position: absolute;\n\n    inset: 15px;\n\n    border: 1px solid rgba(255, 255, 255, 0.6);\n\n    border-radius: 210px 210px 18px 18px;\n\n    pointer-events: none;\n}\n\n\n\/* =========================================\n   BADGE\n   ========================================= *\/\n\n.wnsa-about-badge {\n    position: absolute;\n\n    right: 5px;\n    bottom: 55px;\n\n    width: 135px;\n    height: 135px;\n\n    border-radius: 50%;\n\n    background: var(--wnsa-dark-teal);\n\n    color: #ffffff;\n\n    display: flex;\n\n    flex-direction: column;\n\n    align-items: center;\n    justify-content: center;\n\n    transform: rotate(8deg);\n\n    box-shadow:\n        0 15px 35px rgba(39, 56, 58, 0.18);\n}\n\n.wnsa-about-badge span {\n    color: var(--wnsa-light-gold);\n\n    font-size: 9px;\n\n    letter-spacing: 2px;\n}\n\n.wnsa-about-badge strong {\n    font-family: Georgia, serif;\n\n    font-size: 28px;\n\n    line-height: 1;\n}\n\n.wnsa-about-badge small {\n    margin-top: 7px;\n\n    font-size: 7px;\n\n    letter-spacing: 1px;\n}\n\n\n\/* =========================================\n   CONTENT\n   ========================================= *\/\n\n.wnsa-about-content {\n    max-width: 560px;\n}\n\n\n.wnsa-about-content h2 {\n    margin: 0 0 25px;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: clamp(45px, 5vw, 68px);\n\n    font-weight: 500;\n\n    line-height: 1.05;\n}\n\n.wnsa-about-content h2 span {\n    display: block;\n\n    color: var(--wnsa-teal);\n\n    font-style: italic;\n}\n\n\n\/* LEAD *\/\n\n.wnsa-about-lead {\n    margin-bottom: 15px !important;\n\n    color: var(--wnsa-dark-teal) !important;\n\n    font-family: Georgia, serif;\n\n    font-size: 21px !important;\n\n    line-height: 1.5 !important;\n}\n\n\n\/* BODY *\/\n\n.wnsa-about-content > p {\n    color: #6D7979;\n\n    font-size: 14px;\n\n    line-height: 1.8;\n}\n\n\n\/* =========================================\n   VALUES\n   ========================================= *\/\n\n.wnsa-about-values {\n    margin: 35px 0;\n\n    border-top: 1px solid rgba(13, 124, 147, 0.12);\n}\n\n\n.wnsa-about-value {\n    display: flex;\n\n    gap: 20px;\n\n    padding: 17px 0;\n\n    border-bottom: 1px solid rgba(13, 124, 147, 0.12);\n}\n\n\n.wnsa-about-value > span {\n    flex-shrink: 0;\n\n    color: var(--wnsa-gold);\n\n    font-family: Georgia, serif;\n\n    font-size: 12px;\n\n    font-weight: 700;\n}\n\n\n.wnsa-about-value h3 {\n    margin: 0 0 5px;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 18px;\n\n    font-weight: 500;\n}\n\n\n.wnsa-about-value p {\n    margin: 0;\n\n    color: #7B8584;\n\n    font-size: 11px;\n\n    line-height: 1.6;\n}\n\n\n\/* =========================================\n   BUTTON\n   ========================================= *\/\n\n.wnsa-about-button {\n    display: inline-flex;\n\n    align-items: center;\n\n    gap: 15px;\n\n    height: 48px;\n\n    padding: 0 25px;\n\n    border-radius: 30px;\n\n    background: var(--wnsa-dark-teal);\n\n    color: #ffffff;\n\n    text-decoration: none;\n\n    font-size: 11px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.7px;\n\n    transition: 0.3s ease;\n}\n\n\n.wnsa-about-button:hover {\n    background: var(--wnsa-teal);\n\n    transform: translateY(-2px);\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 900px) {\n\n    .wnsa-about {\n        padding: 90px 25px;\n    }\n\n    .wnsa-about-container {\n        grid-template-columns: 1fr;\n\n        gap: 60px;\n    }\n\n    .wnsa-about-visual {\n        min-height: 500px;\n    }\n\n    .wnsa-about-content {\n        max-width: 650px;\n\n        margin: 0 auto;\n\n        text-align: center;\n    }\n\n    .wnsa-about-values {\n        text-align: left;\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-about {\n        padding: 75px 20px;\n    }\n\n    .wnsa-about-visual {\n        min-height: 410px;\n    }\n\n    .wnsa-about-image {\n        width: 300px;\n        height: 370px;\n    }\n\n    .wnsa-about-badge {\n        right: 5px;\n        bottom: 25px;\n\n        width: 105px;\n        height: 105px;\n    }\n\n    .wnsa-about-badge strong {\n        font-size: 22px;\n    }\n\n    .wnsa-about-content h2 {\n        font-size: 45px;\n    }\n\n    .wnsa-about-lead {\n        font-size: 19px !important;\n    }\n\n    .wnsa-about-button {\n        width: 100%;\n\n        justify-content: center;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - WHAT'S INSIDE SECTION\n   ========================================= *\/\n\n.wnsa-inside {\n    position: relative;\n\n    padding: 115px 30px;\n\n    background: var(--wnsa-dark-teal);\n\n    overflow: hidden;\n}\n\n\n\/* DECORATIVE CIRCLES *\/\n\n.wnsa-inside::before {\n    content: \"\";\n\n    position: absolute;\n\n    width: 500px;\n    height: 500px;\n\n    left: -250px;\n    top: 100px;\n\n    border-radius: 50%;\n\n    border: 1px solid rgba(234, 218, 183, 0.15);\n}\n\n.wnsa-inside::after {\n    content: \"\";\n\n    position: absolute;\n\n    width: 400px;\n    height: 400px;\n\n    right: -200px;\n    bottom: -100px;\n\n    border-radius: 50%;\n\n    background: rgba(234, 218, 183, 0.08);\n}\n\n\n\/* =========================================\n   CONTAINER\n   ========================================= *\/\n\n.wnsa-inside-container {\n    position: relative;\n\n    z-index: 2;\n\n    max-width: 1200px;\n\n    margin: 0 auto;\n}\n\n\n\/* =========================================\n   HEADING\n   ========================================= *\/\n\n.wnsa-inside .wnsa-section-heading {\n    max-width: 700px;\n}\n\n.wnsa-inside .wnsa-section-eyebrow {\n    color: var(--wnsa-light-gold);\n}\n\n.wnsa-inside .wnsa-section-heading h2 {\n    color: #ffffff;\n}\n\n.wnsa-inside .wnsa-section-heading h2 span {\n    color: var(--wnsa-light-gold);\n}\n\n.wnsa-inside .wnsa-section-heading p {\n    color: rgba(255, 255, 255, 0.68);\n}\n\n\n\/* =========================================\n   QUALITY GRID\n   ========================================= *\/\n\n.wnsa-quality-grid {\n    display: grid;\n\n    grid-template-columns: 1fr 1fr 1fr;\n\n    align-items: center;\n\n    gap: 45px;\n\n    margin-top: 70px;\n}\n\n\n\/* =========================================\n   QUALITY ITEMS\n   ========================================= *\/\n\n.wnsa-quality-list {\n    display: flex;\n\n    flex-direction: column;\n\n    gap: 38px;\n}\n\n\n.wnsa-quality-item {\n    display: flex;\n\n    align-items: flex-start;\n\n    gap: 15px;\n}\n\n\n.wnsa-quality-icon {\n    width: 32px;\n    height: 32px;\n\n    flex-shrink: 0;\n\n    display: flex;\n\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 50%;\n\n    background: rgba(234, 218, 183, 0.15);\n\n    border: 1px solid rgba(234, 218, 183, 0.35);\n\n    color: var(--wnsa-light-gold);\n\n    font-size: 13px;\n\n    font-weight: bold;\n}\n\n\n.wnsa-quality-item h3 {\n    margin: 0 0 7px;\n\n    color: #ffffff;\n\n    font-family: Georgia, serif;\n\n    font-size: 19px;\n\n    font-weight: 500;\n}\n\n\n.wnsa-quality-item p {\n    margin: 0;\n\n    color: rgba(255, 255, 255, 0.58);\n\n    font-size: 11px;\n\n    line-height: 1.7;\n}\n\n\n\/* =========================================\n   CENTRE PRODUCT\n   ========================================= *\/\n\n.wnsa-quality-product {\n    position: relative;\n\n    min-height: 470px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n}\n\n\n.wnsa-quality-circle {\n    position: absolute;\n\n    width: 390px;\n    height: 390px;\n\n    border-radius: 50%;\n\n    background: var(--wnsa-light-gold);\n\n    opacity: 0.9;\n}\n\n\n.wnsa-quality-circle::after {\n    content: \"\";\n\n    position: absolute;\n\n    inset: 18px;\n\n    border-radius: 50%;\n\n    border: 1px solid rgba(7, 92, 104, 0.25);\n}\n\n\n.wnsa-quality-product img {\n    position: relative;\n\n    z-index: 3;\n\n    width: 290px;\n\n    height: auto;\n\n    filter:\n        drop-shadow(\n            0 30px 25px rgba(0, 0, 0, 0.25)\n        );\n\n    transition: transform 0.5s ease;\n}\n\n\n.wnsa-quality-product img:hover {\n    transform: translateY(-8px) rotate(2deg);\n}\n\n\n\/* PRODUCT STAMP *\/\n\n.wnsa-quality-stamp {\n    position: absolute;\n\n    right: 15px;\n    bottom: 60px;\n\n    z-index: 5;\n\n    width: 85px;\n    height: 85px;\n\n    display: flex;\n\n    flex-direction: column;\n\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 50%;\n\n    background: var(--wnsa-teal);\n\n    color: #ffffff;\n\n    transform: rotate(8deg);\n}\n\n.wnsa-quality-stamp span {\n    font-size: 8px;\n\n    letter-spacing: 2px;\n}\n\n.wnsa-quality-stamp strong {\n    margin-top: 3px;\n\n    font-family: Georgia, serif;\n\n    font-size: 18px;\n}\n\n\n\/* =========================================\n   FREE FROM\n   ========================================= *\/\n\n.wnsa-free-from {\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    gap: 30px;\n\n    margin-top: 65px;\n\n    padding-top: 25px;\n\n    border-top: 1px solid rgba(255, 255, 255, 0.15);\n}\n\n\n.wnsa-free-from > span {\n    color: var(--wnsa-light-gold);\n\n    font-size: 9px;\n\n    font-weight: 700;\n\n    letter-spacing: 2px;\n}\n\n\n.wnsa-free-items {\n    display: flex;\n\n    align-items: center;\n\n    flex-wrap: wrap;\n\n    justify-content: center;\n\n    gap: 20px;\n}\n\n\n.wnsa-free-items p {\n    position: relative;\n\n    margin: 0;\n\n    color: rgba(255, 255, 255, 0.7);\n\n    font-size: 10px;\n}\n\n\n.wnsa-free-items p:not(:last-child)::after {\n    content: \"\u2022\";\n\n    position: absolute;\n\n    right: -12px;\n\n    color: var(--wnsa-gold);\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 950px) {\n\n    .wnsa-inside {\n        padding: 90px 25px;\n    }\n\n    .wnsa-quality-grid {\n        grid-template-columns: 1fr;\n\n        gap: 45px;\n    }\n\n    .wnsa-quality-list {\n        display: grid;\n\n        grid-template-columns: 1fr 1fr;\n\n        gap: 30px;\n    }\n\n    .wnsa-quality-product {\n        order: -1;\n\n        min-height: 430px;\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-inside {\n        padding: 75px 20px;\n    }\n\n    .wnsa-quality-grid {\n        margin-top: 45px;\n    }\n\n    .wnsa-quality-list {\n        grid-template-columns: 1fr;\n\n        gap: 25px;\n    }\n\n    .wnsa-quality-product {\n        min-height: 350px;\n    }\n\n    .wnsa-quality-circle {\n        width: 300px;\n        height: 300px;\n    }\n\n    .wnsa-quality-product img {\n        width: 220px;\n    }\n\n    .wnsa-quality-stamp {\n        right: 5px;\n        bottom: 30px;\n\n        width: 70px;\n        height: 70px;\n    }\n\n    .wnsa-quality-stamp strong {\n        font-size: 15px;\n    }\n\n    .wnsa-free-from {\n        flex-direction: column;\n\n        gap: 15px;\n\n        text-align: center;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - HOW TO USE SECTION\n   ========================================= *\/\n\n.wnsa-how-to {\n    position: relative;\n\n    padding: 115px 30px;\n\n    background: #FFFDF8;\n\n    overflow: hidden;\n}\n\n\n\/* =========================================\n   CONTAINER\n   ========================================= *\/\n\n.wnsa-how-container {\n    max-width: 1200px;\n\n    margin: 0 auto;\n}\n\n\n\/* =========================================\n   HEADING\n   ========================================= *\/\n\n.wnsa-how-to .wnsa-section-heading {\n    margin-bottom: 65px;\n}\n\n\n\/* =========================================\n   HOW TO GRID\n   ========================================= *\/\n\n.wnsa-how-grid {\n    display: grid;\n\n    grid-template-columns: repeat(4, 1fr);\n\n    gap: 18px;\n}\n\n\n\/* =========================================\n   HOW TO CARD\n   ========================================= *\/\n\n.wnsa-how-card {\n    position: relative;\n\n    min-height: 310px;\n\n    padding: 35px 28px;\n\n    background: var(--wnsa-cream);\n\n    border-radius: 18px;\n\n    border: 1px solid rgba(13, 124, 147, 0.08);\n\n    transition:\n        transform 0.35s ease,\n        box-shadow 0.35s ease;\n}\n\n\n.wnsa-how-card:hover {\n    transform: translateY(-7px);\n\n    box-shadow:\n        0 20px 40px rgba(39, 56, 58, 0.10);\n}\n\n\n\/* NUMBER *\/\n\n.wnsa-how-number {\n    position: absolute;\n\n    top: 20px;\n    right: 22px;\n\n    color: rgba(13, 124, 147, 0.22);\n\n    font-family: Georgia, serif;\n\n    font-size: 12px;\n\n    font-weight: 700;\n}\n\n\n\/* ICON *\/\n\n.wnsa-how-icon {\n    width: 58px;\n    height: 58px;\n\n    margin-bottom: 30px;\n\n    display: flex;\n\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 50%;\n\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 24px;\n}\n\n\n\/* TITLE *\/\n\n.wnsa-how-card h3 {\n    margin: 0 0 14px;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 23px;\n\n    font-weight: 500;\n}\n\n\n\/* TEXT *\/\n\n.wnsa-how-card p {\n    margin: 0;\n\n    color: #707C7B;\n\n    font-size: 12px;\n\n    line-height: 1.75;\n}\n\n\n\/* =========================================\n   CTA\n   ========================================= *\/\n\n.wnsa-how-cta {\n    margin-top: 55px;\n\n    padding: 30px 35px;\n\n    border-radius: 18px;\n\n    background: var(--wnsa-dark-teal);\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: space-between;\n\n    gap: 30px;\n}\n\n\n.wnsa-how-cta span {\n    color: var(--wnsa-light-gold);\n\n    font-size: 9px;\n\n    font-weight: 700;\n\n    letter-spacing: 2px;\n}\n\n\n.wnsa-how-cta h3 {\n    margin: 8px 0 0;\n\n    color: #ffffff;\n\n    font-family: Georgia, serif;\n\n    font-size: 24px;\n\n    font-weight: 500;\n}\n\n\n\/* CTA BUTTON *\/\n\n.wnsa-how-cta a {\n    flex-shrink: 0;\n\n    display: inline-flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    gap: 12px;\n\n    height: 48px;\n\n    padding: 0 25px;\n\n    border-radius: 30px;\n\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n\n    text-decoration: none;\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n\n    transition: 0.3s ease;\n}\n\n\n.wnsa-how-cta a:hover {\n    background: #ffffff;\n\n    transform: translateY(-2px);\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 950px) {\n\n    .wnsa-how-to {\n        padding: 90px 25px;\n    }\n\n    .wnsa-how-grid {\n        grid-template-columns: repeat(2, 1fr);\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-how-to {\n        padding: 75px 20px;\n    }\n\n    .wnsa-how-grid {\n        grid-template-columns: 1fr;\n\n        gap: 15px;\n    }\n\n    .wnsa-how-card {\n        min-height: 260px;\n    }\n\n    .wnsa-how-cta {\n        flex-direction: column;\n\n        align-items: flex-start;\n\n        padding: 25px;\n    }\n\n    .wnsa-how-cta h3 {\n        font-size: 21px;\n    }\n\n    .wnsa-how-cta a {\n        width: 100%;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - TESTIMONIALS SECTION\n   ========================================= *\/\n\n.wnsa-testimonials {\n    position: relative;\n\n    padding: 115px 30px;\n\n    background: var(--wnsa-cream);\n\n    overflow: hidden;\n}\n\n\n\/* DECORATIVE CIRCLE *\/\n\n.wnsa-testimonials::before {\n    content: \"\";\n\n    position: absolute;\n\n    width: 450px;\n    height: 450px;\n\n    right: -220px;\n    top: 100px;\n\n    border-radius: 50%;\n\n    border: 1px solid rgba(13, 124, 147, 0.12);\n}\n\n\n\/* =========================================\n   CONTAINER\n   ========================================= *\/\n\n.wnsa-testimonials-container {\n    position: relative;\n\n    z-index: 2;\n\n    max-width: 1180px;\n\n    margin: 0 auto;\n}\n\n\n\/* =========================================\n   TESTIMONIAL GRID\n   ========================================= *\/\n\n.wnsa-testimonials-grid {\n    display: grid;\n\n    grid-template-columns: repeat(3, 1fr);\n\n    gap: 20px;\n}\n\n\n\/* =========================================\n   CARD\n   ========================================= *\/\n\n.wnsa-testimonial-card {\n    position: relative;\n\n    min-height: 330px;\n\n    padding: 38px 32px;\n\n    background: #FFFDF8;\n\n    border-radius: 20px;\n\n    border: 1px solid rgba(13, 124, 147, 0.08);\n\n    box-shadow:\n        0 10px 30px rgba(39, 56, 58, 0.04);\n\n    transition:\n        transform 0.35s ease,\n        box-shadow 0.35s ease;\n}\n\n\n.wnsa-testimonial-card:hover {\n    transform: translateY(-7px);\n\n    box-shadow:\n        0 20px 45px rgba(39, 56, 58, 0.10);\n}\n\n\n\/* FEATURED *\/\n\n.wnsa-testimonial-featured {\n    background: var(--wnsa-dark-teal);\n\n    transform: translateY(-15px);\n}\n\n.wnsa-testimonial-featured:hover {\n    transform: translateY(-22px);\n}\n\n\n\/* =========================================\n   STARS\n   ========================================= *\/\n\n.wnsa-testimonial-stars {\n    color: var(--wnsa-gold);\n\n    font-size: 15px;\n\n    letter-spacing: 3px;\n\n    margin-bottom: 25px;\n}\n\n\n\/* =========================================\n   QUOTE\n   ========================================= *\/\n\n.wnsa-testimonial-quote {\n    position: absolute;\n\n    top: 15px;\n    right: 25px;\n\n    color: rgba(234, 218, 183, 0.2);\n\n    font-family: Georgia, serif;\n\n    font-size: 80px;\n\n    line-height: 1;\n}\n\n\n\/* =========================================\n   REVIEW TEXT\n   ========================================= *\/\n\n.wnsa-testimonial-text {\n    margin: 0;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 19px;\n\n    line-height: 1.65;\n}\n\n.wnsa-testimonial-featured .wnsa-testimonial-text {\n    color: #ffffff;\n}\n\n\n\/* =========================================\n   AUTHOR\n   ========================================= *\/\n\n.wnsa-testimonial-author {\n    position: absolute;\n\n    left: 32px;\n    bottom: 30px;\n\n    display: flex;\n\n    align-items: center;\n\n    gap: 12px;\n}\n\n\n.wnsa-author-avatar {\n    width: 38px;\n    height: 38px;\n\n    border-radius: 50%;\n\n    display: flex;\n\n    align-items: center;\n    justify-content: center;\n\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 15px;\n\n    font-weight: 600;\n}\n\n\n.wnsa-testimonial-author strong {\n    display: block;\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 12px;\n}\n\n.wnsa-testimonial-featured .wnsa-testimonial-author strong {\n    color: #ffffff;\n}\n\n\n.wnsa-testimonial-author span {\n    display: block;\n\n    margin-top: 3px;\n\n    color: #8A9493;\n\n    font-size: 9px;\n}\n\n\n\/* =========================================\n   REVIEW CTA\n   ========================================= *\/\n\n.wnsa-review-cta {\n    margin-top: 55px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    gap: 15px;\n\n    flex-wrap: wrap;\n}\n\n\n.wnsa-review-cta > span {\n    color: var(--wnsa-gold);\n\n    font-size: 14px;\n\n    letter-spacing: 2px;\n}\n\n\n.wnsa-review-cta p {\n    margin: 0;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 17px;\n}\n\n\n.wnsa-review-cta a {\n    color: var(--wnsa-teal);\n\n    text-decoration: none;\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n}\n\n.wnsa-review-cta a:hover {\n    color: var(--wnsa-dark-teal);\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 900px) {\n\n    .wnsa-testimonials {\n        padding: 90px 25px;\n    }\n\n    .wnsa-testimonials-grid {\n        grid-template-columns: 1fr;\n\n        max-width: 650px;\n\n        margin: 0 auto;\n    }\n\n    .wnsa-testimonial-featured {\n        transform: none;\n    }\n\n    .wnsa-testimonial-featured:hover {\n        transform: translateY(-7px);\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-testimonials {\n        padding: 75px 20px;\n    }\n\n    .wnsa-testimonial-card {\n        min-height: 300px;\n\n        padding: 30px 25px;\n    }\n\n    .wnsa-testimonial-text {\n        font-size: 17px;\n    }\n\n    .wnsa-testimonial-author {\n        left: 25px;\n        bottom: 25px;\n    }\n\n    .wnsa-review-cta {\n        flex-direction: column;\n\n        text-align: center;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - FAQ SECTION\n   ========================================= *\/\n\n.wnsa-faq {\n    padding: 115px 30px;\n\n    background: #FFFDF8;\n}\n\n\n\/* =========================================\n   CONTAINER\n   ========================================= *\/\n\n.wnsa-faq-container {\n    max-width: 1150px;\n\n    margin: 0 auto;\n\n    display: grid;\n\n    grid-template-columns: 0.8fr 1.2fr;\n\n    gap: 90px;\n\n    align-items: start;\n}\n\n\n\/* =========================================\n   INTRO\n   ========================================= *\/\n\n.wnsa-faq-intro {\n    position: sticky;\n\n    top: 100px;\n}\n\n\n.wnsa-faq-intro h2 {\n    margin: 0 0 22px;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: clamp(45px, 5vw, 65px);\n\n    font-weight: 500;\n\n    line-height: 1.05;\n}\n\n\n.wnsa-faq-intro h2 span {\n    display: block;\n\n    color: var(--wnsa-teal);\n\n    font-style: italic;\n}\n\n\n.wnsa-faq-intro > p {\n    max-width: 370px;\n\n    margin: 0 0 30px;\n\n    color: #6D7979;\n\n    font-size: 14px;\n\n    line-height: 1.8;\n}\n\n\n\/* CONTACT BUTTON *\/\n\n.wnsa-faq-contact {\n    display: inline-flex;\n\n    align-items: center;\n\n    gap: 12px;\n\n    color: var(--wnsa-teal);\n\n    text-decoration: none;\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n}\n\n.wnsa-faq-contact:hover {\n    color: var(--wnsa-dark-teal);\n}\n\n\n\/* =========================================\n   FAQ LIST\n   ========================================= *\/\n\n.wnsa-faq-list {\n    border-top: 1px solid rgba(13, 124, 147, 0.15);\n}\n\n\n\/* =========================================\n   FAQ ITEM\n   ========================================= *\/\n\n.wnsa-faq-item {\n    border-bottom: 1px solid rgba(13, 124, 147, 0.15);\n}\n\n\n\/* =========================================\n   QUESTION\n   ========================================= *\/\n\n.wnsa-faq-question {\n    width: 100%;\n\n    min-height: 75px;\n\n    padding: 20px 5px;\n\n    border: none;\n\n    background: transparent;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: space-between;\n\n    gap: 25px;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 18px;\n\n    text-align: left;\n\n    cursor: pointer;\n}\n\n\n.wnsa-faq-question b {\n    width: 30px;\n    height: 30px;\n\n    flex-shrink: 0;\n\n    display: flex;\n\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 50%;\n\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Arial, sans-serif;\n\n    font-size: 17px;\n\n    font-weight: 400;\n}\n\n\n\/* =========================================\n   ANSWER\n   ========================================= *\/\n\n.wnsa-faq-answer {\n    display: none;\n\n    padding: 0 50px 25px 5px;\n}\n\n\n.wnsa-faq-answer p {\n    margin: 0;\n\n    color: #707C7B;\n\n    font-family: Arial, sans-serif;\n\n    font-size: 13px;\n\n    line-height: 1.8;\n}\n\n\n\/* ACTIVE *\/\n\n.wnsa-faq-item.active .wnsa-faq-answer {\n    display: block;\n}\n\n.wnsa-faq-item.active .wnsa-faq-question {\n    color: var(--wnsa-teal);\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 850px) {\n\n    .wnsa-faq {\n        padding: 85px 25px;\n    }\n\n    .wnsa-faq-container {\n        grid-template-columns: 1fr;\n\n        gap: 50px;\n    }\n\n    .wnsa-faq-intro {\n        position: relative;\n\n        top: auto;\n\n        text-align: center;\n    }\n\n    .wnsa-faq-intro > p {\n        margin-left: auto;\n        margin-right: auto;\n    }\n\n    .wnsa-faq-contact {\n        justify-content: center;\n    }\n\n}\n\n\n@media (max-width: 600px) {\n\n    .wnsa-faq {\n        padding: 70px 20px;\n    }\n\n    .wnsa-faq-intro h2 {\n        font-size: 45px;\n    }\n\n    .wnsa-faq-question {\n        min-height: 68px;\n\n        font-size: 16px;\n    }\n\n    .wnsa-faq-answer {\n        padding-right: 35px;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - FINAL CTA\n   ========================================= *\/\n\n.wnsa-final-cta {\n    position: relative;\n\n    padding: 100px 30px;\n\n    background: var(--wnsa-dark-teal);\n\n    overflow: hidden;\n}\n\n\n\/* DECORATIVE BACKGROUND *\/\n\n.wnsa-final-cta::before {\n    content: \"\";\n\n    position: absolute;\n\n    width: 600px;\n    height: 600px;\n\n    left: -300px;\n    top: -250px;\n\n    border-radius: 50%;\n\n    border: 1px solid rgba(234, 218, 183, 0.12);\n}\n\n\n.wnsa-final-cta::after {\n    content: \"\";\n\n    position: absolute;\n\n    width: 450px;\n    height: 450px;\n\n    right: -220px;\n    bottom: -250px;\n\n    border-radius: 50%;\n\n    background: rgba(234, 218, 183, 0.08);\n}\n\n\n\/* =========================================\n   CONTAINER\n   ========================================= *\/\n\n.wnsa-final-cta-container {\n    position: relative;\n\n    z-index: 2;\n\n    max-width: 1150px;\n\n    min-height: 470px;\n\n    margin: 0 auto;\n\n    display: grid;\n\n    grid-template-columns: 1fr 0.9fr;\n\n    align-items: center;\n\n    gap: 50px;\n}\n\n\n\/* =========================================\n   CONTENT\n   ========================================= *\/\n\n.wnsa-final-cta-content {\n    max-width: 600px;\n}\n\n\n.wnsa-final-eyebrow {\n    display: inline-block;\n\n    margin-bottom: 20px;\n\n    color: var(--wnsa-light-gold);\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    letter-spacing: 2.5px;\n}\n\n\n.wnsa-final-cta h2 {\n    margin: 0 0 25px;\n\n    color: #ffffff;\n\n    font-family: Georgia, serif;\n\n    font-size: clamp(50px, 6vw, 78px);\n\n    font-weight: 500;\n\n    line-height: 0.98;\n\n    letter-spacing: -2px;\n}\n\n\n.wnsa-final-cta h2 span {\n    display: block;\n\n    color: var(--wnsa-light-gold);\n\n    font-style: italic;\n}\n\n\n.wnsa-final-cta-content > p {\n    max-width: 500px;\n\n    margin: 0 0 32px;\n\n    color: rgba(255, 255, 255, 0.68);\n\n    font-size: 14px;\n\n    line-height: 1.8;\n}\n\n\n\/* =========================================\n   BUTTON\n   ========================================= *\/\n\n.wnsa-final-button {\n    display: inline-flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    gap: 15px;\n\n    min-width: 180px;\n\n    height: 52px;\n\n    padding: 0 28px;\n\n    border-radius: 30px;\n\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n\n    text-decoration: none;\n\n    font-size: 11px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n\n    transition: all 0.3s ease;\n}\n\n\n.wnsa-final-button:hover {\n    background: #ffffff;\n\n    transform: translateY(-3px);\n}\n\n\n\/* =========================================\n   PRODUCT\n   ========================================= *\/\n\n.wnsa-final-product {\n    position: relative;\n\n    min-height: 470px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n}\n\n\n\/* CIRCLE *\/\n\n.wnsa-final-circle {\n    position: absolute;\n\n    width: 420px;\n    height: 420px;\n\n    border-radius: 50%;\n\n    background: var(--wnsa-light-gold);\n\n    opacity: 0.95;\n}\n\n\n.wnsa-final-circle::after {\n    content: \"\";\n\n    position: absolute;\n\n    inset: 18px;\n\n    border-radius: 50%;\n\n    border: 1px solid rgba(7, 92, 104, 0.25);\n}\n\n\n\/* PRODUCT IMAGE *\/\n\n.wnsa-final-product img {\n    position: relative;\n\n    z-index: 3;\n\n    width: 310px;\n\n    height: auto;\n\n    filter:\n        drop-shadow(\n            0 30px 30px rgba(0, 0, 0, 0.28)\n        );\n\n    transform: rotate(-4deg);\n\n    transition: transform 0.5s ease;\n}\n\n\n.wnsa-final-product img:hover {\n    transform: rotate(0deg) translateY(-10px);\n}\n\n\n\/* =========================================\n   SPARKLES\n   ========================================= *\/\n\n.wnsa-final-sparkle {\n    position: absolute;\n\n    z-index: 4;\n\n    color: var(--wnsa-light-gold);\n\n    font-size: 30px;\n}\n\n\n.sparkle-one {\n    top: 65px;\n\n    right: 40px;\n\n    transform: rotate(15deg);\n}\n\n\n.sparkle-two {\n    bottom: 65px;\n\n    left: 40px;\n\n    font-size: 20px;\n\n    transform: rotate(-20deg);\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 900px) {\n\n    .wnsa-final-cta {\n        padding: 90px 25px;\n    }\n\n    .wnsa-final-cta-container {\n        grid-template-columns: 1fr;\n\n        text-align: center;\n\n        gap: 40px;\n    }\n\n    .wnsa-final-cta-content {\n        max-width: 650px;\n\n        margin: 0 auto;\n    }\n\n    .wnsa-final-cta-content > p {\n        margin-left: auto;\n\n        margin-right: auto;\n    }\n\n    .wnsa-final-product {\n        min-height: 400px;\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-final-cta {\n        padding: 75px 20px;\n    }\n\n    .wnsa-final-cta h2 {\n        font-size: 50px;\n\n        letter-spacing: -1px;\n    }\n\n    .wnsa-final-product {\n        min-height: 350px;\n    }\n\n    .wnsa-final-circle {\n        width: 300px;\n        height: 300px;\n    }\n\n    .wnsa-final-product img {\n        width: 225px;\n    }\n\n    .wnsa-final-button {\n        width: 100%;\n    }\n\n    .sparkle-one {\n        right: 10px;\n    }\n\n    .sparkle-two {\n        left: 10px;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - FOOTER\n   ========================================= *\/\n\n.wnsa-footer {\n    background: #073F48;\n\n    color: #ffffff;\n\n    padding: 80px 30px 25px;\n}\n\n\n\/* =========================================\n   MAIN FOOTER\n   ========================================= *\/\n\n.wnsa-footer-container {\n    max-width: 1180px;\n\n    margin: 0 auto;\n\n    display: grid;\n\n    grid-template-columns: 1.5fr 1fr 1fr 1.2fr;\n\n    gap: 60px;\n\n    padding-bottom: 60px;\n\n    border-bottom: 1px solid rgba(255, 255, 255, 0.12);\n}\n\n\n\/* =========================================\n   BRAND\n   ========================================= *\/\n\n.wnsa-footer-brand {\n    max-width: 300px;\n}\n\n\n.wnsa-footer-logo {\n    display: inline-block;\n\n    line-height: 0;\n\n    margin-bottom: 20px;\n\n    background: #ffffff;\n\n    padding: 8px 12px;\n\n    border-radius: 8px;\n}\n\n\n.wnsa-footer-logo img {\n    display: block;\n\n    width: 125px;\n\n    height: auto;\n}\n\n\n.wnsa-footer-brand > p {\n    margin: 0 0 25px;\n\n    color: rgba(255, 255, 255, 0.62);\n\n    font-size: 12px;\n\n    line-height: 1.8;\n}\n\n\n\/* =========================================\n   SOCIALS\n   ========================================= *\/\n\n.wnsa-footer-socials {\n    display: flex;\n\n    gap: 9px;\n}\n\n\n.wnsa-footer-socials a {\n    width: 34px;\n    height: 34px;\n\n    display: flex;\n\n    align-items: center;\n    justify-content: center;\n\n    border: 1px solid rgba(234, 218, 183, 0.35);\n\n    border-radius: 50%;\n\n    color: var(--wnsa-light-gold);\n\n    text-decoration: none;\n\n    font-size: 13px;\n\n    transition: 0.3s ease;\n}\n\n\n.wnsa-footer-socials a:hover {\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n\n    border-color: var(--wnsa-light-gold);\n}\n\n\n\/* =========================================\n   FOOTER COLUMNS\n   ========================================= *\/\n\n.wnsa-footer-column {\n    display: flex;\n\n    flex-direction: column;\n\n    align-items: flex-start;\n}\n\n\n.wnsa-footer-column h3 {\n    margin: 5px 0 22px;\n\n    color: var(--wnsa-light-gold);\n\n    font-family: Georgia, serif;\n\n    font-size: 18px;\n\n    font-weight: 500;\n}\n\n\n.wnsa-footer-column > a {\n    margin-bottom: 12px;\n\n    color: rgba(255, 255, 255, 0.65);\n\n    text-decoration: none;\n\n    font-size: 11px;\n\n    transition: 0.3s ease;\n}\n\n\n.wnsa-footer-column > a:hover {\n    color: var(--wnsa-light-gold);\n\n    padding-left: 3px;\n}\n\n\n\/* =========================================\n   CONTACT\n   ========================================= *\/\n\n.wnsa-footer-contact > p {\n    margin: 0 0 18px;\n\n    color: rgba(255, 255, 255, 0.65);\n\n    font-size: 11px;\n}\n\n\n.wnsa-footer-contact-button {\n    margin-top: 8px;\n\n    color: var(--wnsa-light-gold) !important;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n}\n\n\n\/* =========================================\n   NEWSLETTER\n   ========================================= *\/\n\n.wnsa-footer-newsletter {\n    max-width: 1180px;\n\n    margin: 0 auto;\n\n    padding: 45px 0;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: space-between;\n\n    gap: 40px;\n\n    border-bottom: 1px solid rgba(255, 255, 255, 0.12);\n}\n\n\n.wnsa-footer-newsletter span {\n    color: var(--wnsa-light-gold);\n\n    font-size: 9px;\n\n    font-weight: 700;\n\n    letter-spacing: 2px;\n}\n\n\n.wnsa-footer-newsletter h3 {\n    margin: 7px 0 0;\n\n    color: #ffffff;\n\n    font-family: Georgia, serif;\n\n    font-size: 25px;\n\n    font-weight: 500;\n}\n\n\n\/* NEWSLETTER FORM *\/\n\n.wnsa-newsletter-form {\n    display: flex;\n\n    width: 450px;\n\n    height: 48px;\n\n    border: 1px solid rgba(234, 218, 183, 0.3);\n\n    border-radius: 30px;\n\n    overflow: hidden;\n}\n\n\n.wnsa-newsletter-form input {\n    flex: 1;\n\n    min-width: 0;\n\n    padding: 0 20px;\n\n    border: none;\n\n    outline: none;\n\n    background: transparent;\n\n    color: #ffffff;\n\n    font-size: 11px;\n}\n\n\n.wnsa-newsletter-form input::placeholder {\n    color: rgba(255, 255, 255, 0.45);\n}\n\n\n.wnsa-newsletter-form button {\n    flex-shrink: 0;\n\n    padding: 0 22px;\n\n    border: none;\n\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n\n    cursor: pointer;\n}\n\n\n.wnsa-newsletter-form button span {\n    margin-left: 7px;\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 13px;\n}\n\n\n\/* =========================================\n   BOTTOM BAR\n   ========================================= *\/\n\n.wnsa-footer-bottom {\n    max-width: 1180px;\n\n    margin: 0 auto;\n\n    padding-top: 25px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: space-between;\n\n    gap: 20px;\n}\n\n\n.wnsa-footer-bottom p {\n    margin: 0;\n\n    color: rgba(255, 255, 255, 0.42);\n\n    font-size: 9px;\n}\n\n\n.wnsa-footer-legal {\n    display: flex;\n\n    align-items: center;\n\n    gap: 20px;\n}\n\n\n.wnsa-footer-legal a {\n    color: rgba(255, 255, 255, 0.42);\n\n    text-decoration: none;\n\n    font-size: 9px;\n}\n\n\n.wnsa-footer-legal a:hover {\n    color: var(--wnsa-light-gold);\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 950px) {\n\n    .wnsa-footer {\n        padding: 65px 25px 25px;\n    }\n\n    .wnsa-footer-container {\n        grid-template-columns: 1fr 1fr;\n\n        gap: 50px;\n    }\n\n    .wnsa-footer-newsletter {\n        flex-direction: column;\n\n        align-items: flex-start;\n    }\n\n    .wnsa-newsletter-form {\n        width: 100%;\n\n        max-width: 500px;\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-footer {\n        padding: 55px 20px 20px;\n    }\n\n    .wnsa-footer-container {\n        grid-template-columns: 1fr;\n\n        gap: 40px;\n\n        padding-bottom: 45px;\n    }\n\n    .wnsa-footer-brand {\n        max-width: 100%;\n    }\n\n    .wnsa-footer-newsletter {\n        padding: 35px 0;\n\n        gap: 25px;\n    }\n\n    .wnsa-footer-newsletter h3 {\n        font-size: 22px;\n    }\n\n    .wnsa-newsletter-form {\n        height: 45px;\n    }\n\n    .wnsa-newsletter-form button {\n        padding: 0 15px;\n    }\n\n    .wnsa-footer-bottom {\n        flex-direction: column;\n\n        align-items: flex-start;\n\n        padding-top: 20px;\n    }\n\n    .wnsa-footer-legal {\n        flex-wrap: wrap;\n\n        gap: 10px 15px;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - BENEFIT CARD 02 FIX\n   Makes Card 02 match Card 01\n   ========================================= *\/\n\n.wnsa-benefits-grid .wnsa-benefit-card.wnsa-benefit-featured {\n    background: var(--wnsa-cream) !important;\n\n    color: var(--wnsa-dark-teal);\n\n    border: 1px solid rgba(13, 124, 147, 0.08);\n\n    box-shadow: none;\n\n    transform: none;\n}\n\n\n\/* Number *\/\n\n.wnsa-benefits-grid\n.wnsa-benefit-card.wnsa-benefit-featured\n.wnsa-benefit-number {\n\n    color: rgba(13, 124, 147, 0.25);\n}\n\n\n\/* Icon *\/\n\n.wnsa-benefits-grid\n.wnsa-benefit-card.wnsa-benefit-featured\n.wnsa-benefit-icon {\n\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n}\n\n\n\/* Heading *\/\n\n.wnsa-benefits-grid\n.wnsa-benefit-card.wnsa-benefit-featured\nh3 {\n\n    color: var(--wnsa-dark-teal);\n}\n\n\n\/* Description *\/\n\n.wnsa-benefits-grid\n.wnsa-benefit-card.wnsa-benefit-featured\np {\n\n    color: #687676;\n}\n\n\n\/* Discover More *\/\n\n.wnsa-benefits-grid\n.wnsa-benefit-card.wnsa-benefit-featured\na {\n\n    color: var(--wnsa-teal);\n}\n\n\n\/* Hover *\/\n\n.wnsa-benefits-grid\n.wnsa-benefit-card.wnsa-benefit-featured:hover {\n\n    background: var(--wnsa-cream) !important;\n\n    transform: translateY(-8px);\n\n    box-shadow:\n        0 20px 45px rgba(39, 56, 58, 0.10);\n}\n\/* =========================================\n   WHY NOT SA - SEPARATE HEADER\n   ========================================= *\/\n\n.wnsa-header {\n    position: relative;\n\n    top: auto;\n    left: auto;\n\n    width: 100%;\n\n    z-index: 100;\n\n    background: #F6F1E6;\n\n    border-bottom: 1px solid rgba(13, 124, 147, 0.10);\n}\n\n\n.wnsa-navbar {\n    width: 100%;\n\n    max-width: 1350px;\n\n    min-height: 88px;\n\n    margin: 0 auto;\n\n    padding: 10px 35px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: space-between;\n\n    gap: 30px;\n}\n\n\n\/* =========================================\n   LOGO\n   ========================================= *\/\n\n.wnsa-logo {\n    display: flex;\n\n    align-items: center;\n\n    flex-shrink: 0;\n\n    line-height: 0;\n\n    text-decoration: none;\n}\n\n\n.wnsa-logo img {\n    display: block;\n\n    width: 105px;\n\n    height: auto;\n\n    max-height: 72px;\n\n    object-fit: contain;\n\n    border-radius: 0 !important;\n\n    background: transparent !important;\n}\n\n\n\/* =========================================\n   NAVIGATION\n   ========================================= *\/\n\n.wnsa-nav {\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    gap: 28px;\n\n    margin-left: auto;\n}\n\n\n.wnsa-nav a {\n    position: relative;\n\n    padding: 8px 0;\n\n    color: var(--wnsa-dark-teal);\n\n    text-decoration: none;\n\n    font-family: Arial, sans-serif;\n\n    font-size: 11px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n\n    transition: color 0.3s ease;\n}\n\n\n.wnsa-nav a::after {\n    content: \"\";\n\n    position: absolute;\n\n    left: 0;\n    bottom: 0;\n\n    width: 0;\n\n    height: 1px;\n\n    background: var(--wnsa-gold);\n\n    transition: width 0.3s ease;\n}\n\n\n.wnsa-nav a:hover,\n.wnsa-nav a.active {\n    color: var(--wnsa-teal);\n}\n\n\n.wnsa-nav a:hover::after,\n.wnsa-nav a.active::after {\n    width: 100%;\n}\n\n\n\/* =========================================\n   SHOP BUTTON\n   ========================================= *\/\n\n.wnsa-header-actions {\n    display: flex;\n\n    align-items: center;\n\n    flex-shrink: 0;\n}\n\n\n.wnsa-header-shop {\n    display: inline-flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    gap: 10px;\n\n    min-height: 42px;\n\n    padding: 0 21px;\n\n    border-radius: 25px;\n\n    background: var(--wnsa-dark-teal);\n\n    color: #ffffff;\n\n    text-decoration: none;\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n\n    transition: 0.3s ease;\n}\n\n\n.wnsa-header-shop:hover {\n    background: var(--wnsa-teal);\n\n    transform: translateY(-2px);\n}\n\n\n\/* =========================================\n   HERO\n   ========================================= *\/\n\n.wnsa-hero {\n    position: relative;\n\n    width: 100%;\n\n    min-height: 720px;\n\n    overflow: hidden;\n\n    background: #F6F1E6;\n}\n\n\n\/* =========================================\n   HERO IMAGE\n   ========================================= *\/\n\n.wnsa-hero-background {\n    position: absolute;\n\n    inset: 0;\n\n    width: 100%;\n    height: 100%;\n\n    z-index: 1;\n}\n\n\n.wnsa-hero-background img {\n    display: block;\n\n    width: 100%;\n    height: 100%;\n\n    max-width: none !important;\n\n    object-fit: cover;\n\n    object-position: center center;\n\n    border-radius: 0 !important;\n}\n\n\n\/* =========================================\n   HERO CONTENT OVER IMAGE\n   ========================================= *\/\n\n.wnsa-hero-container {\n    position: relative;\n\n    z-index: 5;\n\n    width: 100%;\n\n    max-width: 1350px;\n\n    min-height: 720px;\n\n    margin: 0 auto;\n\n    padding: 100px 60px;\n\n    display: flex;\n\n    align-items: center;\n}\n\n\n.wnsa-hero-content {\n    width: 50%;\n\n    max-width: 600px;\n}\n\n\n\/* =========================================\n   HERO TEXT\n   ========================================= *\/\n\n.wnsa-hero-eyebrow {\n    display: inline-block;\n\n    margin-bottom: 20px;\n\n    color: var(--wnsa-teal);\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    letter-spacing: 2.5px;\n}\n\n\n.wnsa-hero h1 {\n    margin: 0;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: clamp(55px, 7vw, 88px);\n\n    font-weight: 500;\n\n    line-height: 0.98;\n\n    letter-spacing: -2px;\n}\n\n\n.wnsa-hero h1 span {\n    display: block;\n\n    color: var(--wnsa-teal);\n\n    font-style: italic;\n}\n\n\n.wnsa-hero-content > p {\n    max-width: 500px;\n\n    margin: 28px 0 32px;\n\n    color: #566968;\n\n    font-size: 15px;\n\n    line-height: 1.8;\n}\n\n\n\/* =========================================\n   HERO BUTTONS\n   ========================================= *\/\n\n.wnsa-hero-buttons {\n    display: flex;\n\n    align-items: center;\n\n    gap: 18px;\n}\n\n\n.wnsa-hero-button {\n    display: inline-flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    gap: 14px;\n\n    min-height: 52px;\n\n    padding: 0 28px;\n\n    border-radius: 30px;\n\n    background: var(--wnsa-dark-teal);\n\n    color: #ffffff;\n\n    text-decoration: none;\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n\n    transition: 0.3s ease;\n}\n\n\n.wnsa-hero-button:hover {\n    background: var(--wnsa-teal);\n\n    transform: translateY(-3px);\n}\n\n\n.wnsa-hero-secondary {\n    color: var(--wnsa-dark-teal);\n\n    text-decoration: none;\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n\n    border-bottom: 1px solid var(--wnsa-gold);\n\n    padding-bottom: 5px;\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 1000px) {\n\n    .wnsa-navbar {\n        padding: 10px 25px;\n    }\n\n    .wnsa-nav {\n        gap: 16px;\n    }\n\n    .wnsa-nav a {\n        font-size: 9px;\n    }\n\n    .wnsa-hero-container {\n        padding-left: 40px;\n        padding-right: 40px;\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 768px) {\n\n    .wnsa-navbar {\n        min-height: 75px;\n\n        padding: 8px 20px;\n    }\n\n\n    .wnsa-logo img {\n        width: 85px;\n    }\n\n\n    .wnsa-header-shop {\n        min-height: 38px;\n\n        padding: 0 15px;\n\n        font-size: 9px;\n    }\n\n\n    .wnsa-hero {\n        min-height: 700px;\n    }\n\n\n    .wnsa-hero-background img {\n        object-position: center center;\n    }\n\n\n    .wnsa-hero-container {\n        min-height: 700px;\n\n        padding:\n            80px\n            25px\n            60px;\n\n        align-items: center;\n    }\n\n\n    .wnsa-hero-content {\n        width: 100%;\n\n        max-width: 600px;\n\n        margin: 0 auto;\n    }\n\n\n    .wnsa-hero h1 {\n        font-size: 52px;\n\n        letter-spacing: -1px;\n    }\n\n\n    .wnsa-hero-content > p {\n        font-size: 14px;\n    }\n\n\n    .wnsa-hero-buttons {\n        flex-wrap: wrap;\n    }\n\n}\n\n\n\/* =========================================\n   SMALL MOBILE\n   ========================================= *\/\n\n@media (max-width: 480px) {\n\n    .wnsa-hero {\n        min-height: 650px;\n    }\n\n\n    .wnsa-hero-container {\n        min-height: 650px;\n\n        padding:\n            60px\n            20px\n            50px;\n    }\n\n\n    .wnsa-hero h1 {\n        font-size: 45px;\n    }\n\n\n    .wnsa-hero-buttons {\n        flex-direction: column;\n\n        width: 100%;\n    }\n\n\n    .wnsa-hero-button {\n        width: 100%;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - HERO IMAGE + TEXT FIX\n   KEEP THE FULL IMAGE VISIBLE\n   ========================================= *\/\n\n.wnsa-hero {\n    position: relative !important;\n    overflow: hidden !important;\n    background: transparent !important;\n}\n\n\n\/* =========================================\n   FULL IMAGE\n   ========================================= *\/\n\n.wnsa-hero-background {\n    position: absolute !important;\n\n    inset: 0 !important;\n\n    width: 100% !important;\n    height: 100% !important;\n\n    z-index: 1 !important;\n}\n\n\n.wnsa-hero-background img {\n    display: block !important;\n\n    width: 100% !important;\n    height: 100% !important;\n\n    max-width: none !important;\n\n    object-fit: cover !important;\n\n    object-position: center center !important;\n\n    border-radius: 0 !important;\n}\n\n\n\/* =========================================\n   VERY LIGHT TEXT READABILITY FADE\n   ========================================= *\/\n\n.wnsa-hero::before {\n    content: \"\";\n\n    position: absolute;\n\n    inset: 0;\n\n    z-index: 2;\n\n    pointer-events: none;\n\n    background:\n        linear-gradient(\n            90deg,\n            rgba(246, 241, 230, 0.48) 0%,\n            rgba(246, 241, 230, 0.28) 25%,\n            rgba(246, 241, 230, 0.08) 45%,\n            rgba(246, 241, 230, 0) 65%\n        );\n}\n\n\n\/* =========================================\n   HERO CONTENT\n   ========================================= *\/\n\n.wnsa-hero-container {\n    position: relative !important;\n\n    z-index: 5 !important;\n\n    min-height: 720px;\n\n    padding: 100px 60px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: flex-start;\n}\n\n\n\/* =========================================\n   NO BOX AROUND TEXT\n   ========================================= *\/\n\n.wnsa-hero-content {\n    width: 50%;\n\n    max-width: 580px;\n\n    padding: 0 !important;\n\n    background: transparent !important;\n\n    border: none !important;\n\n    border-radius: 0 !important;\n\n    box-shadow: none !important;\n\n    backdrop-filter: none !important;\n\n    -webkit-backdrop-filter: none !important;\n}\n\n\n\/* =========================================\n   HEADING\n   ========================================= *\/\n\n.wnsa-hero h1 {\n    color: #075B68 !important;\n\n    text-shadow:\n        0 2px 3px rgba(255, 255, 255, 0.75);\n\n    margin-bottom: 20px;\n}\n\n\n.wnsa-hero h1 span {\n    color: #0D7C93 !important;\n}\n\n\n\/* =========================================\n   SMALL HEADING\n   ========================================= *\/\n\n.wnsa-hero-eyebrow {\n    color: #075B68 !important;\n\n    font-weight: 700;\n\n    text-shadow:\n        0 1px 3px rgba(255, 255, 255, 0.85);\n}\n\n\n\/* =========================================\n   TAGLINE\n   ========================================= *\/\n\n.wnsa-hero-tagline {\n    color: #075B68 !important;\n\n    font-weight: 600;\n\n    text-shadow:\n        0 1px 3px rgba(255, 255, 255, 0.8);\n}\n\n\n\/* =========================================\n   DESCRIPTION\n   ========================================= *\/\n\n.wnsa-hero-description {\n    color: #3F595A !important;\n\n    font-weight: 500;\n\n    text-shadow:\n        0 1px 3px rgba(255, 255, 255, 0.8);\n}\n\n\n\/* =========================================\n   BENEFITS\n   ========================================= *\/\n\n.wnsa-hero-benefit p {\n    color: #075B68 !important;\n\n    font-weight: 600;\n\n    text-shadow:\n        0 1px 3px rgba(255, 255, 255, 0.8);\n}\n\n\n.wnsa-hero-benefit span {\n    color: #C8AF92 !important;\n}\n\n\n\/* =========================================\n   BUTTONS\n   ========================================= *\/\n\n.wnsa-primary-button {\n    background: #0D7C93 !important;\n\n    color: #ffffff !important;\n\n    box-shadow:\n        0 8px 20px rgba(13, 124, 147, 0.20);\n}\n\n\n.wnsa-secondary-button {\n    color: #075B68 !important;\n\n    background: rgba(246, 241, 230, 0.25);\n\n    border-color: #C8AF92 !important;\n\n    text-shadow:\n        0 1px 2px rgba(255,255,255,0.7);\n}\n\n\n\/* =========================================\n   DESKTOP\n   ========================================= *\/\n\n@media (min-width: 1000px) {\n\n    .wnsa-hero-content {\n        margin-left: 20px;\n    }\n\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 900px) {\n\n    .wnsa-hero-container {\n        padding: 80px 35px;\n    }\n\n    .wnsa-hero-content {\n        width: 55%;\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 768px) {\n\n    .wnsa-hero {\n        min-height: 700px;\n    }\n\n\n    .wnsa-hero::before {\n        background:\n            linear-gradient(\n                180deg,\n                rgba(246, 241, 230, 0.35) 0%,\n                rgba(246, 241, 230, 0.12) 50%,\n                rgba(246, 241, 230, 0) 100%\n            );\n    }\n\n\n    .wnsa-hero-container {\n        min-height: 700px;\n\n        padding: 70px 25px;\n\n        justify-content: center;\n\n        text-align: center;\n    }\n\n\n    .wnsa-hero-content {\n        width: 100%;\n\n        max-width: 580px;\n    }\n\n\n    .wnsa-hero h1 {\n        font-size: 48px;\n    }\n\n\n    .wnsa-hero-content > p {\n        margin-left: auto;\n\n        margin-right: auto;\n    }\n\n\n    .wnsa-hero-benefits {\n        justify-content: center;\n    }\n\n\n    .wnsa-hero-buttons {\n        justify-content: center;\n    }\n\n}\n\n\n\/* =========================================\n   SMALL MOBILE\n   ========================================= *\/\n\n@media (max-width: 480px) {\n\n    .wnsa-hero h1 {\n        font-size: 42px;\n    }\n\n}\n\/* =========================================\n   HERO - TEXT READABILITY\n   ========================================= *\/\n\n\/* Description *\/\n.wnsa-hero-description {\n    color: #073F48 !important;\n    font-weight: 600 !important;\n    text-shadow: none !important;\n}\n\n\n\/* Benefit text *\/\n.wnsa-hero-benefit p {\n    color: #073F48 !important;\n    font-weight: 700 !important;\n}\n\n\n\/* Benefit icons *\/\n.wnsa-hero-benefit span {\n    color: #C8AF92 !important;\n}\n\n\n\/* Learn More *\/\n.wnsa-secondary-button {\n    color: #073F48 !important;\n    font-weight: 700 !important;\n    background: rgba(246, 241, 230, 0.65) !important;\n    border-color: #C8AF92 !important;\n}\n\n\n\/* Shop Now *\/\n.wnsa-primary-button {\n    background: #073F48 !important;\n    color: #FFFFFF !important;\n    font-weight: 700 !important;\n}\n\/* Move hero image upward without moving text *\/\n\n.wnsa-hero-background img {\n    object-position: center 30% !important;\n}\n\/* Remove the unwanted pink\/red block only *\/\n[style*=\"background-color: rgb(204, 38, 88)\"],\n[style*=\"background-color:#cc2658\"],\n[style*=\"background-color: #cc2658\"],\n[style*=\"background:#cc2658\"],\n[style*=\"background: #cc2658\"] {\n    display: none !important;\n}\n\/* Remove empty pink button only *\/\n.wsa-navbar button:not(.wsa-mobile-menu):empty {\n    display: none !important;\n}\n\/* =========================================\n   WHY NOT SA - GLOW FROM WITHIN BUBBLE\n   ========================================= *\/\n\n\/* Hide the old WHY NOT SA text *\/\n.glow-bubble .brand-text {\n    display: none !important;\n}\n\n\/* Glow From Within text *\/\n.glow-bubble .glow-text {\n    font-size: 20px !important;\n    font-weight: 600 !important;\n    letter-spacing: 2px !important;\n    line-height: 1.2 !important;\n    text-align: center !important;\n    color: #F6F1E6 !important;\n    width: 85% !important;\n    margin: 0 auto !important;\n}\n\n\/* Keep the text nicely centred inside the circle *\/\n.glow-bubble {\n    display: flex !important;\n    align-items: center !important;\n    justify-content: center !important;\n    text-align: center !important;\n}\n\/* =========================================\n   WHY NOT SA - WAYS TO USE\n   ========================================= *\/\n\n.wnsa-ways {\n    width: 100%;\n    background: #F7F1E4;\n    padding: 10px 0 25px;\n}\n\n.wnsa-ways-container {\n    width: 100%;\n    max-width: 1400px;\n    margin: 0 auto;\n    padding: 0 20px;\n\n    display: grid;\n    grid-template-columns: repeat(4, 1fr);\n    gap: 16px;\n    box-sizing: border-box;\n}\n\n.wnsa-way-card {\n    position: relative;\n\n    min-height: 270px;\n    padding: 32px 28px;\n\n    background: #F6F1E6;\n    border: 1px solid rgba(20, 110, 125, 0.12);\n    border-radius: 18px;\n\n    box-sizing: border-box;\n    overflow: hidden;\n\n    transition: transform 0.25s ease,\n                box-shadow 0.25s ease;\n}\n\n.wnsa-way-card:hover {\n    transform: translateY(-4px);\n    box-shadow: 0 12px 30px rgba(20, 110, 125, 0.10);\n}\n\n\n\/* NUMBER *\/\n\n.wnsa-way-number {\n    position: absolute;\n    top: 22px;\n    right: 24px;\n\n    font-family: Arial, sans-serif;\n    font-size: 12px;\n    font-weight: 600;\n    letter-spacing: 1px;\n\n    color: rgba(20, 110, 125, 0.30);\n}\n\n\n\/* ICON CIRCLE *\/\n\n.wnsa-way-icon {\n    width: 58px;\n    height: 58px;\n\n    margin-bottom: 28px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    background: #EADAB7;\n    border-radius: 50%;\n}\n\n\n\/* SVG ICON *\/\n\n.wnsa-way-icon svg {\n    width: 30px;\n    height: 30px;\n\n    fill: none;\n    stroke: #0D7C93;\n    stroke-width: 2;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n\n\/* TITLE *\/\n\n.wnsa-way-card h3 {\n    margin: 0 0 14px;\n\n    font-family: Georgia, \"Times New Roman\", serif;\n    font-size: 25px;\n    font-weight: 500;\n    line-height: 1.2;\n\n    color: #0D6070;\n}\n\n\n\/* DESCRIPTION *\/\n\n.wnsa-way-card p {\n    margin: 0;\n\n    font-family: Arial, sans-serif;\n    font-size: 14px;\n    line-height: 1.7;\n\n    color: #7A8585;\n}\n\n\n\/* MOBILE *\/\n\n@media (max-width: 900px) {\n\n    .wnsa-ways-container {\n        grid-template-columns: repeat(2, 1fr);\n    }\n\n}\n\n\n@media (max-width: 600px) {\n\n    .wnsa-ways {\n        padding: 10px 0 20px;\n    }\n\n    .wnsa-ways-container {\n        grid-template-columns: 1fr;\n        padding: 0 15px;\n    }\n\n    .wnsa-way-card {\n        min-height: 230px;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - HOW TO USE SECTION\n   ========================================= *\/\n\n.wnsa-how {\n    width: 100%;\n\n    padding: 110px 30px;\n\n    background: #F6F1E6;\n\n    overflow: hidden;\n}\n\n\n.wnsa-how-container {\n    width: 100%;\n\n    max-width: 1250px;\n\n    margin: 0 auto;\n}\n\n\n\/* =========================================\n   INTRO\n   ========================================= *\/\n\n.wnsa-how-intro {\n    max-width: 850px;\n\n    margin: 0 auto 70px;\n\n    text-align: center;\n}\n\n\n.wnsa-how-eyebrow {\n    display: block;\n\n    margin-bottom: 18px;\n\n    color: #0D7C93;\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    letter-spacing: 3px;\n\n    text-transform: uppercase;\n}\n\n\n.wnsa-how-intro h2 {\n    margin: 0;\n\n    color: #075B68;\n\n    font-family: Georgia, serif;\n\n    font-size: clamp(48px, 6vw, 70px);\n\n    font-weight: 500;\n\n    line-height: 1;\n\n    letter-spacing: -2px;\n}\n\n\n.wnsa-how-intro h2 span {\n    display: block;\n\n    color: #0D7C93;\n\n    font-style: italic;\n}\n\n\n.wnsa-how-intro > p {\n    max-width: 700px;\n\n    margin: 30px auto 0;\n\n    color: #687676;\n\n    font-size: 14px;\n\n    line-height: 1.8;\n}\n\n\n\/* =========================================\n   CARD GRID\n   ========================================= *\/\n\n.wnsa-how-grid {\n    display: grid;\n\n    grid-template-columns:\n        repeat(4, 1fr);\n\n    gap: 18px;\n}\n\n\n\/* =========================================\n   CARD\n   ========================================= *\/\n\n.wnsa-how-card {\n    position: relative;\n\n    min-height: 400px;\n\n    padding: 38px 28px;\n\n    background: #F3EEE2;\n\n    border: 1px solid\n        rgba(13, 124, 147, 0.10);\n\n    border-radius: 18px;\n\n    overflow: hidden;\n\n    transition:\n        transform 0.3s ease,\n        box-shadow 0.3s ease;\n}\n\n\n.wnsa-how-card:hover {\n    transform: translateY(-7px);\n\n    box-shadow:\n        0 18px 40px\n        rgba(39, 56, 58, 0.10);\n}\n\n\n\/* =========================================\n   NUMBER\n   ========================================= *\/\n\n.wnsa-how-number {\n    position: absolute;\n\n    top: 25px;\n\n    right: 25px;\n\n    color: rgba(13, 124, 147, 0.25);\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    letter-spacing: 1px;\n}\n\n\n\/* =========================================\n   LINE ICON CIRCLE\n   ========================================= *\/\n\n.wnsa-how-icon {\n    width: 58px;\n\n    height: 58px;\n\n    margin-bottom: 30px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    border-radius: 50%;\n\n    background: #EADAB7;\n\n    color: #0D7C93;\n\n    transition:\n        transform 0.3s ease,\n        background 0.3s ease,\n        color 0.3s ease;\n}\n\n\n.wnsa-how-icon svg {\n    width: 31px;\n\n    height: 31px;\n\n    display: block;\n\n    fill: none;\n\n    stroke: currentColor;\n\n    stroke-width: 1.7;\n\n    stroke-linecap: round;\n\n    stroke-linejoin: round;\n}\n\n\n.wnsa-how-card:hover .wnsa-how-icon {\n    transform: translateY(-3px);\n\n    background: #D8C9A8;\n\n    color: #075B68;\n}\n\n\n\/* =========================================\n   CARD HEADING\n   ========================================= *\/\n\n.wnsa-how-card h3 {\n    margin: 0 0 15px;\n\n    color: #075B68;\n\n    font-family: Georgia, serif;\n\n    font-size: 25px;\n\n    font-weight: 500;\n\n    line-height: 1.15;\n}\n\n\n\/* =========================================\n   CARD DESCRIPTION\n   ========================================= *\/\n\n.wnsa-how-card p {\n    max-width: 260px;\n\n    margin: 0;\n\n    color: #687676;\n\n    font-size: 12px;\n\n    line-height: 1.8;\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 1000px) {\n\n    .wnsa-how {\n        padding: 90px 25px;\n    }\n\n    .wnsa-how-grid {\n        grid-template-columns:\n            repeat(2, 1fr);\n\n        gap: 18px;\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-how {\n        padding: 75px 20px;\n    }\n\n\n    .wnsa-how-intro {\n        margin-bottom: 45px;\n    }\n\n\n    .wnsa-how-intro h2 {\n        font-size: 45px;\n\n        letter-spacing: -1px;\n    }\n\n\n    .wnsa-how-grid {\n        grid-template-columns: 1fr;\n\n        gap: 15px;\n    }\n\n\n    .wnsa-how-card {\n        min-height: 300px;\n\n        padding: 30px 25px;\n    }\n\n\n    .wnsa-how-card h3 {\n        font-size: 24px;\n    }\n\n}\n.wnsa-badge {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n}\n\n.wnsa-badge strong {\n    color: #F6F1E6;\n    font-size: 14px;\n    font-weight: 700;\n    letter-spacing: 2px;\n    text-transform: uppercase;\n}\n\/* =========================================\n   WHY NOT SA - GLOW FROM WITHIN BUBBLE\n   ========================================= *\/\n\n\/* Hide the old WHY NOT SA text *\/\n.glow-bubble .brand-text {\n    display: none !important;\n}\n\n\/* Glow From Within text *\/\n.glow-bubble .glow-text {\n    font-size: 20px !important;\n    font-weight: 600 !important;\n    letter-spacing: 2px !important;\n    line-height: 1.2 !important;\n    text-align: center !important;\n    color: #F6F1E6 !important;\n    width: 85% !important;\n    margin: 0 auto !important;\n}\n\n\/* Keep the text nicely centred inside the circle *\/\n.glow-bubble {\n    display: flex !important;\n    align-items: center !important;\n    justify-content: center !important;\n    text-align: center !important;\n}\n\/* =========================================\n   ABOUT BADGE - GLOW FROM WITHIN\n   ========================================= *\/\n\n.wnsa-about-badge {\n    position: absolute !important;\n\n    display: flex !important;\n\n    align-items: center !important;\n\n    justify-content: center !important;\n\n    text-align: center !important;\n\n    padding: 20px !important;\n\n    box-sizing: border-box !important;\n\n    overflow: hidden !important;\n}\n\n\n\/* Badge text *\/\n\n.wnsa-about-badge strong {\n    display: block !important;\n\n    width: 100% !important;\n\n    margin: 0 !important;\n\n    padding: 0 !important;\n\n    color: #F6F1E6 !important;\n\n    font-family: Georgia, serif !important;\n\n    font-size: 22px !important;\n\n    font-weight: 600 !important;\n\n    line-height: 1.05 !important;\n\n    letter-spacing: 0 !important;\n\n    text-align: center !important;\n\n    text-transform: none !important;\n\n    white-space: normal !important;\n}\n\/* Space between About image and text *\/\n.wnsa-about-visual {\n    margin-bottom: 35px !important;\n}\n\/* =========================================\n   REMOVE UNWANTED RED HEADER BLOCK\n   ========================================= *\/\n\n.wnsa-header-actions > div:not(.wnsa-cart),\n.wnsa-header-actions > a:not(.wnsa-cart):not(.wnsa-shop-button) {\n    display: none !important;\n}\n\/* Remove stray coloured block from header *\/\n.wnsa-header-actions .wp-block-button,\n.wnsa-header-actions .wp-element-button,\n.wnsa-header-actions .wp-block-group:empty {\n    display: none !important;\n}\n\/* =========================================\n   REMOVE RED BLOCK NEXT TO CART\n   ========================================= *\/\n\n.wnsa-header-actions > *:not(.wnsa-cart):not(.wnsa-shop-button) {\n    display: none !important;\n}\n\n\n\/* Remove any empty or coloured element inside header actions *\/\n.wnsa-header-actions > *:empty {\n    display: none !important;\n}\n\n\n\/* Hide buttons\/groups that may be creating the block *\/\n.wnsa-header-actions .wp-block-button,\n.wnsa-header-actions .wp-block-group,\n.wnsa-header-actions .wp-block-column,\n.wnsa-header-actions .wp-element-button {\n    display: none !important;\n}\n\n\n\/* Make sure the actual cart and Shop Now remain *\/\n.wnsa-header-actions .wnsa-cart,\n.wnsa-header-actions .wnsa-shop-button {\n    display: flex !important;\n}\n\/* =========================================\n   HEADER LAYOUT FIX\n   ========================================= *\/\n\n\/* Break the header out of the narrow theme column *\/\n.wnsa-header {\n    width: 100vw !important;\n    max-width: 100vw !important;\n    margin-left: calc(50% - 50vw) !important;\n    margin-right: 0 !important;\n    box-sizing: border-box;\n}\n\n.wnsa-top-bar,\n.wnsa-navbar {\n    box-sizing: border-box;\n}\n\n\/* Keep nav labels on one line *\/\n.wnsa-nav a {\n    white-space: nowrap !important;\n}\n\n\/* Shop Now button: remove theme's red underlined link style *\/\n.wnsa-header-actions a.wnsa-shop-button,\n.wnsa-header-actions a.wnsa-shop-button:hover,\n.wnsa-header-actions a.wnsa-shop-button:visited {\n    color: #ffffff !important;\n    text-decoration: none !important;\n    white-space: nowrap;\n}\n\n\/* Remove theme underline from the other header links too *\/\n.wnsa-nav a,\n.wnsa-cart,\n.wnsa-logo {\n    text-decoration: none !important;\n}\n\n\/* Stop the full-width breakout from causing a sideways scrollbar *\/\nhtml,\nbody {\n    overflow-x: hidden;\n}\n\/* =========================================\n   FULL-WIDTH SECTIONS (desktop + mobile)\n   ========================================= *\/\n\n.wnsa-hero,\n.wnsa-benefits,\n.wnsa-product-section,\n.wnsa-about,\n.wnsa-inside,\n.wnsa-how,\n.wnsa-testimonials,\n.wnsa-faq,\n.wnsa-final-cta,\n.wnsa-footer {\n    width: 100vw !important;\n    max-width: 100vw !important;\n    margin-left: calc(50% - 50vw) !important;\n    margin-right: 0 !important;\n    box-sizing: border-box;\n}\n\n\/* Stop images and buttons overflowing small screens *\/\n.wnsa-header img,\n.wnsa-hero img,\n.wnsa-product-section img,\n.wnsa-about img,\n.wnsa-inside img,\n.wnsa-final-cta img,\n.wnsa-footer img {\n    max-width: 100%;\n}\n\n.wnsa-primary-button,\n.wnsa-secondary-button,\n.wnsa-add-to-cart,\n.wnsa-final-button,\n.wnsa-about-button {\n    text-decoration: none !important;\n}\n\n\n\/* =========================================\n   MOBILE HEADER (768px and below)\n   ========================================= *\/\n\n@media (max-width: 768px) {\n\n    \/* Top bar: keep to one tidy line *\/\n    .wnsa-top-bar {\n        padding: 8px 12px;\n        text-align: center;\n    }\n\n    .wnsa-top-divider,\n    .wnsa-top-bar-inner span:last-child {\n        display: none !important;\n    }\n\n    \/* Navbar: logo on the left, cart + Shop Now on the right *\/\n    .wnsa-navbar {\n        padding: 8px 16px !important;\n        gap: 12px !important;\n        min-height: 70px !important;\n    }\n\n    .wnsa-logo img {\n        width: 70px !important;\n    }\n\n    .wnsa-header-actions {\n        margin-left: auto;\n        gap: 10px !important;\n    }\n\n    .wnsa-shop-button {\n        min-width: 0 !important;\n        height: 36px !important;\n        padding: 0 16px !important;\n        font-size: 10px !important;\n        white-space: nowrap;\n    }\n\n    .wnsa-shop-button span {\n        display: none;\n    }\n\n    \/* About image: stay inside the screen *\/\n    .wnsa-about-image {\n        max-width: 100%;\n    }\n}\n\n\n\/* =========================================\n   SMALL PHONES (480px and below)\n   ========================================= *\/\n\n@media (max-width: 480px) {\n\n    .wnsa-top-bar {\n        font-size: 10px;\n        letter-spacing: 0.2px;\n    }\n\n    .wnsa-hero h1 {\n        font-size: 40px !important;\n        letter-spacing: -1px !important;\n    }\n\n    .wnsa-product-buy {\n        flex-direction: column;\n        align-items: stretch;\n    }\n\n    .wnsa-newsletter-form {\n        width: 100% !important;\n    }\n\n    .wnsa-footer-bottom,\n    .wnsa-footer-legal {\n        flex-wrap: wrap;\n    }\n}\n\/* =========================================\n   REMOVE RED BLOCK IN HEADER\n   ========================================= *\/\n\n\/* Only the logo, nav and actions may sit directly in the navbar *\/\n.wnsa-navbar > *:not(.wnsa-logo):not(.wnsa-nav):not(.wnsa-header-actions) {\n    display: none !important;\n}\n\n\/* Only links may sit inside the nav *\/\n.wnsa-nav > *:not(a) {\n    display: none !important;\n}\n\n\/* Only the cart and Shop Now may sit inside the actions area *\/\n.wnsa-header-actions > *:not(.wnsa-cart):not(.wnsa-shop-button) {\n    display: none !important;\n}\n\n\/* Any stray button or empty element in the header *\/\n.wnsa-header button,\n.wnsa-header .wp-block-button,\n.wnsa-header .wp-element-button,\n.wnsa-header p:empty,\n.wnsa-header div:empty:not(.wnsa-cart):not(.wnsa-top-bar-inner) {\n    display: none !important;\n}\n\n\/* Make sure the real items stay visible *\/\n.wnsa-header .wnsa-cart,\n.wnsa-header .wnsa-shop-button {\n    display: flex !important;\n}\n\n.wnsa-header .wnsa-cart-count {\n    display: flex !important;\n}\n\/* =========================================\n   BUTTON TEXT COLOUR FIX (theme override)\n   ========================================= *\/\n\na.wnsa-about-button,\na.wnsa-about-button:hover,\na.wnsa-about-button:visited {\n    color: #ffffff !important;\n    text-decoration: none !important;\n}\n\na.wnsa-final-button,\na.wnsa-final-button:hover,\na.wnsa-final-button:visited {\n    color: #075C68 !important;\n    text-decoration: none !important;\n}\n\na.wnsa-primary-button,\na.wnsa-primary-button:hover,\na.wnsa-primary-button:visited {\n    color: #ffffff !important;\n    text-decoration: none !important;\n}\n\na.wnsa-secondary-button,\na.wnsa-secondary-button:hover,\na.wnsa-secondary-button:visited {\n    text-decoration: none !important;\n}\n\n\n\/* =========================================\n   \"NOTHING EXTRA\" SECTION - FINE BACKGROUND DETAIL\n   ========================================= *\/\n\n.wnsa-inside {\n    background-color: #075C68 !important;\n\n    background-image:\n        \/* Darker centre so the text stays easy to read *\/\n        radial-gradient(\n            ellipse at 50% 40%,\n            rgba(7, 92, 104, 0.92) 0%,\n            rgba(7, 92, 104, 0.6) 40%,\n            rgba(7, 92, 104, 0) 78%\n        ),\n\n        \/* Fine honeycomb pattern *\/\n        url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='56' height='100' viewBox='0 0 56 100'%3E%3Cpath d='M28 66L0 50L0 16L28 0L56 16L56 50L28 66L28 100' fill='none' stroke='%23EADAB7' stroke-opacity='0.13' stroke-width='1'\/%3E%3Cpath d='M28 0L28 34L0 50L0 84L28 100L56 84L56 50L28 34' fill='none' stroke='%23EADAB7' stroke-opacity='0.13' stroke-width='1'\/%3E%3C\/svg%3E\"),\n\n        \/* Tiny gold dots *\/\n        radial-gradient(circle at 8% 22%, rgba(234, 218, 183, 0.55) 0 2px, transparent 3px),\n        radial-gradient(circle at 93% 16%, rgba(234, 218, 183, 0.45) 0 2px, transparent 3px),\n        radial-gradient(circle at 88% 58%, rgba(234, 218, 183, 0.35) 0 1.5px, transparent 2.5px),\n        radial-gradient(circle at 5% 74%, rgba(234, 218, 183, 0.40) 0 1.5px, transparent 2.5px),\n        radial-gradient(circle at 20% 92%, rgba(234, 218, 183, 0.45) 0 2px, transparent 3px),\n        radial-gradient(circle at 78% 90%, rgba(234, 218, 183, 0.35) 0 1.5px, transparent 2.5px),\n\n        \/* Soft glows in the corners *\/\n        radial-gradient(circle at 12% 18%, rgba(234, 218, 183, 0.12), transparent 32%),\n        radial-gradient(circle at 90% 85%, rgba(13, 124, 147, 0.40), transparent 40%) !important;\n\n    background-size:\n        auto,\n        56px 100px,\n        auto, auto, auto, auto, auto, auto,\n        auto,\n        auto !important;\n}\n\n\/* Extra fine rings around the existing outline circle *\/\n.wnsa-inside::before {\n    box-shadow:\n        0 0 0 38px rgba(234, 218, 183, 0.025),\n        0 0 0 39px rgba(234, 218, 183, 0.10),\n        0 0 0 82px rgba(234, 218, 183, 0.018),\n        0 0 0 83px rgba(234, 218, 183, 0.07);\n}\n\n\/* Fine ring around the soft circle in the corner *\/\n.wnsa-inside::after {\n    box-shadow:\n        0 0 0 30px rgba(234, 218, 183, 0.03),\n        0 0 0 31px rgba(234, 218, 183, 0.08);\n}\n\n\/* Small gold divider under the intro text *\/\n.wnsa-inside .wnsa-section-heading::after {\n    content: \"2726\";\n\n    display: block;\n\n    width: 190px;\n\n    margin: 34px auto 0;\n\n    color: #C8AF92;\n\n    font-size: 14px;\n\n    line-height: 1;\n\n    text-align: center;\n\n    background:\n        linear-gradient(rgba(234, 218, 183, 0.40), rgba(234, 218, 183, 0.40)) left center \/ 75px 1px no-repeat,\n        linear-gradient(rgba(234, 218, 183, 0.40), rgba(234, 218, 183, 0.40)) right center \/ 75px 1px no-repeat;\n}\n\n\/* Soft glow behind the centre product circle *\/\n.wnsa-quality-circle {\n    box-shadow:\n        0 0 0 22px rgba(234, 218, 183, 0.07),\n        0 0 0 23px rgba(234, 218, 183, 0.14),\n        0 0 80px rgba(234, 218, 183, 0.18);\n}\n\n\/* Slightly lighter pattern on phones *\/\n@media (max-width: 600px) {\n\n    .wnsa-inside .wnsa-section-heading::after {\n        margin-top: 26px;\n    }\n\n    .wnsa-quality-circle {\n        box-shadow:\n            0 0 0 14px rgba(234, 218, 183, 0.07),\n            0 0 0 15px rgba(234, 218, 183, 0.14),\n            0 0 50px rgba(234, 218, 183, 0.15);\n    }\n}\n\/* =========================================\n   HOW TO USE - CARD UPGRADE\n   ========================================= *\/\n\n\/* Keep the cards away from the screen edges *\/\n.wnsa-how {\n    padding: 100px 30px !important;\n}\n\n.wnsa-how-container {\n    box-sizing: border-box;\n    padding: 0 10px;\n}\n\n.wnsa-how-grid {\n    gap: 22px !important;\n}\n\n\/* Card *\/\n.wnsa-how-card {\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n\n    min-height: 330px !important;\n    padding: 42px 30px 36px !important;\n\n    background-color: #F8F4EA !important;\n    background-image:\n        url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='56' height='100' viewBox='0 0 56 100'%3E%3Cpath d='M28 66L0 50L0 16L28 0L56 16L56 50L28 66L28 100' fill='none' stroke='%23C8AF92' stroke-opacity='0.22' stroke-width='1'\/%3E%3Cpath d='M28 0L28 34L0 50L0 84L28 100L56 84L56 50L28\n\/* =========================================\n   FINAL CTA - PHOTO FILLS THE CIRCLE\n   ========================================= *\/\n\n.wnsa-final-product img {\n    width: 420px !important;\n    height: 420px !important;\n    max-width: 100% !important;\n\n    box-sizing: border-box !important;\n\n    object-fit: cover !important;\n    object-position: center center !important;\n\n    border-radius: 50% !important;\n    border: 10px solid #EADAB7 !important;\n\n    transform: none !important;\n    filter: none !important;\n\n    box-shadow:\n        0 30px 60px rgba(0, 0, 0, 0.30) !important;\n\n    transition: transform 0.5s ease !important;\n}\n\n.wnsa-final-product img:hover {\n    transform: translateY(-8px) !important;\n}\n\n\/* Hide the flat gold circle, the photo replaces it *\/\n.wnsa-final-circle {\n    opacity: 0 !important;\n}\n\n\/* Phones *\/\n@media (max-width: 600px) {\n\n    .wnsa-final-product img {\n        width: 300px !important;\n        height: 300px !important;\n        border-width: 8px !important;\n    }\n}\n\/* =========================================\n   FOOTER LOGO - REMOVE WHITE BACKGROUND\n   ========================================= *\/\n\n.wnsa-footer-logo {\n    background: transparent !important;\n    padding: 0 !important;\n    border-radius: 0 !important;\n    box-shadow: none !important;\n}\n\n.wnsa-footer-logo img {\n    background: transparent !important;\n    border-radius: 0 !important;\n    width: 140px;\n}\n\/* Add to cart button states *\/\na.wnsa-add-to-cart.wnsa-busy {\n    opacity: 0.8;\n    pointer-events: none;\n}\n\na.wnsa-add-to-cart.wnsa-added {\n    background: #C8AF92 !important;\n    color: #075C68 !important;\n    pointer-events: none;\n}\n<\/style>\n\n<script data-wp-block-html=\"js\">\n\/* =========================================================\n   WHY NOT SA - MAIN JAVASCRIPT\n   ========================================================= *\/\n\ndocument.addEventListener(\"DOMContentLoaded\", function () {\n\n\n    \/* =====================================================\n       1. SMOOTH SCROLLING\n       ===================================================== *\/\n\n    const smoothLinks = document.querySelectorAll(\n        'a[href^=\"#\"]'\n    );\n\n    smoothLinks.forEach(function (link) {\n\n        link.addEventListener(\"click\", function (event) {\n\n            const targetId = this.getAttribute(\"href\");\n\n            if (\n                !targetId ||\n                targetId === \"#\" ||\n                targetId === \"#cart\"\n            ) {\n                return;\n            }\n\n            const target = document.querySelector(targetId);\n\n            if (!target) {\n                return;\n            }\n\n            event.preventDefault();\n\n            const header = document.querySelector(\n                \".wnsa-header\"\n            );\n\n            const headerHeight = header\n                ? header.offsetHeight\n                : 0;\n\n            const targetPosition =\n                target.getBoundingClientRect().top +\n                window.pageYOffset -\n                headerHeight;\n\n            window.scrollTo({\n                top: targetPosition,\n                behavior: \"smooth\"\n            });\n\n        });\n\n    });\n\n\n    \/* =====================================================\n       2. HEADER SCROLL EFFECT\n       ===================================================== *\/\n\n    const header = document.querySelector(\n        \".wnsa-header\"\n    );\n\n    function updateHeader() {\n\n        if (!header) return;\n\n        if (window.scrollY > 50) {\n\n            header.classList.add(\n                \"wnsa-header-scrolled\"\n            );\n\n        } else {\n\n            header.classList.remove(\n                \"wnsa-header-scrolled\"\n            );\n\n        }\n\n    }\n\n    window.addEventListener(\n        \"scroll\",\n        updateHeader\n    );\n\n    updateHeader();\n\n\n    \/* =====================================================\n       3. FAQ ACCORDION\n       ===================================================== *\/\n\n    const faqItems = document.querySelectorAll(\n        \".wnsa-faq-item\"\n    );\n\n    faqItems.forEach(function (item) {\n\n        const question =\n            item.querySelector(\n                \".wnsa-faq-question\"\n            );\n\n        if (!question) return;\n\n        const icon =\n            question.querySelector(\"b\");\n\n        question.addEventListener(\n            \"click\",\n            function () {\n\n                const isOpen =\n                    item.classList.contains(\n                        \"active\"\n                    );\n\n\n                \/* Close all FAQs *\/\n\n                faqItems.forEach(\n                    function (otherItem) {\n\n                        otherItem.classList.remove(\n                            \"active\"\n                        );\n\n                        const otherQuestion =\n                            otherItem.querySelector(\n                                \".wnsa-faq-question\"\n                            );\n\n                        if (otherQuestion) {\n\n                            otherQuestion.setAttribute(\n                                \"aria-expanded\",\n                                \"false\"\n                            );\n\n                        }\n\n                        const otherIcon =\n                            otherItem.querySelector(\n                                \".wnsa-faq-question b\"\n                            );\n\n                        if (otherIcon) {\n                            otherIcon.textContent = \"+\";\n                        }\n\n                    }\n                );\n\n\n                \/* Open selected FAQ *\/\n\n                if (!isOpen) {\n\n                    item.classList.add(\n                        \"active\"\n                    );\n\n                    question.setAttribute(\n                        \"aria-expanded\",\n                        \"true\"\n                    );\n\n                    if (icon) {\n                        icon.textContent = \"\u2212\";\n                    }\n\n                }\n\n            }\n        );\n\n    });\n\n\n    \/* =====================================================\n       4. PRODUCT QUANTITY\n       ===================================================== *\/\n\n    const quantityValue =\n        document.querySelector(\n            \".wnsa-quantity-value\"\n        );\n\n    const quantityMinus =\n        document.querySelector(\n            \".wnsa-quantity-minus\"\n        );\n\n    const quantityPlus =\n        document.querySelector(\n            \".wnsa-quantity-plus\"\n        );\n\n\n    let quantity = 1;\n\n\n    function updateQuantity() {\n\n        if (quantityValue) {\n\n            quantityValue.textContent =\n                quantity;\n\n        }\n\n    }\n\n\n    if (quantityPlus) {\n\n        quantityPlus.addEventListener(\n            \"click\",\n            function () {\n\n                quantity++;\n\n                updateQuantity();\n\n            }\n        );\n\n    }\n\n\n    if (quantityMinus) {\n\n        quantityMinus.addEventListener(\n            \"click\",\n            function () {\n\n                if (quantity > 1) {\n\n                    quantity--;\n\n                    updateQuantity();\n\n                }\n\n            }\n        );\n\n    }\n\n\n    \/* =====================================================\n       5. SHOPPING CART COUNT\n       ===================================================== *\/\n\n    let cartCount = 0;\n\n    const cartCounter =\n        document.querySelector(\n            \".wnsa-cart-count\"\n        );\n\n    const addToCart =\n        document.querySelector(\n            \".wnsa-add-to-cart\"\n        );\n\n\n    function updateCart() {\n\n        if (cartCounter) {\n\n            cartCounter.textContent =\n                cartCount;\n\n        }\n\n    }\n\n\n    if (addToCart) {\n\n        addToCart.addEventListener(\n            \"click\",\n            function () {\n\n                cartCount += quantity;\n\n                updateCart();\n\n\n                \/* Button feedback *\/\n\n                const originalText =\n                    addToCart.innerHTML;\n\n                addToCart.innerHTML =\n                    \"Added \u2713\";\n\n\n                addToCart.classList.add(\n                    \"wnsa-cart-added\"\n                );\n\n\n                setTimeout(\n                    function () {\n\n                        addToCart.innerHTML =\n                            originalText;\n\n                        addToCart.classList.remove(\n                            \"wnsa-cart-added\"\n                        );\n\n                    },\n                    1800\n                );\n\n            }\n        );\n\n    }\n\n\n    \/* =====================================================\n       6. NEWSLETTER\n       ===================================================== *\/\n\n    const newsletterForm =\n        document.querySelector(\n            \".wnsa-newsletter-form\"\n        );\n\n\n    if (newsletterForm) {\n\n        newsletterForm.addEventListener(\n            \"submit\",\n            function (event) {\n\n                event.preventDefault();\n\n                const emailInput =\n                    newsletterForm.querySelector(\n                        'input[type=\"email\"]'\n                    );\n\n                const button =\n                    newsletterForm.querySelector(\n                        \"button\"\n                    );\n\n\n                if (\n                    !emailInput ||\n                    !emailInput.value.trim()\n                ) {\n                    return;\n                }\n\n\n                const originalButton =\n                    button.innerHTML;\n\n\n                button.innerHTML =\n                    \"Thank You \u2713\";\n\n\n                emailInput.value = \"\";\n\n\n                setTimeout(\n                    function () {\n\n                        button.innerHTML =\n                            originalButton;\n\n                    },\n                    3000\n                );\n\n            }\n        );\n\n    }\n\n\n    \/* =====================================================\n       7. MOBILE MENU\n       ===================================================== *\/\n\n    const navbar =\n        document.querySelector(\n            \".wnsa-navbar\"\n        );\n\n\n    if (navbar) {\n\n        const nav =\n            navbar.querySelector(\n                \".wnsa-nav\"\n            );\n\n\n        if (nav) {\n\n            \/* Create mobile menu button *\/\n\n            const mobileButton =\n                document.createElement(\n                    \"button\"\n                );\n\n\n            mobileButton.className =\n                \"wnsa-mobile-menu\";\n\n\n            mobileButton.setAttribute(\n                \"aria-label\",\n                \"Open navigation\"\n            );\n\n\n            mobileButton.setAttribute(\n                \"aria-expanded\",\n                \"false\"\n            );\n\n\n            mobileButton.innerHTML =\n                \"<span><\/span><span><\/span><span><\/span>\";\n\n\n            navbar.insertBefore(\n                mobileButton,\n                navbar.querySelector(\n                    \".wnsa-header-actions\"\n                )\n            );\n\n\n            \/* Toggle menu *\/\n\n            mobileButton.addEventListener(\n                \"click\",\n                function () {\n\n                    const isOpen =\n                        nav.classList.contains(\n                            \"wnsa-mobile-open\"\n                        );\n\n\n                    if (isOpen) {\n\n                        nav.classList.remove(\n                            \"wnsa-mobile-open\"\n                        );\n\n                        mobileButton.classList.remove(\n                            \"active\"\n                        );\n\n                        mobileButton.setAttribute(\n                            \"aria-expanded\",\n                            \"false\"\n                        );\n\n                    } else {\n\n                        nav.classList.add(\n                            \"wnsa-mobile-open\"\n                        );\n\n                        mobileButton.classList.add(\n                            \"active\"\n                        );\n\n                        mobileButton.setAttribute(\n                            \"aria-expanded\",\n                            \"true\"\n                        );\n\n                    }\n\n                }\n            );\n\n\n            \/* Close menu after clicking link *\/\n\n            nav.querySelectorAll(\"a\").forEach(\n                function (link) {\n\n                    link.addEventListener(\n                        \"click\",\n                        function () {\n\n                            nav.classList.remove(\n                                \"wnsa-mobile-open\"\n                            );\n\n                            mobileButton.classList.remove(\n                                \"active\"\n                            );\n\n                            mobileButton.setAttribute(\n                                \"aria-expanded\",\n                                \"false\"\n                            );\n\n                        }\n                    );\n\n                }\n            );\n\n        }\n\n    }\n\n\n    \/* =====================================================\n       8. ACTIVE NAVIGATION LINK\n       ===================================================== *\/\n\n    const sections =\n        document.querySelectorAll(\n            \"section[id]\"\n        );\n\n    const navigationLinks =\n        document.querySelectorAll(\n            \".wnsa-nav a\"\n        );\n\n\n    function updateActiveNavigation() {\n\n        let currentSection = \"\";\n\n        sections.forEach(\n            function (section) {\n\n                const sectionTop =\n                    section.offsetTop - 180;\n\n                if (\n                    window.scrollY >=\n                    sectionTop\n                ) {\n\n                    currentSection =\n                        section.getAttribute(\n                            \"id\"\n                        );\n\n                }\n\n            }\n        );\n\n\n        navigationLinks.forEach(\n            function (link) {\n\n                link.classList.remove(\n                    \"active\"\n                );\n\n\n                const href =\n                    link.getAttribute(\n                        \"href\"\n                    );\n\n\n                if (\n                    href ===\n                    \"#\" + currentSection\n                ) {\n\n                    link.classList.add(\n                        \"active\"\n                    );\n\n                }\n\n            }\n        );\n\n    }\n\n\n    window.addEventListener(\n        \"scroll\",\n        updateActiveNavigation\n    );\n\n\n    \/* =====================================================\n       9. SCROLL REVEAL ANIMATION\n       ===================================================== *\/\n\n    const animatedElements =\n        document.querySelectorAll(\n            \".wnsa-benefit-card, \" +\n            \".wnsa-quality-item, \" +\n            \".wnsa-how-card, \" +\n            \".wnsa-testimonial-card, \" +\n            \".wnsa-faq-item\"\n        );\n\n\n    if (\n        \"IntersectionObserver\"\n        in window\n    ) {\n\n        const observer =\n            new IntersectionObserver(\n                function (\n                    entries,\n                    observer\n                ) {\n\n                    entries.forEach(\n                        function (entry) {\n\n                            if (\n                                entry.isIntersecting\n                            ) {\n\n                                entry.target.classList.add(\n                                    \"wnsa-visible\"\n                                );\n\n                                observer.unobserve(\n                                    entry.target\n                                );\n\n                            }\n\n                        }\n                    );\n\n                },\n                {\n                    threshold: 0.12\n                }\n            );\n\n\n        animatedElements.forEach(\n            function (element) {\n\n                element.classList.add(\n                    \"wnsa-reveal\"\n                );\n\n                observer.observe(\n                    element\n                );\n\n            }\n        );\n\n    }\n\n\n    \/* =====================================================\n       10. PREVENT EMPTY LINKS\n       ===================================================== *\/\n\n    document.querySelectorAll(\n        'a[href=\"#\"]'\n    ).forEach(\n        function (link) {\n\n            link.addEventListener(\n                \"click\",\n                function (event) {\n\n                    event.preventDefault();\n\n                }\n            );\n\n        }\n    );\n\n\n    \/* =====================================================\n       11. INITIALISE\n       ===================================================== *\/\n\n    updateQuantity();\n    updateCart();\n    updateActiveNavigation();\n\n});\n<\/script>\n\n<!-- =========================================\n     WHY NOT SA - TOP BAR & HEADER\n     ========================================= -->\n\n<header class=\"wnsa-header\">\n\n    <!-- TOP ANNOUNCEMENT BAR -->\n    <div class=\"wnsa-top-bar\">\n\n        <div class=\"wnsa-top-bar-inner\">\n\n            <span>\n                \u2726 Premium Quality Collagen Powder\n            <\/span>\n\n            <span class=\"wnsa-top-divider\">\n                \u2022\n            <\/span>\n\n            <span>\n                Glow from the Inside Out\n            <\/span>\n\n        <\/div>\n\n        <div class=\"wnsa-social-links\">\n\n            <a href=\"#\" aria-label=\"Facebook\">\n                f\n            <\/a>\n\n            <a href=\"#\" aria-label=\"Instagram\">\n                \u25ce\n            <\/a>\n\n        <\/div>\n\n    <\/div>\n\n\n    <!-- MAIN NAVIGATION -->\n    <div class=\"wnsa-navbar\">\n\n        <!-- LOGO -->\n        <a href=\"\/\" class=\"wnsa-logo\">\n\n            <img decoding=\"async\" src=\"https:\/\/whynotsa.co.za\/wp-content\/uploads\/2023\/11\/PNG-%EF%BF%BD-WHY-NOT-SAL-RE-DESIGNED-scaled.png\" alt=\"Why Not SA Collagen\">\n\n        <\/a>\n\n\n        <!-- NAVIGATION -->\n        <nav class=\"wnsa-nav\" aria-label=\"Main Navigation\">\n\n            <a href=\"#home\" class=\"active\">\n                Home\n            <\/a>\n\n            <a href=\"#about\">\n                About\n            <\/a>\n\n            <a href=\"#product\">\n                Product\n            <\/a>\n\n            <a href=\"#benefits\">\n                Benefits\n            <\/a>\n\n            <a href=\"#how-to\">\n                How To Use\n            <\/a>\n\n            <a href=\"#reviews\">\n                Reviews\n            <\/a>\n\n            <a href=\"#faq\">\n                FAQ\n            <\/a>\n\n            <a href=\"#contact\">\n                Contact\n            <\/a>\n\n        <\/nav>\n\n\n        <!-- HEADER ACTIONS -->\n        <div class=\"wnsa-header-actions\">\n\n            <a href=\"#cart\" class=\"wnsa-cart\" aria-label=\"Shopping Cart\">\n\n                <span class=\"wnsa-cart-icon\">\n                    \ud83d\uded2\n                <\/span>\n\n                <span class=\"wnsa-cart-count\">\n                    0\n                <\/span>\n\n            <\/a>\n\n\n            <a href=\"#product\" class=\"wnsa-shop-button\">\n                Shop Now\n                <span>\u2192<\/span>\n            <\/a>\n\n        <\/div>\n<div class=\"wnsa-menu-toggle\" role=\"button\" tabindex=\"0\" aria-label=\"Open menu\" aria-expanded=\"false\">\n    <span><\/span>\n    <span><\/span>\n    <span><\/span>\n<\/div>\n    <\/div>\n\n<\/header>\n\n\n\n<!-- =========================================\n     WHY NOT SA - FULL WIDTH HERO\n     ========================================= -->\n\n<section class=\"wnsa-hero\" id=\"home\">\n\n\n    <!-- =====================================\n         FULL WIDTH HERO IMAGE\n         ===================================== -->\n\n    <div class=\"wnsa-hero-background\">\n\n        <img decoding=\"async\" src=\"https:\/\/whynotsa.co.za\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-15-2026-01_55_05-PM.png\" alt=\"Why Not SA Collagen\">\n\n    <\/div>\n\n\n    <!-- =====================================\n         VERY LIGHT IMAGE OVERLAY\n         ===================================== -->\n\n    <div class=\"wnsa-hero-overlay\"><\/div>\n\n\n    <!-- =====================================\n         HERO CONTENT\n         ===================================== -->\n\n    <div class=\"wnsa-hero-container\">\n\n        <div class=\"wnsa-hero-content\">\n\n\n            <span class=\"wnsa-hero-eyebrow\">\n                PURE \u2022 PREMIUM \u2022 UNFLAVOURED\n            <\/span>\n\n\n            <h1>\n                Glow From\n                <span>\n                    The Inside Out.\n                <\/span>\n            <\/h1>\n\n\n            <p class=\"wnsa-hero-tagline\">\n                Beauty support from the inside out.\n            <\/p>\n\n\n            <p class=\"wnsa-hero-description\">\n                Pure bovine collagen peptides designed to support\n                healthy skin, hair, nails and joints \u2014 with no\n                flavour, making it easy to add to your daily routine.\n            <\/p>\n\n\n            <!-- BENEFITS -->\n\n            <div class=\"wnsa-hero-benefits\">\n\n                <div class=\"wnsa-hero-benefit\">\n\n                    <span>\n                        \u2726\n                    <\/span>\n\n                    <p>\n                        Healthy Skin\n                    <\/p>\n\n                <\/div>\n\n\n                <div class=\"wnsa-hero-benefit\">\n\n                    <span>\n                        \u2726\n                    <\/span>\n\n                    <p>\n                        Hair &amp; Nails\n                    <\/p>\n\n                <\/div>\n\n\n                <div class=\"wnsa-hero-benefit\">\n\n                    <span>\n                        \u2726\n                    <\/span>\n\n                    <p>\n                        Joint Support\n                    <\/p>\n\n                <\/div>\n\n            <\/div>\n\n\n            <!-- BUTTONS -->\n\n            <div class=\"wnsa-hero-buttons\">\n\n                <a href=\"#product\" class=\"wnsa-primary-button\">\n                    Shop Now\n                    <span>\u2192<\/span>\n                <\/a>\n\n\n                <a href=\"#about\" class=\"wnsa-secondary-button\">\n                    Learn More\n                <\/a>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n<!-- =========================================\n     WHY NOT SA - BENEFITS SECTION\n     ========================================= -->\n\n<section class=\"wnsa-benefits\" id=\"benefits\">\n\n    <div class=\"wnsa-benefits-container\">\n\n        <!-- SECTION INTRO -->\n        <div class=\"wnsa-section-heading\">\n\n            <span class=\"wnsa-section-eyebrow\">\n                WHY COLLAGEN?\n            <\/span>\n\n            <h2>\n                Beauty &amp; Wellness\n                <span>From Within<\/span>\n            <\/h2>\n\n            <p>\n                Our pure bovine collagen peptides are an easy way\n                to add collagen to your everyday routine, supporting\n                the things that matter from the inside out.\n            <\/p>\n\n        <\/div>\n\n\n        <!-- BENEFITS GRID -->\n        <div class=\"wnsa-benefits-grid\">\n\n\n            <!-- BENEFIT 1 -->\n            <article class=\"wnsa-benefit-card\">\n\n                <div class=\"wnsa-benefit-number\">\n                    01\n                <\/div>\n\n                <div class=\"wnsa-benefit-icon\">\n                    \u2661\n                <\/div>\n\n                <h3>\n                    Healthy Skin\n                <\/h3>\n\n                <p>\n                    Supports healthy-looking skin and helps you\n                    maintain a natural, radiant appearance.\n                <\/p>\n\n                <a href=\"#product\">\n                    Discover More \u2192\n                <\/a>\n\n            <\/article>\n\n\n            <!-- BENEFIT 2 -->\n            <article class=\"wnsa-benefit-card wnsa-benefit-featured\">\n\n                <div class=\"wnsa-benefit-number\">\n                    02\n                <\/div>\n\n                <div class=\"wnsa-benefit-icon\">\n                    \u2726\n                <\/div>\n\n                <h3>\n                    Hair &amp; Nails\n                <\/h3>\n\n                <p>\n                    Collagen is a simple addition to your daily\n                    routine to support healthy hair and nails.\n                <\/p>\n\n                <a href=\"#product\">\n                    Discover More \u2192\n                <\/a>\n\n            <\/article>\n\n\n            <!-- BENEFIT 3 -->\n            <article class=\"wnsa-benefit-card\">\n\n                <div class=\"wnsa-benefit-number\">\n                    03\n                <\/div>\n\n                <div class=\"wnsa-benefit-icon\">\n                    \u25c7\n                <\/div>\n\n                <h3>\n                    Joint Support\n                <\/h3>\n\n                <p>\n                    Add collagen to your daily routine to support\n                    healthy joints and everyday movement.\n                <\/p>\n\n                <a href=\"#product\">\n                    Discover More \u2192\n                <\/a>\n\n            <\/article>\n\n\n            <!-- BENEFIT 4 -->\n            <article class=\"wnsa-benefit-card\">\n\n                <div class=\"wnsa-benefit-number\">\n                    04\n                <\/div>\n\n                <div class=\"wnsa-benefit-icon\">\n                    \u263c\n                <\/div>\n\n                <h3>\n                    Everyday Wellness\n                <\/h3>\n\n                <p>\n                    An easy, unflavoured collagen powder that fits\n                    effortlessly into your daily lifestyle.\n                <\/p>\n\n                <a href=\"#product\">\n                    Discover More \u2192\n                <\/a>\n\n            <\/article>\n\n        <\/div>\n\n\n        <!-- BOTTOM STATEMENT -->\n        <div class=\"wnsa-benefits-bottom\">\n\n            <div class=\"wnsa-benefits-line\"><\/div>\n\n            <p>\n                PURE COLLAGEN \u2022 SIMPLE ROUTINE \u2022 EVERYDAY WELLNESS\n            <\/p>\n\n            <div class=\"wnsa-benefits-line\"><\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n<!-- =========================================\n     WHY NOT SA - PRODUCT SECTION\n     ========================================= -->\n\n<section class=\"wnsa-product-section\" id=\"product\">\n\n    <div class=\"wnsa-product-container\">\n\n        <!-- PRODUCT IMAGE -->\n        <div class=\"wnsa-product-showcase\">\n\n            <div class=\"wnsa-product-bg-circle\"><\/div>\n\n            <div class=\"wnsa-product-badge\">\n                <span>PURE<\/span>\n                <strong>COLLAGEN<\/strong>\n            <\/div>\n\n            <div class=\"wnsa-main-product-image\">\n\n                <img decoding=\"async\" src=\"https:\/\/whynotsa.co.za\/wp-content\/uploads\/2026\/08\/Collagen-smoothie-Resize.png\" alt=\"Why Not SA Pure Bovine Collagen Powder 300g\">\n\n            <\/div>\n\n        <\/div>\n\n\n        <!-- PRODUCT INFORMATION -->\n        <div class=\"wnsa-product-info\">\n\n            <span class=\"wnsa-product-eyebrow\">\n                WHY NOT SA \u2022 300G\n            <\/span>\n\n            <h2>\n                Pure Bovine\n                <span>Collagen Peptides<\/span>\n            <\/h2>\n\n            <div class=\"wnsa-product-stars\">\n                \u2605\u2605\u2605\u2605\u2605\n                <span>Premium Quality<\/span>\n            <\/div>\n\n            <p class=\"wnsa-product-intro\">\n                A simple, pure and unflavoured collagen powder\n                designed to fit effortlessly into your everyday\n                wellness routine.\n            <\/p>\n\n\n            <!-- PRODUCT FEATURES -->\n\n            <div class=\"wnsa-product-features\">\n\n                <div class=\"wnsa-product-feature\">\n                    <span>\u2713<\/span>\n                    <p>Pure bovine collagen peptides<\/p>\n                <\/div>\n\n                <div class=\"wnsa-product-feature\">\n                    <span>\u2713<\/span>\n                    <p>Unflavoured and easy to mix<\/p>\n                <\/div>\n\n                <div class=\"wnsa-product-feature\">\n                    <span>\u2713<\/span>\n                    <p>Grass-fed &amp; pasture raised<\/p>\n                <\/div>\n\n                <div class=\"wnsa-product-feature\">\n                    <span>\u2713<\/span>\n                    <p>Halal<\/p>\n                <\/div>\n\n            <\/div>\n\n\n            <!-- PRODUCT PRICE -->\n\n            <div class=\"wnsa-product-price-area\">\n\n                <span class=\"wnsa-price-label\">\n                    300G TIN\n                <\/span>\n\n                <span class=\"wnsa-product-price\">\n                    R300\n                <\/span>\n\n            <\/div>\n\n\n            <!-- QUANTITY -->\n\n            <div class=\"wnsa-product-buy\">\n\n    <div class=\"wnsa-quantity\">\n        <button type=\"button\" class=\"wnsa-quantity-minus\" aria-label=\"Decrease quantity\">\u2212<\/button>\n        <span class=\"wnsa-quantity-value\">1<\/span>\n        <button type=\"button\" class=\"wnsa-quantity-plus\" aria-label=\"Increase quantity\">+<\/button>\n    <\/div>\n\n   <a href=\"\/cart\/?add-to-cart=123&amp;quantity=1\" class=\"wnsa-add-to-cart\" data-product-id=\"123\" style=\"color:#ffffff !important; text-decoration:none !important;\">\n    <span class=\"wnsa-add-label\" style=\"color:inherit !important;\">Add To Cart<\/span>\n    <span class=\"wnsa-add-arrow\" style=\"color:inherit !important;\">\u2192<\/span>\n<\/a>\n<\/div>\n\n<script>\n(function () {\n    var btn = document.querySelector('.wnsa-add-to-cart');\n    var valueEl = document.querySelector('.wnsa-quantity-value');\n    var minus = document.querySelector('.wnsa-quantity-minus');\n    var plus = document.querySelector('.wnsa-quantity-plus');\n    if (!btn || !valueEl) return;\n\n    var id = btn.getAttribute('data-product-id');\n    var label = btn.querySelector('.wnsa-add-label');\n    var arrow = btn.querySelector('.wnsa-add-arrow');\n    var qty = 1;\n    var busy = false;\n\n    function update() {\n        valueEl.textContent = qty;\n        btn.href = '\/cart\/?add-to-cart=' + id + '&quantity=' + qty;\n    }\n\n    minus.addEventListener('click', function () {\n        if (qty > 1) { qty--; update(); }\n    });\n\n    plus.addEventListener('click', function () {\n        if (qty < 20) { qty++; update(); }\n    });\n\n    btn.addEventListener('click', function (e) {\n        e.preventDefault();\n        if (busy) return;\n        busy = true;\n        btn.classList.add('wnsa-busy');\n        label.textContent = 'Adding...';\n        arrow.textContent = '';\n\n        var data = new URLSearchParams();\n        data.append('product_id', id);\n        data.append('quantity', qty);\n\n        fetch('\/?wc-ajax=add_to_cart', {\n            method: 'POST',\n            credentials: 'same-origin',\n            headers: { 'Content-Type': 'application\/x-www-form-urlencoded' },\n            body: data\n        })\n        .then(function (r) { return r.json(); })\n        .then(function (res) {\n            if (!res || res.error) { throw new Error('add failed'); }\n            label.textContent = 'Added to Cart';\n            arrow.textContent = '\u2713';\n            btn.classList.remove('wnsa-busy');\n            btn.classList.add('wnsa-added');\n            setTimeout(function () {\n                window.location.href = '\/cart\/';\n            }, 1200);\n        })\n        .catch(function () {\n            \/* Fallback: add through the link and land on the cart page *\/\n            window.location.href = btn.href;\n        });\n    });\n})();\n<\/script>\n\n\n            <!-- PRODUCT NOTES -->\n\n            <div class=\"wnsa-product-notes\">\n\n                <span>\u2726<\/span>\n\n                <p>\n                    Easy to add to coffee, smoothies,\n                    water or your favourite drink.\n                <\/p>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n<!-- =========================================\n     WHY NOT SA - ABOUT \/ BRAND SECTION\n     ========================================= -->\n\n<section class=\"wnsa-about\" id=\"about\">\n\n    <div class=\"wnsa-about-container\">\n\n        <!-- LEFT IMAGE -->\n        <div class=\"wnsa-about-visual\">\n\n            <div class=\"wnsa-about-image\">\n                <img decoding=\"async\" src=\"https:\/\/whynotsa.co.za\/wp-content\/uploads\/2026\/08\/Collagen-Model.3.png\" alt=\"Why Not SA Collagen\">\n            <\/div>\n\n            <div class=\"wnsa-about-badge\">\n                <strong>Glow From Within<\/strong>\n            <\/div>\n\n        <\/div>\n\n\n        <!-- RIGHT CONTENT -->\n        <div class=\"wnsa-about-content\">\n\n            <span class=\"wnsa-section-eyebrow\">\n                ABOUT WHY NOT SA\n            <\/span>\n\n            <h2>\n                Simple.\n                <span>Pure. Effective.<\/span>\n            <\/h2>\n\n            <p class=\"wnsa-about-lead\">\n                We believe looking after yourself shouldn't have\n                to be complicated.\n            <\/p>\n\n            <p>\n                Why Not SA Collagen was created with a simple\n                purpose \u2014 to make adding quality collagen to your\n                everyday routine easy.\n            <\/p>\n\n            <p>\n                Our pure bovine collagen peptides are unflavoured,\n                versatile and easy to incorporate into your favourite\n                drinks, smoothies or meals.\n            <\/p>\n\n\n            <!-- BRAND VALUES -->\n            <div class=\"wnsa-about-values\">\n\n                <div class=\"wnsa-about-value\">\n                    <span>01<\/span>\n                    <div>\n                        <h3>Quality First<\/h3>\n                        <p>\n                            Carefully selected collagen peptides\n                            for your daily routine.\n                        <\/p>\n                    <\/div>\n                <\/div>\n\n                <div class=\"wnsa-about-value\">\n                    <span>02<\/span>\n                    <div>\n                        <h3>Keep It Simple<\/h3>\n                        <p>\n                            No unnecessary flavour \u2014 just pure,\n                            versatile collagen powder.\n                        <\/p>\n                    <\/div>\n                <\/div>\n\n                <div class=\"wnsa-about-value\">\n                    <span>03<\/span>\n                    <div>\n                        <h3>Made For Everyday<\/h3>\n                        <p>\n                            An easy addition to the lifestyle\n                            you already have.\n                        <\/p>\n                    <\/div>\n                <\/div>\n\n            <\/div>\n\n\n            <a href=\"#product\" class=\"wnsa-about-button\">\n                Discover Our Collagen\n                <span>\u2192<\/span>\n            <\/a>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n<!-- =========================================\n     WHY NOT SA - WHAT'S INSIDE SECTION\n     ========================================= -->\n\n<section class=\"wnsa-inside\" id=\"quality\">\n\n    <div class=\"wnsa-inside-container\">\n\n        <!-- SECTION HEADING -->\n        <div class=\"wnsa-section-heading\">\n\n            <span class=\"wnsa-section-eyebrow\">\n                PURE BY DESIGN\n            <\/span>\n\n            <h2>\n                Nothing Extra.\n                <span>Just Pure Collagen.<\/span>\n            <\/h2>\n\n            <p>\n                We keep our collagen simple. Pure bovine collagen\n                peptides with no unnecessary additions, so you can\n                easily make it part of your everyday routine.\n            <\/p>\n\n        <\/div>\n\n\n        <!-- QUALITY CONTENT -->\n        <div class=\"wnsa-quality-grid\">\n\n            <!-- LEFT COLUMN -->\n            <div class=\"wnsa-quality-list\">\n\n                <div class=\"wnsa-quality-item\">\n\n                    <div class=\"wnsa-quality-icon\">\n                        \u2713\n                    <\/div>\n\n                    <div>\n                        <h3>Pure Bovine Collagen<\/h3>\n                        <p>\n                            Made from high-quality bovine collagen\n                            peptides.\n                        <\/p>\n                    <\/div>\n\n                <\/div>\n\n\n                <div class=\"wnsa-quality-item\">\n\n                    <div class=\"wnsa-quality-icon\">\n                        \u2713\n                    <\/div>\n\n                    <div>\n                        <h3>Unflavoured<\/h3>\n                        <p>\n                            A neutral taste that makes it easy to\n                            add to your favourite drinks and meals.\n                        <\/p>\n                    <\/div>\n\n                <\/div>\n\n\n                <div class=\"wnsa-quality-item\">\n\n                    <div class=\"wnsa-quality-icon\">\n                        \u2713\n                    <\/div>\n\n                    <div>\n                        <h3>Grass-Fed &amp; Pasture Raised<\/h3>\n                        <p>\n                            Carefully sourced collagen for a product\n                            you can feel good about adding to your routine.\n                        <\/p>\n                    <\/div>\n\n                <\/div>\n\n            <\/div>\n\n\n            <!-- CENTRE PRODUCT -->\n            <div class=\"wnsa-quality-product\">\n\n                <div class=\"wnsa-quality-circle\"><\/div>\n\n                <img decoding=\"async\" src=\"https:\/\/whynotsa.co.za\/wp-content\/uploads\/2026\/08\/Collagen-Tins-x3.png\" alt=\"Why Not SA Pure Collagen Powder\">\n\n                <div class=\"wnsa-quality-stamp\">\n                    <span>PURE<\/span>\n                    <strong>300g<\/strong>\n                <\/div>\n\n            <\/div>\n\n\n            <!-- RIGHT COLUMN -->\n            <div class=\"wnsa-quality-list\">\n\n                <div class=\"wnsa-quality-item\">\n\n                    <div class=\"wnsa-quality-icon\">\n                        \u2713\n                    <\/div>\n\n                    <div>\n                        <h3>Halal<\/h3>\n                        <p>\n                            Suitable for customers looking for\n                            Halal collagen.\n                        <\/p>\n                    <\/div>\n\n                <\/div>\n\n\n                <div class=\"wnsa-quality-item\">\n\n                    <div class=\"wnsa-quality-icon\">\n                        \u2713\n                    <\/div>\n\n                    <div>\n                        <h3>No Added Flavour<\/h3>\n                        <p>\n                            Nothing overpowering, so you can mix it\n                            into your favourite recipes.\n                        <\/p>\n                    <\/div>\n\n                <\/div>\n\n\n                <div class=\"wnsa-quality-item\">\n\n                    <div class=\"wnsa-quality-icon\">\n                        \u2713\n                    <\/div>\n\n                    <div>\n                        <h3>Easy Everyday Routine<\/h3>\n                        <p>\n                            Mix it into water, coffee, smoothies\n                            or your favourite drink.\n                        <\/p>\n                    <\/div>\n\n                <\/div>\n\n            <\/div>\n\n        <\/div>\n\n\n        <!-- FREE FROM -->\n        <div class=\"wnsa-free-from\">\n\n            <span>FREE FROM<\/span>\n\n            <div class=\"wnsa-free-items\">\n                <p>Cholesterol<\/p>\n                <p>Carbohydrates<\/p>\n                <p>Dietary Fibre<\/p>\n                <p>GMO<\/p>\n                <p>Fat<\/p>\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n<!-- =========================================\n     WHY NOT SA - HOW TO USE SECTION\n     ========================================= -->\n\n<!-- =========================================\n     WHY NOT SA - HOW TO USE\n     ========================================= -->\n\n<section class=\"wnsa-how\" id=\"how-to\">\n\n    <div class=\"wnsa-how-container\">\n\n        <!-- SECTION INTRO -->\n\n        <div class=\"wnsa-how-intro\">\n\n            <span class=\"wnsa-how-eyebrow\">\n                MAKE IT PART OF YOUR ROUTINE\n            <\/span>\n\n            <h2>\n                Easy To Add.\n                <span>Easy To Enjoy.<\/span>\n            <\/h2>\n\n            <p>\n                Our unflavoured collagen powder blends easily into\n                your favourite drinks, smoothies and meals.\n            <\/p>\n\n        <\/div>\n\n\n        <!-- CARDS -->\n\n        <div class=\"wnsa-how-grid\">\n\n\n            <!-- CARD 01 -->\n\n            <article class=\"wnsa-how-card\">\n\n                <span class=\"wnsa-how-number\">\n                    01\n                <\/span>\n\n                <div class=\"wnsa-how-icon\">\n\n                    <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\n                        <path d=\"M9 20h25v9c0 6-5 10-10 10h-5c-6 0-10-4-10-10v-9Z\"><\/path>\n                        <path d=\"M34 23h4c4 0 6 3 6 6s-2 6-6 6h-4\"><\/path>\n                        <path d=\"M14 15c0-2 2-3 2-5\"><\/path>\n                        <path d=\"M21 15c0-2 2-3 2-5\"><\/path>\n                        <path d=\"M28 15c0-2 2-3 2-5\"><\/path>\n                        <path d=\"M7 42h30\"><\/path>\n                    <\/svg>\n\n                <\/div>\n\n                <h3>\n                    Coffee\n                <\/h3>\n\n                <p>\n                    Stir into your morning coffee for an\n                    effortless addition to your daily routine.\n                <\/p>\n\n            <\/article>\n\n\n            <!-- CARD 02 -->\n\n            <article class=\"wnsa-how-card\">\n\n                <span class=\"wnsa-how-number\">\n                    02\n                <\/span>\n\n                <div class=\"wnsa-how-icon\">\n\n                    <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\n                        <path d=\"M15 15h19l-2 27H17l-2-27Z\"><\/path>\n                        <path d=\"M15 21h19\"><\/path>\n                        <path d=\"M25 15V7\"><\/path>\n                        <path d=\"M25 7h8\"><\/path>\n                        <path d=\"M20 27h9\"><\/path>\n                    <\/svg>\n\n                <\/div>\n\n                <h3>\n                    Smoothies\n                <\/h3>\n\n                <p>\n                    Add it to your favourite smoothie for a\n                    simple collagen boost.\n                <\/p>\n\n            <\/article>\n\n\n            <!-- CARD 03 -->\n\n            <article class=\"wnsa-how-card\">\n\n                <span class=\"wnsa-how-number\">\n                    03\n                <\/span>\n\n                <div class=\"wnsa-how-icon\">\n\n                    <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\n                        <path d=\"M24 6C20 13 12 21 12 30a12 12 0 0 0 24 0c0-9-8-17-12-24Z\"><\/path>\n                        <path d=\"M18 31c1 3 3 5 6 5\"><\/path>\n                    <\/svg>\n\n                <\/div>\n\n                <h3>\n                    Water\n                <\/h3>\n\n                <p>\n                    Mix with water or your favourite drink\n                    whenever it suits your routine.\n                <\/p>\n\n            <\/article>\n\n\n            <!-- CARD 04 -->\n\n            <article class=\"wnsa-how-card\">\n\n                <span class=\"wnsa-how-number\">\n                    04\n                <\/span>\n\n                <div class=\"wnsa-how-icon\">\n\n                    <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\n                        <path d=\"M13 10l25 25\"><\/path>\n                        <path d=\"M16 7l5 5\"><\/path>\n                        <path d=\"M12 11l5 5\"><\/path>\n                        <path d=\"M9 14l5 5\"><\/path>\n                        <path d=\"M34 13c-4 0-8 4-8 8 0 3 2 5 5 5 4 0 8-4 8-8 0-3-2-5-5-5Z\"><\/path>\n                        <path d=\"M28 27L17 38\"><\/path>\n                        <path d=\"M14 35l-3 3\"><\/path>\n                    <\/svg>\n\n                <\/div>\n\n                <h3>\n                    Your Favourite Recipes\n                <\/h3>\n\n                <p>\n                    Because it is unflavoured, it can be\n                    incorporated into a variety of everyday\n                    recipes.\n                <\/p>\n\n            <\/article>\n\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n<!-- =========================================\n     WHY NOT SA - TESTIMONIALS SECTION\n     ========================================= -->\n\n<section class=\"wnsa-testimonials\" id=\"reviews\">\n\n    <div class=\"wnsa-testimonials-container\">\n\n        <!-- HEADING -->\n        <div class=\"wnsa-section-heading\">\n\n            <span class=\"wnsa-section-eyebrow\">\n                CUSTOMER LOVE\n            <\/span>\n\n            <h2>\n                Loved By Our\n                <span>Community<\/span>\n            <\/h2>\n\n            <p>\n                Real routines, real experiences and a little more\n                glow from the inside out.\n            <\/p>\n\n        <\/div>\n\n\n        <!-- TESTIMONIAL GRID -->\n        <div class=\"wnsa-testimonials-grid\">\n\n\n            <!-- REVIEW 1 - DONNA -->\n            <article class=\"wnsa-testimonial-card\">\n\n                <div class=\"wnsa-testimonial-stars\">\n                    \u2605\u2605\u2605\u2605\u2605\n                <\/div>\n\n                <p class=\"wnsa-testimonial-text\">\n                    \u201cThe collagen is flavourless, so I can slip it into\n                    my husband\u2019s coffee every morning! Love it!\n                    Her service is great and fast. I will definitely\n                    recommend it to anyone.\u201d\n                <\/p>\n\n                <div class=\"wnsa-testimonial-author\">\n\n                    <div class=\"wnsa-author-avatar\">\n                        D\n                    <\/div>\n\n                    <div>\n                        <strong>Donna<\/strong>\n                        <span>Verified Customer<\/span>\n                    <\/div>\n\n                <\/div>\n\n            <\/article>\n\n\n            <!-- REVIEW 2 - MINETTE -->\n            <article class=\"wnsa-testimonial-card wnsa-testimonial-featured\">\n\n                <div class=\"wnsa-testimonial-quote\">\n                    \u201c\n                <\/div>\n\n                <div class=\"wnsa-testimonial-stars\">\n                    \u2605\u2605\u2605\u2605\u2605\n                <\/div>\n\n                <p class=\"wnsa-testimonial-text\">\n                    \u201cAn incredibly good product! My overall health improved\n                    within a few weeks. I am very happy with the product.\u201d\n                <\/p>\n\n                <div class=\"wnsa-testimonial-author\">\n\n                    <div class=\"wnsa-author-avatar\">\n                        M\n                    <\/div>\n\n                    <div>\n                        <strong>Minette<\/strong>\n                        <span>Verified Customer<\/span>\n                    <\/div>\n\n                <\/div>\n\n            <\/article>\n\n\n            <!-- REVIEW 3 - CELEST -->\n            <article class=\"wnsa-testimonial-card\">\n\n                <div class=\"wnsa-testimonial-stars\">\n                    \u2605\u2605\u2605\u2605\u2605\n                <\/div>\n\n                <p class=\"wnsa-testimonial-text\">\n                    \u201cThis collagen is amazing! My nails are harder,\n                    I have lots of new baby hair and I can feel an\n                    improvement in my gut health. I would 100%\n                    recommend this product!\u201d\n                <\/p>\n\n                <div class=\"wnsa-testimonial-author\">\n\n                    <div class=\"wnsa-author-avatar\">\n                        C\n                    <\/div>\n\n                    <div>\n                        <strong>Celest<\/strong>\n                        <span>Verified Customer<\/span>\n                    <\/div>\n\n                <\/div>\n\n            <\/article>\n\n\n        <\/div>\n\n\n        <!-- REVIEW CTA -->\n\n        <div class=\"wnsa-review-cta\">\n\n            <span>\n                \u2605\u2605\u2605\u2605\u2605\n            <\/span>\n\n            <p>\n                Have you tried Why Not SA?\n            <\/p>\n\n            <a href=\"#contact\">\n                Share Your Experience \u2192\n            <\/a>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n<!-- =========================================\n     WHY NOT SA - FAQ SECTION\n     ========================================= -->\n\n<section class=\"wnsa-faq\" id=\"faq\">\n\n    <div class=\"wnsa-faq-container\">\n\n        <!-- LEFT SIDE -->\n        <div class=\"wnsa-faq-intro\">\n\n            <span class=\"wnsa-section-eyebrow\">\n                HAVE QUESTIONS?\n            <\/span>\n\n            <h2>\n                We've Got\n                <span>Answers.<\/span>\n            <\/h2>\n\n            <p>\n                Everything you need to know about our pure,\n                unflavoured collagen powder.\n            <\/p>\n\n            <a href=\"#contact\" class=\"wnsa-faq-contact\">\n                Still Have Questions?\n                <span>\u2192<\/span>\n            <\/a>\n\n        <\/div>\n\n\n        <!-- RIGHT SIDE -->\n        <div class=\"wnsa-faq-list\">\n\n\n            <!-- FAQ 1 -->\n            <div class=\"wnsa-faq-item active\">\n\n                <button type=\"button\" class=\"wnsa-faq-question\" aria-expanded=\"true\">\n                    <span>\n                        What is Why Not SA Collagen?\n                    <\/span>\n\n                    <b>\u2212<\/b>\n                <\/button>\n\n                <div class=\"wnsa-faq-answer\">\n\n                    <p>\n                        Why Not SA Collagen is a pure bovine collagen\n                        peptide powder. It is unflavoured, making it\n                        easy to add to your favourite drinks, smoothies\n                        or meals.\n                    <\/p>\n\n                <\/div>\n\n            <\/div>\n\n\n            <!-- FAQ 2 -->\n            <div class=\"wnsa-faq-item\">\n\n                <button type=\"button\" class=\"wnsa-faq-question\" aria-expanded=\"false\">\n                    <span>\n                        Is the collagen flavoured?\n                    <\/span>\n\n                    <b>+<\/b>\n                <\/button>\n\n                <div class=\"wnsa-faq-answer\">\n\n                    <p>\n                        No. Our collagen is completely unflavoured,\n                        so it can easily be added to coffee, water,\n                        smoothies and other foods or drinks.\n                    <\/p>\n\n                <\/div>\n\n            <\/div>\n\n\n            <!-- FAQ 3 -->\n            <div class=\"wnsa-faq-item\">\n\n                <button type=\"button\" class=\"wnsa-faq-question\" aria-expanded=\"false\">\n                    <span>\n                        What can I mix it with?\n                    <\/span>\n\n                    <b>+<\/b>\n                <\/button>\n\n                <div class=\"wnsa-faq-answer\">\n\n                    <p>\n                        Because it is unflavoured, you can mix it\n                        into water, coffee, smoothies or incorporate\n                        it into your favourite recipes.\n                    <\/p>\n\n                <\/div>\n\n            <\/div>\n\n\n            <!-- FAQ 4 -->\n            <div class=\"wnsa-faq-item\">\n\n                <button type=\"button\" class=\"wnsa-faq-question\" aria-expanded=\"false\">\n                    <span>\n                        What are the benefits of collagen?\n                    <\/span>\n\n                    <b>+<\/b>\n                <\/button>\n\n                <div class=\"wnsa-faq-answer\">\n\n                    <p>\n                        Collagen is an important structural protein\n                        in the body. Our collagen is designed to\n                        support healthy skin, hair, nails and joints\n                        as part of a balanced lifestyle.\n                    <\/p>\n\n                <\/div>\n\n            <\/div>\n\n\n            <!-- FAQ 5 -->\n            <div class=\"wnsa-faq-item\">\n\n                <button type=\"button\" class=\"wnsa-faq-question\" aria-expanded=\"false\">\n                    <span>\n                        Is Why Not SA Collagen Halal?\n                    <\/span>\n\n                    <b>+<\/b>\n                <\/button>\n\n                <div class=\"wnsa-faq-answer\">\n\n                    <p>\n                        Yes. Our collagen is Halal.\n                    <\/p>\n\n                <\/div>\n\n            <\/div>\n\n\n            <!-- FAQ 6 -->\n            <div class=\"wnsa-faq-item\">\n\n                <button type=\"button\" class=\"wnsa-faq-question\" aria-expanded=\"false\">\n                    <span>\n                        How much collagen is in the tin?\n                    <\/span>\n\n                    <b>+<\/b>\n                <\/button>\n\n                <div class=\"wnsa-faq-answer\">\n\n                    <p>\n                        Each Why Not SA tin contains 300g of pure\n                        bovine collagen powder.\n                    <\/p>\n\n                <\/div>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n<!-- =========================================\n     WHY NOT SA - FINAL CTA SECTION\n     ========================================= -->\n\n<section class=\"wnsa-final-cta\">\n\n    <div class=\"wnsa-final-cta-container\">\n\n        <!-- LEFT CONTENT -->\n        <div class=\"wnsa-final-cta-content\">\n\n            <span class=\"wnsa-final-eyebrow\">\n                YOUR DAILY WELLNESS RITUAL\n            <\/span>\n\n            <h2>\n                Glow From\n                <span>The Inside Out.<\/span>\n            <\/h2>\n\n            <p>\n                Make pure collagen part of your everyday routine\n                and take a simple step towards supporting healthy\n                skin, hair, nails and joints.\n            <\/p>\n\n            <a href=\"#product\" class=\"wnsa-final-button\">\n                Shop Why Not SA\n                <span>\u2192<\/span>\n            <\/a>\n\n        <\/div>\n\n\n        <!-- RIGHT PRODUCT -->\n        <div class=\"wnsa-final-product\">\n\n            <div class=\"wnsa-final-circle\"><\/div>\n\n            <div class=\"wnsa-final-sparkle sparkle-one\">\n                \u2726\n            <\/div>\n\n            <div class=\"wnsa-final-sparkle sparkle-two\">\n                \u2726\n            <\/div>\n\n            <img decoding=\"async\" src=\"https:\/\/whynotsa.co.za\/wp-content\/uploads\/2026\/08\/Collagen01.png\" alt=\"Why Not SA Pure Bovine Collagen Powder\">\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n<style>\n.wnsa-final-product img {\n    width: 420px !important;\n    height: 420px !important;\n    max-width: 100% !important;\n    box-sizing: border-box !important;\n    object-fit: cover !important;\n    object-position: center center !important;\n    border-radius: 50% !important;\n    border: 10px solid #EADAB7 !important;\n    transform: none !important;\n    filter: none !important;\n    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.30) !important;\n}\n\n.wnsa-final-circle {\n    opacity: 0 !important;\n}\n\n@media (max-width: 600px) {\n    .wnsa-final-product img {\n        width: 300px !important;\n        height: 300px !important;\n        border-width: 8px !important;\n    }\n}\n<\/style>\n<!-- =========================================\n     WHY NOT SA - FOOTER\n     ========================================= -->\n\n<footer class=\"wnsa-footer\" id=\"contact\">\n\n    <div class=\"wnsa-footer-container\">\n\n        <!-- BRAND -->\n        <div class=\"wnsa-footer-brand\">\n\n            <a href=\"\/\" class=\"wnsa-footer-logo\">\n                <img decoding=\"async\" src=\"https:\/\/whynotsa.co.za\/wp-content\/uploads\/2023\/11\/PNG-%EF%BF%BD-WHY-NOT-SAL-RE-DESIGNED-scaled.png\" alt=\"Why Not SA Collagen\">\n            <\/a>\n\n            <p>\n                Pure bovine collagen peptides designed to support\n                your everyday wellness routine.\n            <\/p>\n\n            <div class=\"wnsa-footer-socials\">\n\n                <a href=\"#\" aria-label=\"Facebook\">\n                    f\n                <\/a>\n\n                <a href=\"#\" aria-label=\"Instagram\">\n                    \u25ce\n                <\/a>\n\n                <a href=\"#\" aria-label=\"TikTok\">\n                    \u266a\n                <\/a>\n\n            <\/div>\n\n        <\/div>\n\n\n        <!-- QUICK LINKS -->\n        <div class=\"wnsa-footer-column\">\n\n            <h3>\n                Quick Links\n            <\/h3>\n\n            <a href=\"#home\">\n                Home\n            <\/a>\n\n            <a href=\"#about\">\n                About Us\n            <\/a>\n\n            <a href=\"#product\">\n                Our Product\n            <\/a>\n\n            <a href=\"#benefits\">\n                Benefits\n            <\/a>\n\n            <a href=\"#how-to\">\n                How To Use\n            <\/a>\n\n            <a href=\"#faq\">\n                FAQ\n            <\/a>\n\n        <\/div>\n\n\n        <!-- SHOP -->\n        <div class=\"wnsa-footer-column\">\n\n            <h3>\n                Shop\n            <\/h3>\n\n            <a href=\"#product\">\n                Collagen Powder\n            <\/a>\n\n            <a href=\"#product\">\n                300g Tin\n            <\/a>\n\n            <a href=\"#reviews\">\n                Customer Reviews\n            <\/a>\n\n            <a href=\"#product\">\n                Shop Now\n            <\/a>\n\n        <\/div>\n\n\n        <!-- CONTACT -->\n        <div class=\"wnsa-footer-column wnsa-footer-contact\">\n\n            <h3>\n                Get In Touch\n            <\/h3>\n\n            <a href=\"mailto:info@whynotsa.co.za\">\n                info@whynotsa.co.za\n            <\/a>\n\n            <a href=\"https:\/\/whynotsa.co.za\">\n                www.whynotsa.co.za\n            <\/a>\n\n            <p>\n                South Africa\n            <\/p>\n\n            <a href=\"#contact\" class=\"wnsa-footer-contact-button\">\n                Contact Us \u2192\n            <\/a>\n\n        <\/div>\n\n    <\/div>\n\n\n    <!-- NEWSLETTER -->\n    <div class=\"wnsa-footer-newsletter\">\n\n        <div>\n\n            <span>\n                STAY IN THE LOOP\n            <\/span>\n\n            <h3>\n                Wellness starts from within.\n            <\/h3>\n\n        <\/div>\n\n        <form class=\"wnsa-newsletter-form\">\n\n            <input type=\"email\" placeholder=\"Your email address\" aria-label=\"Email address\" required=\"\">\n\n            <button type=\"submit\">\n                Subscribe\n                <span>\u2192<\/span>\n            <\/button>\n\n        <\/form>\n\n    <\/div>\n\n\n    <!-- BOTTOM BAR -->\n    <div class=\"wnsa-footer-bottom\">\n\n        <p>\n            \u00a9 2026 Why Not SA. All Rights Reserved.\n        <\/p>\n\n        <div class=\"wnsa-footer-legal\">\n\n            <a href=\"#\">\n                Privacy Policy\n            <\/a>\n\n            <a href=\"#\">\n                Terms &amp; Conditions\n            <\/a>\n\n            <a href=\"#\">\n                Shipping &amp; Returns\n            <\/a>\n\n        <\/div>\n\n    <\/div>\n\n<\/footer>\n<style>\n\/* =========================================\n   WHY NOT SA - RESPONSIVE LAYOUT\n   ========================================= *\/\n\nhtml, body { overflow-x: hidden; }\n\n[class^=\"wnsa-\"], [class*=\" wnsa-\"] { box-sizing: border-box; }\n\n.wnsa-product-section img,\n.wnsa-about img,\n.wnsa-inside img,\n.wnsa-final-cta img,\n.wnsa-footer img { max-width: 100%; }\n\n\n\/* ---------- TABLET AND PHONE: MENU (1000px and below) ---------- *\/\n\n@media (max-width: 1000px) {\n\n    .wnsa-header .wnsa-navbar .wnsa-nav { display: none !important; }\n\n    .wnsa-header-actions { margin-left: auto !important; }\n\n    html body .wnsa-header .wnsa-navbar > .wnsa-menu-toggle.wnsa-menu-toggle.wnsa-menu-toggle {\n        display: flex !important;\n        flex-direction: column;\n        justify-content: center;\n        gap: 5px;\n        width: 42px;\n        height: 42px;\n        padding: 0 11px;\n        flex-shrink: 0;\n        cursor: pointer;\n        border-radius: 50%;\n        border: 1px solid rgba(200, 175, 146, 0.7);\n        background: #ffffff;\n    }\n\n    .wnsa-menu-toggle span {\n        display: block;\n        width: 100%;\n        height: 2px;\n        border-radius: 2px;\n        background: #075C68;\n        transition: transform 0.3s ease, opacity 0.3s ease;\n    }\n\n    .wnsa-menu-toggle.wnsa-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }\n    .wnsa-menu-toggle.wnsa-open span:nth-child(2) { opacity: 0; }\n    .wnsa-menu-toggle.wnsa-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }\n\n    .wnsa-header .wnsa-navbar .wnsa-nav.wnsa-open {\n        display: flex !important;\n        flex-direction: column;\n        align-items: stretch;\n        gap: 0;\n        position: absolute;\n        top: 100%;\n        left: 0;\n        right: 0;\n        margin: 0;\n        padding: 6px 24px 18px;\n        background: #F6F1E6;\n        border-bottom: 1px solid rgba(13, 124, 147, 0.12);\n        box-shadow: 0 18px 30px rgba(39, 56, 58, 0.12);\n        z-index: 999;\n    }\n\n    .wnsa-nav.wnsa-open a {\n        padding: 15px 0;\n        font-size: 13px;\n        border-bottom: 1px solid rgba(13, 124, 147, 0.10);\n    }\n\n    .wnsa-nav.wnsa-open a::after { display: none; }\n}\n\n\n\/* ---------- PHONE (768px and below) ---------- *\/\n\n@media (max-width: 768px) {\n\n    .wnsa-top-bar { padding: 8px 12px; text-align: center; }\n    .wnsa-top-divider,\n    .wnsa-top-bar-inner span:last-child { display: none !important; }\n\n    .wnsa-navbar { padding: 8px 16px !important; gap: 10px !important; min-height: 70px !important; }\n    .wnsa-logo img { width: 70px !important; }\n    .wnsa-shop-button { min-width: 0 !important; height: 36px !important; padding: 0 14px !important; font-size: 10px !important; white-space: nowrap; }\n    .wnsa-shop-button span { display: none; }\n\n    \/* Hero: stronger fade so the text stays readable over the photo *\/\n    .wnsa-hero,\n    .wnsa-hero-container { min-height: 640px !important; }\n    .wnsa-hero::before {\n        background: linear-gradient(180deg,\n            rgba(246, 241, 230, 0.78) 0%,\n            rgba(246, 241, 230, 0.55) 55%,\n            rgba(246, 241, 230, 0.25) 100%) !important;\n    }\n    .wnsa-hero-container { padding: 60px 22px !important; justify-content: center; text-align: center; }\n    .wnsa-hero-content { width: 100% !important; max-width: 560px; margin: 0 auto !important; }\n    .wnsa-hero h1 { font-size: 46px !important; letter-spacing: -1px !important; }\n    .wnsa-hero-tagline { font-size: 20px; }\n    .wnsa-hero-description { font-size: 14.5px !important; margin-left: auto; margin-right: auto; }\n    .wnsa-hero-benefits,\n    .wnsa-hero-buttons { justify-content: center; }\n}\n\n\n\/* ---------- SMALL PHONE (600px and below) ---------- *\/\n\n@media (max-width: 600px) {\n\n    \/* Hero buttons stacked *\/\n    .wnsa-hero-buttons { flex-direction: column; align-items: stretch; width: 100%; }\n    .wnsa-primary-button, .wnsa-secondary-button { width: 100%; }\n\n    \/* Section headings *\/\n    .wnsa-section-heading h2 { font-size: 38px !important; }\n    .wnsa-section-heading p { font-size: 14.5px !important; }\n\n    \/* Benefits *\/\n    .wnsa-benefit-card { min-height: auto !important; padding: 30px 25px 70px !important; }\n    .wnsa-benefit-card p { font-size: 14px; }\n\n    \/* Product *\/\n    .wnsa-product-showcase { min-height: 380px; }\n    .wnsa-product-info { text-align: center; }\n    .wnsa-product-features { text-align: left; }\n    .wnsa-product-feature p { font-size: 13px; }\n    .wnsa-product-price-area { justify-content: center; }\n    .wnsa-product-notes { justify-content: center; text-align: left; }\n    .wnsa-product-notes p { font-size: 12px; }\n    .wnsa-product-buy { flex-direction: column; align-items: stretch; }\n    .wnsa-quantity { justify-content: center; align-self: center; width: 150px; }\n    a.wnsa-add-to-cart, .wnsa-add-to-cart { width: 100%; flex: none; }\n\n    \/* About *\/\n    .wnsa-about-visual { min-height: 400px; margin-bottom: 0 !important; }\n    .wnsa-about-image { width: 290px !important; height: 360px !important; }\n    .wnsa-about-content > p { font-size: 15px; }\n    .wnsa-about-value p { font-size: 13px; }\n    .wnsa-about-value h3 { font-size: 19px; }\n\n    \/* What's inside *\/\n    .wnsa-quality-item p { font-size: 13px; }\n    .wnsa-free-items p { font-size: 12px; }\n\n    \/* How to use *\/\n    .wnsa-how-card { min-height: auto !important; padding: 34px 26px 32px !important; }\n    .wnsa-how-card p { font-size: 14px !important; max-width: 100% !important; }\n\n    \/* Reviews: author sits below the text instead of overlapping it *\/\n    .wnsa-testimonial-card { min-height: auto !important; padding: 30px 25px 95px !important; }\n    .wnsa-testimonial-text { font-size: 17px; }\n    .wnsa-testimonial-featured { transform: none !important; }\n\n    \/* FAQ *\/\n    .wnsa-faq-question { font-size: 16px; }\n    .wnsa-faq-answer p { font-size: 14px; }\n\n    \/* Final CTA *\/\n    .wnsa-final-cta h2 { font-size: 46px !important; }\n    .wnsa-final-cta-content > p { font-size: 15px; }\n    .wnsa-final-button { width: 100%; }\n\n    \/* Footer *\/\n    .wnsa-footer-brand > p { font-size: 14px; }\n    .wnsa-footer-column > a { font-size: 14px; margin-bottom: 14px; }\n    .wnsa-footer-contact > p { font-size: 14px; }\n    .wnsa-newsletter-form { width: 100% !important; max-width: none !important; }\n    .wnsa-newsletter-form input { font-size: 14px; }\n    .wnsa-footer-bottom p, .wnsa-footer-legal a { font-size: 11px; }\n}\n<\/style>\n\n<script>\n(function () {\n    var toggle = document.querySelector('.wnsa-menu-toggle');\n    var nav = document.querySelector('.wnsa-nav');\n    if (!toggle || !nav) return;\n\n    function setOpen(open) {\n        nav.classList.toggle('wnsa-open', open);\n        toggle.classList.toggle('wnsa-open', open);\n        toggle.setAttribute('aria-expanded', open ? 'true' : 'false');\n    }\n\n    toggle.addEventListener('click', function () {\n        setOpen(!nav.classList.contains('wnsa-open'));\n    });\n\n    toggle.addEventListener('keydown', function (e) {\n        if (e.key === 'Enter' || e.key === ' ') {\n            e.preventDefault();\n            setOpen(!nav.classList.contains('wnsa-open'));\n        }\n    });\n\n    nav.querySelectorAll('a').forEach(function (a) {\n        a.addEventListener('click', function () { setOpen(false); });\n    });\n\n    window.addEventListener('resize', function () {\n        if (window.innerWidth > 1000) setOpen(false);\n    });\n})();\n<\/script>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u2726 Premium Quality Collagen Powder \u2022 Glow from the Inside Out f \u25ce Home About Product Benefits How To Use Reviews FAQ Contact \ud83d\uded2 0 Shop Now \u2192 PURE \u2022 PREMIUM \u2022 UNFLAVOURED Glow From The Inside Out. Beauty support from the inside out. Pure bovine collagen peptides designed to support healthy skin, hair, nails [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"essential-blocks-fullwidth-template.php","meta":{"_et_pb_use_builder":"off","_et_pb_old_content":"<!-- wp:html -->\n<style data-wp-block-html=\"css\">\n\/* =========================================\n   WHY NOT SA - HEADER CSS\n   ========================================= *\/\n\n:root {\n    --wnsa-teal: #0D7C93;\n    --wnsa-dark-teal: #075C68;\n    --wnsa-gold: #C8AF92;\n    --wnsa-light-gold: #EADAB7;\n    --wnsa-cream: #F6F1E6;\n    --wnsa-white: #FFFDF8;\n    --wnsa-text: #26383A;\n}\n\n\n\/* ================================\n   HEADER\n   ================================ *\/\n\n.wnsa-header {\n    width: 100%;\n    position: relative;\n    z-index: 1000;\n    background: var(--wnsa-cream);\n}\n\n\n\/* ================================\n   TOP ANNOUNCEMENT BAR\n   ================================ *\/\n\n.wnsa-top-bar {\n    width: 100%;\n    min-height: 38px;\n    background: var(--wnsa-dark-teal);\n    color: #ffffff;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    position: relative;\n\n    font-family: Arial, sans-serif;\n    font-size: 13px;\n    letter-spacing: 0.4px;\n}\n\n.wnsa-top-bar-inner {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n}\n\n.wnsa-top-divider {\n    color: var(--wnsa-gold);\n}\n\n\n\/* SOCIAL ICONS *\/\n\n.wnsa-social-links {\n    position: absolute;\n    right: 35px;\n\n    display: flex;\n    align-items: center;\n    gap: 12px;\n}\n\n.wnsa-social-links a {\n    width: 22px;\n    height: 22px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 50%;\n\n    background: #ffffff;\n    color: var(--wnsa-dark-teal);\n\n    text-decoration: none;\n\n    font-size: 12px;\n    font-weight: 600;\n\n    transition: 0.3s ease;\n}\n\n.wnsa-social-links a:hover {\n    background: var(--wnsa-light-gold);\n    color: var(--wnsa-dark-teal);\n}\n\n\n\/* ================================\n   MAIN NAVIGATION\n   ================================ *\/\n\n.wnsa-navbar {\n    width: 100%;\n    min-height: 105px;\n\n    padding: 0 55px;\n\n    display: flex;\n    align-items: center;\n\n    position: relative;\n\n    background: rgba(246, 241, 230, 0.97);\n}\n\n\n\/* ================================\n   LOGO\n   ================================ *\/\n\n.wnsa-logo {\n    flex-shrink: 0;\n\n    display: flex;\n    align-items: center;\n}\n\n.wnsa-logo a {\n    display: block;\n    line-height: 0;\n}\n\n.wnsa-logo img {\n    width: 115px;\n    height: auto;\n\n    display: block;\n\n    object-fit: contain;\n}\n\n\n\/* ================================\n   NAVIGATION\n   ================================ *\/\n\n.wnsa-nav {\n    display: flex;\n    align-items: center;\n\n    gap: 38px;\n\n    margin-left: auto;\n    margin-right: 35px;\n}\n\n.wnsa-nav a {\n    position: relative;\n\n    color: var(--wnsa-text);\n\n    text-decoration: none;\n\n    font-family: Arial, sans-serif;\n    font-size: 13px;\n    font-weight: 600;\n\n    text-transform: uppercase;\n    letter-spacing: 0.6px;\n\n    padding: 10px 0;\n\n    transition: color 0.3s ease;\n}\n\n.wnsa-nav a:hover,\n.wnsa-nav a.active {\n    color: var(--wnsa-teal);\n}\n\n\n\/* GOLD UNDERLINE *\/\n\n.wnsa-nav a::after {\n    content: \"\";\n\n    position: absolute;\n\n    left: 0;\n    bottom: 0;\n\n    width: 0;\n    height: 2px;\n\n    background: var(--wnsa-gold);\n\n    transition: width 0.3s ease;\n}\n\n.wnsa-nav a:hover::after,\n.wnsa-nav a.active::after {\n    width: 100%;\n}\n\n\n\/* ================================\n   HEADER ACTIONS\n   ================================ *\/\n\n.wnsa-header-actions {\n    display: flex;\n    align-items: center;\n\n    gap: 22px;\n\n    flex-shrink: 0;\n}\n\n\n\/* CART *\/\n\n.wnsa-cart {\n    position: relative;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    color: var(--wnsa-dark-teal);\n\n    text-decoration: none;\n\n    width: 36px;\n    height: 36px;\n}\n\n.wnsa-cart-icon {\n    font-size: 21px;\n}\n\n.wnsa-cart-count {\n    position: absolute;\n\n    top: -2px;\n    right: -4px;\n\n    width: 17px;\n    height: 17px;\n\n    border-radius: 50%;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    background: var(--wnsa-gold);\n    color: #ffffff;\n\n    font-size: 9px;\n    font-weight: bold;\n}\n\n\n\/* ================================\n   SHOP NOW BUTTON\n   ================================ *\/\n\n.wnsa-shop-button {\n    display: inline-flex;\n\n    align-items: center;\n    justify-content: center;\n\n    min-width: 125px;\n    height: 43px;\n\n    padding: 0 25px;\n\n    border-radius: 30px;\n\n    background: var(--wnsa-dark-teal);\n    color: #ffffff;\n\n    text-decoration: none;\n\n    font-family: Arial, sans-serif;\n    font-size: 12px;\n    font-weight: 700;\n\n    text-transform: uppercase;\n    letter-spacing: 0.6px;\n\n    transition: all 0.3s ease;\n}\n\n.wnsa-shop-button:hover {\n    background: var(--wnsa-teal);\n    transform: translateY(-2px);\n}\n\n\n\/* ================================\n   TABLET\n   ================================ *\/\n\n@media (max-width: 1000px) {\n\n    .wnsa-navbar {\n        padding: 0 30px;\n    }\n\n    .wnsa-nav {\n        gap: 20px;\n        margin-right: 20px;\n    }\n\n    .wnsa-nav a {\n        font-size: 11px;\n    }\n\n    .wnsa-logo img {\n        width: 95px;\n    }\n\n    .wnsa-shop-button {\n        min-width: 105px;\n        padding: 0 18px;\n    }\n}\n\n\n\/* ================================\n   MOBILE\n   ================================ *\/\n\n@media (max-width: 768px) {\n\n    .wnsa-top-bar {\n        min-height: 34px;\n        font-size: 11px;\n    }\n\n    .wnsa-social-links {\n        display: none;\n    }\n\n    .wnsa-navbar {\n        min-height: 80px;\n        padding: 0 20px;\n    }\n\n    .wnsa-logo img {\n        width: 85px;\n    }\n\n    .wnsa-nav {\n        display: none;\n    }\n\n    .wnsa-header-actions {\n        margin-left: auto;\n        gap: 12px;\n    }\n\n    .wnsa-cart {\n        width: 32px;\n        height: 32px;\n    }\n\n    .wnsa-cart-icon {\n        font-size: 19px;\n    }\n\n    .wnsa-shop-button {\n        min-width: 95px;\n        height: 38px;\n\n        padding: 0 16px;\n\n        font-size: 10px;\n    }\n}\n\/* =========================================\n   WHY NOT SA - HERO SECTION\n   ========================================= *\/\n\n.wnsa-hero {\n    position: relative;\n    overflow: hidden;\n\n    background:\n        radial-gradient(\n            circle at 75% 45%,\n            rgba(234, 218, 183, 0.45),\n            transparent 30%\n        ),\n        var(--wnsa-cream);\n\n    min-height: 680px;\n}\n\n\n\/* HERO CONTAINER *\/\n\n.wnsa-hero-container {\n    max-width: 1250px;\n\n    min-height: 620px;\n\n    margin: 0 auto;\n\n    padding: 70px 55px;\n\n    display: grid;\n\n    grid-template-columns: 1fr 1fr;\n\n    align-items: center;\n\n    gap: 40px;\n}\n\n\n\/* =========================================\n   LEFT CONTENT\n   ========================================= *\/\n\n.wnsa-hero-content {\n    position: relative;\n    z-index: 5;\n\n    max-width: 570px;\n}\n\n\n\/* EYEBROW *\/\n\n.wnsa-hero-eyebrow {\n    display: inline-block;\n\n    margin-bottom: 18px;\n\n    color: var(--wnsa-teal);\n\n    font-family: Arial, sans-serif;\n\n    font-size: 11px;\n\n    font-weight: 700;\n\n    letter-spacing: 2.5px;\n}\n\n\n\/* MAIN HEADING *\/\n\n.wnsa-hero h1 {\n    margin: 0;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: clamp(55px, 6vw, 88px);\n\n    line-height: 0.92;\n\n    font-weight: 500;\n\n    letter-spacing: -3px;\n}\n\n.wnsa-hero h1 span {\n    display: block;\n\n    color: var(--wnsa-teal);\n}\n\n\n\/* TAGLINE *\/\n\n.wnsa-hero-tagline {\n    margin: 28px 0 12px;\n\n    color: var(--wnsa-text);\n\n    font-family: Georgia, serif;\n\n    font-size: 25px;\n\n    line-height: 1.3;\n}\n\n\n\/* DESCRIPTION *\/\n\n.wnsa-hero-description {\n    max-width: 500px;\n\n    margin: 0 0 25px;\n\n    color: #617173;\n\n    font-family: Arial, sans-serif;\n\n    font-size: 15px;\n\n    line-height: 1.8;\n}\n\n\n\/* =========================================\n   HERO BENEFITS\n   ========================================= *\/\n\n.wnsa-hero-benefits {\n    display: flex;\n\n    flex-wrap: wrap;\n\n    gap: 18px;\n\n    margin-bottom: 32px;\n}\n\n.wnsa-hero-benefit {\n    display: flex;\n\n    align-items: center;\n\n    gap: 7px;\n}\n\n.wnsa-hero-benefit span {\n    color: var(--wnsa-gold);\n\n    font-size: 15px;\n}\n\n.wnsa-hero-benefit p {\n    margin: 0;\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 12px;\n\n    font-weight: 700;\n}\n\n\n\/* =========================================\n   BUTTONS\n   ========================================= *\/\n\n.wnsa-hero-buttons {\n    display: flex;\n\n    align-items: center;\n\n    gap: 15px;\n}\n\n\n.wnsa-primary-button {\n    display: inline-flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    gap: 15px;\n\n    min-width: 155px;\n\n    height: 50px;\n\n    padding: 0 25px;\n\n    border-radius: 30px;\n\n    background: var(--wnsa-dark-teal);\n\n    color: #ffffff;\n\n    text-decoration: none;\n\n    font-size: 12px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n\n    transition: 0.3s ease;\n}\n\n.wnsa-primary-button:hover {\n    background: var(--wnsa-teal);\n\n    transform: translateY(-2px);\n}\n\n.wnsa-primary-button span {\n    font-size: 17px;\n}\n\n\n.wnsa-secondary-button {\n    display: inline-flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    min-width: 130px;\n\n    height: 50px;\n\n    padding: 0 22px;\n\n    border: 1px solid var(--wnsa-gold);\n\n    border-radius: 30px;\n\n    color: var(--wnsa-dark-teal);\n\n    text-decoration: none;\n\n    font-size: 12px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n\n    transition: 0.3s ease;\n}\n\n.wnsa-secondary-button:hover {\n    background: var(--wnsa-light-gold);\n}\n\n\n\/* =========================================\n   PRODUCT AREA\n   ========================================= *\/\n\n.wnsa-hero-product {\n    position: relative;\n\n    min-height: 520px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n}\n\n\n\/* LARGE CIRCLE *\/\n\n.wnsa-hero-circle {\n    position: absolute;\n\n    width: 470px;\n\n    height: 470px;\n\n    border-radius: 50%;\n\n    background: #EADAB7;\n\n    opacity: 0.7;\n}\n\n\n\/* SECOND CIRCLE *\/\n\n.wnsa-hero-circle::after {\n    content: \"\";\n\n    position: absolute;\n\n    width: 390px;\n\n    height: 390px;\n\n    top: 40px;\n\n    left: 40px;\n\n    border-radius: 50%;\n\n    border: 1px solid rgba(13, 124, 147, 0.25);\n}\n\n\n\/* PRODUCT IMAGE *\/\n\n.wnsa-product-image {\n    position: relative;\n\n    z-index: 3;\n\n    width: 330px;\n\n    transform: rotate(-3deg);\n\n    filter: drop-shadow(\n        0 25px 25px rgba(39, 56, 58, 0.18)\n    );\n\n    transition: transform 0.5s ease;\n}\n\n.wnsa-product-image:hover {\n    transform: rotate(0deg) translateY(-8px);\n}\n\n.wnsa-product-image img {\n    width: 100%;\n\n    height: auto;\n\n    display: block;\n\n    object-fit: contain;\n}\n\n\n\/* =========================================\n   PRODUCT LABEL\n   ========================================= *\/\n\n.wnsa-product-label {\n    position: absolute;\n\n    right: 15px;\n\n    bottom: 75px;\n\n    z-index: 5;\n\n    width: 145px;\n\n    padding: 18px;\n\n    background: #ffffff;\n\n    border-radius: 12px;\n\n    box-shadow:\n        0 12px 35px rgba(39, 56, 58, 0.12);\n\n    display: flex;\n\n    flex-direction: column;\n\n    gap: 5px;\n}\n\n.wnsa-label-small {\n    color: var(--wnsa-gold);\n\n    font-size: 9px;\n\n    font-weight: 700;\n\n    letter-spacing: 1.5px;\n}\n\n.wnsa-product-label strong {\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 15px;\n}\n\n.wnsa-label-weight {\n    color: #7A8584;\n\n    font-size: 11px;\n}\n\n\n\/* DECORATION *\/\n\n.wnsa-hero-decoration {\n    position: absolute;\n\n    top: 65px;\n\n    right: 65px;\n\n    z-index: 4;\n\n    color: var(--wnsa-gold);\n\n    font-size: 35px;\n\n    transform: rotate(15deg);\n}\n\n\n\/* =========================================\n   TRUST STRIP\n   ========================================= *\/\n\n.wnsa-hero-trust {\n    max-width: 1150px;\n\n    margin: 0 auto;\n\n    padding: 18px 30px;\n\n    border-top: 1px solid rgba(13, 124, 147, 0.15);\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: space-between;\n}\n\n.wnsa-trust-item {\n    display: flex;\n\n    align-items: center;\n\n    gap: 8px;\n}\n\n.wnsa-trust-item span {\n    color: var(--wnsa-gold);\n\n    font-size: 14px;\n}\n\n.wnsa-trust-item p {\n    margin: 0;\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 11px;\n\n    font-weight: 700;\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 900px) {\n\n    .wnsa-hero-container {\n        grid-template-columns: 1fr;\n\n        text-align: center;\n\n        padding: 60px 30px 40px;\n    }\n\n    .wnsa-hero-content {\n        max-width: 650px;\n\n        margin: 0 auto;\n    }\n\n    .wnsa-hero-description {\n        margin-left: auto;\n        margin-right: auto;\n    }\n\n    .wnsa-hero-benefits {\n        justify-content: center;\n    }\n\n    .wnsa-hero-buttons {\n        justify-content: center;\n    }\n\n    .wnsa-hero-product {\n        min-height: 470px;\n    }\n\n    .wnsa-hero-trust {\n        flex-wrap: wrap;\n\n        justify-content: center;\n\n        gap: 20px 40px;\n    }\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-hero {\n        min-height: auto;\n    }\n\n    .wnsa-hero-container {\n        padding: 45px 20px 25px;\n    }\n\n    .wnsa-hero h1 {\n        font-size: 52px;\n\n        letter-spacing: -2px;\n    }\n\n    .wnsa-hero-tagline {\n        font-size: 21px;\n    }\n\n    .wnsa-hero-description {\n        font-size: 14px;\n\n        line-height: 1.7;\n    }\n\n    .wnsa-hero-buttons {\n        flex-direction: column;\n\n        width: 100%;\n    }\n\n    .wnsa-primary-button,\n    .wnsa-secondary-button {\n        width: 100%;\n    }\n\n    .wnsa-hero-product {\n        min-height: 390px;\n    }\n\n    .wnsa-hero-circle {\n        width: 330px;\n        height: 330px;\n    }\n\n    .wnsa-hero-circle::after {\n        width: 270px;\n        height: 270px;\n    }\n\n    .wnsa-product-image {\n        width: 250px;\n    }\n\n    .wnsa-product-label {\n        right: 5px;\n        bottom: 35px;\n\n        width: 120px;\n\n        padding: 14px;\n    }\n\n    .wnsa-hero-decoration {\n        top: 35px;\n        right: 20px;\n    }\n\n    .wnsa-hero-trust {\n        padding: 20px;\n\n        display: grid;\n\n        grid-template-columns: 1fr 1fr;\n\n        gap: 15px;\n    }\n\n    .wnsa-trust-item p {\n        font-size: 10px;\n    }\n}\n\/* =========================================\n   WHY NOT SA - BENEFITS SECTION\n   ========================================= *\/\n\n.wnsa-benefits {\n    position: relative;\n\n    padding: 110px 30px;\n\n    background: #FFFDF8;\n\n    overflow: hidden;\n}\n\n\n\/* DECORATIVE BACKGROUND *\/\n\n.wnsa-benefits::before {\n    content: \"\";\n\n    position: absolute;\n\n    width: 350px;\n    height: 350px;\n\n    left: -180px;\n    top: 80px;\n\n    border-radius: 50%;\n\n    border: 1px solid rgba(13, 124, 147, 0.12);\n}\n\n.wnsa-benefits::after {\n    content: \"\";\n\n    position: absolute;\n\n    width: 220px;\n    height: 220px;\n\n    right: -100px;\n    bottom: 50px;\n\n    border-radius: 50%;\n\n    background: rgba(234, 218, 183, 0.35);\n}\n\n\n\/* =========================================\n   CONTAINER\n   ========================================= *\/\n\n.wnsa-benefits-container {\n    position: relative;\n\n    z-index: 2;\n\n    max-width: 1200px;\n\n    margin: 0 auto;\n}\n\n\n\/* =========================================\n   SECTION HEADING\n   ========================================= *\/\n\n.wnsa-section-heading {\n    max-width: 680px;\n\n    margin: 0 auto 65px;\n\n    text-align: center;\n}\n\n\n.wnsa-section-eyebrow {\n    display: inline-block;\n\n    margin-bottom: 15px;\n\n    color: var(--wnsa-teal);\n\n    font-family: Arial, sans-serif;\n\n    font-size: 11px;\n\n    font-weight: 700;\n\n    letter-spacing: 2.5px;\n}\n\n\n.wnsa-section-heading h2 {\n    margin: 0;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: clamp(40px, 5vw, 62px);\n\n    line-height: 1.05;\n\n    font-weight: 500;\n}\n\n\n.wnsa-section-heading h2 span {\n    display: block;\n\n    color: var(--wnsa-teal);\n\n    font-style: italic;\n}\n\n\n.wnsa-section-heading p {\n    max-width: 580px;\n\n    margin: 25px auto 0;\n\n    color: #6D7979;\n\n    font-family: Arial, sans-serif;\n\n    font-size: 15px;\n\n    line-height: 1.8;\n}\n\n\n\/* =========================================\n   BENEFITS GRID\n   ========================================= *\/\n\n.wnsa-benefits-grid {\n    display: grid;\n\n    grid-template-columns: repeat(4, 1fr);\n\n    gap: 18px;\n}\n\n\n\/* =========================================\n   BENEFIT CARD\n   ========================================= *\/\n\n.wnsa-benefit-card {\n    position: relative;\n\n    min-height: 330px;\n\n    padding: 35px 28px;\n\n    background: var(--wnsa-cream);\n\n    border: 1px solid rgba(13, 124, 147, 0.08);\n\n    border-radius: 18px;\n\n    overflow: hidden;\n\n    transition:\n        transform 0.35s ease,\n        box-shadow 0.35s ease;\n}\n\n\n.wnsa-benefit-card:hover {\n    transform: translateY(-8px);\n\n    box-shadow:\n        0 20px 45px rgba(39, 56, 58, 0.10);\n}\n\n\n\/* FEATURED CARD *\/\n\n.wnsa-benefit-featured {\n    background: var(--wnsa-dark-teal);\n}\n\n.wnsa-benefit-featured h3,\n.wnsa-benefit-featured p {\n    color: #ffffff;\n}\n\n.wnsa-benefit-featured a {\n    color: var(--wnsa-light-gold);\n}\n\n\n\/* NUMBER *\/\n\n.wnsa-benefit-number {\n    position: absolute;\n\n    top: 20px;\n    right: 25px;\n\n    color: rgba(13, 124, 147, 0.25);\n\n    font-family: Georgia, serif;\n\n    font-size: 12px;\n\n    font-weight: 700;\n\n    letter-spacing: 1px;\n}\n\n.wnsa-benefit-featured .wnsa-benefit-number {\n    color: rgba(255, 255, 255, 0.25);\n}\n\n\n\/* ICON *\/\n\n.wnsa-benefit-icon {\n    width: 55px;\n    height: 55px;\n\n    margin-bottom: 30px;\n\n    display: flex;\n\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 50%;\n\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 25px;\n}\n\n.wnsa-benefit-featured .wnsa-benefit-icon {\n    background: rgba(234, 218, 183, 0.18);\n\n    color: var(--wnsa-light-gold);\n}\n\n\n\/* TITLE *\/\n\n.wnsa-benefit-card h3 {\n    margin: 0 0 15px;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 25px;\n\n    font-weight: 500;\n}\n\n\n\/* TEXT *\/\n\n.wnsa-benefit-card p {\n    margin: 0 0 25px;\n\n    color: #687676;\n\n    font-family: Arial, sans-serif;\n\n    font-size: 13px;\n\n    line-height: 1.75;\n}\n\n\n\/* LINK *\/\n\n.wnsa-benefit-card a {\n    position: absolute;\n\n    left: 28px;\n    bottom: 28px;\n\n    color: var(--wnsa-teal);\n\n    text-decoration: none;\n\n    font-family: Arial, sans-serif;\n\n    font-size: 11px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n}\n\n.wnsa-benefit-card a:hover {\n    color: var(--wnsa-dark-teal);\n}\n\n\n\/* =========================================\n   BOTTOM STATEMENT\n   ========================================= *\/\n\n.wnsa-benefits-bottom {\n    display: flex;\n\n    align-items: center;\n\n    gap: 20px;\n\n    margin-top: 65px;\n}\n\n\n.wnsa-benefits-bottom p {\n    flex-shrink: 0;\n\n    margin: 0;\n\n    color: #899392;\n\n    font-size: 9px;\n\n    font-weight: 700;\n\n    letter-spacing: 2px;\n\n    text-align: center;\n}\n\n\n.wnsa-benefits-line {\n    width: 100%;\n\n    height: 1px;\n\n    background: rgba(13, 124, 147, 0.15);\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 1000px) {\n\n    .wnsa-benefits {\n        padding: 90px 25px;\n    }\n\n    .wnsa-benefits-grid {\n        grid-template-columns: repeat(2, 1fr);\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-benefits {\n        padding: 75px 20px;\n    }\n\n    .wnsa-section-heading {\n        margin-bottom: 45px;\n    }\n\n    .wnsa-section-heading h2 {\n        font-size: 42px;\n    }\n\n    .wnsa-section-heading p {\n        font-size: 14px;\n    }\n\n    .wnsa-benefits-grid {\n        grid-template-columns: 1fr;\n\n        gap: 15px;\n    }\n\n    .wnsa-benefit-card {\n        min-height: 300px;\n\n        padding: 30px 25px;\n    }\n\n    .wnsa-benefits-bottom {\n        display: none;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - PRODUCT SECTION\n   ========================================= *\/\n\n.wnsa-product-section {\n    position: relative;\n\n    padding: 115px 30px;\n\n    background: var(--wnsa-cream);\n\n    overflow: hidden;\n}\n\n\n\/* =========================================\n   CONTAINER\n   ========================================= *\/\n\n.wnsa-product-container {\n    max-width: 1180px;\n\n    margin: 0 auto;\n\n    display: grid;\n\n    grid-template-columns: 1fr 1fr;\n\n    align-items: center;\n\n    gap: 80px;\n}\n\n\n\/* =========================================\n   PRODUCT SHOWCASE\n   ========================================= *\/\n\n.wnsa-product-showcase {\n    position: relative;\n\n    min-height: 570px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n}\n\n\n\/* BACKGROUND CIRCLE *\/\n\n.wnsa-product-bg-circle {\n    position: absolute;\n\n    width: 500px;\n    height: 500px;\n\n    border-radius: 50%;\n\n    background: #EADAB7;\n\n    opacity: 0.65;\n}\n\n.wnsa-product-bg-circle::before {\n    content: \"\";\n\n    position: absolute;\n\n    inset: 30px;\n\n    border-radius: 50%;\n\n    border: 1px solid rgba(13, 124, 147, 0.25);\n}\n\n\n\/* PRODUCT IMAGE *\/\n\n.wnsa-main-product-image {\n    position: relative;\n\n    z-index: 3;\n\n    width: 370px;\n\n    filter: drop-shadow(\n        0 30px 25px rgba(39, 56, 58, 0.20)\n    );\n\n    transition: transform 0.5s ease;\n}\n\n.wnsa-main-product-image:hover {\n    transform: translateY(-10px) rotate(2deg);\n}\n\n.wnsa-main-product-image img {\n    display: block;\n\n    width: 100%;\n\n    height: auto;\n}\n\n\n\/* PRODUCT BADGE *\/\n\n.wnsa-product-badge {\n    position: absolute;\n\n    top: 45px;\n    left: 20px;\n\n    z-index: 5;\n\n    width: 95px;\n    height: 95px;\n\n    border-radius: 50%;\n\n    background: var(--wnsa-dark-teal);\n\n    color: #ffffff;\n\n    display: flex;\n\n    flex-direction: column;\n\n    align-items: center;\n\n    justify-content: center;\n\n    transform: rotate(-12deg);\n\n    box-shadow:\n        0 12px 25px rgba(39, 56, 58, 0.15);\n}\n\n.wnsa-product-badge span {\n    font-size: 9px;\n\n    letter-spacing: 2px;\n\n    color: var(--wnsa-light-gold);\n}\n\n.wnsa-product-badge strong {\n    font-family: Georgia, serif;\n\n    font-size: 13px;\n\n    letter-spacing: 0.5px;\n}\n\n\n\/* =========================================\n   PRODUCT INFORMATION\n   ========================================= *\/\n\n.wnsa-product-info {\n    max-width: 530px;\n}\n\n\n.wnsa-product-eyebrow {\n    display: inline-block;\n\n    margin-bottom: 15px;\n\n    color: var(--wnsa-teal);\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    letter-spacing: 2px;\n}\n\n\n.wnsa-product-info h2 {\n    margin: 0;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: clamp(42px, 5vw, 64px);\n\n    font-weight: 500;\n\n    line-height: 1.05;\n}\n\n.wnsa-product-info h2 span {\n    display: block;\n\n    color: var(--wnsa-teal);\n\n    font-style: italic;\n}\n\n\n\/* STARS *\/\n\n.wnsa-product-stars {\n    display: flex;\n\n    align-items: center;\n\n    gap: 12px;\n\n    margin: 22px 0;\n\n    color: var(--wnsa-gold);\n\n    font-size: 15px;\n\n    letter-spacing: 2px;\n}\n\n.wnsa-product-stars span {\n    color: #788483;\n\n    font-size: 10px;\n\n    letter-spacing: 0;\n\n    font-weight: 600;\n}\n\n\n\/* INTRO *\/\n\n.wnsa-product-intro {\n    margin: 0 0 28px;\n\n    color: #697676;\n\n    font-size: 15px;\n\n    line-height: 1.8;\n}\n\n\n\/* =========================================\n   PRODUCT FEATURES\n   ========================================= *\/\n\n.wnsa-product-features {\n    display: grid;\n\n    grid-template-columns: 1fr 1fr;\n\n    gap: 13px 25px;\n\n    padding-bottom: 28px;\n\n    border-bottom: 1px solid rgba(13, 124, 147, 0.13);\n}\n\n\n.wnsa-product-feature {\n    display: flex;\n\n    align-items: center;\n\n    gap: 9px;\n}\n\n.wnsa-product-feature span {\n    width: 21px;\n    height: 21px;\n\n    flex-shrink: 0;\n\n    display: flex;\n\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 50%;\n\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 11px;\n\n    font-weight: bold;\n}\n\n.wnsa-product-feature p {\n    margin: 0;\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 11px;\n\n    font-weight: 600;\n}\n\n\n\/* =========================================\n   PRICE\n   ========================================= *\/\n\n.wnsa-product-price-area {\n    display: flex;\n\n    align-items: center;\n\n    gap: 15px;\n\n    margin: 25px 0;\n}\n\n.wnsa-price-label {\n    color: #8B9492;\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    letter-spacing: 1px;\n}\n\n.wnsa-product-price {\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 30px;\n\n    font-weight: 500;\n}\n\n\n\/* =========================================\n   BUY AREA\n   ========================================= *\/\n\n.wnsa-product-buy {\n    display: flex;\n\n    align-items: center;\n\n    gap: 12px;\n}\n\n\n\/* QUANTITY *\/\n\n.wnsa-quantity {\n    height: 50px;\n\n    display: flex;\n\n    align-items: center;\n\n    border: 1px solid rgba(13, 124, 147, 0.25);\n\n    border-radius: 30px;\n\n    background: #ffffff;\n}\n\n.wnsa-quantity button {\n    width: 38px;\n\n    height: 48px;\n\n    border: none;\n\n    background: transparent;\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 18px;\n\n    cursor: pointer;\n}\n\n.wnsa-quantity-value {\n    min-width: 20px;\n\n    text-align: center;\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 13px;\n\n    font-weight: 700;\n}\n\n\n\/* ADD TO CART *\/\n\n.wnsa-add-to-cart {\n    flex: 1;\n\n    height: 50px;\n\n    padding: 0 25px;\n\n    border: none;\n\n    border-radius: 30px;\n\n    background: var(--wnsa-dark-teal);\n\n    color: #ffffff;\n\n    font-size: 11px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 1px;\n\n    cursor: pointer;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    gap: 15px;\n\n    transition: 0.3s ease;\n}\n\n.wnsa-add-to-cart:hover {\n    background: var(--wnsa-teal);\n\n    transform: translateY(-2px);\n}\n\n\n\/* =========================================\n   PRODUCT NOTES\n   ========================================= *\/\n\n.wnsa-product-notes {\n    display: flex;\n\n    align-items: flex-start;\n\n    gap: 10px;\n\n    margin-top: 20px;\n}\n\n.wnsa-product-notes span {\n    color: var(--wnsa-gold);\n\n    font-size: 14px;\n}\n\n.wnsa-product-notes p {\n    margin: 0;\n\n    color: #7D8786;\n\n    font-size: 10px;\n\n    line-height: 1.6;\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 900px) {\n\n    .wnsa-product-section {\n        padding: 90px 25px;\n    }\n\n    .wnsa-product-container {\n        grid-template-columns: 1fr;\n\n        gap: 50px;\n    }\n\n    .wnsa-product-info {\n        max-width: 650px;\n\n        margin: 0 auto;\n\n        text-align: center;\n    }\n\n    .wnsa-product-stars {\n        justify-content: center;\n    }\n\n    .wnsa-product-features {\n        text-align: left;\n    }\n\n    .wnsa-product-notes {\n        justify-content: center;\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-product-section {\n        padding: 75px 20px;\n    }\n\n    .wnsa-product-showcase {\n        min-height: 400px;\n    }\n\n    .wnsa-product-bg-circle {\n        width: 330px;\n        height: 330px;\n    }\n\n    .wnsa-product-bg-circle::before {\n        inset: 20px;\n    }\n\n    .wnsa-main-product-image {\n        width: 250px;\n    }\n\n    .wnsa-product-badge {\n        top: 20px;\n        left: 0;\n\n        width: 75px;\n        height: 75px;\n    }\n\n    .wnsa-product-badge span {\n        font-size: 7px;\n    }\n\n    .wnsa-product-badge strong {\n        font-size: 10px;\n    }\n\n    .wnsa-product-info h2 {\n        font-size: 42px;\n    }\n\n    .wnsa-product-features {\n        grid-template-columns: 1fr;\n\n        text-align: left;\n    }\n\n    .wnsa-product-buy {\n        flex-direction: column;\n\n        align-items: stretch;\n    }\n\n    .wnsa-quantity {\n        justify-content: center;\n    }\n\n    .wnsa-add-to-cart {\n        flex: none;\n\n        width: 100%;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - ABOUT SECTION\n   ========================================= *\/\n\n.wnsa-about {\n    position: relative;\n\n    padding: 120px 30px;\n\n    background: #FFFDF8;\n\n    overflow: hidden;\n}\n\n\n\/* =========================================\n   CONTAINER\n   ========================================= *\/\n\n.wnsa-about-container {\n    max-width: 1180px;\n\n    margin: 0 auto;\n\n    display: grid;\n\n    grid-template-columns: 0.95fr 1.05fr;\n\n    align-items: center;\n\n    gap: 90px;\n}\n\n\n\/* =========================================\n   VISUAL\n   ========================================= *\/\n\n.wnsa-about-visual {\n    position: relative;\n\n    min-height: 560px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n}\n\n\n\/* IMAGE FRAME *\/\n\n.wnsa-about-image {\n    position: relative;\n\n    width: 430px;\n    height: 500px;\n\n    overflow: hidden;\n\n    border-radius: 220px 220px 25px 25px;\n\n    background: var(--wnsa-light-gold);\n\n    box-shadow:\n        0 25px 60px rgba(39, 56, 58, 0.12);\n}\n\n.wnsa-about-image img {\n    width: 100%;\n    height: 100%;\n\n    display: block;\n\n    object-fit: cover;\n}\n\n\n\/* GOLD FRAME *\/\n\n.wnsa-about-image::after {\n    content: \"\";\n\n    position: absolute;\n\n    inset: 15px;\n\n    border: 1px solid rgba(255, 255, 255, 0.6);\n\n    border-radius: 210px 210px 18px 18px;\n\n    pointer-events: none;\n}\n\n\n\/* =========================================\n   BADGE\n   ========================================= *\/\n\n.wnsa-about-badge {\n    position: absolute;\n\n    right: 5px;\n    bottom: 55px;\n\n    width: 135px;\n    height: 135px;\n\n    border-radius: 50%;\n\n    background: var(--wnsa-dark-teal);\n\n    color: #ffffff;\n\n    display: flex;\n\n    flex-direction: column;\n\n    align-items: center;\n    justify-content: center;\n\n    transform: rotate(8deg);\n\n    box-shadow:\n        0 15px 35px rgba(39, 56, 58, 0.18);\n}\n\n.wnsa-about-badge span {\n    color: var(--wnsa-light-gold);\n\n    font-size: 9px;\n\n    letter-spacing: 2px;\n}\n\n.wnsa-about-badge strong {\n    font-family: Georgia, serif;\n\n    font-size: 28px;\n\n    line-height: 1;\n}\n\n.wnsa-about-badge small {\n    margin-top: 7px;\n\n    font-size: 7px;\n\n    letter-spacing: 1px;\n}\n\n\n\/* =========================================\n   CONTENT\n   ========================================= *\/\n\n.wnsa-about-content {\n    max-width: 560px;\n}\n\n\n.wnsa-about-content h2 {\n    margin: 0 0 25px;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: clamp(45px, 5vw, 68px);\n\n    font-weight: 500;\n\n    line-height: 1.05;\n}\n\n.wnsa-about-content h2 span {\n    display: block;\n\n    color: var(--wnsa-teal);\n\n    font-style: italic;\n}\n\n\n\/* LEAD *\/\n\n.wnsa-about-lead {\n    margin-bottom: 15px !important;\n\n    color: var(--wnsa-dark-teal) !important;\n\n    font-family: Georgia, serif;\n\n    font-size: 21px !important;\n\n    line-height: 1.5 !important;\n}\n\n\n\/* BODY *\/\n\n.wnsa-about-content > p {\n    color: #6D7979;\n\n    font-size: 14px;\n\n    line-height: 1.8;\n}\n\n\n\/* =========================================\n   VALUES\n   ========================================= *\/\n\n.wnsa-about-values {\n    margin: 35px 0;\n\n    border-top: 1px solid rgba(13, 124, 147, 0.12);\n}\n\n\n.wnsa-about-value {\n    display: flex;\n\n    gap: 20px;\n\n    padding: 17px 0;\n\n    border-bottom: 1px solid rgba(13, 124, 147, 0.12);\n}\n\n\n.wnsa-about-value > span {\n    flex-shrink: 0;\n\n    color: var(--wnsa-gold);\n\n    font-family: Georgia, serif;\n\n    font-size: 12px;\n\n    font-weight: 700;\n}\n\n\n.wnsa-about-value h3 {\n    margin: 0 0 5px;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 18px;\n\n    font-weight: 500;\n}\n\n\n.wnsa-about-value p {\n    margin: 0;\n\n    color: #7B8584;\n\n    font-size: 11px;\n\n    line-height: 1.6;\n}\n\n\n\/* =========================================\n   BUTTON\n   ========================================= *\/\n\n.wnsa-about-button {\n    display: inline-flex;\n\n    align-items: center;\n\n    gap: 15px;\n\n    height: 48px;\n\n    padding: 0 25px;\n\n    border-radius: 30px;\n\n    background: var(--wnsa-dark-teal);\n\n    color: #ffffff;\n\n    text-decoration: none;\n\n    font-size: 11px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.7px;\n\n    transition: 0.3s ease;\n}\n\n\n.wnsa-about-button:hover {\n    background: var(--wnsa-teal);\n\n    transform: translateY(-2px);\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 900px) {\n\n    .wnsa-about {\n        padding: 90px 25px;\n    }\n\n    .wnsa-about-container {\n        grid-template-columns: 1fr;\n\n        gap: 60px;\n    }\n\n    .wnsa-about-visual {\n        min-height: 500px;\n    }\n\n    .wnsa-about-content {\n        max-width: 650px;\n\n        margin: 0 auto;\n\n        text-align: center;\n    }\n\n    .wnsa-about-values {\n        text-align: left;\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-about {\n        padding: 75px 20px;\n    }\n\n    .wnsa-about-visual {\n        min-height: 410px;\n    }\n\n    .wnsa-about-image {\n        width: 300px;\n        height: 370px;\n    }\n\n    .wnsa-about-badge {\n        right: 5px;\n        bottom: 25px;\n\n        width: 105px;\n        height: 105px;\n    }\n\n    .wnsa-about-badge strong {\n        font-size: 22px;\n    }\n\n    .wnsa-about-content h2 {\n        font-size: 45px;\n    }\n\n    .wnsa-about-lead {\n        font-size: 19px !important;\n    }\n\n    .wnsa-about-button {\n        width: 100%;\n\n        justify-content: center;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - WHAT'S INSIDE SECTION\n   ========================================= *\/\n\n.wnsa-inside {\n    position: relative;\n\n    padding: 115px 30px;\n\n    background: var(--wnsa-dark-teal);\n\n    overflow: hidden;\n}\n\n\n\/* DECORATIVE CIRCLES *\/\n\n.wnsa-inside::before {\n    content: \"\";\n\n    position: absolute;\n\n    width: 500px;\n    height: 500px;\n\n    left: -250px;\n    top: 100px;\n\n    border-radius: 50%;\n\n    border: 1px solid rgba(234, 218, 183, 0.15);\n}\n\n.wnsa-inside::after {\n    content: \"\";\n\n    position: absolute;\n\n    width: 400px;\n    height: 400px;\n\n    right: -200px;\n    bottom: -100px;\n\n    border-radius: 50%;\n\n    background: rgba(234, 218, 183, 0.08);\n}\n\n\n\/* =========================================\n   CONTAINER\n   ========================================= *\/\n\n.wnsa-inside-container {\n    position: relative;\n\n    z-index: 2;\n\n    max-width: 1200px;\n\n    margin: 0 auto;\n}\n\n\n\/* =========================================\n   HEADING\n   ========================================= *\/\n\n.wnsa-inside .wnsa-section-heading {\n    max-width: 700px;\n}\n\n.wnsa-inside .wnsa-section-eyebrow {\n    color: var(--wnsa-light-gold);\n}\n\n.wnsa-inside .wnsa-section-heading h2 {\n    color: #ffffff;\n}\n\n.wnsa-inside .wnsa-section-heading h2 span {\n    color: var(--wnsa-light-gold);\n}\n\n.wnsa-inside .wnsa-section-heading p {\n    color: rgba(255, 255, 255, 0.68);\n}\n\n\n\/* =========================================\n   QUALITY GRID\n   ========================================= *\/\n\n.wnsa-quality-grid {\n    display: grid;\n\n    grid-template-columns: 1fr 1fr 1fr;\n\n    align-items: center;\n\n    gap: 45px;\n\n    margin-top: 70px;\n}\n\n\n\/* =========================================\n   QUALITY ITEMS\n   ========================================= *\/\n\n.wnsa-quality-list {\n    display: flex;\n\n    flex-direction: column;\n\n    gap: 38px;\n}\n\n\n.wnsa-quality-item {\n    display: flex;\n\n    align-items: flex-start;\n\n    gap: 15px;\n}\n\n\n.wnsa-quality-icon {\n    width: 32px;\n    height: 32px;\n\n    flex-shrink: 0;\n\n    display: flex;\n\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 50%;\n\n    background: rgba(234, 218, 183, 0.15);\n\n    border: 1px solid rgba(234, 218, 183, 0.35);\n\n    color: var(--wnsa-light-gold);\n\n    font-size: 13px;\n\n    font-weight: bold;\n}\n\n\n.wnsa-quality-item h3 {\n    margin: 0 0 7px;\n\n    color: #ffffff;\n\n    font-family: Georgia, serif;\n\n    font-size: 19px;\n\n    font-weight: 500;\n}\n\n\n.wnsa-quality-item p {\n    margin: 0;\n\n    color: rgba(255, 255, 255, 0.58);\n\n    font-size: 11px;\n\n    line-height: 1.7;\n}\n\n\n\/* =========================================\n   CENTRE PRODUCT\n   ========================================= *\/\n\n.wnsa-quality-product {\n    position: relative;\n\n    min-height: 470px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n}\n\n\n.wnsa-quality-circle {\n    position: absolute;\n\n    width: 390px;\n    height: 390px;\n\n    border-radius: 50%;\n\n    background: var(--wnsa-light-gold);\n\n    opacity: 0.9;\n}\n\n\n.wnsa-quality-circle::after {\n    content: \"\";\n\n    position: absolute;\n\n    inset: 18px;\n\n    border-radius: 50%;\n\n    border: 1px solid rgba(7, 92, 104, 0.25);\n}\n\n\n.wnsa-quality-product img {\n    position: relative;\n\n    z-index: 3;\n\n    width: 290px;\n\n    height: auto;\n\n    filter:\n        drop-shadow(\n            0 30px 25px rgba(0, 0, 0, 0.25)\n        );\n\n    transition: transform 0.5s ease;\n}\n\n\n.wnsa-quality-product img:hover {\n    transform: translateY(-8px) rotate(2deg);\n}\n\n\n\/* PRODUCT STAMP *\/\n\n.wnsa-quality-stamp {\n    position: absolute;\n\n    right: 15px;\n    bottom: 60px;\n\n    z-index: 5;\n\n    width: 85px;\n    height: 85px;\n\n    display: flex;\n\n    flex-direction: column;\n\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 50%;\n\n    background: var(--wnsa-teal);\n\n    color: #ffffff;\n\n    transform: rotate(8deg);\n}\n\n.wnsa-quality-stamp span {\n    font-size: 8px;\n\n    letter-spacing: 2px;\n}\n\n.wnsa-quality-stamp strong {\n    margin-top: 3px;\n\n    font-family: Georgia, serif;\n\n    font-size: 18px;\n}\n\n\n\/* =========================================\n   FREE FROM\n   ========================================= *\/\n\n.wnsa-free-from {\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    gap: 30px;\n\n    margin-top: 65px;\n\n    padding-top: 25px;\n\n    border-top: 1px solid rgba(255, 255, 255, 0.15);\n}\n\n\n.wnsa-free-from > span {\n    color: var(--wnsa-light-gold);\n\n    font-size: 9px;\n\n    font-weight: 700;\n\n    letter-spacing: 2px;\n}\n\n\n.wnsa-free-items {\n    display: flex;\n\n    align-items: center;\n\n    flex-wrap: wrap;\n\n    justify-content: center;\n\n    gap: 20px;\n}\n\n\n.wnsa-free-items p {\n    position: relative;\n\n    margin: 0;\n\n    color: rgba(255, 255, 255, 0.7);\n\n    font-size: 10px;\n}\n\n\n.wnsa-free-items p:not(:last-child)::after {\n    content: \"\u2022\";\n\n    position: absolute;\n\n    right: -12px;\n\n    color: var(--wnsa-gold);\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 950px) {\n\n    .wnsa-inside {\n        padding: 90px 25px;\n    }\n\n    .wnsa-quality-grid {\n        grid-template-columns: 1fr;\n\n        gap: 45px;\n    }\n\n    .wnsa-quality-list {\n        display: grid;\n\n        grid-template-columns: 1fr 1fr;\n\n        gap: 30px;\n    }\n\n    .wnsa-quality-product {\n        order: -1;\n\n        min-height: 430px;\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-inside {\n        padding: 75px 20px;\n    }\n\n    .wnsa-quality-grid {\n        margin-top: 45px;\n    }\n\n    .wnsa-quality-list {\n        grid-template-columns: 1fr;\n\n        gap: 25px;\n    }\n\n    .wnsa-quality-product {\n        min-height: 350px;\n    }\n\n    .wnsa-quality-circle {\n        width: 300px;\n        height: 300px;\n    }\n\n    .wnsa-quality-product img {\n        width: 220px;\n    }\n\n    .wnsa-quality-stamp {\n        right: 5px;\n        bottom: 30px;\n\n        width: 70px;\n        height: 70px;\n    }\n\n    .wnsa-quality-stamp strong {\n        font-size: 15px;\n    }\n\n    .wnsa-free-from {\n        flex-direction: column;\n\n        gap: 15px;\n\n        text-align: center;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - HOW TO USE SECTION\n   ========================================= *\/\n\n.wnsa-how-to {\n    position: relative;\n\n    padding: 115px 30px;\n\n    background: #FFFDF8;\n\n    overflow: hidden;\n}\n\n\n\/* =========================================\n   CONTAINER\n   ========================================= *\/\n\n.wnsa-how-container {\n    max-width: 1200px;\n\n    margin: 0 auto;\n}\n\n\n\/* =========================================\n   HEADING\n   ========================================= *\/\n\n.wnsa-how-to .wnsa-section-heading {\n    margin-bottom: 65px;\n}\n\n\n\/* =========================================\n   HOW TO GRID\n   ========================================= *\/\n\n.wnsa-how-grid {\n    display: grid;\n\n    grid-template-columns: repeat(4, 1fr);\n\n    gap: 18px;\n}\n\n\n\/* =========================================\n   HOW TO CARD\n   ========================================= *\/\n\n.wnsa-how-card {\n    position: relative;\n\n    min-height: 310px;\n\n    padding: 35px 28px;\n\n    background: var(--wnsa-cream);\n\n    border-radius: 18px;\n\n    border: 1px solid rgba(13, 124, 147, 0.08);\n\n    transition:\n        transform 0.35s ease,\n        box-shadow 0.35s ease;\n}\n\n\n.wnsa-how-card:hover {\n    transform: translateY(-7px);\n\n    box-shadow:\n        0 20px 40px rgba(39, 56, 58, 0.10);\n}\n\n\n\/* NUMBER *\/\n\n.wnsa-how-number {\n    position: absolute;\n\n    top: 20px;\n    right: 22px;\n\n    color: rgba(13, 124, 147, 0.22);\n\n    font-family: Georgia, serif;\n\n    font-size: 12px;\n\n    font-weight: 700;\n}\n\n\n\/* ICON *\/\n\n.wnsa-how-icon {\n    width: 58px;\n    height: 58px;\n\n    margin-bottom: 30px;\n\n    display: flex;\n\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 50%;\n\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 24px;\n}\n\n\n\/* TITLE *\/\n\n.wnsa-how-card h3 {\n    margin: 0 0 14px;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 23px;\n\n    font-weight: 500;\n}\n\n\n\/* TEXT *\/\n\n.wnsa-how-card p {\n    margin: 0;\n\n    color: #707C7B;\n\n    font-size: 12px;\n\n    line-height: 1.75;\n}\n\n\n\/* =========================================\n   CTA\n   ========================================= *\/\n\n.wnsa-how-cta {\n    margin-top: 55px;\n\n    padding: 30px 35px;\n\n    border-radius: 18px;\n\n    background: var(--wnsa-dark-teal);\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: space-between;\n\n    gap: 30px;\n}\n\n\n.wnsa-how-cta span {\n    color: var(--wnsa-light-gold);\n\n    font-size: 9px;\n\n    font-weight: 700;\n\n    letter-spacing: 2px;\n}\n\n\n.wnsa-how-cta h3 {\n    margin: 8px 0 0;\n\n    color: #ffffff;\n\n    font-family: Georgia, serif;\n\n    font-size: 24px;\n\n    font-weight: 500;\n}\n\n\n\/* CTA BUTTON *\/\n\n.wnsa-how-cta a {\n    flex-shrink: 0;\n\n    display: inline-flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    gap: 12px;\n\n    height: 48px;\n\n    padding: 0 25px;\n\n    border-radius: 30px;\n\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n\n    text-decoration: none;\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n\n    transition: 0.3s ease;\n}\n\n\n.wnsa-how-cta a:hover {\n    background: #ffffff;\n\n    transform: translateY(-2px);\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 950px) {\n\n    .wnsa-how-to {\n        padding: 90px 25px;\n    }\n\n    .wnsa-how-grid {\n        grid-template-columns: repeat(2, 1fr);\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-how-to {\n        padding: 75px 20px;\n    }\n\n    .wnsa-how-grid {\n        grid-template-columns: 1fr;\n\n        gap: 15px;\n    }\n\n    .wnsa-how-card {\n        min-height: 260px;\n    }\n\n    .wnsa-how-cta {\n        flex-direction: column;\n\n        align-items: flex-start;\n\n        padding: 25px;\n    }\n\n    .wnsa-how-cta h3 {\n        font-size: 21px;\n    }\n\n    .wnsa-how-cta a {\n        width: 100%;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - TESTIMONIALS SECTION\n   ========================================= *\/\n\n.wnsa-testimonials {\n    position: relative;\n\n    padding: 115px 30px;\n\n    background: var(--wnsa-cream);\n\n    overflow: hidden;\n}\n\n\n\/* DECORATIVE CIRCLE *\/\n\n.wnsa-testimonials::before {\n    content: \"\";\n\n    position: absolute;\n\n    width: 450px;\n    height: 450px;\n\n    right: -220px;\n    top: 100px;\n\n    border-radius: 50%;\n\n    border: 1px solid rgba(13, 124, 147, 0.12);\n}\n\n\n\/* =========================================\n   CONTAINER\n   ========================================= *\/\n\n.wnsa-testimonials-container {\n    position: relative;\n\n    z-index: 2;\n\n    max-width: 1180px;\n\n    margin: 0 auto;\n}\n\n\n\/* =========================================\n   TESTIMONIAL GRID\n   ========================================= *\/\n\n.wnsa-testimonials-grid {\n    display: grid;\n\n    grid-template-columns: repeat(3, 1fr);\n\n    gap: 20px;\n}\n\n\n\/* =========================================\n   CARD\n   ========================================= *\/\n\n.wnsa-testimonial-card {\n    position: relative;\n\n    min-height: 330px;\n\n    padding: 38px 32px;\n\n    background: #FFFDF8;\n\n    border-radius: 20px;\n\n    border: 1px solid rgba(13, 124, 147, 0.08);\n\n    box-shadow:\n        0 10px 30px rgba(39, 56, 58, 0.04);\n\n    transition:\n        transform 0.35s ease,\n        box-shadow 0.35s ease;\n}\n\n\n.wnsa-testimonial-card:hover {\n    transform: translateY(-7px);\n\n    box-shadow:\n        0 20px 45px rgba(39, 56, 58, 0.10);\n}\n\n\n\/* FEATURED *\/\n\n.wnsa-testimonial-featured {\n    background: var(--wnsa-dark-teal);\n\n    transform: translateY(-15px);\n}\n\n.wnsa-testimonial-featured:hover {\n    transform: translateY(-22px);\n}\n\n\n\/* =========================================\n   STARS\n   ========================================= *\/\n\n.wnsa-testimonial-stars {\n    color: var(--wnsa-gold);\n\n    font-size: 15px;\n\n    letter-spacing: 3px;\n\n    margin-bottom: 25px;\n}\n\n\n\/* =========================================\n   QUOTE\n   ========================================= *\/\n\n.wnsa-testimonial-quote {\n    position: absolute;\n\n    top: 15px;\n    right: 25px;\n\n    color: rgba(234, 218, 183, 0.2);\n\n    font-family: Georgia, serif;\n\n    font-size: 80px;\n\n    line-height: 1;\n}\n\n\n\/* =========================================\n   REVIEW TEXT\n   ========================================= *\/\n\n.wnsa-testimonial-text {\n    margin: 0;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 19px;\n\n    line-height: 1.65;\n}\n\n.wnsa-testimonial-featured .wnsa-testimonial-text {\n    color: #ffffff;\n}\n\n\n\/* =========================================\n   AUTHOR\n   ========================================= *\/\n\n.wnsa-testimonial-author {\n    position: absolute;\n\n    left: 32px;\n    bottom: 30px;\n\n    display: flex;\n\n    align-items: center;\n\n    gap: 12px;\n}\n\n\n.wnsa-author-avatar {\n    width: 38px;\n    height: 38px;\n\n    border-radius: 50%;\n\n    display: flex;\n\n    align-items: center;\n    justify-content: center;\n\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 15px;\n\n    font-weight: 600;\n}\n\n\n.wnsa-testimonial-author strong {\n    display: block;\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 12px;\n}\n\n.wnsa-testimonial-featured .wnsa-testimonial-author strong {\n    color: #ffffff;\n}\n\n\n.wnsa-testimonial-author span {\n    display: block;\n\n    margin-top: 3px;\n\n    color: #8A9493;\n\n    font-size: 9px;\n}\n\n\n\/* =========================================\n   REVIEW CTA\n   ========================================= *\/\n\n.wnsa-review-cta {\n    margin-top: 55px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    gap: 15px;\n\n    flex-wrap: wrap;\n}\n\n\n.wnsa-review-cta > span {\n    color: var(--wnsa-gold);\n\n    font-size: 14px;\n\n    letter-spacing: 2px;\n}\n\n\n.wnsa-review-cta p {\n    margin: 0;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 17px;\n}\n\n\n.wnsa-review-cta a {\n    color: var(--wnsa-teal);\n\n    text-decoration: none;\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n}\n\n.wnsa-review-cta a:hover {\n    color: var(--wnsa-dark-teal);\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 900px) {\n\n    .wnsa-testimonials {\n        padding: 90px 25px;\n    }\n\n    .wnsa-testimonials-grid {\n        grid-template-columns: 1fr;\n\n        max-width: 650px;\n\n        margin: 0 auto;\n    }\n\n    .wnsa-testimonial-featured {\n        transform: none;\n    }\n\n    .wnsa-testimonial-featured:hover {\n        transform: translateY(-7px);\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-testimonials {\n        padding: 75px 20px;\n    }\n\n    .wnsa-testimonial-card {\n        min-height: 300px;\n\n        padding: 30px 25px;\n    }\n\n    .wnsa-testimonial-text {\n        font-size: 17px;\n    }\n\n    .wnsa-testimonial-author {\n        left: 25px;\n        bottom: 25px;\n    }\n\n    .wnsa-review-cta {\n        flex-direction: column;\n\n        text-align: center;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - FAQ SECTION\n   ========================================= *\/\n\n.wnsa-faq {\n    padding: 115px 30px;\n\n    background: #FFFDF8;\n}\n\n\n\/* =========================================\n   CONTAINER\n   ========================================= *\/\n\n.wnsa-faq-container {\n    max-width: 1150px;\n\n    margin: 0 auto;\n\n    display: grid;\n\n    grid-template-columns: 0.8fr 1.2fr;\n\n    gap: 90px;\n\n    align-items: start;\n}\n\n\n\/* =========================================\n   INTRO\n   ========================================= *\/\n\n.wnsa-faq-intro {\n    position: sticky;\n\n    top: 100px;\n}\n\n\n.wnsa-faq-intro h2 {\n    margin: 0 0 22px;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: clamp(45px, 5vw, 65px);\n\n    font-weight: 500;\n\n    line-height: 1.05;\n}\n\n\n.wnsa-faq-intro h2 span {\n    display: block;\n\n    color: var(--wnsa-teal);\n\n    font-style: italic;\n}\n\n\n.wnsa-faq-intro > p {\n    max-width: 370px;\n\n    margin: 0 0 30px;\n\n    color: #6D7979;\n\n    font-size: 14px;\n\n    line-height: 1.8;\n}\n\n\n\/* CONTACT BUTTON *\/\n\n.wnsa-faq-contact {\n    display: inline-flex;\n\n    align-items: center;\n\n    gap: 12px;\n\n    color: var(--wnsa-teal);\n\n    text-decoration: none;\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n}\n\n.wnsa-faq-contact:hover {\n    color: var(--wnsa-dark-teal);\n}\n\n\n\/* =========================================\n   FAQ LIST\n   ========================================= *\/\n\n.wnsa-faq-list {\n    border-top: 1px solid rgba(13, 124, 147, 0.15);\n}\n\n\n\/* =========================================\n   FAQ ITEM\n   ========================================= *\/\n\n.wnsa-faq-item {\n    border-bottom: 1px solid rgba(13, 124, 147, 0.15);\n}\n\n\n\/* =========================================\n   QUESTION\n   ========================================= *\/\n\n.wnsa-faq-question {\n    width: 100%;\n\n    min-height: 75px;\n\n    padding: 20px 5px;\n\n    border: none;\n\n    background: transparent;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: space-between;\n\n    gap: 25px;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: 18px;\n\n    text-align: left;\n\n    cursor: pointer;\n}\n\n\n.wnsa-faq-question b {\n    width: 30px;\n    height: 30px;\n\n    flex-shrink: 0;\n\n    display: flex;\n\n    align-items: center;\n    justify-content: center;\n\n    border-radius: 50%;\n\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Arial, sans-serif;\n\n    font-size: 17px;\n\n    font-weight: 400;\n}\n\n\n\/* =========================================\n   ANSWER\n   ========================================= *\/\n\n.wnsa-faq-answer {\n    display: none;\n\n    padding: 0 50px 25px 5px;\n}\n\n\n.wnsa-faq-answer p {\n    margin: 0;\n\n    color: #707C7B;\n\n    font-family: Arial, sans-serif;\n\n    font-size: 13px;\n\n    line-height: 1.8;\n}\n\n\n\/* ACTIVE *\/\n\n.wnsa-faq-item.active .wnsa-faq-answer {\n    display: block;\n}\n\n.wnsa-faq-item.active .wnsa-faq-question {\n    color: var(--wnsa-teal);\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 850px) {\n\n    .wnsa-faq {\n        padding: 85px 25px;\n    }\n\n    .wnsa-faq-container {\n        grid-template-columns: 1fr;\n\n        gap: 50px;\n    }\n\n    .wnsa-faq-intro {\n        position: relative;\n\n        top: auto;\n\n        text-align: center;\n    }\n\n    .wnsa-faq-intro > p {\n        margin-left: auto;\n        margin-right: auto;\n    }\n\n    .wnsa-faq-contact {\n        justify-content: center;\n    }\n\n}\n\n\n@media (max-width: 600px) {\n\n    .wnsa-faq {\n        padding: 70px 20px;\n    }\n\n    .wnsa-faq-intro h2 {\n        font-size: 45px;\n    }\n\n    .wnsa-faq-question {\n        min-height: 68px;\n\n        font-size: 16px;\n    }\n\n    .wnsa-faq-answer {\n        padding-right: 35px;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - FINAL CTA\n   ========================================= *\/\n\n.wnsa-final-cta {\n    position: relative;\n\n    padding: 100px 30px;\n\n    background: var(--wnsa-dark-teal);\n\n    overflow: hidden;\n}\n\n\n\/* DECORATIVE BACKGROUND *\/\n\n.wnsa-final-cta::before {\n    content: \"\";\n\n    position: absolute;\n\n    width: 600px;\n    height: 600px;\n\n    left: -300px;\n    top: -250px;\n\n    border-radius: 50%;\n\n    border: 1px solid rgba(234, 218, 183, 0.12);\n}\n\n\n.wnsa-final-cta::after {\n    content: \"\";\n\n    position: absolute;\n\n    width: 450px;\n    height: 450px;\n\n    right: -220px;\n    bottom: -250px;\n\n    border-radius: 50%;\n\n    background: rgba(234, 218, 183, 0.08);\n}\n\n\n\/* =========================================\n   CONTAINER\n   ========================================= *\/\n\n.wnsa-final-cta-container {\n    position: relative;\n\n    z-index: 2;\n\n    max-width: 1150px;\n\n    min-height: 470px;\n\n    margin: 0 auto;\n\n    display: grid;\n\n    grid-template-columns: 1fr 0.9fr;\n\n    align-items: center;\n\n    gap: 50px;\n}\n\n\n\/* =========================================\n   CONTENT\n   ========================================= *\/\n\n.wnsa-final-cta-content {\n    max-width: 600px;\n}\n\n\n.wnsa-final-eyebrow {\n    display: inline-block;\n\n    margin-bottom: 20px;\n\n    color: var(--wnsa-light-gold);\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    letter-spacing: 2.5px;\n}\n\n\n.wnsa-final-cta h2 {\n    margin: 0 0 25px;\n\n    color: #ffffff;\n\n    font-family: Georgia, serif;\n\n    font-size: clamp(50px, 6vw, 78px);\n\n    font-weight: 500;\n\n    line-height: 0.98;\n\n    letter-spacing: -2px;\n}\n\n\n.wnsa-final-cta h2 span {\n    display: block;\n\n    color: var(--wnsa-light-gold);\n\n    font-style: italic;\n}\n\n\n.wnsa-final-cta-content > p {\n    max-width: 500px;\n\n    margin: 0 0 32px;\n\n    color: rgba(255, 255, 255, 0.68);\n\n    font-size: 14px;\n\n    line-height: 1.8;\n}\n\n\n\/* =========================================\n   BUTTON\n   ========================================= *\/\n\n.wnsa-final-button {\n    display: inline-flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    gap: 15px;\n\n    min-width: 180px;\n\n    height: 52px;\n\n    padding: 0 28px;\n\n    border-radius: 30px;\n\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n\n    text-decoration: none;\n\n    font-size: 11px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n\n    transition: all 0.3s ease;\n}\n\n\n.wnsa-final-button:hover {\n    background: #ffffff;\n\n    transform: translateY(-3px);\n}\n\n\n\/* =========================================\n   PRODUCT\n   ========================================= *\/\n\n.wnsa-final-product {\n    position: relative;\n\n    min-height: 470px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n}\n\n\n\/* CIRCLE *\/\n\n.wnsa-final-circle {\n    position: absolute;\n\n    width: 420px;\n    height: 420px;\n\n    border-radius: 50%;\n\n    background: var(--wnsa-light-gold);\n\n    opacity: 0.95;\n}\n\n\n.wnsa-final-circle::after {\n    content: \"\";\n\n    position: absolute;\n\n    inset: 18px;\n\n    border-radius: 50%;\n\n    border: 1px solid rgba(7, 92, 104, 0.25);\n}\n\n\n\/* PRODUCT IMAGE *\/\n\n.wnsa-final-product img {\n    position: relative;\n\n    z-index: 3;\n\n    width: 310px;\n\n    height: auto;\n\n    filter:\n        drop-shadow(\n            0 30px 30px rgba(0, 0, 0, 0.28)\n        );\n\n    transform: rotate(-4deg);\n\n    transition: transform 0.5s ease;\n}\n\n\n.wnsa-final-product img:hover {\n    transform: rotate(0deg) translateY(-10px);\n}\n\n\n\/* =========================================\n   SPARKLES\n   ========================================= *\/\n\n.wnsa-final-sparkle {\n    position: absolute;\n\n    z-index: 4;\n\n    color: var(--wnsa-light-gold);\n\n    font-size: 30px;\n}\n\n\n.sparkle-one {\n    top: 65px;\n\n    right: 40px;\n\n    transform: rotate(15deg);\n}\n\n\n.sparkle-two {\n    bottom: 65px;\n\n    left: 40px;\n\n    font-size: 20px;\n\n    transform: rotate(-20deg);\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 900px) {\n\n    .wnsa-final-cta {\n        padding: 90px 25px;\n    }\n\n    .wnsa-final-cta-container {\n        grid-template-columns: 1fr;\n\n        text-align: center;\n\n        gap: 40px;\n    }\n\n    .wnsa-final-cta-content {\n        max-width: 650px;\n\n        margin: 0 auto;\n    }\n\n    .wnsa-final-cta-content > p {\n        margin-left: auto;\n\n        margin-right: auto;\n    }\n\n    .wnsa-final-product {\n        min-height: 400px;\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-final-cta {\n        padding: 75px 20px;\n    }\n\n    .wnsa-final-cta h2 {\n        font-size: 50px;\n\n        letter-spacing: -1px;\n    }\n\n    .wnsa-final-product {\n        min-height: 350px;\n    }\n\n    .wnsa-final-circle {\n        width: 300px;\n        height: 300px;\n    }\n\n    .wnsa-final-product img {\n        width: 225px;\n    }\n\n    .wnsa-final-button {\n        width: 100%;\n    }\n\n    .sparkle-one {\n        right: 10px;\n    }\n\n    .sparkle-two {\n        left: 10px;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - FOOTER\n   ========================================= *\/\n\n.wnsa-footer {\n    background: #073F48;\n\n    color: #ffffff;\n\n    padding: 80px 30px 25px;\n}\n\n\n\/* =========================================\n   MAIN FOOTER\n   ========================================= *\/\n\n.wnsa-footer-container {\n    max-width: 1180px;\n\n    margin: 0 auto;\n\n    display: grid;\n\n    grid-template-columns: 1.5fr 1fr 1fr 1.2fr;\n\n    gap: 60px;\n\n    padding-bottom: 60px;\n\n    border-bottom: 1px solid rgba(255, 255, 255, 0.12);\n}\n\n\n\/* =========================================\n   BRAND\n   ========================================= *\/\n\n.wnsa-footer-brand {\n    max-width: 300px;\n}\n\n\n.wnsa-footer-logo {\n    display: inline-block;\n\n    line-height: 0;\n\n    margin-bottom: 20px;\n\n    background: #ffffff;\n\n    padding: 8px 12px;\n\n    border-radius: 8px;\n}\n\n\n.wnsa-footer-logo img {\n    display: block;\n\n    width: 125px;\n\n    height: auto;\n}\n\n\n.wnsa-footer-brand > p {\n    margin: 0 0 25px;\n\n    color: rgba(255, 255, 255, 0.62);\n\n    font-size: 12px;\n\n    line-height: 1.8;\n}\n\n\n\/* =========================================\n   SOCIALS\n   ========================================= *\/\n\n.wnsa-footer-socials {\n    display: flex;\n\n    gap: 9px;\n}\n\n\n.wnsa-footer-socials a {\n    width: 34px;\n    height: 34px;\n\n    display: flex;\n\n    align-items: center;\n    justify-content: center;\n\n    border: 1px solid rgba(234, 218, 183, 0.35);\n\n    border-radius: 50%;\n\n    color: var(--wnsa-light-gold);\n\n    text-decoration: none;\n\n    font-size: 13px;\n\n    transition: 0.3s ease;\n}\n\n\n.wnsa-footer-socials a:hover {\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n\n    border-color: var(--wnsa-light-gold);\n}\n\n\n\/* =========================================\n   FOOTER COLUMNS\n   ========================================= *\/\n\n.wnsa-footer-column {\n    display: flex;\n\n    flex-direction: column;\n\n    align-items: flex-start;\n}\n\n\n.wnsa-footer-column h3 {\n    margin: 5px 0 22px;\n\n    color: var(--wnsa-light-gold);\n\n    font-family: Georgia, serif;\n\n    font-size: 18px;\n\n    font-weight: 500;\n}\n\n\n.wnsa-footer-column > a {\n    margin-bottom: 12px;\n\n    color: rgba(255, 255, 255, 0.65);\n\n    text-decoration: none;\n\n    font-size: 11px;\n\n    transition: 0.3s ease;\n}\n\n\n.wnsa-footer-column > a:hover {\n    color: var(--wnsa-light-gold);\n\n    padding-left: 3px;\n}\n\n\n\/* =========================================\n   CONTACT\n   ========================================= *\/\n\n.wnsa-footer-contact > p {\n    margin: 0 0 18px;\n\n    color: rgba(255, 255, 255, 0.65);\n\n    font-size: 11px;\n}\n\n\n.wnsa-footer-contact-button {\n    margin-top: 8px;\n\n    color: var(--wnsa-light-gold) !important;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n}\n\n\n\/* =========================================\n   NEWSLETTER\n   ========================================= *\/\n\n.wnsa-footer-newsletter {\n    max-width: 1180px;\n\n    margin: 0 auto;\n\n    padding: 45px 0;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: space-between;\n\n    gap: 40px;\n\n    border-bottom: 1px solid rgba(255, 255, 255, 0.12);\n}\n\n\n.wnsa-footer-newsletter span {\n    color: var(--wnsa-light-gold);\n\n    font-size: 9px;\n\n    font-weight: 700;\n\n    letter-spacing: 2px;\n}\n\n\n.wnsa-footer-newsletter h3 {\n    margin: 7px 0 0;\n\n    color: #ffffff;\n\n    font-family: Georgia, serif;\n\n    font-size: 25px;\n\n    font-weight: 500;\n}\n\n\n\/* NEWSLETTER FORM *\/\n\n.wnsa-newsletter-form {\n    display: flex;\n\n    width: 450px;\n\n    height: 48px;\n\n    border: 1px solid rgba(234, 218, 183, 0.3);\n\n    border-radius: 30px;\n\n    overflow: hidden;\n}\n\n\n.wnsa-newsletter-form input {\n    flex: 1;\n\n    min-width: 0;\n\n    padding: 0 20px;\n\n    border: none;\n\n    outline: none;\n\n    background: transparent;\n\n    color: #ffffff;\n\n    font-size: 11px;\n}\n\n\n.wnsa-newsletter-form input::placeholder {\n    color: rgba(255, 255, 255, 0.45);\n}\n\n\n.wnsa-newsletter-form button {\n    flex-shrink: 0;\n\n    padding: 0 22px;\n\n    border: none;\n\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n\n    cursor: pointer;\n}\n\n\n.wnsa-newsletter-form button span {\n    margin-left: 7px;\n\n    color: var(--wnsa-dark-teal);\n\n    font-size: 13px;\n}\n\n\n\/* =========================================\n   BOTTOM BAR\n   ========================================= *\/\n\n.wnsa-footer-bottom {\n    max-width: 1180px;\n\n    margin: 0 auto;\n\n    padding-top: 25px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: space-between;\n\n    gap: 20px;\n}\n\n\n.wnsa-footer-bottom p {\n    margin: 0;\n\n    color: rgba(255, 255, 255, 0.42);\n\n    font-size: 9px;\n}\n\n\n.wnsa-footer-legal {\n    display: flex;\n\n    align-items: center;\n\n    gap: 20px;\n}\n\n\n.wnsa-footer-legal a {\n    color: rgba(255, 255, 255, 0.42);\n\n    text-decoration: none;\n\n    font-size: 9px;\n}\n\n\n.wnsa-footer-legal a:hover {\n    color: var(--wnsa-light-gold);\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 950px) {\n\n    .wnsa-footer {\n        padding: 65px 25px 25px;\n    }\n\n    .wnsa-footer-container {\n        grid-template-columns: 1fr 1fr;\n\n        gap: 50px;\n    }\n\n    .wnsa-footer-newsletter {\n        flex-direction: column;\n\n        align-items: flex-start;\n    }\n\n    .wnsa-newsletter-form {\n        width: 100%;\n\n        max-width: 500px;\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-footer {\n        padding: 55px 20px 20px;\n    }\n\n    .wnsa-footer-container {\n        grid-template-columns: 1fr;\n\n        gap: 40px;\n\n        padding-bottom: 45px;\n    }\n\n    .wnsa-footer-brand {\n        max-width: 100%;\n    }\n\n    .wnsa-footer-newsletter {\n        padding: 35px 0;\n\n        gap: 25px;\n    }\n\n    .wnsa-footer-newsletter h3 {\n        font-size: 22px;\n    }\n\n    .wnsa-newsletter-form {\n        height: 45px;\n    }\n\n    .wnsa-newsletter-form button {\n        padding: 0 15px;\n    }\n\n    .wnsa-footer-bottom {\n        flex-direction: column;\n\n        align-items: flex-start;\n\n        padding-top: 20px;\n    }\n\n    .wnsa-footer-legal {\n        flex-wrap: wrap;\n\n        gap: 10px 15px;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - BENEFIT CARD 02 FIX\n   Makes Card 02 match Card 01\n   ========================================= *\/\n\n.wnsa-benefits-grid .wnsa-benefit-card.wnsa-benefit-featured {\n    background: var(--wnsa-cream) !important;\n\n    color: var(--wnsa-dark-teal);\n\n    border: 1px solid rgba(13, 124, 147, 0.08);\n\n    box-shadow: none;\n\n    transform: none;\n}\n\n\n\/* Number *\/\n\n.wnsa-benefits-grid\n.wnsa-benefit-card.wnsa-benefit-featured\n.wnsa-benefit-number {\n\n    color: rgba(13, 124, 147, 0.25);\n}\n\n\n\/* Icon *\/\n\n.wnsa-benefits-grid\n.wnsa-benefit-card.wnsa-benefit-featured\n.wnsa-benefit-icon {\n\n    background: var(--wnsa-light-gold);\n\n    color: var(--wnsa-dark-teal);\n}\n\n\n\/* Heading *\/\n\n.wnsa-benefits-grid\n.wnsa-benefit-card.wnsa-benefit-featured\nh3 {\n\n    color: var(--wnsa-dark-teal);\n}\n\n\n\/* Description *\/\n\n.wnsa-benefits-grid\n.wnsa-benefit-card.wnsa-benefit-featured\np {\n\n    color: #687676;\n}\n\n\n\/* Discover More *\/\n\n.wnsa-benefits-grid\n.wnsa-benefit-card.wnsa-benefit-featured\na {\n\n    color: var(--wnsa-teal);\n}\n\n\n\/* Hover *\/\n\n.wnsa-benefits-grid\n.wnsa-benefit-card.wnsa-benefit-featured:hover {\n\n    background: var(--wnsa-cream) !important;\n\n    transform: translateY(-8px);\n\n    box-shadow:\n        0 20px 45px rgba(39, 56, 58, 0.10);\n}\n\/* =========================================\n   WHY NOT SA - SEPARATE HEADER\n   ========================================= *\/\n\n.wnsa-header {\n    position: relative;\n\n    top: auto;\n    left: auto;\n\n    width: 100%;\n\n    z-index: 100;\n\n    background: #F6F1E6;\n\n    border-bottom: 1px solid rgba(13, 124, 147, 0.10);\n}\n\n\n.wnsa-navbar {\n    width: 100%;\n\n    max-width: 1350px;\n\n    min-height: 88px;\n\n    margin: 0 auto;\n\n    padding: 10px 35px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: space-between;\n\n    gap: 30px;\n}\n\n\n\/* =========================================\n   LOGO\n   ========================================= *\/\n\n.wnsa-logo {\n    display: flex;\n\n    align-items: center;\n\n    flex-shrink: 0;\n\n    line-height: 0;\n\n    text-decoration: none;\n}\n\n\n.wnsa-logo img {\n    display: block;\n\n    width: 105px;\n\n    height: auto;\n\n    max-height: 72px;\n\n    object-fit: contain;\n\n    border-radius: 0 !important;\n\n    background: transparent !important;\n}\n\n\n\/* =========================================\n   NAVIGATION\n   ========================================= *\/\n\n.wnsa-nav {\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    gap: 28px;\n\n    margin-left: auto;\n}\n\n\n.wnsa-nav a {\n    position: relative;\n\n    padding: 8px 0;\n\n    color: var(--wnsa-dark-teal);\n\n    text-decoration: none;\n\n    font-family: Arial, sans-serif;\n\n    font-size: 11px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n\n    transition: color 0.3s ease;\n}\n\n\n.wnsa-nav a::after {\n    content: \"\";\n\n    position: absolute;\n\n    left: 0;\n    bottom: 0;\n\n    width: 0;\n\n    height: 1px;\n\n    background: var(--wnsa-gold);\n\n    transition: width 0.3s ease;\n}\n\n\n.wnsa-nav a:hover,\n.wnsa-nav a.active {\n    color: var(--wnsa-teal);\n}\n\n\n.wnsa-nav a:hover::after,\n.wnsa-nav a.active::after {\n    width: 100%;\n}\n\n\n\/* =========================================\n   SHOP BUTTON\n   ========================================= *\/\n\n.wnsa-header-actions {\n    display: flex;\n\n    align-items: center;\n\n    flex-shrink: 0;\n}\n\n\n.wnsa-header-shop {\n    display: inline-flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    gap: 10px;\n\n    min-height: 42px;\n\n    padding: 0 21px;\n\n    border-radius: 25px;\n\n    background: var(--wnsa-dark-teal);\n\n    color: #ffffff;\n\n    text-decoration: none;\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n\n    transition: 0.3s ease;\n}\n\n\n.wnsa-header-shop:hover {\n    background: var(--wnsa-teal);\n\n    transform: translateY(-2px);\n}\n\n\n\/* =========================================\n   HERO\n   ========================================= *\/\n\n.wnsa-hero {\n    position: relative;\n\n    width: 100%;\n\n    min-height: 720px;\n\n    overflow: hidden;\n\n    background: #F6F1E6;\n}\n\n\n\/* =========================================\n   HERO IMAGE\n   ========================================= *\/\n\n.wnsa-hero-background {\n    position: absolute;\n\n    inset: 0;\n\n    width: 100%;\n    height: 100%;\n\n    z-index: 1;\n}\n\n\n.wnsa-hero-background img {\n    display: block;\n\n    width: 100%;\n    height: 100%;\n\n    max-width: none !important;\n\n    object-fit: cover;\n\n    object-position: center center;\n\n    border-radius: 0 !important;\n}\n\n\n\/* =========================================\n   HERO CONTENT OVER IMAGE\n   ========================================= *\/\n\n.wnsa-hero-container {\n    position: relative;\n\n    z-index: 5;\n\n    width: 100%;\n\n    max-width: 1350px;\n\n    min-height: 720px;\n\n    margin: 0 auto;\n\n    padding: 100px 60px;\n\n    display: flex;\n\n    align-items: center;\n}\n\n\n.wnsa-hero-content {\n    width: 50%;\n\n    max-width: 600px;\n}\n\n\n\/* =========================================\n   HERO TEXT\n   ========================================= *\/\n\n.wnsa-hero-eyebrow {\n    display: inline-block;\n\n    margin-bottom: 20px;\n\n    color: var(--wnsa-teal);\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    letter-spacing: 2.5px;\n}\n\n\n.wnsa-hero h1 {\n    margin: 0;\n\n    color: var(--wnsa-dark-teal);\n\n    font-family: Georgia, serif;\n\n    font-size: clamp(55px, 7vw, 88px);\n\n    font-weight: 500;\n\n    line-height: 0.98;\n\n    letter-spacing: -2px;\n}\n\n\n.wnsa-hero h1 span {\n    display: block;\n\n    color: var(--wnsa-teal);\n\n    font-style: italic;\n}\n\n\n.wnsa-hero-content > p {\n    max-width: 500px;\n\n    margin: 28px 0 32px;\n\n    color: #566968;\n\n    font-size: 15px;\n\n    line-height: 1.8;\n}\n\n\n\/* =========================================\n   HERO BUTTONS\n   ========================================= *\/\n\n.wnsa-hero-buttons {\n    display: flex;\n\n    align-items: center;\n\n    gap: 18px;\n}\n\n\n.wnsa-hero-button {\n    display: inline-flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    gap: 14px;\n\n    min-height: 52px;\n\n    padding: 0 28px;\n\n    border-radius: 30px;\n\n    background: var(--wnsa-dark-teal);\n\n    color: #ffffff;\n\n    text-decoration: none;\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n\n    transition: 0.3s ease;\n}\n\n\n.wnsa-hero-button:hover {\n    background: var(--wnsa-teal);\n\n    transform: translateY(-3px);\n}\n\n\n.wnsa-hero-secondary {\n    color: var(--wnsa-dark-teal);\n\n    text-decoration: none;\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    text-transform: uppercase;\n\n    letter-spacing: 0.8px;\n\n    border-bottom: 1px solid var(--wnsa-gold);\n\n    padding-bottom: 5px;\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 1000px) {\n\n    .wnsa-navbar {\n        padding: 10px 25px;\n    }\n\n    .wnsa-nav {\n        gap: 16px;\n    }\n\n    .wnsa-nav a {\n        font-size: 9px;\n    }\n\n    .wnsa-hero-container {\n        padding-left: 40px;\n        padding-right: 40px;\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 768px) {\n\n    .wnsa-navbar {\n        min-height: 75px;\n\n        padding: 8px 20px;\n    }\n\n\n    .wnsa-logo img {\n        width: 85px;\n    }\n\n\n    .wnsa-header-shop {\n        min-height: 38px;\n\n        padding: 0 15px;\n\n        font-size: 9px;\n    }\n\n\n    .wnsa-hero {\n        min-height: 700px;\n    }\n\n\n    .wnsa-hero-background img {\n        object-position: center center;\n    }\n\n\n    .wnsa-hero-container {\n        min-height: 700px;\n\n        padding:\n            80px\n            25px\n            60px;\n\n        align-items: center;\n    }\n\n\n    .wnsa-hero-content {\n        width: 100%;\n\n        max-width: 600px;\n\n        margin: 0 auto;\n    }\n\n\n    .wnsa-hero h1 {\n        font-size: 52px;\n\n        letter-spacing: -1px;\n    }\n\n\n    .wnsa-hero-content > p {\n        font-size: 14px;\n    }\n\n\n    .wnsa-hero-buttons {\n        flex-wrap: wrap;\n    }\n\n}\n\n\n\/* =========================================\n   SMALL MOBILE\n   ========================================= *\/\n\n@media (max-width: 480px) {\n\n    .wnsa-hero {\n        min-height: 650px;\n    }\n\n\n    .wnsa-hero-container {\n        min-height: 650px;\n\n        padding:\n            60px\n            20px\n            50px;\n    }\n\n\n    .wnsa-hero h1 {\n        font-size: 45px;\n    }\n\n\n    .wnsa-hero-buttons {\n        flex-direction: column;\n\n        width: 100%;\n    }\n\n\n    .wnsa-hero-button {\n        width: 100%;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - HERO IMAGE + TEXT FIX\n   KEEP THE FULL IMAGE VISIBLE\n   ========================================= *\/\n\n.wnsa-hero {\n    position: relative !important;\n    overflow: hidden !important;\n    background: transparent !important;\n}\n\n\n\/* =========================================\n   FULL IMAGE\n   ========================================= *\/\n\n.wnsa-hero-background {\n    position: absolute !important;\n\n    inset: 0 !important;\n\n    width: 100% !important;\n    height: 100% !important;\n\n    z-index: 1 !important;\n}\n\n\n.wnsa-hero-background img {\n    display: block !important;\n\n    width: 100% !important;\n    height: 100% !important;\n\n    max-width: none !important;\n\n    object-fit: cover !important;\n\n    object-position: center center !important;\n\n    border-radius: 0 !important;\n}\n\n\n\/* =========================================\n   VERY LIGHT TEXT READABILITY FADE\n   ========================================= *\/\n\n.wnsa-hero::before {\n    content: \"\";\n\n    position: absolute;\n\n    inset: 0;\n\n    z-index: 2;\n\n    pointer-events: none;\n\n    background:\n        linear-gradient(\n            90deg,\n            rgba(246, 241, 230, 0.48) 0%,\n            rgba(246, 241, 230, 0.28) 25%,\n            rgba(246, 241, 230, 0.08) 45%,\n            rgba(246, 241, 230, 0) 65%\n        );\n}\n\n\n\/* =========================================\n   HERO CONTENT\n   ========================================= *\/\n\n.wnsa-hero-container {\n    position: relative !important;\n\n    z-index: 5 !important;\n\n    min-height: 720px;\n\n    padding: 100px 60px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: flex-start;\n}\n\n\n\/* =========================================\n   NO BOX AROUND TEXT\n   ========================================= *\/\n\n.wnsa-hero-content {\n    width: 50%;\n\n    max-width: 580px;\n\n    padding: 0 !important;\n\n    background: transparent !important;\n\n    border: none !important;\n\n    border-radius: 0 !important;\n\n    box-shadow: none !important;\n\n    backdrop-filter: none !important;\n\n    -webkit-backdrop-filter: none !important;\n}\n\n\n\/* =========================================\n   HEADING\n   ========================================= *\/\n\n.wnsa-hero h1 {\n    color: #075B68 !important;\n\n    text-shadow:\n        0 2px 3px rgba(255, 255, 255, 0.75);\n\n    margin-bottom: 20px;\n}\n\n\n.wnsa-hero h1 span {\n    color: #0D7C93 !important;\n}\n\n\n\/* =========================================\n   SMALL HEADING\n   ========================================= *\/\n\n.wnsa-hero-eyebrow {\n    color: #075B68 !important;\n\n    font-weight: 700;\n\n    text-shadow:\n        0 1px 3px rgba(255, 255, 255, 0.85);\n}\n\n\n\/* =========================================\n   TAGLINE\n   ========================================= *\/\n\n.wnsa-hero-tagline {\n    color: #075B68 !important;\n\n    font-weight: 600;\n\n    text-shadow:\n        0 1px 3px rgba(255, 255, 255, 0.8);\n}\n\n\n\/* =========================================\n   DESCRIPTION\n   ========================================= *\/\n\n.wnsa-hero-description {\n    color: #3F595A !important;\n\n    font-weight: 500;\n\n    text-shadow:\n        0 1px 3px rgba(255, 255, 255, 0.8);\n}\n\n\n\/* =========================================\n   BENEFITS\n   ========================================= *\/\n\n.wnsa-hero-benefit p {\n    color: #075B68 !important;\n\n    font-weight: 600;\n\n    text-shadow:\n        0 1px 3px rgba(255, 255, 255, 0.8);\n}\n\n\n.wnsa-hero-benefit span {\n    color: #C8AF92 !important;\n}\n\n\n\/* =========================================\n   BUTTONS\n   ========================================= *\/\n\n.wnsa-primary-button {\n    background: #0D7C93 !important;\n\n    color: #ffffff !important;\n\n    box-shadow:\n        0 8px 20px rgba(13, 124, 147, 0.20);\n}\n\n\n.wnsa-secondary-button {\n    color: #075B68 !important;\n\n    background: rgba(246, 241, 230, 0.25);\n\n    border-color: #C8AF92 !important;\n\n    text-shadow:\n        0 1px 2px rgba(255,255,255,0.7);\n}\n\n\n\/* =========================================\n   DESKTOP\n   ========================================= *\/\n\n@media (min-width: 1000px) {\n\n    .wnsa-hero-content {\n        margin-left: 20px;\n    }\n\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 900px) {\n\n    .wnsa-hero-container {\n        padding: 80px 35px;\n    }\n\n    .wnsa-hero-content {\n        width: 55%;\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 768px) {\n\n    .wnsa-hero {\n        min-height: 700px;\n    }\n\n\n    .wnsa-hero::before {\n        background:\n            linear-gradient(\n                180deg,\n                rgba(246, 241, 230, 0.35) 0%,\n                rgba(246, 241, 230, 0.12) 50%,\n                rgba(246, 241, 230, 0) 100%\n            );\n    }\n\n\n    .wnsa-hero-container {\n        min-height: 700px;\n\n        padding: 70px 25px;\n\n        justify-content: center;\n\n        text-align: center;\n    }\n\n\n    .wnsa-hero-content {\n        width: 100%;\n\n        max-width: 580px;\n    }\n\n\n    .wnsa-hero h1 {\n        font-size: 48px;\n    }\n\n\n    .wnsa-hero-content > p {\n        margin-left: auto;\n\n        margin-right: auto;\n    }\n\n\n    .wnsa-hero-benefits {\n        justify-content: center;\n    }\n\n\n    .wnsa-hero-buttons {\n        justify-content: center;\n    }\n\n}\n\n\n\/* =========================================\n   SMALL MOBILE\n   ========================================= *\/\n\n@media (max-width: 480px) {\n\n    .wnsa-hero h1 {\n        font-size: 42px;\n    }\n\n}\n\/* =========================================\n   HERO - TEXT READABILITY\n   ========================================= *\/\n\n\/* Description *\/\n.wnsa-hero-description {\n    color: #073F48 !important;\n    font-weight: 600 !important;\n    text-shadow: none !important;\n}\n\n\n\/* Benefit text *\/\n.wnsa-hero-benefit p {\n    color: #073F48 !important;\n    font-weight: 700 !important;\n}\n\n\n\/* Benefit icons *\/\n.wnsa-hero-benefit span {\n    color: #C8AF92 !important;\n}\n\n\n\/* Learn More *\/\n.wnsa-secondary-button {\n    color: #073F48 !important;\n    font-weight: 700 !important;\n    background: rgba(246, 241, 230, 0.65) !important;\n    border-color: #C8AF92 !important;\n}\n\n\n\/* Shop Now *\/\n.wnsa-primary-button {\n    background: #073F48 !important;\n    color: #FFFFFF !important;\n    font-weight: 700 !important;\n}\n\/* Move hero image upward without moving text *\/\n\n.wnsa-hero-background img {\n    object-position: center 30% !important;\n}\n\/* Remove the unwanted pink\/red block only *\/\n[style*=\"background-color: rgb(204, 38, 88)\"],\n[style*=\"background-color:#cc2658\"],\n[style*=\"background-color: #cc2658\"],\n[style*=\"background:#cc2658\"],\n[style*=\"background: #cc2658\"] {\n    display: none !important;\n}\n\/* Remove empty pink button only *\/\n.wsa-navbar button:not(.wsa-mobile-menu):empty {\n    display: none !important;\n}\n\/* =========================================\n   WHY NOT SA - GLOW FROM WITHIN BUBBLE\n   ========================================= *\/\n\n\/* Hide the old WHY NOT SA text *\/\n.glow-bubble .brand-text {\n    display: none !important;\n}\n\n\/* Glow From Within text *\/\n.glow-bubble .glow-text {\n    font-size: 20px !important;\n    font-weight: 600 !important;\n    letter-spacing: 2px !important;\n    line-height: 1.2 !important;\n    text-align: center !important;\n    color: #F6F1E6 !important;\n    width: 85% !important;\n    margin: 0 auto !important;\n}\n\n\/* Keep the text nicely centred inside the circle *\/\n.glow-bubble {\n    display: flex !important;\n    align-items: center !important;\n    justify-content: center !important;\n    text-align: center !important;\n}\n\/* =========================================\n   WHY NOT SA - WAYS TO USE\n   ========================================= *\/\n\n.wnsa-ways {\n    width: 100%;\n    background: #F7F1E4;\n    padding: 10px 0 25px;\n}\n\n.wnsa-ways-container {\n    width: 100%;\n    max-width: 1400px;\n    margin: 0 auto;\n    padding: 0 20px;\n\n    display: grid;\n    grid-template-columns: repeat(4, 1fr);\n    gap: 16px;\n    box-sizing: border-box;\n}\n\n.wnsa-way-card {\n    position: relative;\n\n    min-height: 270px;\n    padding: 32px 28px;\n\n    background: #F6F1E6;\n    border: 1px solid rgba(20, 110, 125, 0.12);\n    border-radius: 18px;\n\n    box-sizing: border-box;\n    overflow: hidden;\n\n    transition: transform 0.25s ease,\n                box-shadow 0.25s ease;\n}\n\n.wnsa-way-card:hover {\n    transform: translateY(-4px);\n    box-shadow: 0 12px 30px rgba(20, 110, 125, 0.10);\n}\n\n\n\/* NUMBER *\/\n\n.wnsa-way-number {\n    position: absolute;\n    top: 22px;\n    right: 24px;\n\n    font-family: Arial, sans-serif;\n    font-size: 12px;\n    font-weight: 600;\n    letter-spacing: 1px;\n\n    color: rgba(20, 110, 125, 0.30);\n}\n\n\n\/* ICON CIRCLE *\/\n\n.wnsa-way-icon {\n    width: 58px;\n    height: 58px;\n\n    margin-bottom: 28px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    background: #EADAB7;\n    border-radius: 50%;\n}\n\n\n\/* SVG ICON *\/\n\n.wnsa-way-icon svg {\n    width: 30px;\n    height: 30px;\n\n    fill: none;\n    stroke: #0D7C93;\n    stroke-width: 2;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n}\n\n\n\/* TITLE *\/\n\n.wnsa-way-card h3 {\n    margin: 0 0 14px;\n\n    font-family: Georgia, \"Times New Roman\", serif;\n    font-size: 25px;\n    font-weight: 500;\n    line-height: 1.2;\n\n    color: #0D6070;\n}\n\n\n\/* DESCRIPTION *\/\n\n.wnsa-way-card p {\n    margin: 0;\n\n    font-family: Arial, sans-serif;\n    font-size: 14px;\n    line-height: 1.7;\n\n    color: #7A8585;\n}\n\n\n\/* MOBILE *\/\n\n@media (max-width: 900px) {\n\n    .wnsa-ways-container {\n        grid-template-columns: repeat(2, 1fr);\n    }\n\n}\n\n\n@media (max-width: 600px) {\n\n    .wnsa-ways {\n        padding: 10px 0 20px;\n    }\n\n    .wnsa-ways-container {\n        grid-template-columns: 1fr;\n        padding: 0 15px;\n    }\n\n    .wnsa-way-card {\n        min-height: 230px;\n    }\n\n}\n\/* =========================================\n   WHY NOT SA - HOW TO USE SECTION\n   ========================================= *\/\n\n.wnsa-how {\n    width: 100%;\n\n    padding: 110px 30px;\n\n    background: #F6F1E6;\n\n    overflow: hidden;\n}\n\n\n.wnsa-how-container {\n    width: 100%;\n\n    max-width: 1250px;\n\n    margin: 0 auto;\n}\n\n\n\/* =========================================\n   INTRO\n   ========================================= *\/\n\n.wnsa-how-intro {\n    max-width: 850px;\n\n    margin: 0 auto 70px;\n\n    text-align: center;\n}\n\n\n.wnsa-how-eyebrow {\n    display: block;\n\n    margin-bottom: 18px;\n\n    color: #0D7C93;\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    letter-spacing: 3px;\n\n    text-transform: uppercase;\n}\n\n\n.wnsa-how-intro h2 {\n    margin: 0;\n\n    color: #075B68;\n\n    font-family: Georgia, serif;\n\n    font-size: clamp(48px, 6vw, 70px);\n\n    font-weight: 500;\n\n    line-height: 1;\n\n    letter-spacing: -2px;\n}\n\n\n.wnsa-how-intro h2 span {\n    display: block;\n\n    color: #0D7C93;\n\n    font-style: italic;\n}\n\n\n.wnsa-how-intro > p {\n    max-width: 700px;\n\n    margin: 30px auto 0;\n\n    color: #687676;\n\n    font-size: 14px;\n\n    line-height: 1.8;\n}\n\n\n\/* =========================================\n   CARD GRID\n   ========================================= *\/\n\n.wnsa-how-grid {\n    display: grid;\n\n    grid-template-columns:\n        repeat(4, 1fr);\n\n    gap: 18px;\n}\n\n\n\/* =========================================\n   CARD\n   ========================================= *\/\n\n.wnsa-how-card {\n    position: relative;\n\n    min-height: 400px;\n\n    padding: 38px 28px;\n\n    background: #F3EEE2;\n\n    border: 1px solid\n        rgba(13, 124, 147, 0.10);\n\n    border-radius: 18px;\n\n    overflow: hidden;\n\n    transition:\n        transform 0.3s ease,\n        box-shadow 0.3s ease;\n}\n\n\n.wnsa-how-card:hover {\n    transform: translateY(-7px);\n\n    box-shadow:\n        0 18px 40px\n        rgba(39, 56, 58, 0.10);\n}\n\n\n\/* =========================================\n   NUMBER\n   ========================================= *\/\n\n.wnsa-how-number {\n    position: absolute;\n\n    top: 25px;\n\n    right: 25px;\n\n    color: rgba(13, 124, 147, 0.25);\n\n    font-size: 10px;\n\n    font-weight: 700;\n\n    letter-spacing: 1px;\n}\n\n\n\/* =========================================\n   LINE ICON CIRCLE\n   ========================================= *\/\n\n.wnsa-how-icon {\n    width: 58px;\n\n    height: 58px;\n\n    margin-bottom: 30px;\n\n    display: flex;\n\n    align-items: center;\n\n    justify-content: center;\n\n    border-radius: 50%;\n\n    background: #EADAB7;\n\n    color: #0D7C93;\n\n    transition:\n        transform 0.3s ease,\n        background 0.3s ease,\n        color 0.3s ease;\n}\n\n\n.wnsa-how-icon svg {\n    width: 31px;\n\n    height: 31px;\n\n    display: block;\n\n    fill: none;\n\n    stroke: currentColor;\n\n    stroke-width: 1.7;\n\n    stroke-linecap: round;\n\n    stroke-linejoin: round;\n}\n\n\n.wnsa-how-card:hover .wnsa-how-icon {\n    transform: translateY(-3px);\n\n    background: #D8C9A8;\n\n    color: #075B68;\n}\n\n\n\/* =========================================\n   CARD HEADING\n   ========================================= *\/\n\n.wnsa-how-card h3 {\n    margin: 0 0 15px;\n\n    color: #075B68;\n\n    font-family: Georgia, serif;\n\n    font-size: 25px;\n\n    font-weight: 500;\n\n    line-height: 1.15;\n}\n\n\n\/* =========================================\n   CARD DESCRIPTION\n   ========================================= *\/\n\n.wnsa-how-card p {\n    max-width: 260px;\n\n    margin: 0;\n\n    color: #687676;\n\n    font-size: 12px;\n\n    line-height: 1.8;\n}\n\n\n\/* =========================================\n   TABLET\n   ========================================= *\/\n\n@media (max-width: 1000px) {\n\n    .wnsa-how {\n        padding: 90px 25px;\n    }\n\n    .wnsa-how-grid {\n        grid-template-columns:\n            repeat(2, 1fr);\n\n        gap: 18px;\n    }\n\n}\n\n\n\/* =========================================\n   MOBILE\n   ========================================= *\/\n\n@media (max-width: 600px) {\n\n    .wnsa-how {\n        padding: 75px 20px;\n    }\n\n\n    .wnsa-how-intro {\n        margin-bottom: 45px;\n    }\n\n\n    .wnsa-how-intro h2 {\n        font-size: 45px;\n\n        letter-spacing: -1px;\n    }\n\n\n    .wnsa-how-grid {\n        grid-template-columns: 1fr;\n\n        gap: 15px;\n    }\n\n\n    .wnsa-how-card {\n        min-height: 300px;\n\n        padding: 30px 25px;\n    }\n\n\n    .wnsa-how-card h3 {\n        font-size: 24px;\n    }\n\n}\n.wnsa-badge {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n}\n\n.wnsa-badge strong {\n    color: #F6F1E6;\n    font-size: 14px;\n    font-weight: 700;\n    letter-spacing: 2px;\n    text-transform: uppercase;\n}\n\/* =========================================\n   WHY NOT SA - GLOW FROM WITHIN BUBBLE\n   ========================================= *\/\n\n\/* Hide the old WHY NOT SA text *\/\n.glow-bubble .brand-text {\n    display: none !important;\n}\n\n\/* Glow From Within text *\/\n.glow-bubble .glow-text {\n    font-size: 20px !important;\n    font-weight: 600 !important;\n    letter-spacing: 2px !important;\n    line-height: 1.2 !important;\n    text-align: center !important;\n    color: #F6F1E6 !important;\n    width: 85% !important;\n    margin: 0 auto !important;\n}\n\n\/* Keep the text nicely centred inside the circle *\/\n.glow-bubble {\n    display: flex !important;\n    align-items: center !important;\n    justify-content: center !important;\n    text-align: center !important;\n}\n\/* =========================================\n   ABOUT BADGE - GLOW FROM WITHIN\n   ========================================= *\/\n\n.wnsa-about-badge {\n    position: absolute !important;\n\n    display: flex !important;\n\n    align-items: center !important;\n\n    justify-content: center !important;\n\n    text-align: center !important;\n\n    padding: 20px !important;\n\n    box-sizing: border-box !important;\n\n    overflow: hidden !important;\n}\n\n\n\/* Badge text *\/\n\n.wnsa-about-badge strong {\n    display: block !important;\n\n    width: 100% !important;\n\n    margin: 0 !important;\n\n    padding: 0 !important;\n\n    color: #F6F1E6 !important;\n\n    font-family: Georgia, serif !important;\n\n    font-size: 22px !important;\n\n    font-weight: 600 !important;\n\n    line-height: 1.05 !important;\n\n    letter-spacing: 0 !important;\n\n    text-align: center !important;\n\n    text-transform: none !important;\n\n    white-space: normal !important;\n}\n\/* Space between About image and text *\/\n.wnsa-about-visual {\n    margin-bottom: 35px !important;\n}\n\/* =========================================\n   REMOVE UNWANTED RED HEADER BLOCK\n   ========================================= *\/\n\n.wnsa-header-actions > div:not(.wnsa-cart),\n.wnsa-header-actions > a:not(.wnsa-cart):not(.wnsa-shop-button) {\n    display: none !important;\n}\n\/* Remove stray coloured block from header *\/\n.wnsa-header-actions .wp-block-button,\n.wnsa-header-actions .wp-element-button,\n.wnsa-header-actions .wp-block-group:empty {\n    display: none !important;\n}\n\/* =========================================\n   REMOVE RED BLOCK NEXT TO CART\n   ========================================= *\/\n\n.wnsa-header-actions > *:not(.wnsa-cart):not(.wnsa-shop-button) {\n    display: none !important;\n}\n\n\n\/* Remove any empty or coloured element inside header actions *\/\n.wnsa-header-actions > *:empty {\n    display: none !important;\n}\n\n\n\/* Hide buttons\/groups that may be creating the block *\/\n.wnsa-header-actions .wp-block-button,\n.wnsa-header-actions .wp-block-group,\n.wnsa-header-actions .wp-block-column,\n.wnsa-header-actions .wp-element-button {\n    display: none !important;\n}\n\n\n\/* Make sure the actual cart and Shop Now remain *\/\n.wnsa-header-actions .wnsa-cart,\n.wnsa-header-actions .wnsa-shop-button {\n    display: flex !important;\n}\n\/* =========================================\n   HEADER LAYOUT FIX\n   ========================================= *\/\n\n\/* Break the header out of the narrow theme column *\/\n.wnsa-header {\n    width: 100vw !important;\n    max-width: 100vw !important;\n    margin-left: calc(50% - 50vw) !important;\n    margin-right: 0 !important;\n    box-sizing: border-box;\n}\n\n.wnsa-top-bar,\n.wnsa-navbar {\n    box-sizing: border-box;\n}\n\n\/* Keep nav labels on one line *\/\n.wnsa-nav a {\n    white-space: nowrap !important;\n}\n\n\/* Shop Now button: remove theme's red underlined link style *\/\n.wnsa-header-actions a.wnsa-shop-button,\n.wnsa-header-actions a.wnsa-shop-button:hover,\n.wnsa-header-actions a.wnsa-shop-button:visited {\n    color: #ffffff !important;\n    text-decoration: none !important;\n    white-space: nowrap;\n}\n\n\/* Remove theme underline from the other header links too *\/\n.wnsa-nav a,\n.wnsa-cart,\n.wnsa-logo {\n    text-decoration: none !important;\n}\n\n\/* Stop the full-width breakout from causing a sideways scrollbar *\/\nhtml,\nbody {\n    overflow-x: hidden;\n}\n\/* =========================================\n   FULL-WIDTH SECTIONS (desktop + mobile)\n   ========================================= *\/\n\n.wnsa-hero,\n.wnsa-benefits,\n.wnsa-product-section,\n.wnsa-about,\n.wnsa-inside,\n.wnsa-how,\n.wnsa-testimonials,\n.wnsa-faq,\n.wnsa-final-cta,\n.wnsa-footer {\n    width: 100vw !important;\n    max-width: 100vw !important;\n    margin-left: calc(50% - 50vw) !important;\n    margin-right: 0 !important;\n    box-sizing: border-box;\n}\n\n\/* Stop images and buttons overflowing small screens *\/\n.wnsa-header img,\n.wnsa-hero img,\n.wnsa-product-section img,\n.wnsa-about img,\n.wnsa-inside img,\n.wnsa-final-cta img,\n.wnsa-footer img {\n    max-width: 100%;\n}\n\n.wnsa-primary-button,\n.wnsa-secondary-button,\n.wnsa-add-to-cart,\n.wnsa-final-button,\n.wnsa-about-button {\n    text-decoration: none !important;\n}\n\n\n\/* =========================================\n   MOBILE HEADER (768px and below)\n   ========================================= *\/\n\n@media (max-width: 768px) {\n\n    \/* Top bar: keep to one tidy line *\/\n    .wnsa-top-bar {\n        padding: 8px 12px;\n        text-align: center;\n    }\n\n    .wnsa-top-divider,\n    .wnsa-top-bar-inner span:last-child {\n        display: none !important;\n    }\n\n    \/* Navbar: logo on the left, cart + Shop Now on the right *\/\n    .wnsa-navbar {\n        padding: 8px 16px !important;\n        gap: 12px !important;\n        min-height: 70px !important;\n    }\n\n    .wnsa-logo img {\n        width: 70px !important;\n    }\n\n    .wnsa-header-actions {\n        margin-left: auto;\n        gap: 10px !important;\n    }\n\n    .wnsa-shop-button {\n        min-width: 0 !important;\n        height: 36px !important;\n        padding: 0 16px !important;\n        font-size: 10px !important;\n        white-space: nowrap;\n    }\n\n    .wnsa-shop-button span {\n        display: none;\n    }\n\n    \/* About image: stay inside the screen *\/\n    .wnsa-about-image {\n        max-width: 100%;\n    }\n}\n\n\n\/* =========================================\n   SMALL PHONES (480px and below)\n   ========================================= *\/\n\n@media (max-width: 480px) {\n\n    .wnsa-top-bar {\n        font-size: 10px;\n        letter-spacing: 0.2px;\n    }\n\n    .wnsa-hero h1 {\n        font-size: 40px !important;\n        letter-spacing: -1px !important;\n    }\n\n    .wnsa-product-buy {\n        flex-direction: column;\n        align-items: stretch;\n    }\n\n    .wnsa-newsletter-form {\n        width: 100% !important;\n    }\n\n    .wnsa-footer-bottom,\n    .wnsa-footer-legal {\n        flex-wrap: wrap;\n    }\n}\n\/* =========================================\n   REMOVE RED BLOCK IN HEADER\n   ========================================= *\/\n\n\/* Only the logo, nav and actions may sit directly in the navbar *\/\n.wnsa-navbar > *:not(.wnsa-logo):not(.wnsa-nav):not(.wnsa-header-actions) {\n    display: none !important;\n}\n\n\/* Only links may sit inside the nav *\/\n.wnsa-nav > *:not(a) {\n    display: none !important;\n}\n\n\/* Only the cart and Shop Now may sit inside the actions area *\/\n.wnsa-header-actions > *:not(.wnsa-cart):not(.wnsa-shop-button) {\n    display: none !important;\n}\n\n\/* Any stray button or empty element in the header *\/\n.wnsa-header button,\n.wnsa-header .wp-block-button,\n.wnsa-header .wp-element-button,\n.wnsa-header p:empty,\n.wnsa-header div:empty:not(.wnsa-cart):not(.wnsa-top-bar-inner) {\n    display: none !important;\n}\n\n\/* Make sure the real items stay visible *\/\n.wnsa-header .wnsa-cart,\n.wnsa-header .wnsa-shop-button {\n    display: flex !important;\n}\n\n.wnsa-header .wnsa-cart-count {\n    display: flex !important;\n}\n\/* =========================================\n   BUTTON TEXT COLOUR FIX (theme override)\n   ========================================= *\/\n\na.wnsa-about-button,\na.wnsa-about-button:hover,\na.wnsa-about-button:visited {\n    color: #ffffff !important;\n    text-decoration: none !important;\n}\n\na.wnsa-final-button,\na.wnsa-final-button:hover,\na.wnsa-final-button:visited {\n    color: #075C68 !important;\n    text-decoration: none !important;\n}\n\na.wnsa-primary-button,\na.wnsa-primary-button:hover,\na.wnsa-primary-button:visited {\n    color: #ffffff !important;\n    text-decoration: none !important;\n}\n\na.wnsa-secondary-button,\na.wnsa-secondary-button:hover,\na.wnsa-secondary-button:visited {\n    text-decoration: none !important;\n}\n\n\n\/* =========================================\n   \"NOTHING EXTRA\" SECTION - FINE BACKGROUND DETAIL\n   ========================================= *\/\n\n.wnsa-inside {\n    background-color: #075C68 !important;\n\n    background-image:\n        \/* Darker centre so the text stays easy to read *\/\n        radial-gradient(\n            ellipse at 50% 40%,\n            rgba(7, 92, 104, 0.92) 0%,\n            rgba(7, 92, 104, 0.6) 40%,\n            rgba(7, 92, 104, 0) 78%\n        ),\n\n        \/* Fine honeycomb pattern *\/\n        url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='56' height='100' viewBox='0 0 56 100'%3E%3Cpath d='M28 66L0 50L0 16L28 0L56 16L56 50L28 66L28 100' fill='none' stroke='%23EADAB7' stroke-opacity='0.13' stroke-width='1'\/%3E%3Cpath d='M28 0L28 34L0 50L0 84L28 100L56 84L56 50L28 34' fill='none' stroke='%23EADAB7' stroke-opacity='0.13' stroke-width='1'\/%3E%3C\/svg%3E\"),\n\n        \/* Tiny gold dots *\/\n        radial-gradient(circle at 8% 22%, rgba(234, 218, 183, 0.55) 0 2px, transparent 3px),\n        radial-gradient(circle at 93% 16%, rgba(234, 218, 183, 0.45) 0 2px, transparent 3px),\n        radial-gradient(circle at 88% 58%, rgba(234, 218, 183, 0.35) 0 1.5px, transparent 2.5px),\n        radial-gradient(circle at 5% 74%, rgba(234, 218, 183, 0.40) 0 1.5px, transparent 2.5px),\n        radial-gradient(circle at 20% 92%, rgba(234, 218, 183, 0.45) 0 2px, transparent 3px),\n        radial-gradient(circle at 78% 90%, rgba(234, 218, 183, 0.35) 0 1.5px, transparent 2.5px),\n\n        \/* Soft glows in the corners *\/\n        radial-gradient(circle at 12% 18%, rgba(234, 218, 183, 0.12), transparent 32%),\n        radial-gradient(circle at 90% 85%, rgba(13, 124, 147, 0.40), transparent 40%) !important;\n\n    background-size:\n        auto,\n        56px 100px,\n        auto, auto, auto, auto, auto, auto,\n        auto,\n        auto !important;\n}\n\n\/* Extra fine rings around the existing outline circle *\/\n.wnsa-inside::before {\n    box-shadow:\n        0 0 0 38px rgba(234, 218, 183, 0.025),\n        0 0 0 39px rgba(234, 218, 183, 0.10),\n        0 0 0 82px rgba(234, 218, 183, 0.018),\n        0 0 0 83px rgba(234, 218, 183, 0.07);\n}\n\n\/* Fine ring around the soft circle in the corner *\/\n.wnsa-inside::after {\n    box-shadow:\n        0 0 0 30px rgba(234, 218, 183, 0.03),\n        0 0 0 31px rgba(234, 218, 183, 0.08);\n}\n\n\/* Small gold divider under the intro text *\/\n.wnsa-inside .wnsa-section-heading::after {\n    content: \"2726\";\n\n    display: block;\n\n    width: 190px;\n\n    margin: 34px auto 0;\n\n    color: #C8AF92;\n\n    font-size: 14px;\n\n    line-height: 1;\n\n    text-align: center;\n\n    background:\n        linear-gradient(rgba(234, 218, 183, 0.40), rgba(234, 218, 183, 0.40)) left center \/ 75px 1px no-repeat,\n        linear-gradient(rgba(234, 218, 183, 0.40), rgba(234, 218, 183, 0.40)) right center \/ 75px 1px no-repeat;\n}\n\n\/* Soft glow behind the centre product circle *\/\n.wnsa-quality-circle {\n    box-shadow:\n        0 0 0 22px rgba(234, 218, 183, 0.07),\n        0 0 0 23px rgba(234, 218, 183, 0.14),\n        0 0 80px rgba(234, 218, 183, 0.18);\n}\n\n\/* Slightly lighter pattern on phones *\/\n@media (max-width: 600px) {\n\n    .wnsa-inside .wnsa-section-heading::after {\n        margin-top: 26px;\n    }\n\n    .wnsa-quality-circle {\n        box-shadow:\n            0 0 0 14px rgba(234, 218, 183, 0.07),\n            0 0 0 15px rgba(234, 218, 183, 0.14),\n            0 0 50px rgba(234, 218, 183, 0.15);\n    }\n}\n\/* =========================================\n   HOW TO USE - CARD UPGRADE\n   ========================================= *\/\n\n\/* Keep the cards away from the screen edges *\/\n.wnsa-how {\n    padding: 100px 30px !important;\n}\n\n.wnsa-how-container {\n    box-sizing: border-box;\n    padding: 0 10px;\n}\n\n.wnsa-how-grid {\n    gap: 22px !important;\n}\n\n\/* Card *\/\n.wnsa-how-card {\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n\n    min-height: 330px !important;\n    padding: 42px 30px 36px !important;\n\n    background-color: #F8F4EA !important;\n    background-image:\n        url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='56' height='100' viewBox='0 0 56 100'%3E%3Cpath d='M28 66L0 50L0 16L28 0L56 16L56 50L28 66L28 100' fill='none' stroke='%23C8AF92' stroke-opacity='0.22' stroke-width='1'\/%3E%3Cpath d='M28 0L28 34L0 50L0 84L28 100L56 84L56 50L28\n\/* =========================================\n   FINAL CTA - PHOTO FILLS THE CIRCLE\n   ========================================= *\/\n\n.wnsa-final-product img {\n    width: 420px !important;\n    height: 420px !important;\n    max-width: 100% !important;\n\n    box-sizing: border-box !important;\n\n    object-fit: cover !important;\n    object-position: center center !important;\n\n    border-radius: 50% !important;\n    border: 10px solid #EADAB7 !important;\n\n    transform: none !important;\n    filter: none !important;\n\n    box-shadow:\n        0 30px 60px rgba(0, 0, 0, 0.30) !important;\n\n    transition: transform 0.5s ease !important;\n}\n\n.wnsa-final-product img:hover {\n    transform: translateY(-8px) !important;\n}\n\n\/* Hide the flat gold circle, the photo replaces it *\/\n.wnsa-final-circle {\n    opacity: 0 !important;\n}\n\n\/* Phones *\/\n@media (max-width: 600px) {\n\n    .wnsa-final-product img {\n        width: 300px !important;\n        height: 300px !important;\n        border-width: 8px !important;\n    }\n}\n\/* =========================================\n   FOOTER LOGO - REMOVE WHITE BACKGROUND\n   ========================================= *\/\n\n.wnsa-footer-logo {\n    background: transparent !important;\n    padding: 0 !important;\n    border-radius: 0 !important;\n    box-shadow: none !important;\n}\n\n.wnsa-footer-logo img {\n    background: transparent !important;\n    border-radius: 0 !important;\n    width: 140px;\n}\n\/* Add to cart button states *\/\na.wnsa-add-to-cart.wnsa-busy {\n    opacity: 0.8;\n    pointer-events: none;\n}\n\na.wnsa-add-to-cart.wnsa-added {\n    background: #C8AF92 !important;\n    color: #075C68 !important;\n    pointer-events: none;\n}\n<\/style>\n\n<script data-wp-block-html=\"js\">\n\/* =========================================================\n   WHY NOT SA - MAIN JAVASCRIPT\n   ========================================================= *\/\n\ndocument.addEventListener(\"DOMContentLoaded\", function () {\n\n\n    \/* =====================================================\n       1. SMOOTH SCROLLING\n       ===================================================== *\/\n\n    const smoothLinks = document.querySelectorAll(\n        'a[href^=\"#\"]'\n    );\n\n    smoothLinks.forEach(function (link) {\n\n        link.addEventListener(\"click\", function (event) {\n\n            const targetId = this.getAttribute(\"href\");\n\n            if (\n                !targetId ||\n                targetId === \"#\" ||\n                targetId === \"#cart\"\n            ) {\n                return;\n            }\n\n            const target = document.querySelector(targetId);\n\n            if (!target) {\n                return;\n            }\n\n            event.preventDefault();\n\n            const header = document.querySelector(\n                \".wnsa-header\"\n            );\n\n            const headerHeight = header\n                ? header.offsetHeight\n                : 0;\n\n            const targetPosition =\n                target.getBoundingClientRect().top +\n                window.pageYOffset -\n                headerHeight;\n\n            window.scrollTo({\n                top: targetPosition,\n                behavior: \"smooth\"\n            });\n\n        });\n\n    });\n\n\n    \/* =====================================================\n       2. HEADER SCROLL EFFECT\n       ===================================================== *\/\n\n    const header = document.querySelector(\n        \".wnsa-header\"\n    );\n\n    function updateHeader() {\n\n        if (!header) return;\n\n        if (window.scrollY > 50) {\n\n            header.classList.add(\n                \"wnsa-header-scrolled\"\n            );\n\n        } else {\n\n            header.classList.remove(\n                \"wnsa-header-scrolled\"\n            );\n\n        }\n\n    }\n\n    window.addEventListener(\n        \"scroll\",\n        updateHeader\n    );\n\n    updateHeader();\n\n\n    \/* =====================================================\n       3. FAQ ACCORDION\n       ===================================================== *\/\n\n    const faqItems = document.querySelectorAll(\n        \".wnsa-faq-item\"\n    );\n\n    faqItems.forEach(function (item) {\n\n        const question =\n            item.querySelector(\n                \".wnsa-faq-question\"\n            );\n\n        if (!question) return;\n\n        const icon =\n            question.querySelector(\"b\");\n\n        question.addEventListener(\n            \"click\",\n            function () {\n\n                const isOpen =\n                    item.classList.contains(\n                        \"active\"\n                    );\n\n\n                \/* Close all FAQs *\/\n\n                faqItems.forEach(\n                    function (otherItem) {\n\n                        otherItem.classList.remove(\n                            \"active\"\n                        );\n\n                        const otherQuestion =\n                            otherItem.querySelector(\n                                \".wnsa-faq-question\"\n                            );\n\n                        if (otherQuestion) {\n\n                            otherQuestion.setAttribute(\n                                \"aria-expanded\",\n                                \"false\"\n                            );\n\n                        }\n\n                        const otherIcon =\n                            otherItem.querySelector(\n                                \".wnsa-faq-question b\"\n                            );\n\n                        if (otherIcon) {\n                            otherIcon.textContent = \"+\";\n                        }\n\n                    }\n                );\n\n\n                \/* Open selected FAQ *\/\n\n                if (!isOpen) {\n\n                    item.classList.add(\n                        \"active\"\n                    );\n\n                    question.setAttribute(\n                        \"aria-expanded\",\n                        \"true\"\n                    );\n\n                    if (icon) {\n                        icon.textContent = \"\u2212\";\n                    }\n\n                }\n\n            }\n        );\n\n    });\n\n\n    \/* =====================================================\n       4. PRODUCT QUANTITY\n       ===================================================== *\/\n\n    const quantityValue =\n        document.querySelector(\n            \".wnsa-quantity-value\"\n        );\n\n    const quantityMinus =\n        document.querySelector(\n            \".wnsa-quantity-minus\"\n        );\n\n    const quantityPlus =\n        document.querySelector(\n            \".wnsa-quantity-plus\"\n        );\n\n\n    let quantity = 1;\n\n\n    function updateQuantity() {\n\n        if (quantityValue) {\n\n            quantityValue.textContent =\n                quantity;\n\n        }\n\n    }\n\n\n    if (quantityPlus) {\n\n        quantityPlus.addEventListener(\n            \"click\",\n            function () {\n\n                quantity++;\n\n                updateQuantity();\n\n            }\n        );\n\n    }\n\n\n    if (quantityMinus) {\n\n        quantityMinus.addEventListener(\n            \"click\",\n            function () {\n\n                if (quantity > 1) {\n\n                    quantity--;\n\n                    updateQuantity();\n\n                }\n\n            }\n        );\n\n    }\n\n\n    \/* =====================================================\n       5. SHOPPING CART COUNT\n       ===================================================== *\/\n\n    let cartCount = 0;\n\n    const cartCounter =\n        document.querySelector(\n            \".wnsa-cart-count\"\n        );\n\n    const addToCart =\n        document.querySelector(\n            \".wnsa-add-to-cart\"\n        );\n\n\n    function updateCart() {\n\n        if (cartCounter) {\n\n            cartCounter.textContent =\n                cartCount;\n\n        }\n\n    }\n\n\n    if (addToCart) {\n\n        addToCart.addEventListener(\n            \"click\",\n            function () {\n\n                cartCount += quantity;\n\n                updateCart();\n\n\n                \/* Button feedback *\/\n\n                const originalText =\n                    addToCart.innerHTML;\n\n                addToCart.innerHTML =\n                    \"Added \u2713\";\n\n\n                addToCart.classList.add(\n                    \"wnsa-cart-added\"\n                );\n\n\n                setTimeout(\n                    function () {\n\n                        addToCart.innerHTML =\n                            originalText;\n\n                        addToCart.classList.remove(\n                            \"wnsa-cart-added\"\n                        );\n\n                    },\n                    1800\n                );\n\n            }\n        );\n\n    }\n\n\n    \/* =====================================================\n       6. NEWSLETTER\n       ===================================================== *\/\n\n    const newsletterForm =\n        document.querySelector(\n            \".wnsa-newsletter-form\"\n        );\n\n\n    if (newsletterForm) {\n\n        newsletterForm.addEventListener(\n            \"submit\",\n            function (event) {\n\n                event.preventDefault();\n\n                const emailInput =\n                    newsletterForm.querySelector(\n                        'input[type=\"email\"]'\n                    );\n\n                const button =\n                    newsletterForm.querySelector(\n                        \"button\"\n                    );\n\n\n                if (\n                    !emailInput ||\n                    !emailInput.value.trim()\n                ) {\n                    return;\n                }\n\n\n                const originalButton =\n                    button.innerHTML;\n\n\n                button.innerHTML =\n                    \"Thank You \u2713\";\n\n\n                emailInput.value = \"\";\n\n\n                setTimeout(\n                    function () {\n\n                        button.innerHTML =\n                            originalButton;\n\n                    },\n                    3000\n                );\n\n            }\n        );\n\n    }\n\n\n    \/* =====================================================\n       7. MOBILE MENU\n       ===================================================== *\/\n\n    const navbar =\n        document.querySelector(\n            \".wnsa-navbar\"\n        );\n\n\n    if (navbar) {\n\n        const nav =\n            navbar.querySelector(\n                \".wnsa-nav\"\n            );\n\n\n        if (nav) {\n\n            \/* Create mobile menu button *\/\n\n            const mobileButton =\n                document.createElement(\n                    \"button\"\n                );\n\n\n            mobileButton.className =\n                \"wnsa-mobile-menu\";\n\n\n            mobileButton.setAttribute(\n                \"aria-label\",\n                \"Open navigation\"\n            );\n\n\n            mobileButton.setAttribute(\n                \"aria-expanded\",\n                \"false\"\n            );\n\n\n            mobileButton.innerHTML =\n                \"<span><\/span><span><\/span><span><\/span>\";\n\n\n            navbar.insertBefore(\n                mobileButton,\n                navbar.querySelector(\n                    \".wnsa-header-actions\"\n                )\n            );\n\n\n            \/* Toggle menu *\/\n\n            mobileButton.addEventListener(\n                \"click\",\n                function () {\n\n                    const isOpen =\n                        nav.classList.contains(\n                            \"wnsa-mobile-open\"\n                        );\n\n\n                    if (isOpen) {\n\n                        nav.classList.remove(\n                            \"wnsa-mobile-open\"\n                        );\n\n                        mobileButton.classList.remove(\n                            \"active\"\n                        );\n\n                        mobileButton.setAttribute(\n                            \"aria-expanded\",\n                            \"false\"\n                        );\n\n                    } else {\n\n                        nav.classList.add(\n                            \"wnsa-mobile-open\"\n                        );\n\n                        mobileButton.classList.add(\n                            \"active\"\n                        );\n\n                        mobileButton.setAttribute(\n                            \"aria-expanded\",\n                            \"true\"\n                        );\n\n                    }\n\n                }\n            );\n\n\n            \/* Close menu after clicking link *\/\n\n            nav.querySelectorAll(\"a\").forEach(\n                function (link) {\n\n                    link.addEventListener(\n                        \"click\",\n                        function () {\n\n                            nav.classList.remove(\n                                \"wnsa-mobile-open\"\n                            );\n\n                            mobileButton.classList.remove(\n                                \"active\"\n                            );\n\n                            mobileButton.setAttribute(\n                                \"aria-expanded\",\n                                \"false\"\n                            );\n\n                        }\n                    );\n\n                }\n            );\n\n        }\n\n    }\n\n\n    \/* =====================================================\n       8. ACTIVE NAVIGATION LINK\n       ===================================================== *\/\n\n    const sections =\n        document.querySelectorAll(\n            \"section[id]\"\n        );\n\n    const navigationLinks =\n        document.querySelectorAll(\n            \".wnsa-nav a\"\n        );\n\n\n    function updateActiveNavigation() {\n\n        let currentSection = \"\";\n\n        sections.forEach(\n            function (section) {\n\n                const sectionTop =\n                    section.offsetTop - 180;\n\n                if (\n                    window.scrollY >=\n                    sectionTop\n                ) {\n\n                    currentSection =\n                        section.getAttribute(\n                            \"id\"\n                        );\n\n                }\n\n            }\n        );\n\n\n        navigationLinks.forEach(\n            function (link) {\n\n                link.classList.remove(\n                    \"active\"\n                );\n\n\n                const href =\n                    link.getAttribute(\n                        \"href\"\n                    );\n\n\n                if (\n                    href ===\n                    \"#\" + currentSection\n                ) {\n\n                    link.classList.add(\n                        \"active\"\n                    );\n\n                }\n\n            }\n        );\n\n    }\n\n\n    window.addEventListener(\n        \"scroll\",\n        updateActiveNavigation\n    );\n\n\n    \/* =====================================================\n       9. SCROLL REVEAL ANIMATION\n       ===================================================== *\/\n\n    const animatedElements =\n        document.querySelectorAll(\n            \".wnsa-benefit-card, \" +\n            \".wnsa-quality-item, \" +\n            \".wnsa-how-card, \" +\n            \".wnsa-testimonial-card, \" +\n            \".wnsa-faq-item\"\n        );\n\n\n    if (\n        \"IntersectionObserver\"\n        in window\n    ) {\n\n        const observer =\n            new IntersectionObserver(\n                function (\n                    entries,\n                    observer\n                ) {\n\n                    entries.forEach(\n                        function (entry) {\n\n                            if (\n                                entry.isIntersecting\n                            ) {\n\n                                entry.target.classList.add(\n                                    \"wnsa-visible\"\n                                );\n\n                                observer.unobserve(\n                                    entry.target\n                                );\n\n                            }\n\n                        }\n                    );\n\n                },\n                {\n                    threshold: 0.12\n                }\n            );\n\n\n        animatedElements.forEach(\n            function (element) {\n\n                element.classList.add(\n                    \"wnsa-reveal\"\n                );\n\n                observer.observe(\n                    element\n                );\n\n            }\n        );\n\n    }\n\n\n    \/* =====================================================\n       10. PREVENT EMPTY LINKS\n       ===================================================== *\/\n\n    document.querySelectorAll(\n        'a[href=\"#\"]'\n    ).forEach(\n        function (link) {\n\n            link.addEventListener(\n                \"click\",\n                function (event) {\n\n                    event.preventDefault();\n\n                }\n            );\n\n        }\n    );\n\n\n    \/* =====================================================\n       11. INITIALISE\n       ===================================================== *\/\n\n    updateQuantity();\n    updateCart();\n    updateActiveNavigation();\n\n});\n<\/script>\n\n<!-- =========================================\n     WHY NOT SA - TOP BAR & HEADER\n     ========================================= -->\n\n<header class=\"wnsa-header\">\n\n    <!-- TOP ANNOUNCEMENT BAR -->\n    <div class=\"wnsa-top-bar\">\n\n        <div class=\"wnsa-top-bar-inner\">\n\n            <span>\n                \u2726 Premium Quality Collagen Powder\n            <\/span>\n\n            <span class=\"wnsa-top-divider\">\n                \u2022\n            <\/span>\n\n            <span>\n                Glow from the Inside Out\n            <\/span>\n\n        <\/div>\n\n        <div class=\"wnsa-social-links\">\n\n            <a href=\"#\" aria-label=\"Facebook\">\n                f\n            <\/a>\n\n            <a href=\"#\" aria-label=\"Instagram\">\n                \u25ce\n            <\/a>\n\n        <\/div>\n\n    <\/div>\n\n\n    <!-- MAIN NAVIGATION -->\n    <div class=\"wnsa-navbar\">\n\n        <!-- LOGO -->\n        <a href=\"\/\" class=\"wnsa-logo\">\n\n            <img src=\"https:\/\/whynotsa.co.za\/wp-content\/uploads\/2023\/11\/PNG-%EF%BF%BD-WHY-NOT-SAL-RE-DESIGNED-scaled.png\" alt=\"Why Not SA Collagen\">\n\n        <\/a>\n\n\n        <!-- NAVIGATION -->\n        <nav class=\"wnsa-nav\" aria-label=\"Main Navigation\">\n\n            <a href=\"#home\" class=\"active\">\n                Home\n            <\/a>\n\n            <a href=\"#about\">\n                About\n            <\/a>\n\n            <a href=\"#product\">\n                Product\n            <\/a>\n\n            <a href=\"#benefits\">\n                Benefits\n            <\/a>\n\n            <a href=\"#how-to\">\n                How To Use\n            <\/a>\n\n            <a href=\"#reviews\">\n                Reviews\n            <\/a>\n\n            <a href=\"#faq\">\n                FAQ\n            <\/a>\n\n            <a href=\"#contact\">\n                Contact\n            <\/a>\n\n        <\/nav>\n\n\n        <!-- HEADER ACTIONS -->\n        <div class=\"wnsa-header-actions\">\n\n            <a href=\"#cart\" class=\"wnsa-cart\" aria-label=\"Shopping Cart\">\n\n                <span class=\"wnsa-cart-icon\">\n                    \ud83d\uded2\n                <\/span>\n\n                <span class=\"wnsa-cart-count\">\n                    0\n                <\/span>\n\n            <\/a>\n\n\n            <a href=\"#product\" class=\"wnsa-shop-button\">\n                Shop Now\n                <span>\u2192<\/span>\n            <\/a>\n\n        <\/div>\n\n    <\/div>\n\n<\/header>\n\n\n\n<!-- =========================================\n     WHY NOT SA - FULL WIDTH HERO\n     ========================================= -->\n\n<section class=\"wnsa-hero\" id=\"home\">\n\n\n    <!-- =====================================\n         FULL WIDTH HERO IMAGE\n         ===================================== -->\n\n    <div class=\"wnsa-hero-background\">\n\n        <img src=\"https:\/\/whynotsa.co.za\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-15-2026-01_55_05-PM.png\" alt=\"Why Not SA Collagen\">\n\n    <\/div>\n\n\n    <!-- =====================================\n         VERY LIGHT IMAGE OVERLAY\n         ===================================== -->\n\n    <div class=\"wnsa-hero-overlay\"><\/div>\n\n\n    <!-- =====================================\n         HERO CONTENT\n         ===================================== -->\n\n    <div class=\"wnsa-hero-container\">\n\n        <div class=\"wnsa-hero-content\">\n\n\n            <span class=\"wnsa-hero-eyebrow\">\n                PURE \u2022 PREMIUM \u2022 UNFLAVOURED\n            <\/span>\n\n\n            <h1>\n                Glow From\n                <span>\n                    The Inside Out.\n                <\/span>\n            <\/h1>\n\n\n            <p class=\"wnsa-hero-tagline\">\n                Beauty support from the inside out.\n            <\/p>\n\n\n            <p class=\"wnsa-hero-description\">\n                Pure bovine collagen peptides designed to support\n                healthy skin, hair, nails and joints \u2014 with no\n                flavour, making it easy to add to your daily routine.\n            <\/p>\n\n\n            <!-- BENEFITS -->\n\n            <div class=\"wnsa-hero-benefits\">\n\n                <div class=\"wnsa-hero-benefit\">\n\n                    <span>\n                        \u2726\n                    <\/span>\n\n                    <p>\n                        Healthy Skin\n                    <\/p>\n\n                <\/div>\n\n\n                <div class=\"wnsa-hero-benefit\">\n\n                    <span>\n                        \u2726\n                    <\/span>\n\n                    <p>\n                        Hair &amp; Nails\n                    <\/p>\n\n                <\/div>\n\n\n                <div class=\"wnsa-hero-benefit\">\n\n                    <span>\n                        \u2726\n                    <\/span>\n\n                    <p>\n                        Joint Support\n                    <\/p>\n\n                <\/div>\n\n            <\/div>\n\n\n            <!-- BUTTONS -->\n\n            <div class=\"wnsa-hero-buttons\">\n\n                <a href=\"#product\" class=\"wnsa-primary-button\">\n                    Shop Now\n                    <span>\u2192<\/span>\n                <\/a>\n\n\n                <a href=\"#about\" class=\"wnsa-secondary-button\">\n                    Learn More\n                <\/a>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n<!-- =========================================\n     WHY NOT SA - BENEFITS SECTION\n     ========================================= -->\n\n<section class=\"wnsa-benefits\" id=\"benefits\">\n\n    <div class=\"wnsa-benefits-container\">\n\n        <!-- SECTION INTRO -->\n        <div class=\"wnsa-section-heading\">\n\n            <span class=\"wnsa-section-eyebrow\">\n                WHY COLLAGEN?\n            <\/span>\n\n            <h2>\n                Beauty &amp; Wellness\n                <span>From Within<\/span>\n            <\/h2>\n\n            <p>\n                Our pure bovine collagen peptides are an easy way\n                to add collagen to your everyday routine, supporting\n                the things that matter from the inside out.\n            <\/p>\n\n        <\/div>\n\n\n        <!-- BENEFITS GRID -->\n        <div class=\"wnsa-benefits-grid\">\n\n\n            <!-- BENEFIT 1 -->\n            <article class=\"wnsa-benefit-card\">\n\n                <div class=\"wnsa-benefit-number\">\n                    01\n                <\/div>\n\n                <div class=\"wnsa-benefit-icon\">\n                    \u2661\n                <\/div>\n\n                <h3>\n                    Healthy Skin\n                <\/h3>\n\n                <p>\n                    Supports healthy-looking skin and helps you\n                    maintain a natural, radiant appearance.\n                <\/p>\n\n                <a href=\"#product\">\n                    Discover More \u2192\n                <\/a>\n\n            <\/article>\n\n\n            <!-- BENEFIT 2 -->\n            <article class=\"wnsa-benefit-card wnsa-benefit-featured\">\n\n                <div class=\"wnsa-benefit-number\">\n                    02\n                <\/div>\n\n                <div class=\"wnsa-benefit-icon\">\n                    \u2726\n                <\/div>\n\n                <h3>\n                    Hair &amp; Nails\n                <\/h3>\n\n                <p>\n                    Collagen is a simple addition to your daily\n                    routine to support healthy hair and nails.\n                <\/p>\n\n                <a href=\"#product\">\n                    Discover More \u2192\n                <\/a>\n\n            <\/article>\n\n\n            <!-- BENEFIT 3 -->\n            <article class=\"wnsa-benefit-card\">\n\n                <div class=\"wnsa-benefit-number\">\n                    03\n                <\/div>\n\n                <div class=\"wnsa-benefit-icon\">\n                    \u25c7\n                <\/div>\n\n                <h3>\n                    Joint Support\n                <\/h3>\n\n                <p>\n                    Add collagen to your daily routine to support\n                    healthy joints and everyday movement.\n                <\/p>\n\n                <a href=\"#product\">\n                    Discover More \u2192\n                <\/a>\n\n            <\/article>\n\n\n            <!-- BENEFIT 4 -->\n            <article class=\"wnsa-benefit-card\">\n\n                <div class=\"wnsa-benefit-number\">\n                    04\n                <\/div>\n\n                <div class=\"wnsa-benefit-icon\">\n                    \u263c\n                <\/div>\n\n                <h3>\n                    Everyday Wellness\n                <\/h3>\n\n                <p>\n                    An easy, unflavoured collagen powder that fits\n                    effortlessly into your daily lifestyle.\n                <\/p>\n\n                <a href=\"#product\">\n                    Discover More \u2192\n                <\/a>\n\n            <\/article>\n\n        <\/div>\n\n\n        <!-- BOTTOM STATEMENT -->\n        <div class=\"wnsa-benefits-bottom\">\n\n            <div class=\"wnsa-benefits-line\"><\/div>\n\n            <p>\n                PURE COLLAGEN \u2022 SIMPLE ROUTINE \u2022 EVERYDAY WELLNESS\n            <\/p>\n\n            <div class=\"wnsa-benefits-line\"><\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n<!-- =========================================\n     WHY NOT SA - PRODUCT SECTION\n     ========================================= -->\n\n<section class=\"wnsa-product-section\" id=\"product\">\n\n    <div class=\"wnsa-product-container\">\n\n        <!-- PRODUCT IMAGE -->\n        <div class=\"wnsa-product-showcase\">\n\n            <div class=\"wnsa-product-bg-circle\"><\/div>\n\n            <div class=\"wnsa-product-badge\">\n                <span>PURE<\/span>\n                <strong>COLLAGEN<\/strong>\n            <\/div>\n\n            <div class=\"wnsa-main-product-image\">\n\n                <img src=\"https:\/\/whynotsa.co.za\/wp-content\/uploads\/2026\/08\/Collagen-smoothie-Resize.png\" alt=\"Why Not SA Pure Bovine Collagen Powder 300g\">\n\n            <\/div>\n\n        <\/div>\n\n\n        <!-- PRODUCT INFORMATION -->\n        <div class=\"wnsa-product-info\">\n\n            <span class=\"wnsa-product-eyebrow\">\n                WHY NOT SA \u2022 300G\n            <\/span>\n\n            <h2>\n                Pure Bovine\n                <span>Collagen Peptides<\/span>\n            <\/h2>\n\n            <div class=\"wnsa-product-stars\">\n                \u2605\u2605\u2605\u2605\u2605\n                <span>Premium Quality<\/span>\n            <\/div>\n\n            <p class=\"wnsa-product-intro\">\n                A simple, pure and unflavoured collagen powder\n                designed to fit effortlessly into your everyday\n                wellness routine.\n            <\/p>\n\n\n            <!-- PRODUCT FEATURES -->\n\n            <div class=\"wnsa-product-features\">\n\n                <div class=\"wnsa-product-feature\">\n                    <span>\u2713<\/span>\n                    <p>Pure bovine collagen peptides<\/p>\n                <\/div>\n\n                <div class=\"wnsa-product-feature\">\n                    <span>\u2713<\/span>\n                    <p>Unflavoured and easy to mix<\/p>\n                <\/div>\n\n                <div class=\"wnsa-product-feature\">\n                    <span>\u2713<\/span>\n                    <p>Grass-fed &amp; pasture raised<\/p>\n                <\/div>\n\n                <div class=\"wnsa-product-feature\">\n                    <span>\u2713<\/span>\n                    <p>Halal<\/p>\n                <\/div>\n\n            <\/div>\n\n\n            <!-- PRODUCT PRICE -->\n\n            <div class=\"wnsa-product-price-area\">\n\n                <span class=\"wnsa-price-label\">\n                    300G TIN\n                <\/span>\n\n                <span class=\"wnsa-product-price\">\n                    R300\n                <\/span>\n\n            <\/div>\n\n\n            <!-- QUANTITY -->\n\n            <div class=\"wnsa-product-buy\">\n\n    <div class=\"wnsa-quantity\">\n        <button type=\"button\" class=\"wnsa-quantity-minus\" aria-label=\"Decrease quantity\">\u2212<\/button>\n        <span class=\"wnsa-quantity-value\">1<\/span>\n        <button type=\"button\" class=\"wnsa-quantity-plus\" aria-label=\"Increase quantity\">+<\/button>\n    <\/div>\n\n    <a href=\"\/cart\/?add-to-cart=123&amp;quantity=1\" class=\"wnsa-add-to-cart\" data-product-id=\"123\">\n        <span class=\"wnsa-add-label\">Add To Cart<\/span>\n        <span class=\"wnsa-add-arrow\">\u2192<\/span>\n    <\/a>\n\n<\/div>\n\n<script>\n(function () {\n    var btn = document.querySelector('.wnsa-add-to-cart');\n    var valueEl = document.querySelector('.wnsa-quantity-value');\n    var minus = document.querySelector('.wnsa-quantity-minus');\n    var plus = document.querySelector('.wnsa-quantity-plus');\n    if (!btn || !valueEl) return;\n\n    var id = btn.getAttribute('data-product-id');\n    var label = btn.querySelector('.wnsa-add-label');\n    var arrow = btn.querySelector('.wnsa-add-arrow');\n    var qty = 1;\n    var busy = false;\n\n    function update() {\n        valueEl.textContent = qty;\n        btn.href = '\/cart\/?add-to-cart=' + id + '&quantity=' + qty;\n    }\n\n    minus.addEventListener('click', function () {\n        if (qty > 1) { qty--; update(); }\n    });\n\n    plus.addEventListener('click', function () {\n        if (qty < 20) { qty++; update(); }\n    });\n\n    btn.addEventListener('click', function (e) {\n        e.preventDefault();\n        if (busy) return;\n        busy = true;\n        btn.classList.add('wnsa-busy');\n        label.textContent = 'Adding...';\n        arrow.textContent = '';\n\n        var data = new URLSearchParams();\n        data.append('product_id', id);\n        data.append('quantity', qty);\n\n        fetch('\/?wc-ajax=add_to_cart', {\n            method: 'POST',\n            credentials: 'same-origin',\n            headers: { 'Content-Type': 'application\/x-www-form-urlencoded' },\n            body: data\n        })\n        .then(function (r) { return r.json(); })\n        .then(function (res) {\n            if (!res || res.error) { throw new Error('add failed'); }\n            label.textContent = 'Added to Cart';\n            arrow.textContent = '\u2713';\n            btn.classList.remove('wnsa-busy');\n            btn.classList.add('wnsa-added');\n            setTimeout(function () {\n                window.location.href = '\/cart\/';\n            }, 1200);\n        })\n        .catch(function () {\n            \/* Fallback: add through the link and land on the cart page *\/\n            window.location.href = btn.href;\n        });\n    });\n})();\n<\/script>\n\n\n            <!-- PRODUCT NOTES -->\n\n            <div class=\"wnsa-product-notes\">\n\n                <span>\u2726<\/span>\n\n                <p>\n                    Easy to add to coffee, smoothies,\n                    water or your favourite drink.\n                <\/p>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n<!-- =========================================\n     WHY NOT SA - ABOUT \/ BRAND SECTION\n     ========================================= -->\n\n<section class=\"wnsa-about\" id=\"about\">\n\n    <div class=\"wnsa-about-container\">\n\n        <!-- LEFT IMAGE -->\n        <div class=\"wnsa-about-visual\">\n\n            <div class=\"wnsa-about-image\">\n                <img src=\"https:\/\/whynotsa.co.za\/wp-content\/uploads\/2026\/08\/Collagen-Model.3.png\" alt=\"Why Not SA Collagen\">\n            <\/div>\n\n            <div class=\"wnsa-about-badge\">\n                <strong>Glow From Within<\/strong>\n            <\/div>\n\n        <\/div>\n\n\n        <!-- RIGHT CONTENT -->\n        <div class=\"wnsa-about-content\">\n\n            <span class=\"wnsa-section-eyebrow\">\n                ABOUT WHY NOT SA\n            <\/span>\n\n            <h2>\n                Simple.\n                <span>Pure. Effective.<\/span>\n            <\/h2>\n\n            <p class=\"wnsa-about-lead\">\n                We believe looking after yourself shouldn't have\n                to be complicated.\n            <\/p>\n\n            <p>\n                Why Not SA Collagen was created with a simple\n                purpose \u2014 to make adding quality collagen to your\n                everyday routine easy.\n            <\/p>\n\n            <p>\n                Our pure bovine collagen peptides are unflavoured,\n                versatile and easy to incorporate into your favourite\n                drinks, smoothies or meals.\n            <\/p>\n\n\n            <!-- BRAND VALUES -->\n            <div class=\"wnsa-about-values\">\n\n                <div class=\"wnsa-about-value\">\n                    <span>01<\/span>\n                    <div>\n                        <h3>Quality First<\/h3>\n                        <p>\n                            Carefully selected collagen peptides\n                            for your daily routine.\n                        <\/p>\n                    <\/div>\n                <\/div>\n\n                <div class=\"wnsa-about-value\">\n                    <span>02<\/span>\n                    <div>\n                        <h3>Keep It Simple<\/h3>\n                        <p>\n                            No unnecessary flavour \u2014 just pure,\n                            versatile collagen powder.\n                        <\/p>\n                    <\/div>\n                <\/div>\n\n                <div class=\"wnsa-about-value\">\n                    <span>03<\/span>\n                    <div>\n                        <h3>Made For Everyday<\/h3>\n                        <p>\n                            An easy addition to the lifestyle\n                            you already have.\n                        <\/p>\n                    <\/div>\n                <\/div>\n\n            <\/div>\n\n\n            <a href=\"#product\" class=\"wnsa-about-button\">\n                Discover Our Collagen\n                <span>\u2192<\/span>\n            <\/a>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n<!-- =========================================\n     WHY NOT SA - WHAT'S INSIDE SECTION\n     ========================================= -->\n\n<section class=\"wnsa-inside\" id=\"quality\">\n\n    <div class=\"wnsa-inside-container\">\n\n        <!-- SECTION HEADING -->\n        <div class=\"wnsa-section-heading\">\n\n            <span class=\"wnsa-section-eyebrow\">\n                PURE BY DESIGN\n            <\/span>\n\n            <h2>\n                Nothing Extra.\n                <span>Just Pure Collagen.<\/span>\n            <\/h2>\n\n            <p>\n                We keep our collagen simple. Pure bovine collagen\n                peptides with no unnecessary additions, so you can\n                easily make it part of your everyday routine.\n            <\/p>\n\n        <\/div>\n\n\n        <!-- QUALITY CONTENT -->\n        <div class=\"wnsa-quality-grid\">\n\n            <!-- LEFT COLUMN -->\n            <div class=\"wnsa-quality-list\">\n\n                <div class=\"wnsa-quality-item\">\n\n                    <div class=\"wnsa-quality-icon\">\n                        \u2713\n                    <\/div>\n\n                    <div>\n                        <h3>Pure Bovine Collagen<\/h3>\n                        <p>\n                            Made from high-quality bovine collagen\n                            peptides.\n                        <\/p>\n                    <\/div>\n\n                <\/div>\n\n\n                <div class=\"wnsa-quality-item\">\n\n                    <div class=\"wnsa-quality-icon\">\n                        \u2713\n                    <\/div>\n\n                    <div>\n                        <h3>Unflavoured<\/h3>\n                        <p>\n                            A neutral taste that makes it easy to\n                            add to your favourite drinks and meals.\n                        <\/p>\n                    <\/div>\n\n                <\/div>\n\n\n                <div class=\"wnsa-quality-item\">\n\n                    <div class=\"wnsa-quality-icon\">\n                        \u2713\n                    <\/div>\n\n                    <div>\n                        <h3>Grass-Fed &amp; Pasture Raised<\/h3>\n                        <p>\n                            Carefully sourced collagen for a product\n                            you can feel good about adding to your routine.\n                        <\/p>\n                    <\/div>\n\n                <\/div>\n\n            <\/div>\n\n\n            <!-- CENTRE PRODUCT -->\n            <div class=\"wnsa-quality-product\">\n\n                <div class=\"wnsa-quality-circle\"><\/div>\n\n                <img src=\"https:\/\/whynotsa.co.za\/wp-content\/uploads\/2026\/08\/Collagen-Tins-x3.png\" alt=\"Why Not SA Pure Collagen Powder\">\n\n                <div class=\"wnsa-quality-stamp\">\n                    <span>PURE<\/span>\n                    <strong>300g<\/strong>\n                <\/div>\n\n            <\/div>\n\n\n            <!-- RIGHT COLUMN -->\n            <div class=\"wnsa-quality-list\">\n\n                <div class=\"wnsa-quality-item\">\n\n                    <div class=\"wnsa-quality-icon\">\n                        \u2713\n                    <\/div>\n\n                    <div>\n                        <h3>Halal<\/h3>\n                        <p>\n                            Suitable for customers looking for\n                            Halal collagen.\n                        <\/p>\n                    <\/div>\n\n                <\/div>\n\n\n                <div class=\"wnsa-quality-item\">\n\n                    <div class=\"wnsa-quality-icon\">\n                        \u2713\n                    <\/div>\n\n                    <div>\n                        <h3>No Added Flavour<\/h3>\n                        <p>\n                            Nothing overpowering, so you can mix it\n                            into your favourite recipes.\n                        <\/p>\n                    <\/div>\n\n                <\/div>\n\n\n                <div class=\"wnsa-quality-item\">\n\n                    <div class=\"wnsa-quality-icon\">\n                        \u2713\n                    <\/div>\n\n                    <div>\n                        <h3>Easy Everyday Routine<\/h3>\n                        <p>\n                            Mix it into water, coffee, smoothies\n                            or your favourite drink.\n                        <\/p>\n                    <\/div>\n\n                <\/div>\n\n            <\/div>\n\n        <\/div>\n\n\n        <!-- FREE FROM -->\n        <div class=\"wnsa-free-from\">\n\n            <span>FREE FROM<\/span>\n\n            <div class=\"wnsa-free-items\">\n                <p>Cholesterol<\/p>\n                <p>Carbohydrates<\/p>\n                <p>Dietary Fibre<\/p>\n                <p>GMO<\/p>\n                <p>Fat<\/p>\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n<!-- =========================================\n     WHY NOT SA - HOW TO USE SECTION\n     ========================================= -->\n\n<!-- =========================================\n     WHY NOT SA - HOW TO USE\n     ========================================= -->\n\n<section class=\"wnsa-how\" id=\"how-to\">\n\n    <div class=\"wnsa-how-container\">\n\n        <!-- SECTION INTRO -->\n\n        <div class=\"wnsa-how-intro\">\n\n            <span class=\"wnsa-how-eyebrow\">\n                MAKE IT PART OF YOUR ROUTINE\n            <\/span>\n\n            <h2>\n                Easy To Add.\n                <span>Easy To Enjoy.<\/span>\n            <\/h2>\n\n            <p>\n                Our unflavoured collagen powder blends easily into\n                your favourite drinks, smoothies and meals.\n            <\/p>\n\n        <\/div>\n\n\n        <!-- CARDS -->\n\n        <div class=\"wnsa-how-grid\">\n\n\n            <!-- CARD 01 -->\n\n            <article class=\"wnsa-how-card\">\n\n                <span class=\"wnsa-how-number\">\n                    01\n                <\/span>\n\n                <div class=\"wnsa-how-icon\">\n\n                    <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\n                        <path d=\"M9 20h25v9c0 6-5 10-10 10h-5c-6 0-10-4-10-10v-9Z\"><\/path>\n                        <path d=\"M34 23h4c4 0 6 3 6 6s-2 6-6 6h-4\"><\/path>\n                        <path d=\"M14 15c0-2 2-3 2-5\"><\/path>\n                        <path d=\"M21 15c0-2 2-3 2-5\"><\/path>\n                        <path d=\"M28 15c0-2 2-3 2-5\"><\/path>\n                        <path d=\"M7 42h30\"><\/path>\n                    <\/svg>\n\n                <\/div>\n\n                <h3>\n                    Coffee\n                <\/h3>\n\n                <p>\n                    Stir into your morning coffee for an\n                    effortless addition to your daily routine.\n                <\/p>\n\n            <\/article>\n\n\n            <!-- CARD 02 -->\n\n            <article class=\"wnsa-how-card\">\n\n                <span class=\"wnsa-how-number\">\n                    02\n                <\/span>\n\n                <div class=\"wnsa-how-icon\">\n\n                    <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\n                        <path d=\"M15 15h19l-2 27H17l-2-27Z\"><\/path>\n                        <path d=\"M15 21h19\"><\/path>\n                        <path d=\"M25 15V7\"><\/path>\n                        <path d=\"M25 7h8\"><\/path>\n                        <path d=\"M20 27h9\"><\/path>\n                    <\/svg>\n\n                <\/div>\n\n                <h3>\n                    Smoothies\n                <\/h3>\n\n                <p>\n                    Add it to your favourite smoothie for a\n                    simple collagen boost.\n                <\/p>\n\n            <\/article>\n\n\n            <!-- CARD 03 -->\n\n            <article class=\"wnsa-how-card\">\n\n                <span class=\"wnsa-how-number\">\n                    03\n                <\/span>\n\n                <div class=\"wnsa-how-icon\">\n\n                    <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\n                        <path d=\"M24 6C20 13 12 21 12 30a12 12 0 0 0 24 0c0-9-8-17-12-24Z\"><\/path>\n                        <path d=\"M18 31c1 3 3 5 6 5\"><\/path>\n                    <\/svg>\n\n                <\/div>\n\n                <h3>\n                    Water\n                <\/h3>\n\n                <p>\n                    Mix with water or your favourite drink\n                    whenever it suits your routine.\n                <\/p>\n\n            <\/article>\n\n\n            <!-- CARD 04 -->\n\n            <article class=\"wnsa-how-card\">\n\n                <span class=\"wnsa-how-number\">\n                    04\n                <\/span>\n\n                <div class=\"wnsa-how-icon\">\n\n                    <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\n                        <path d=\"M13 10l25 25\"><\/path>\n                        <path d=\"M16 7l5 5\"><\/path>\n                        <path d=\"M12 11l5 5\"><\/path>\n                        <path d=\"M9 14l5 5\"><\/path>\n                        <path d=\"M34 13c-4 0-8 4-8 8 0 3 2 5 5 5 4 0 8-4 8-8 0-3-2-5-5-5Z\"><\/path>\n                        <path d=\"M28 27L17 38\"><\/path>\n                        <path d=\"M14 35l-3 3\"><\/path>\n                    <\/svg>\n\n                <\/div>\n\n                <h3>\n                    Your Favourite Recipes\n                <\/h3>\n\n                <p>\n                    Because it is unflavoured, it can be\n                    incorporated into a variety of everyday\n                    recipes.\n                <\/p>\n\n            <\/article>\n\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n<!-- =========================================\n     WHY NOT SA - TESTIMONIALS SECTION\n     ========================================= -->\n\n<section class=\"wnsa-testimonials\" id=\"reviews\">\n\n    <div class=\"wnsa-testimonials-container\">\n\n        <!-- HEADING -->\n        <div class=\"wnsa-section-heading\">\n\n            <span class=\"wnsa-section-eyebrow\">\n                CUSTOMER LOVE\n            <\/span>\n\n            <h2>\n                Loved By Our\n                <span>Community<\/span>\n            <\/h2>\n\n            <p>\n                Real routines, real experiences and a little more\n                glow from the inside out.\n            <\/p>\n\n        <\/div>\n\n\n        <!-- TESTIMONIAL GRID -->\n        <div class=\"wnsa-testimonials-grid\">\n\n\n            <!-- REVIEW 1 - DONNA -->\n            <article class=\"wnsa-testimonial-card\">\n\n                <div class=\"wnsa-testimonial-stars\">\n                    \u2605\u2605\u2605\u2605\u2605\n                <\/div>\n\n                <p class=\"wnsa-testimonial-text\">\n                    \u201cThe collagen is flavourless, so I can slip it into\n                    my husband\u2019s coffee every morning! Love it!\n                    Her service is great and fast. I will definitely\n                    recommend it to anyone.\u201d\n                <\/p>\n\n                <div class=\"wnsa-testimonial-author\">\n\n                    <div class=\"wnsa-author-avatar\">\n                        D\n                    <\/div>\n\n                    <div>\n                        <strong>Donna<\/strong>\n                        <span>Verified Customer<\/span>\n                    <\/div>\n\n                <\/div>\n\n            <\/article>\n\n\n            <!-- REVIEW 2 - MINETTE -->\n            <article class=\"wnsa-testimonial-card wnsa-testimonial-featured\">\n\n                <div class=\"wnsa-testimonial-quote\">\n                    \u201c\n                <\/div>\n\n                <div class=\"wnsa-testimonial-stars\">\n                    \u2605\u2605\u2605\u2605\u2605\n                <\/div>\n\n                <p class=\"wnsa-testimonial-text\">\n                    \u201cAn incredibly good product! My overall health improved\n                    within a few weeks. I am very happy with the product.\u201d\n                <\/p>\n\n                <div class=\"wnsa-testimonial-author\">\n\n                    <div class=\"wnsa-author-avatar\">\n                        M\n                    <\/div>\n\n                    <div>\n                        <strong>Minette<\/strong>\n                        <span>Verified Customer<\/span>\n                    <\/div>\n\n                <\/div>\n\n            <\/article>\n\n\n            <!-- REVIEW 3 - CELEST -->\n            <article class=\"wnsa-testimonial-card\">\n\n                <div class=\"wnsa-testimonial-stars\">\n                    \u2605\u2605\u2605\u2605\u2605\n                <\/div>\n\n                <p class=\"wnsa-testimonial-text\">\n                    \u201cThis collagen is amazing! My nails are harder,\n                    I have lots of new baby hair and I can feel an\n                    improvement in my gut health. I would 100%\n                    recommend this product!\u201d\n                <\/p>\n\n                <div class=\"wnsa-testimonial-author\">\n\n                    <div class=\"wnsa-author-avatar\">\n                        C\n                    <\/div>\n\n                    <div>\n                        <strong>Celest<\/strong>\n                        <span>Verified Customer<\/span>\n                    <\/div>\n\n                <\/div>\n\n            <\/article>\n\n\n        <\/div>\n\n\n        <!-- REVIEW CTA -->\n\n        <div class=\"wnsa-review-cta\">\n\n            <span>\n                \u2605\u2605\u2605\u2605\u2605\n            <\/span>\n\n            <p>\n                Have you tried Why Not SA?\n            <\/p>\n\n            <a href=\"#contact\">\n                Share Your Experience \u2192\n            <\/a>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n<!-- =========================================\n     WHY NOT SA - FAQ SECTION\n     ========================================= -->\n\n<section class=\"wnsa-faq\" id=\"faq\">\n\n    <div class=\"wnsa-faq-container\">\n\n        <!-- LEFT SIDE -->\n        <div class=\"wnsa-faq-intro\">\n\n            <span class=\"wnsa-section-eyebrow\">\n                HAVE QUESTIONS?\n            <\/span>\n\n            <h2>\n                We've Got\n                <span>Answers.<\/span>\n            <\/h2>\n\n            <p>\n                Everything you need to know about our pure,\n                unflavoured collagen powder.\n            <\/p>\n\n            <a href=\"#contact\" class=\"wnsa-faq-contact\">\n                Still Have Questions?\n                <span>\u2192<\/span>\n            <\/a>\n\n        <\/div>\n\n\n        <!-- RIGHT SIDE -->\n        <div class=\"wnsa-faq-list\">\n\n\n            <!-- FAQ 1 -->\n            <div class=\"wnsa-faq-item active\">\n\n                <button type=\"button\" class=\"wnsa-faq-question\" aria-expanded=\"true\">\n                    <span>\n                        What is Why Not SA Collagen?\n                    <\/span>\n\n                    <b>\u2212<\/b>\n                <\/button>\n\n                <div class=\"wnsa-faq-answer\">\n\n                    <p>\n                        Why Not SA Collagen is a pure bovine collagen\n                        peptide powder. It is unflavoured, making it\n                        easy to add to your favourite drinks, smoothies\n                        or meals.\n                    <\/p>\n\n                <\/div>\n\n            <\/div>\n\n\n            <!-- FAQ 2 -->\n            <div class=\"wnsa-faq-item\">\n\n                <button type=\"button\" class=\"wnsa-faq-question\" aria-expanded=\"false\">\n                    <span>\n                        Is the collagen flavoured?\n                    <\/span>\n\n                    <b>+<\/b>\n                <\/button>\n\n                <div class=\"wnsa-faq-answer\">\n\n                    <p>\n                        No. Our collagen is completely unflavoured,\n                        so it can easily be added to coffee, water,\n                        smoothies and other foods or drinks.\n                    <\/p>\n\n                <\/div>\n\n            <\/div>\n\n\n            <!-- FAQ 3 -->\n            <div class=\"wnsa-faq-item\">\n\n                <button type=\"button\" class=\"wnsa-faq-question\" aria-expanded=\"false\">\n                    <span>\n                        What can I mix it with?\n                    <\/span>\n\n                    <b>+<\/b>\n                <\/button>\n\n                <div class=\"wnsa-faq-answer\">\n\n                    <p>\n                        Because it is unflavoured, you can mix it\n                        into water, coffee, smoothies or incorporate\n                        it into your favourite recipes.\n                    <\/p>\n\n                <\/div>\n\n            <\/div>\n\n\n            <!-- FAQ 4 -->\n            <div class=\"wnsa-faq-item\">\n\n                <button type=\"button\" class=\"wnsa-faq-question\" aria-expanded=\"false\">\n                    <span>\n                        What are the benefits of collagen?\n                    <\/span>\n\n                    <b>+<\/b>\n                <\/button>\n\n                <div class=\"wnsa-faq-answer\">\n\n                    <p>\n                        Collagen is an important structural protein\n                        in the body. Our collagen is designed to\n                        support healthy skin, hair, nails and joints\n                        as part of a balanced lifestyle.\n                    <\/p>\n\n                <\/div>\n\n            <\/div>\n\n\n            <!-- FAQ 5 -->\n            <div class=\"wnsa-faq-item\">\n\n                <button type=\"button\" class=\"wnsa-faq-question\" aria-expanded=\"false\">\n                    <span>\n                        Is Why Not SA Collagen Halal?\n                    <\/span>\n\n                    <b>+<\/b>\n                <\/button>\n\n                <div class=\"wnsa-faq-answer\">\n\n                    <p>\n                        Yes. Our collagen is Halal.\n                    <\/p>\n\n                <\/div>\n\n            <\/div>\n\n\n            <!-- FAQ 6 -->\n            <div class=\"wnsa-faq-item\">\n\n                <button type=\"button\" class=\"wnsa-faq-question\" aria-expanded=\"false\">\n                    <span>\n                        How much collagen is in the tin?\n                    <\/span>\n\n                    <b>+<\/b>\n                <\/button>\n\n                <div class=\"wnsa-faq-answer\">\n\n                    <p>\n                        Each Why Not SA tin contains 300g of pure\n                        bovine collagen powder.\n                    <\/p>\n\n                <\/div>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n<!-- =========================================\n     WHY NOT SA - FINAL CTA SECTION\n     ========================================= -->\n\n<section class=\"wnsa-final-cta\">\n\n    <div class=\"wnsa-final-cta-container\">\n\n        <!-- LEFT CONTENT -->\n        <div class=\"wnsa-final-cta-content\">\n\n            <span class=\"wnsa-final-eyebrow\">\n                YOUR DAILY WELLNESS RITUAL\n            <\/span>\n\n            <h2>\n                Glow From\n                <span>The Inside Out.<\/span>\n            <\/h2>\n\n            <p>\n                Make pure collagen part of your everyday routine\n                and take a simple step towards supporting healthy\n                skin, hair, nails and joints.\n            <\/p>\n\n            <a href=\"#product\" class=\"wnsa-final-button\">\n                Shop Why Not SA\n                <span>\u2192<\/span>\n            <\/a>\n\n        <\/div>\n\n\n        <!-- RIGHT PRODUCT -->\n        <div class=\"wnsa-final-product\">\n\n            <div class=\"wnsa-final-circle\"><\/div>\n\n            <div class=\"wnsa-final-sparkle sparkle-one\">\n                \u2726\n            <\/div>\n\n            <div class=\"wnsa-final-sparkle sparkle-two\">\n                \u2726\n            <\/div>\n\n            <img src=\"https:\/\/whynotsa.co.za\/wp-content\/uploads\/2026\/08\/Collagen01.png\" alt=\"Why Not SA Pure Bovine Collagen Powder\">\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n<style>\n.wnsa-final-product img {\n    width: 420px !important;\n    height: 420px !important;\n    max-width: 100% !important;\n    box-sizing: border-box !important;\n    object-fit: cover !important;\n    object-position: center center !important;\n    border-radius: 50% !important;\n    border: 10px solid #EADAB7 !important;\n    transform: none !important;\n    filter: none !important;\n    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.30) !important;\n}\n\n.wnsa-final-circle {\n    opacity: 0 !important;\n}\n\n@media (max-width: 600px) {\n    .wnsa-final-product img {\n        width: 300px !important;\n        height: 300px !important;\n        border-width: 8px !important;\n    }\n}\n<\/style>\n<!-- =========================================\n     WHY NOT SA - FOOTER\n     ========================================= -->\n\n<footer class=\"wnsa-footer\" id=\"contact\">\n\n    <div class=\"wnsa-footer-container\">\n\n        <!-- BRAND -->\n        <div class=\"wnsa-footer-brand\">\n\n            <a href=\"\/\" class=\"wnsa-footer-logo\">\n                <img src=\"https:\/\/whynotsa.co.za\/wp-content\/uploads\/2023\/11\/PNG-%EF%BF%BD-WHY-NOT-SAL-RE-DESIGNED-scaled.png\" alt=\"Why Not SA Collagen\">\n            <\/a>\n\n            <p>\n                Pure bovine collagen peptides designed to support\n                your everyday wellness routine.\n            <\/p>\n\n            <div class=\"wnsa-footer-socials\">\n\n                <a href=\"#\" aria-label=\"Facebook\">\n                    f\n                <\/a>\n\n                <a href=\"#\" aria-label=\"Instagram\">\n                    \u25ce\n                <\/a>\n\n                <a href=\"#\" aria-label=\"TikTok\">\n                    \u266a\n                <\/a>\n\n            <\/div>\n\n        <\/div>\n\n\n        <!-- QUICK LINKS -->\n        <div class=\"wnsa-footer-column\">\n\n            <h3>\n                Quick Links\n            <\/h3>\n\n            <a href=\"#home\">\n                Home\n            <\/a>\n\n            <a href=\"#about\">\n                About Us\n            <\/a>\n\n            <a href=\"#product\">\n                Our Product\n            <\/a>\n\n            <a href=\"#benefits\">\n                Benefits\n            <\/a>\n\n            <a href=\"#how-to\">\n                How To Use\n            <\/a>\n\n            <a href=\"#faq\">\n                FAQ\n            <\/a>\n\n        <\/div>\n\n\n        <!-- SHOP -->\n        <div class=\"wnsa-footer-column\">\n\n            <h3>\n                Shop\n            <\/h3>\n\n            <a href=\"#product\">\n                Collagen Powder\n            <\/a>\n\n            <a href=\"#product\">\n                300g Tin\n            <\/a>\n\n            <a href=\"#reviews\">\n                Customer Reviews\n            <\/a>\n\n            <a href=\"#product\">\n                Shop Now\n            <\/a>\n\n        <\/div>\n\n\n        <!-- CONTACT -->\n        <div class=\"wnsa-footer-column wnsa-footer-contact\">\n\n            <h3>\n                Get In Touch\n            <\/h3>\n\n            <a href=\"mailto:info@whynotsa.co.za\">\n                info@whynotsa.co.za\n            <\/a>\n\n            <a href=\"https:\/\/whynotsa.co.za\">\n                www.whynotsa.co.za\n            <\/a>\n\n            <p>\n                South Africa\n            <\/p>\n\n            <a href=\"#contact\" class=\"wnsa-footer-contact-button\">\n                Contact Us \u2192\n            <\/a>\n\n        <\/div>\n\n    <\/div>\n\n\n    <!-- NEWSLETTER -->\n    <div class=\"wnsa-footer-newsletter\">\n\n        <div>\n\n            <span>\n                STAY IN THE LOOP\n            <\/span>\n\n            <h3>\n                Wellness starts from within.\n            <\/h3>\n\n        <\/div>\n\n        <form class=\"wnsa-newsletter-form\">\n\n            <input type=\"email\" placeholder=\"Your email address\" aria-label=\"Email address\" required=\"\">\n\n            <button type=\"submit\">\n                Subscribe\n                <span>\u2192<\/span>\n            <\/button>\n\n        <\/form>\n\n    <\/div>\n\n\n    <!-- BOTTOM BAR -->\n    <div class=\"wnsa-footer-bottom\">\n\n        <p>\n            \u00a9 2026 Why Not SA. All Rights Reserved.\n        <\/p>\n\n        <div class=\"wnsa-footer-legal\">\n\n            <a href=\"#\">\n                Privacy Policy\n            <\/a>\n\n            <a href=\"#\">\n                Terms &amp; Conditions\n            <\/a>\n\n            <a href=\"#\">\n                Shipping &amp; Returns\n            <\/a>\n\n        <\/div>\n\n    <\/div>\n\n<\/footer>\n<!-- \/wp:html -->\n\n<!-- wp:paragraph -->\n<p><\/p>\n<!-- \/wp:paragraph -->","_et_gb_content_width":"","_eb_attr":"","_themeisle_gutenberg_block_has_review":false,"_joinchat":[],"footnotes":""},"class_list":["post-2033","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/whynotsa.co.za\/index.php\/wp-json\/wp\/v2\/pages\/2033","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/whynotsa.co.za\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/whynotsa.co.za\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/whynotsa.co.za\/index.php\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/whynotsa.co.za\/index.php\/wp-json\/wp\/v2\/comments?post=2033"}],"version-history":[{"count":30,"href":"https:\/\/whynotsa.co.za\/index.php\/wp-json\/wp\/v2\/pages\/2033\/revisions"}],"predecessor-version":[{"id":2099,"href":"https:\/\/whynotsa.co.za\/index.php\/wp-json\/wp\/v2\/pages\/2033\/revisions\/2099"}],"wp:attachment":[{"href":"https:\/\/whynotsa.co.za\/index.php\/wp-json\/wp\/v2\/media?parent=2033"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}