{"title":"VELR Collection","description":null,"products":[{"product_id":"silicon-scrubber","title":"VELR Grooming Set","description":"\u003cp\u003e\u003cbr\u003e\u003c\/p\u003e\n\u003cstyle\u003e\n  .velr-product {\n    --velr-bg: #050505;\n    --velr-card: #0b0b0b;\n    --velr-border: rgba(255,255,255,0.12);\n    --velr-text: #f5f5f5;\n    --velr-muted: #a6a6a6;\n    --velr-silver: #d8d8d8;\n    --velr-dark-silver: #777;\n    \n    background: var(--velr-bg);\n    color: var(--velr-text);\n    padding: 70px 22px;\n    overflow: hidden;\n    font-family: Arial, Helvetica, sans-serif;\n    position: relative;\n  }\n\n  \/* Subtle background glow *\/\n  .velr-product::before {\n    content: \"\";\n    position: absolute;\n    width: 600px;\n    height: 600px;\n    top: -300px;\n    left: 50%;\n    transform: translateX(-50%);\n    background: radial-gradient(\n      circle,\n      rgba(255,255,255,0.08) 0%,\n      rgba(255,255,255,0.025) 35%,\n      transparent 70%\n    );\n    pointer-events: none;\n  }\n\n  .velr-container {\n    max-width: 1050px;\n    margin: 0 auto;\n    position: relative;\n    z-index: 2;\n  }\n\n  \/* Header *\/\n  .velr-eyebrow {\n    text-align: center;\n    font-size: 11px;\n    letter-spacing: 4px;\n    text-transform: uppercase;\n    color: #999;\n    margin-bottom: 18px;\n    animation: velrFadeUp 0.8s ease forwards;\n  }\n\n  .velr-title {\n    text-align: center;\n    margin: 0;\n    font-size: clamp(38px, 6vw, 68px);\n    line-height: 0.95;\n    font-weight: 500;\n    letter-spacing: -3px;\n    \n    background: linear-gradient(\n      110deg,\n      #777 0%,\n      #f5f5f5 25%,\n      #9c9c9c 50%,\n      #ffffff 70%,\n      #707070 100%\n    );\n    \n    background-size: 200% auto;\n    -webkit-background-clip: text;\n    -webkit-text-fill-color: transparent;\n    animation:\n      velrFadeUp 0.9s ease forwards,\n      velrMetal 6s linear infinite;\n  }\n\n  .velr-subtitle {\n    max-width: 620px;\n    margin: 24px auto 0;\n    text-align: center;\n    color: #a5a5a5;\n    font-size: 16px;\n    line-height: 1.7;\n    animation: velrFadeUp 1s ease 0.15s both;\n  }\n\n  \/* Divider *\/\n  .velr-line {\n    width: 70px;\n    height: 1px;\n    background: linear-gradient(\n      90deg,\n      transparent,\n      #aaa,\n      transparent\n    );\n    margin: 42px auto 55px;\n    opacity: 0.7;\n  }\n\n  \/* Section heading *\/\n  .velr-section-heading {\n    text-align: center;\n    margin-bottom: 28px;\n  }\n\n  .velr-section-heading span {\n    font-size: 11px;\n    text-transform: uppercase;\n    letter-spacing: 3px;\n    color: #777;\n  }\n\n  \/* Product cards *\/\n  .velr-grid {\n    display: grid;\n    grid-template-columns: repeat(2, 1fr);\n    gap: 14px;\n  }\n\n  .velr-card {\n    position: relative;\n    min-height: 185px;\n    padding: 30px;\n    background:\n      linear-gradient(\n        145deg,\n        rgba(255,255,255,0.055),\n        rgba(255,255,255,0.012)\n      );\n    border: 1px solid var(--velr-border);\n    border-radius: 3px;\n    overflow: hidden;\n    transition:\n      transform 0.45s cubic-bezier(.2,.8,.2,1),\n      border-color 0.45s ease,\n      box-shadow 0.45s ease;\n    \n    opacity: 0;\n    transform: translateY(25px);\n    animation: velrCardIn 0.8s ease forwards;\n  }\n\n  .velr-card:nth-child(1) {\n    animation-delay: 0.15s;\n  }\n\n  .velr-card:nth-child(2) {\n    animation-delay: 0.25s;\n  }\n\n  .velr-card:nth-child(3) {\n    animation-delay: 0.35s;\n  }\n\n  .velr-card:nth-child(4) {\n    animation-delay: 0.45s;\n  }\n\n  .velr-card:hover {\n    transform: translateY(-6px);\n    border-color: rgba(255,255,255,0.3);\n    box-shadow:\n      0 20px 50px rgba(0,0,0,0.55),\n      inset 0 1px 0 rgba(255,255,255,0.08);\n  }\n\n  \/* Moving shine *\/\n  .velr-card::after {\n    content: \"\";\n    position: absolute;\n    width: 150%;\n    height: 100%;\n    top: 0;\n    left: -180%;\n    background: linear-gradient(\n      100deg,\n      transparent 35%,\n      rgba(255,255,255,0.08) 50%,\n      transparent 65%\n    );\n    transform: skewX(-20deg);\n    transition: left 0.8s ease;\n  }\n\n  .velr-card:hover::after {\n    left: 120%;\n  }\n\n  .velr-number {\n    position: absolute;\n    top: 20px;\n    right: 22px;\n    font-size: 10px;\n    letter-spacing: 2px;\n    color: #555;\n  }\n\n  .velr-icon {\n    width: 38px;\n    height: 38px;\n    border: 1px solid rgba(255,255,255,0.2);\n    border-radius: 50%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    margin-bottom: 22px;\n    color: #d5d5d5;\n    font-size: 13px;\n    background: rgba(255,255,255,0.025);\n  }\n\n  .velr-card h3 {\n    margin: 0 0 9px;\n    font-size: 19px;\n    font-weight: 500;\n    letter-spacing: -0.4px;\n  }\n\n  .velr-card p {\n    margin: 0;\n    color: #8d8d8d;\n    font-size: 13px;\n    line-height: 1.65;\n    max-width: 350px;\n  }\n\n  \/* Bottom statement *\/\n  .velr-bottom {\n    text-align: center;\n    margin-top: 70px;\n    padding-top: 55px;\n    border-top: 1px solid rgba(255,255,255,0.08);\n    animation: velrFadeUp 1s ease 0.6s both;\n  }\n\n  .velr-bottom-small {\n    color: #777;\n    text-transform: uppercase;\n    letter-spacing: 3px;\n    font-size: 10px;\n    margin-bottom: 18px;\n  }\n\n  .velr-bottom h2 {\n    margin: 0;\n    font-size: clamp(26px, 4vw, 42px);\n    font-weight: 400;\n    letter-spacing: -1.5px;\n    \n    background: linear-gradient(\n      100deg,\n      #888,\n      #fff,\n      #888\n    );\n    \n    -webkit-background-clip: text;\n    -webkit-text-fill-color: transparent;\n  }\n\n  .velr-bottom p {\n    max-width: 530px;\n    margin: 18px auto 0;\n    color: #888;\n    font-size: 14px;\n    line-height: 1.7;\n  }\n\n  \/* Animations *\/\n  @keyframes velrFadeUp {\n    from {\n      opacity: 0;\n      transform: translateY(22px);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n  }\n\n  @keyframes velrCardIn {\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n  }\n\n  @keyframes velrMetal {\n    0% {\n      background-position: 200% center;\n    }\n    100% {\n      background-position: -200% center;\n    }\n  }\n\n  \/* Mobile *\/\n  @media (max-width: 650px) {\n    .velr-product {\n      padding: 55px 17px;\n    }\n\n    .velr-title {\n      letter-spacing: -2px;\n    }\n\n    .velr-subtitle {\n      font-size: 14px;\n      line-height: 1.65;\n    }\n\n    .velr-grid {\n      grid-template-columns: 1fr;\n      gap: 10px;\n    }\n\n    .velr-card {\n      min-height: auto;\n      padding: 25px;\n    }\n\n    .velr-bottom {\n      margin-top: 55px;\n      padding-top: 45px;\n    }\n  }\n\u003c\/style\u003e\n\u003csection class=\"velr-product\"\u003e\n\u003cdiv class=\"velr-container\"\u003e\n\u003c!-- HEADER --\u003e\n\u003cdiv class=\"velr-eyebrow\"\u003eVELR Grooming\u003c\/div\u003e\n\u003ch2 class=\"velr-title\"\u003eThe VELR Grooming Set\u003c\/h2\u003e\n\u003cp class=\"velr-subtitle\"\u003eFour essentials. One complete grooming routine. Designed to give you a deeper, more refreshing clean from head to toe.\u003c\/p\u003e\n\u003cdiv class=\"velr-line\"\u003e\u003cbr\u003e\u003c\/div\u003e\n\u003c!-- WHAT'S INCLUDED --\u003e\n\u003cdiv class=\"velr-section-heading\"\u003e\u003cspan\u003eWhat's included\u003c\/span\u003e\u003c\/div\u003e\n\u003cdiv class=\"velr-grid\"\u003e\n\u003c!-- FACE --\u003e\n\u003cdiv class=\"velr-card\"\u003e\n\u003cspan class=\"velr-number\"\u003e01\u003c\/span\u003e\n\u003cdiv class=\"velr-icon\"\u003e◇\u003c\/div\u003e\n\u003ch3\u003eFace Scrubber\u003c\/h3\u003e\n\u003cp\u003eGently exfoliates and helps remove daily buildup, leaving your skin feeling cleaner and refreshed.\u003c\/p\u003e\n\u003c\/div\u003e\n\u003c!-- SCALP --\u003e\n\u003cdiv class=\"velr-card\"\u003e\n\u003cspan class=\"velr-number\"\u003e02\u003c\/span\u003e\n\u003cdiv class=\"velr-icon\"\u003e◉\u003c\/div\u003e\n\u003ch3\u003eScalp Scrubber\u003c\/h3\u003e\n\u003cp\u003eHelps cleanse the scalp while lifting away sweat, oil and product buildup.\u003c\/p\u003e\n\u003c\/div\u003e\n\u003c!-- BACK --\u003e\n\u003cdiv class=\"velr-card\"\u003e\n\u003cspan class=\"velr-number\"\u003e03\u003c\/span\u003e\n\u003cdiv class=\"velr-icon\"\u003e↗\u003c\/div\u003e\n\u003ch3\u003eBack Scrubber\u003c\/h3\u003e\n\u003cp\u003eDesigned to make those hard-to-reach areas easier to cleanse thoroughly.\u003c\/p\u003e\n\u003c\/div\u003e\n\u003c!-- BODY --\u003e\n\u003cdiv class=\"velr-card\"\u003e\n\u003cspan class=\"velr-number\"\u003e04\u003c\/span\u003e\n\u003cdiv class=\"velr-icon\"\u003e✦\u003c\/div\u003e\n\u003ch3\u003eBody Scrubber\u003c\/h3\u003e\n\u003cp\u003eCreates a deeper, more satisfying cleanse across your body without harsh scrubbing.\u003c\/p\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c!-- BOTTOM STATEMENT --\u003e\n\u003cdiv class=\"velr-bottom\"\u003e\n\u003cdiv class=\"velr-bottom-small\"\u003eOne system. Four essentials.\u003c\/div\u003e\n\u003ch2\u003eA better way to groom.\u003c\/h2\u003e\n\u003cp\u003eMade from soft, skin-friendly silicone, the VELR Grooming Set helps lift away sweat, oil and buildup while keeping your everyday routine simple.\u003c\/p\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/section\u003e\n","brand":"My Store","offers":[{"title":"SINGLE SET (25% OFF)","offer_id":67615849185644,"sku":null,"price":749.99,"currency_code":"ZAR","in_stock":true},{"title":"DOUBLE SET (35% OFF)","offer_id":67615849218412,"sku":null,"price":849.0,"currency_code":"ZAR","in_stock":false}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/1007\/6533\/5916\/files\/ChatGPT_Image_Aug_13_2026_09_49_19_PM.png?v=1786651111"},{"product_id":"face-cleanser","title":"VELR Charcoal Cleanser","description":"\u003cstyle\u003e\n  .velr-cleanse {\n    --bg: #050505;\n    --card: #0b0b0b;\n    --text: #f5f5f5;\n    --muted: #969696;\n    --border: rgba(255,255,255,0.12);\n\n    position: relative;\n    overflow: hidden;\n    background: var(--bg);\n    color: var(--text);\n    padding: 75px 22px;\n    font-family: Arial, Helvetica, sans-serif;\n\n    \/* IMPORTANT:\n       Makes this section respond to its actual Shopify column width *\/\n    container-type: inline-size;\n  }\n\n  \/* Background glow *\/\n\n  .velr-cleanse::before {\n    content: \"\";\n    position: absolute;\n    width: 650px;\n    height: 650px;\n    top: -330px;\n    left: 50%;\n    transform: translateX(-50%);\n\n    background: radial-gradient(\n      circle,\n      rgba(255,255,255,0.075) 0%,\n      rgba(255,255,255,0.025) 35%,\n      transparent 70%\n    );\n\n    pointer-events: none;\n  }\n\n  .velr-cleanse::after {\n    content: \"\";\n    position: absolute;\n    width: 450px;\n    height: 450px;\n    bottom: -300px;\n    right: -180px;\n\n    background: radial-gradient(\n      circle,\n      rgba(255,255,255,0.035),\n      transparent 70%\n    );\n\n    pointer-events: none;\n  }\n\n  .velr-cleanse-container {\n    width: 100%;\n    max-width: 1050px;\n    margin: 0 auto;\n    position: relative;\n    z-index: 2;\n  }\n\n  \/* HEADER *\/\n\n  .velr-cleanse-eyebrow {\n    text-align: center;\n    color: #888;\n    font-size: 11px;\n    letter-spacing: 4px;\n    text-transform: uppercase;\n    margin-bottom: 18px;\n\n    animation: velrCleanseFade 0.8s ease forwards;\n  }\n\n  .velr-cleanse-title {\n    margin: 0 auto;\n    max-width: 900px;\n\n    text-align: center;\n\n    font-size: clamp(42px, 6vw, 72px);\n    line-height: 0.98;\n    font-weight: 500;\n    letter-spacing: -3px;\n\n    background: linear-gradient(\n      110deg,\n      #707070 0%,\n      #f7f7f7 24%,\n      #a0a0a0 48%,\n      #ffffff 70%,\n      #6c6c6c 100%\n    );\n\n    background-size: 220% auto;\n\n    -webkit-background-clip: text;\n    -webkit-text-fill-color: transparent;\n\n    animation:\n      velrCleanseFade 0.9s ease forwards,\n      velrCleanseMetal 7s linear infinite;\n  }\n\n  .velr-cleanse-intro {\n    width: 100%;\n    max-width: 650px;\n\n    margin: 25px auto 0;\n\n    text-align: center;\n\n    color: var(--muted);\n\n    font-size: 15px;\n    line-height: 1.75;\n\n    animation: velrCleanseFade 1s ease 0.15s both;\n  }\n\n  \/* DIVIDER *\/\n\n  .velr-cleanse-divider {\n    width: 75px;\n    height: 1px;\n\n    margin: 43px auto 58px;\n\n    background: linear-gradient(\n      90deg,\n      transparent,\n      #aaa,\n      transparent\n    );\n\n    opacity: 0.7;\n  }\n\n  \/* SECTION LABEL *\/\n\n  .velr-cleanse-label {\n    text-align: center;\n\n    color: #777;\n\n    text-transform: uppercase;\n    letter-spacing: 3px;\n\n    font-size: 10px;\n\n    margin-bottom: 28px;\n  }\n\n  \/* ================================\n     FEATURE GRID\n     ================================ *\/\n\n  .velr-cleanse-features {\n    display: grid;\n\n    \/* IMPORTANT FIX:\n       Cards never get crushed into tiny columns *\/\n    grid-template-columns:\n      repeat(auto-fit, minmax(min(230px, 100%), 1fr));\n\n    gap: 14px;\n\n    width: 100%;\n    max-width: 1050px;\n\n    margin: 0 auto;\n  }\n\n  \/* CARDS *\/\n\n  .velr-cleanse-card {\n    position: relative;\n    overflow: hidden;\n\n    min-width: 0;\n    min-height: 200px;\n\n    padding: 30px;\n\n    box-sizing: border-box;\n\n    background:\n      linear-gradient(\n        145deg,\n        rgba(255,255,255,0.055),\n        rgba(255,255,255,0.012)\n      );\n\n    border: 1px solid var(--border);\n\n    border-radius: 4px;\n\n    opacity: 0;\n    transform: translateY(25px);\n\n    animation: velrCleanseCard 0.8s ease forwards;\n\n    transition:\n      transform 0.45s cubic-bezier(.2,.8,.2,1),\n      border-color 0.45s ease,\n      box-shadow 0.45s ease;\n  }\n\n  .velr-cleanse-card:nth-child(1) {\n    animation-delay: 0.15s;\n  }\n\n  .velr-cleanse-card:nth-child(2) {\n    animation-delay: 0.28s;\n  }\n\n  .velr-cleanse-card:nth-child(3) {\n    animation-delay: 0.41s;\n  }\n\n  .velr-cleanse-card:hover {\n    transform: translateY(-6px);\n\n    border-color: rgba(255,255,255,0.28);\n\n    box-shadow:\n      0 20px 50px rgba(0,0,0,0.55),\n      inset 0 1px 0 rgba(255,255,255,0.08);\n  }\n\n  \/* SHINE ANIMATION *\/\n\n  .velr-cleanse-card::after {\n    content: \"\";\n\n    position: absolute;\n\n    width: 150%;\n    height: 100%;\n\n    top: 0;\n    left: -180%;\n\n    background: linear-gradient(\n      100deg,\n      transparent 35%,\n      rgba(255,255,255,0.08) 50%,\n      transparent 65%\n    );\n\n    transform: skewX(-20deg);\n\n    transition: left 0.8s ease;\n\n    pointer-events: none;\n  }\n\n  .velr-cleanse-card:hover::after {\n    left: 120%;\n  }\n\n  \/* ICON *\/\n\n  .velr-cleanse-icon {\n    width: 40px;\n    height: 40px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    border: 1px solid rgba(255,255,255,0.2);\n\n    border-radius: 50%;\n\n    color: #d5d5d5;\n\n    font-size: 14px;\n\n    background: rgba(255,255,255,0.025);\n\n    margin-bottom: 22px;\n\n    box-sizing: border-box;\n  }\n\n  \/* CARD TYPOGRAPHY *\/\n\n  .velr-cleanse-card h3 {\n    margin: 0 0 10px;\n\n    font-size: 20px;\n\n    font-weight: 500;\n\n    letter-spacing: -0.4px;\n\n    line-height: 1.2;\n\n    word-break: normal;\n    overflow-wrap: normal;\n  }\n\n  .velr-cleanse-card p {\n    margin: 0;\n\n    max-width: 520px;\n\n    color: #888;\n\n    font-size: 14px;\n\n    line-height: 1.7;\n\n    word-break: normal;\n    overflow-wrap: normal;\n  }\n\n  \/* BOTTOM STATEMENT *\/\n\n  .velr-cleanse-bottom {\n    text-align: center;\n\n    margin: 70px auto 0;\n\n    padding-top: 55px;\n\n    border-top: 1px solid rgba(255,255,255,0.08);\n\n    max-width: 900px;\n\n    animation: velrCleanseFade 1s ease 0.6s both;\n  }\n\n  .velr-cleanse-small {\n    color: #777;\n\n    text-transform: uppercase;\n\n    letter-spacing: 3px;\n\n    font-size: 10px;\n\n    margin-bottom: 18px;\n  }\n\n  .velr-cleanse-bottom h2 {\n    margin: 0;\n\n    font-size: clamp(28px, 4vw, 44px);\n\n    line-height: 1.08;\n\n    font-weight: 400;\n\n    letter-spacing: -1.5px;\n\n    background: linear-gradient(\n      100deg,\n      #888,\n      #fff,\n      #888\n    );\n\n    -webkit-background-clip: text;\n    -webkit-text-fill-color: transparent;\n  }\n\n  .velr-cleanse-bottom p {\n    max-width: 560px;\n\n    margin: 19px auto 0;\n\n    color: #888;\n\n    font-size: 14px;\n\n    line-height: 1.75;\n  }\n\n  \/* BOTTOM ACCENT *\/\n\n  .velr-cleanse-accent {\n    margin: 35px auto 0;\n\n    display: flex;\n\n    justify-content: center;\n\n    align-items: center;\n\n    gap: 10px;\n\n    color: #777;\n\n    font-size: 10px;\n\n    letter-spacing: 3px;\n\n    text-transform: uppercase;\n  }\n\n  .velr-cleanse-accent::before,\n  .velr-cleanse-accent::after {\n    content: \"\";\n\n    width: 28px;\n    height: 1px;\n\n    background: #444;\n  }\n\n  \/* ANIMATIONS *\/\n\n  @keyframes velrCleanseFade {\n    from {\n      opacity: 0;\n      transform: translateY(22px);\n    }\n\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n  }\n\n  @keyframes velrCleanseCard {\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n  }\n\n  @keyframes velrCleanseMetal {\n    0% {\n      background-position: 200% center;\n    }\n\n    100% {\n      background-position: -200% center;\n    }\n  }\n\n  \/* =================================================\n     SHOPIFY COLUMN WIDTH FIX\n     Responds to actual section width\n     ================================================= *\/\n\n  @container (max-width: 700px) {\n\n    .velr-cleanse-features {\n      grid-template-columns: 1fr;\n      gap: 14px;\n    }\n\n    .velr-cleanse-card {\n      min-height: auto;\n      padding: 27px;\n    }\n\n    .velr-cleanse-card h3 {\n      font-size: 19px;\n      line-height: 1.25;\n    }\n\n    .velr-cleanse-card p {\n      font-size: 13px;\n      line-height: 1.65;\n    }\n\n  }\n\n  \/*\n    If this block has enough room,\n    allow two columns.\n  *\/\n\n  @container (min-width: 701px) and (max-width: 900px) {\n\n    .velr-cleanse-features {\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n      gap: 14px;\n    }\n\n  }\n\n  \/*\n    If the section itself is genuinely wide,\n    then allow 3 columns.\n  *\/\n\n  @container (min-width: 901px) {\n\n    .velr-cleanse-features {\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n      gap: 14px;\n    }\n\n  }\n\n  \/* ================================\n     MOBILE\n     KEEP MOBILE LOOK\n     ================================ *\/\n\n  @media (max-width: 700px) {\n\n    .velr-cleanse {\n      padding: 58px 17px;\n    }\n\n    .velr-cleanse-title {\n      font-size: clamp(42px, 13vw, 62px);\n      letter-spacing: -3px;\n      line-height: 0.98;\n    }\n\n    .velr-cleanse-intro {\n      font-size: 14px;\n      line-height: 1.7;\n    }\n\n    .velr-cleanse-divider {\n      margin-bottom: 48px;\n    }\n\n    .velr-cleanse-features {\n      grid-template-columns: 1fr;\n      gap: 10px;\n      max-width: 100%;\n    }\n\n    .velr-cleanse-card {\n      min-height: auto;\n      padding: 27px;\n    }\n\n    .velr-cleanse-card h3 {\n      font-size: 19px;\n    }\n\n    .velr-cleanse-card p {\n      font-size: 13px;\n    }\n\n    .velr-cleanse-bottom {\n      margin-top: 55px;\n      padding-top: 45px;\n    }\n\n  }\n\n\u003c\/style\u003e\n\n\n\u003csection class=\"velr-cleanse\"\u003e\n\n  \u003cdiv class=\"velr-cleanse-container\"\u003e\n\n\n    \u003c!-- HEADER --\u003e\n\n    \u003cdiv class=\"velr-cleanse-eyebrow\"\u003e\n      VELR Facial Care\n    \u003c\/div\u003e\n\n\n    \u003ch2 class=\"velr-cleanse-title\"\u003e\n      The VELR Charcoal Cleanser\n    \u003c\/h2\u003e\n\n\n    \u003cp class=\"velr-cleanse-intro\"\u003e\n      A black bamboo charcoal facial cleanser designed to leave\n      your skin feeling fresh, clean and refreshed without\n      overcomplicating your routine.\n    \u003c\/p\u003e\n\n\n    \u003cdiv class=\"velr-cleanse-divider\"\u003e\u003c\/div\u003e\n\n\n    \u003c!-- FEATURES --\u003e\n\n    \u003cdiv class=\"velr-cleanse-label\"\u003e\n      The Cleanse\n    \u003c\/div\u003e\n\n\n    \u003cdiv class=\"velr-cleanse-features\"\u003e\n\n\n      \u003c!-- FEATURE 1 --\u003e\n\n      \u003cdiv class=\"velr-cleanse-card\"\u003e\n\n        \u003cdiv class=\"velr-cleanse-icon\"\u003e\n          ◇\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          Black Bamboo Charcoal\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          A charcoal-based formula designed to help\n          lift away everyday oil, sweat and buildup.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n      \u003c!-- FEATURE 2 --\u003e\n\n      \u003cdiv class=\"velr-cleanse-card\"\u003e\n\n        \u003cdiv class=\"velr-cleanse-icon\"\u003e\n          ✦\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          Fresh \u0026amp; Refreshed\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          Leaves your skin feeling fresh and clean,\n          making it an easy addition to your daily routine.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n      \u003c!-- FEATURE 3 --\u003e\n\n      \u003cdiv class=\"velr-cleanse-card\"\u003e\n\n        \u003cdiv class=\"velr-cleanse-icon\"\u003e\n          ◉\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          Built For Your Routine\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          Simple, effective and easy to use whenever\n          your skin needs a clean reset.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n    \u003c\/div\u003e\n\n\n    \u003c!-- FINAL STATEMENT --\u003e\n\n    \u003cdiv class=\"velr-cleanse-bottom\"\u003e\n\n      \u003cdiv class=\"velr-cleanse-small\"\u003e\n        Simple. Effective. Refined.\n      \u003c\/div\u003e\n\n\n      \u003ch2\u003e\n        Deep clean.\u003cbr\u003e\n        Fresh finish.\n      \u003c\/h2\u003e\n\n\n      \u003cp\u003e\n        Make cleansing part of your grooming ritual.\n        The VELR Charcoal Cleanser keeps your routine simple\n        while giving your skin that clean, refreshed feeling.\n      \u003c\/p\u003e\n\n\n      \u003cdiv class=\"velr-cleanse-accent\"\u003e\n        Start clean. Finish fresh.\n      \u003c\/div\u003e\n\n    \u003c\/div\u003e\n\n\n  \u003c\/div\u003e\n\n\u003c\/section\u003e\n","brand":"My Store","offers":[{"title":"Default Title","offer_id":54192752886124,"sku":null,"price":499.99,"currency_code":"ZAR","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/1007\/6533\/5916\/files\/ChatGPT_Image_Aug_13_2026_09_49_42_PM.png?v=1786651112"},{"product_id":"velr-grooming-trimmer","title":"VELR Grooming Trimmer","description":"\u003cstyle\u003e\n  .velr-trimmer {\n    --bg: #050505;\n    --card: #0b0b0b;\n    --text: #f5f5f5;\n    --muted: #969696;\n    --border: rgba(255,255,255,0.12);\n\n    position: relative;\n    overflow: hidden;\n    background: var(--bg);\n    color: var(--text);\n    padding: 75px 22px;\n    font-family: Arial, Helvetica, sans-serif;\n\n    \/* Makes the section respond to its actual Shopify width *\/\n    container-type: inline-size;\n  }\n\n  \/* BACKGROUND ATMOSPHERE *\/\n\n  .velr-trimmer::before {\n    content: \"\";\n    position: absolute;\n    width: 650px;\n    height: 650px;\n    top: -330px;\n    left: 50%;\n    transform: translateX(-50%);\n\n    background: radial-gradient(\n      circle,\n      rgba(255,255,255,0.075) 0%,\n      rgba(255,255,255,0.025) 35%,\n      transparent 70%\n    );\n\n    pointer-events: none;\n  }\n\n  .velr-trimmer::after {\n    content: \"\";\n    position: absolute;\n    width: 450px;\n    height: 450px;\n    bottom: -300px;\n    right: -180px;\n\n    background: radial-gradient(\n      circle,\n      rgba(255,255,255,0.035),\n      transparent 70%\n    );\n\n    pointer-events: none;\n  }\n\n  .velr-trimmer-container {\n    width: 100%;\n    max-width: 1050px;\n    margin: 0 auto;\n    position: relative;\n    z-index: 2;\n  }\n\n  \/* HEADER *\/\n\n  .velr-trimmer-eyebrow {\n    text-align: center;\n    color: #888;\n    font-size: 11px;\n    letter-spacing: 4px;\n    text-transform: uppercase;\n    margin-bottom: 18px;\n\n    animation: trimmerFade 0.8s ease forwards;\n  }\n\n  .velr-trimmer-title {\n    margin: 0 auto;\n    max-width: 900px;\n\n    text-align: center;\n\n    font-size: clamp(42px, 6vw, 72px);\n    line-height: 0.98;\n    font-weight: 500;\n    letter-spacing: -3px;\n\n    background: linear-gradient(\n      110deg,\n      #707070 0%,\n      #f7f7f7 24%,\n      #a0a0a0 48%,\n      #ffffff 70%,\n      #6c6c6c 100%\n    );\n\n    background-size: 220% auto;\n\n    -webkit-background-clip: text;\n    -webkit-text-fill-color: transparent;\n\n    animation:\n      trimmerFade 0.9s ease forwards,\n      trimmerMetal 7s linear infinite;\n  }\n\n  .velr-trimmer-intro {\n    width: 100%;\n    max-width: 650px;\n\n    margin: 25px auto 0;\n\n    text-align: center;\n\n    color: var(--muted);\n\n    font-size: 15px;\n    line-height: 1.75;\n\n    animation: trimmerFade 1s ease 0.15s both;\n  }\n\n  \/* DIVIDER *\/\n\n  .velr-trimmer-divider {\n    width: 75px;\n    height: 1px;\n\n    margin: 43px auto 58px;\n\n    background: linear-gradient(\n      90deg,\n      transparent,\n      #aaa,\n      transparent\n    );\n\n    opacity: 0.7;\n  }\n\n  \/* SECTION LABEL *\/\n\n  .velr-trimmer-label {\n    text-align: center;\n\n    color: #777;\n\n    text-transform: uppercase;\n    letter-spacing: 3px;\n\n    font-size: 10px;\n\n    margin-bottom: 28px;\n  }\n\n  \/* ================================\n     FEATURE GRID\n     ================================ *\/\n\n  .velr-trimmer-features {\n    display: grid;\n\n    \/* Prevents cards being crushed *\/\n    grid-template-columns:\n      repeat(auto-fit, minmax(min(220px, 100%), 1fr));\n\n    gap: 14px;\n\n    width: 100%;\n    max-width: 1050px;\n\n    margin: 0 auto;\n  }\n\n  \/* CARDS *\/\n\n  .velr-trimmer-card {\n    position: relative;\n    overflow: hidden;\n\n    min-width: 0;\n    min-height: 200px;\n\n    padding: 30px;\n\n    box-sizing: border-box;\n\n    background:\n      linear-gradient(\n        145deg,\n        rgba(255,255,255,0.055),\n        rgba(255,255,255,0.012)\n      );\n\n    border: 1px solid var(--border);\n\n    border-radius: 4px;\n\n    opacity: 0;\n    transform: translateY(25px);\n\n    animation: trimmerCard 0.8s ease forwards;\n\n    transition:\n      transform 0.45s cubic-bezier(.2,.8,.2,1),\n      border-color 0.45s ease,\n      box-shadow 0.45s ease;\n  }\n\n  .velr-trimmer-card:nth-child(1) {\n    animation-delay: 0.15s;\n  }\n\n  .velr-trimmer-card:nth-child(2) {\n    animation-delay: 0.28s;\n  }\n\n  .velr-trimmer-card:nth-child(3) {\n    animation-delay: 0.41s;\n  }\n\n  .velr-trimmer-card:nth-child(4) {\n    animation-delay: 0.54s;\n  }\n\n  .velr-trimmer-card:hover {\n    transform: translateY(-6px);\n\n    border-color: rgba(255,255,255,0.28);\n\n    box-shadow:\n      0 20px 50px rgba(0,0,0,0.55),\n      inset 0 1px 0 rgba(255,255,255,0.08);\n  }\n\n  \/* SHINE *\/\n\n  .velr-trimmer-card::after {\n    content: \"\";\n\n    position: absolute;\n\n    width: 150%;\n    height: 100%;\n\n    top: 0;\n    left: -180%;\n\n    background: linear-gradient(\n      100deg,\n      transparent 35%,\n      rgba(255,255,255,0.08) 50%,\n      transparent 65%\n    );\n\n    transform: skewX(-20deg);\n\n    transition: left 0.8s ease;\n\n    pointer-events: none;\n  }\n\n  .velr-trimmer-card:hover::after {\n    left: 120%;\n  }\n\n  \/* ICON *\/\n\n  .velr-trimmer-icon {\n    width: 40px;\n    height: 40px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    border: 1px solid rgba(255,255,255,0.2);\n\n    border-radius: 50%;\n\n    color: #d5d5d5;\n\n    font-size: 14px;\n\n    background: rgba(255,255,255,0.025);\n\n    margin-bottom: 22px;\n\n    box-sizing: border-box;\n  }\n\n  \/* CARD TYPOGRAPHY *\/\n\n  .velr-trimmer-card h3 {\n    margin: 0 0 10px;\n\n    font-size: 20px;\n\n    font-weight: 500;\n\n    letter-spacing: -0.4px;\n\n    line-height: 1.2;\n\n    word-break: normal;\n    overflow-wrap: normal;\n  }\n\n  .velr-trimmer-card p {\n    margin: 0;\n\n    max-width: 520px;\n\n    color: #888;\n\n    font-size: 14px;\n\n    line-height: 1.7;\n\n    word-break: normal;\n    overflow-wrap: normal;\n  }\n\n  \/* BOTTOM STATEMENT *\/\n\n  .velr-trimmer-bottom {\n    text-align: center;\n\n    margin: 70px auto 0;\n\n    padding-top: 55px;\n\n    border-top: 1px solid rgba(255,255,255,0.08);\n\n    max-width: 900px;\n\n    animation: trimmerFade 1s ease 0.65s both;\n  }\n\n  .velr-trimmer-small {\n    color: #777;\n\n    text-transform: uppercase;\n\n    letter-spacing: 3px;\n\n    font-size: 10px;\n\n    margin-bottom: 18px;\n  }\n\n  .velr-trimmer-bottom h2 {\n    margin: 0;\n\n    font-size: clamp(28px, 4vw, 44px);\n\n    line-height: 1.08;\n\n    font-weight: 400;\n\n    letter-spacing: -1.5px;\n\n    background: linear-gradient(\n      100deg,\n      #888,\n      #fff,\n      #888\n    );\n\n    -webkit-background-clip: text;\n    -webkit-text-fill-color: transparent;\n  }\n\n  .velr-trimmer-bottom p {\n    max-width: 560px;\n\n    margin: 19px auto 0;\n\n    color: #888;\n\n    font-size: 14px;\n\n    line-height: 1.75;\n  }\n\n  \/* BOTTOM ACCENT *\/\n\n  .velr-trimmer-accent {\n    margin: 35px auto 0;\n\n    display: flex;\n\n    justify-content: center;\n\n    align-items: center;\n\n    gap: 10px;\n\n    color: #777;\n\n    font-size: 10px;\n\n    letter-spacing: 3px;\n\n    text-transform: uppercase;\n  }\n\n  .velr-trimmer-accent::before,\n  .velr-trimmer-accent::after {\n    content: \"\";\n\n    width: 28px;\n    height: 1px;\n\n    background: #444;\n  }\n\n  \/* ANIMATIONS *\/\n\n  @keyframes trimmerFade {\n    from {\n      opacity: 0;\n      transform: translateY(22px);\n    }\n\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n  }\n\n  @keyframes trimmerCard {\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n  }\n\n  @keyframes trimmerMetal {\n    0% {\n      background-position: 200% center;\n    }\n\n    100% {\n      background-position: -200% center;\n    }\n  }\n\n  \/* =================================================\n     SHOPIFY COLUMN WIDTH FIX\n     ================================================= *\/\n\n  \/*\n    Narrow Shopify product column:\n    stack cards instead of crushing them.\n  *\/\n\n  @container (max-width: 520px) {\n\n    .velr-trimmer-features {\n      grid-template-columns: 1fr;\n      gap: 14px;\n    }\n\n    .velr-trimmer-card {\n      min-height: auto;\n      padding: 27px;\n    }\n\n    .velr-trimmer-card h3 {\n      font-size: 19px;\n      line-height: 1.25;\n    }\n\n    .velr-trimmer-card p {\n      font-size: 13px;\n      line-height: 1.65;\n    }\n\n  }\n\n  \/*\n    Medium-width Shopify column:\n    two cards per row.\n  *\/\n\n  @container (min-width: 521px) and (max-width: 900px) {\n\n    .velr-trimmer-features {\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n      gap: 14px;\n    }\n\n    .velr-trimmer-card {\n      min-height: 200px;\n    }\n\n  }\n\n  \/*\n    Only use four columns when THIS SECTION\n    is actually wide enough.\n  *\/\n\n  @container (min-width: 901px) {\n\n    .velr-trimmer-features {\n      grid-template-columns: repeat(4, minmax(0, 1fr));\n      gap: 14px;\n    }\n\n    .velr-trimmer-card {\n      min-height: 220px;\n    }\n\n  }\n\n  \/* ================================\n     MOBILE\n     ================================ *\/\n\n  @media (max-width: 700px) {\n\n    .velr-trimmer {\n      padding: 58px 17px;\n    }\n\n    .velr-trimmer-title {\n      font-size: clamp(42px, 13vw, 62px);\n      letter-spacing: -3px;\n      line-height: 0.98;\n    }\n\n    .velr-trimmer-intro {\n      font-size: 14px;\n      line-height: 1.7;\n    }\n\n    .velr-trimmer-divider {\n      margin-bottom: 48px;\n    }\n\n    .velr-trimmer-features {\n      grid-template-columns: 1fr;\n      gap: 10px;\n      max-width: 100%;\n    }\n\n    .velr-trimmer-card {\n      min-height: auto;\n      padding: 27px;\n    }\n\n    .velr-trimmer-card h3 {\n      font-size: 19px;\n    }\n\n    .velr-trimmer-card p {\n      font-size: 13px;\n    }\n\n    .velr-trimmer-bottom {\n      margin-top: 55px;\n      padding-top: 45px;\n    }\n\n  }\n\n\u003c\/style\u003e\n\n\n\u003csection class=\"velr-trimmer\"\u003e\n\n  \u003cdiv class=\"velr-trimmer-container\"\u003e\n\n\n    \u003c!-- HEADER --\u003e\n\n    \u003cdiv class=\"velr-trimmer-eyebrow\"\u003e\n      VELR Grooming\n    \u003c\/div\u003e\n\n\n    \u003ch2 class=\"velr-trimmer-title\"\u003e\n      The VELR Grooming Trimmer\n    \u003c\/h2\u003e\n\n\n    \u003cp class=\"velr-trimmer-intro\"\u003e\n      A sleek, cordless grooming essential designed to keep\n      your beard, hair and finer details looking sharp.\n    \u003c\/p\u003e\n\n\n    \u003cdiv class=\"velr-trimmer-divider\"\u003e\u003c\/div\u003e\n\n\n    \u003c!-- FEATURES --\u003e\n\n    \u003cdiv class=\"velr-trimmer-label\"\u003e\n      Precision Grooming\n    \u003c\/div\u003e\n\n\n    \u003cdiv class=\"velr-trimmer-features\"\u003e\n\n\n      \u003c!-- FEATURE 1 --\u003e\n\n      \u003cdiv class=\"velr-trimmer-card\"\u003e\n\n        \u003cdiv class=\"velr-trimmer-icon\"\u003e\n          ◇\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          Precision Control\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          Designed to give you the control you need\n          for clean trimming, shaping and detailing.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n      \u003c!-- FEATURE 2 --\u003e\n\n      \u003cdiv class=\"velr-trimmer-card\"\u003e\n\n        \u003cdiv class=\"velr-trimmer-icon\"\u003e\n          ✦\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          Cordless Freedom\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          A sleek cordless design makes grooming\n          simple, convenient and easy wherever you are.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n      \u003c!-- FEATURE 3 --\u003e\n\n      \u003cdiv class=\"velr-trimmer-card\"\u003e\n\n        \u003cdiv class=\"velr-trimmer-icon\"\u003e\n          ◉\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          Digital Display\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          Keep an eye on your remaining power with\n          the clear digital display while you groom.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n      \u003c!-- FEATURE 4 --\u003e\n\n      \u003cdiv class=\"velr-trimmer-card\"\u003e\n\n        \u003cdiv class=\"velr-trimmer-icon\"\u003e\n          ⟡\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          Built To Stay Sharp\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          From everyday maintenance to final detailing,\n          keep your grooming routine looking refined.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n    \u003c\/div\u003e\n\n\n    \u003c!-- FINAL STATEMENT --\u003e\n\n    \u003cdiv class=\"velr-trimmer-bottom\"\u003e\n\n      \u003cdiv class=\"velr-trimmer-small\"\u003e\n        Simple. Precise. Refined.\n      \u003c\/div\u003e\n\n\n      \u003ch2\u003e\n        Clean lines.\u003cbr\u003e\n        Precise control.\n      \u003c\/h2\u003e\n\n\n      \u003cp\u003e\n        Keep your routine sharp with a grooming essential\n        designed for trimming, shaping and detailing.\n        Your grooming routine, refined.\n      \u003c\/p\u003e\n\n\n      \u003cdiv class=\"velr-trimmer-accent\"\u003e\n        Built to keep you sharp\n      \u003c\/div\u003e\n\n    \u003c\/div\u003e\n\n\n  \u003c\/div\u003e\n\n\u003c\/section\u003e\n\n\n","brand":"My Store","offers":[{"title":"Default Title","offer_id":54197039661420,"sku":null,"price":999.99,"currency_code":"ZAR","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/1007\/6533\/5916\/files\/ChatGPTImageAug14_2026_08_58_01PM.png?v=1786733938"},{"product_id":"velr-detail-kit","title":"VELR Detail Kit","description":"\u003cstyle\u003e\n  .velr-detail {\n    --bg: #050505;\n    --card: #0b0b0b;\n    --text: #f5f5f5;\n    --muted: #969696;\n    --border: rgba(255,255,255,0.12);\n\n    position: relative;\n    overflow: hidden;\n    background: var(--bg);\n    color: var(--text);\n    padding: 75px 22px;\n    font-family: Arial, Helvetica, sans-serif;\n\n    \/* Allows the grid to react to THIS section's width *\/\n    container-type: inline-size;\n  }\n\n  \/* LUXURY AMBIENT GLOW *\/\n\n  .velr-detail::before {\n    content: \"\";\n    position: absolute;\n    width: 700px;\n    height: 700px;\n    top: -350px;\n    left: 50%;\n    transform: translateX(-50%);\n    background: radial-gradient(\n      circle,\n      rgba(255,255,255,0.075) 0%,\n      rgba(255,255,255,0.025) 35%,\n      transparent 70%\n    );\n    pointer-events: none;\n  }\n\n  .velr-detail::after {\n    content: \"\";\n    position: absolute;\n    width: 500px;\n    height: 500px;\n    right: -250px;\n    bottom: -300px;\n    background: radial-gradient(\n      circle,\n      rgba(255,255,255,0.04),\n      transparent 70%\n    );\n    pointer-events: none;\n  }\n\n  .velr-detail-container {\n    position: relative;\n    z-index: 2;\n    width: 100%;\n    max-width: 1080px;\n    margin: 0 auto;\n  }\n\n\n  \/* ================================\n     INTRO\n     ================================ *\/\n\n  .velr-detail-eyebrow {\n    text-align: center;\n    color: #888;\n    font-size: 11px;\n    letter-spacing: 4px;\n    text-transform: uppercase;\n    margin-bottom: 18px;\n    animation: velrDetailFade 0.8s ease forwards;\n  }\n\n  .velr-detail-title {\n    margin: 0 auto;\n    max-width: 950px;\n    text-align: center;\n\n    font-size: clamp(44px, 6vw, 76px);\n    line-height: 0.98;\n    font-weight: 500;\n    letter-spacing: -3px;\n\n    background: linear-gradient(\n      110deg,\n      #707070 0%,\n      #f7f7f7 25%,\n      #a0a0a0 48%,\n      #ffffff 70%,\n      #686868 100%\n    );\n\n    background-size: 220% auto;\n    -webkit-background-clip: text;\n    -webkit-text-fill-color: transparent;\n\n    animation:\n      velrDetailFade 0.9s ease forwards,\n      velrDetailMetal 7s linear infinite;\n  }\n\n  .velr-detail-intro {\n    width: 100%;\n    max-width: 680px;\n    margin: 25px auto 0;\n\n    text-align: center;\n    color: var(--muted);\n\n    font-size: 15px;\n    line-height: 1.75;\n\n    animation: velrDetailFade 1s ease 0.15s both;\n  }\n\n  .velr-detail-divider {\n    width: 75px;\n    height: 1px;\n    margin: 43px auto 58px;\n\n    background: linear-gradient(\n      90deg,\n      transparent,\n      #aaa,\n      transparent\n    );\n\n    opacity: 0.7;\n  }\n\n\n  \/* ================================\n     SECTION LABEL\n     ================================ *\/\n\n  .velr-detail-label {\n    text-align: center;\n    color: #777;\n\n    text-transform: uppercase;\n    letter-spacing: 4px;\n\n    font-size: 10px;\n    margin-bottom: 30px;\n  }\n\n\n  \/* ================================\n     12 PIECE GRID\n     ================================ *\/\n\n  .velr-detail-grid {\n    display: grid;\n\n    \/*\n      IMPORTANT FIX:\n      Cards will never be crushed into tiny columns.\n      Browser chooses how many can actually fit.\n    *\/\n    grid-template-columns:\n      repeat(auto-fit, minmax(min(210px, 100%), 1fr));\n\n    gap: 14px;\n\n    width: 100%;\n    max-width: 1050px;\n    margin: 0 auto;\n  }\n\n  .velr-detail-card {\n    position: relative;\n    overflow: hidden;\n\n    min-width: 0;\n    min-height: 210px;\n\n    padding: 27px;\n\n    box-sizing: border-box;\n\n    background: linear-gradient(\n      145deg,\n      rgba(255,255,255,0.055),\n      rgba(255,255,255,0.012)\n    );\n\n    border: 1px solid var(--border);\n    border-radius: 4px;\n\n    opacity: 0;\n    transform: translateY(24px);\n\n    animation: velrDetailCard 0.7s ease forwards;\n\n    transition:\n      transform 0.45s cubic-bezier(.2,.8,.2,1),\n      border-color 0.45s ease,\n      box-shadow 0.45s ease;\n  }\n\n  .velr-detail-card:nth-child(1) {\n    animation-delay: .08s;\n  }\n\n  .velr-detail-card:nth-child(2) {\n    animation-delay: .14s;\n  }\n\n  .velr-detail-card:nth-child(3) {\n    animation-delay: .20s;\n  }\n\n  .velr-detail-card:nth-child(4) {\n    animation-delay: .26s;\n  }\n\n  .velr-detail-card:nth-child(5) {\n    animation-delay: .32s;\n  }\n\n  .velr-detail-card:nth-child(6) {\n    animation-delay: .38s;\n  }\n\n  .velr-detail-card:nth-child(7) {\n    animation-delay: .44s;\n  }\n\n  .velr-detail-card:nth-child(8) {\n    animation-delay: .50s;\n  }\n\n  .velr-detail-card:nth-child(9) {\n    animation-delay: .56s;\n  }\n\n  .velr-detail-card:nth-child(10) {\n    animation-delay: .62s;\n  }\n\n  .velr-detail-card:nth-child(11) {\n    animation-delay: .68s;\n  }\n\n  .velr-detail-card:nth-child(12) {\n    animation-delay: .74s;\n  }\n\n\n  \/* CARD HOVER *\/\n\n  .velr-detail-card:hover {\n    transform: translateY(-6px);\n\n    border-color: rgba(255,255,255,0.28);\n\n    box-shadow:\n      0 20px 50px rgba(0,0,0,0.55),\n      inset 0 1px 0 rgba(255,255,255,0.08);\n  }\n\n\n  \/* CARD SHINE *\/\n\n  .velr-detail-card::after {\n    content: \"\";\n\n    position: absolute;\n\n    width: 160%;\n    height: 100%;\n\n    top: 0;\n    left: -190%;\n\n    background: linear-gradient(\n      100deg,\n      transparent 35%,\n      rgba(255,255,255,0.08) 50%,\n      transparent 65%\n    );\n\n    transform: skewX(-20deg);\n    transition: left 0.8s ease;\n\n    pointer-events: none;\n  }\n\n  .velr-detail-card:hover::after {\n    left: 120%;\n  }\n\n\n  \/* ================================\n     NUMBER\n     ================================ *\/\n\n  .velr-detail-number {\n    width: 38px;\n    height: 38px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    border: 1px solid rgba(255,255,255,0.19);\n    border-radius: 50%;\n\n    color: #aaa;\n\n    font-size: 11px;\n    letter-spacing: 1px;\n\n    background: rgba(255,255,255,0.025);\n\n    margin-bottom: 22px;\n\n    box-sizing: border-box;\n  }\n\n\n  \/* ================================\n     CARD TEXT\n     ================================ *\/\n\n  .velr-detail-card h3 {\n    margin: 0 0 9px;\n\n    color: #f2f2f2;\n\n    font-size: 17px;\n    line-height: 1.25;\n\n    font-weight: 500;\n    letter-spacing: -0.3px;\n\n    word-break: normal;\n    overflow-wrap: normal;\n  }\n\n  .velr-detail-card p {\n    margin: 0;\n\n    color: #858585;\n\n    font-size: 12px;\n    line-height: 1.65;\n\n    word-break: normal;\n    overflow-wrap: normal;\n  }\n\n\n  \/* ================================\n     CASE SECTION\n     ================================ *\/\n\n  .velr-detail-case {\n    max-width: 900px;\n\n    margin: 75px auto 0;\n\n    padding: 48px 35px;\n\n    text-align: center;\n\n    border-top: 1px solid rgba(255,255,255,0.08);\n    border-bottom: 1px solid rgba(255,255,255,0.08);\n\n    animation: velrDetailFade 1s ease 0.9s both;\n  }\n\n  .velr-detail-case-label {\n    color: #777;\n\n    font-size: 10px;\n    letter-spacing: 4px;\n\n    text-transform: uppercase;\n\n    margin-bottom: 17px;\n  }\n\n  .velr-detail-case h2 {\n    margin: 0;\n\n    font-size: clamp(28px, 4vw, 44px);\n\n    line-height: 1.08;\n\n    font-weight: 400;\n\n    letter-spacing: -1.5px;\n\n    background: linear-gradient(\n      100deg,\n      #888,\n      #fff,\n      #888\n    );\n\n    -webkit-background-clip: text;\n    -webkit-text-fill-color: transparent;\n  }\n\n  .velr-detail-case p {\n    max-width: 600px;\n\n    margin: 19px auto 0;\n\n    color: #888;\n\n    font-size: 14px;\n    line-height: 1.75;\n  }\n\n\n  \/* ================================\n     FINAL\n     ================================ *\/\n\n  .velr-detail-final {\n    text-align: center;\n\n    margin-top: 58px;\n\n    animation: velrDetailFade 1s ease 1s both;\n  }\n\n  .velr-detail-final-small {\n    color: #777;\n\n    text-transform: uppercase;\n\n    letter-spacing: 4px;\n\n    font-size: 10px;\n\n    margin-bottom: 17px;\n  }\n\n  .velr-detail-final h2 {\n    margin: 0;\n\n    font-size: clamp(30px, 4vw, 46px);\n\n    font-weight: 400;\n\n    letter-spacing: -1.5px;\n\n    line-height: 1.05;\n\n    background: linear-gradient(\n      100deg,\n      #888,\n      #fff,\n      #888\n    );\n\n    -webkit-background-clip: text;\n    -webkit-text-fill-color: transparent;\n  }\n\n  .velr-detail-accent {\n    display: flex;\n\n    align-items: center;\n    justify-content: center;\n\n    gap: 10px;\n\n    margin-top: 30px;\n\n    color: #777;\n\n    font-size: 10px;\n\n    letter-spacing: 3px;\n\n    text-transform: uppercase;\n  }\n\n  .velr-detail-accent::before,\n  .velr-detail-accent::after {\n    content: \"\";\n\n    width: 28px;\n    height: 1px;\n\n    background: #444;\n  }\n\n\n  \/* ================================\n     ANIMATIONS\n     ================================ *\/\n\n  @keyframes velrDetailFade {\n\n    from {\n      opacity: 0;\n      transform: translateY(22px);\n    }\n\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n\n  }\n\n\n  @keyframes velrDetailCard {\n\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n\n  }\n\n\n  @keyframes velrDetailMetal {\n\n    0% {\n      background-position: 200% center;\n    }\n\n    100% {\n      background-position: -200% center;\n    }\n\n  }\n\n\n  \/* =================================================\n     CONTAINER FIX\n     This responds to the actual Shopify column width\n     ================================================= *\/\n\n  @container (max-width: 700px) {\n\n    .velr-detail-grid {\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n      gap: 14px;\n    }\n\n    .velr-detail-card {\n      min-height: 215px;\n      padding: 24px;\n    }\n\n    .velr-detail-card h3 {\n      font-size: 17px;\n      line-height: 1.25;\n    }\n\n    .velr-detail-card p {\n      font-size: 12px;\n      line-height: 1.6;\n    }\n\n  }\n\n\n  \/*\n    If Shopify gives this block VERY little space,\n    use one card per row rather than crushing the text.\n  *\/\n\n  @container (max-width: 450px) {\n\n    .velr-detail-grid {\n      grid-template-columns: 1fr;\n    }\n\n  }\n\n\n  \/* ================================\n     MOBILE\n     Original mobile behaviour\n     ================================ *\/\n\n  @media (max-width: 700px) {\n\n    .velr-detail {\n      padding: 58px 17px;\n    }\n\n    .velr-detail-title {\n      font-size: clamp(42px, 13vw, 62px);\n\n      letter-spacing: -3px;\n\n      line-height: 0.98;\n    }\n\n    .velr-detail-intro {\n      font-size: 14px;\n\n      line-height: 1.7;\n    }\n\n    .velr-detail-divider {\n      margin-bottom: 48px;\n    }\n\n    .velr-detail-grid {\n      grid-template-columns: 1fr;\n\n      gap: 10px;\n    }\n\n    .velr-detail-card {\n      min-height: auto;\n\n      padding: 27px;\n    }\n\n    .velr-detail-card h3 {\n      font-size: 19px;\n    }\n\n    .velr-detail-card p {\n      font-size: 13px;\n    }\n\n    .velr-detail-case {\n      margin-top: 55px;\n\n      padding: 43px 10px;\n    }\n\n    .velr-detail-final {\n      margin-top: 48px;\n    }\n\n  }\n\n\u003c\/style\u003e\n\n\n\u003csection class=\"velr-detail\"\u003e\n\n  \u003cdiv class=\"velr-detail-container\"\u003e\n\n\n    \u003c!-- INTRO --\u003e\n\n    \u003cdiv class=\"velr-detail-eyebrow\"\u003e\n      VELR Grooming\n    \u003c\/div\u003e\n\n\n    \u003ch2 class=\"velr-detail-title\"\u003e\n      The VELR Detail Kit\n    \u003c\/h2\u003e\n\n\n    \u003cp class=\"velr-detail-intro\"\u003e\n      A complete collection of precision grooming tools,\n      designed to keep your nails, cuticles and finer details\n      looking clean, sharp and well maintained.\n    \u003c\/p\u003e\n\n\n    \u003cdiv class=\"velr-detail-divider\"\u003e\u003c\/div\u003e\n\n\n    \u003c!-- 12 PIECES --\u003e\n\n    \u003cdiv class=\"velr-detail-label\"\u003e\n      12 Precision Essentials\n    \u003c\/div\u003e\n\n\n    \u003cdiv class=\"velr-detail-grid\"\u003e\n\n\n      \u003c!-- 01 --\u003e\n\n      \u003cdiv class=\"velr-detail-card\"\u003e\n\n        \u003cdiv class=\"velr-detail-number\"\u003e\n          01\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          Nail Clipper\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          For clean, precise nail trimming.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n      \u003c!-- 02 --\u003e\n\n      \u003cdiv class=\"velr-detail-card\"\u003e\n\n        \u003cdiv class=\"velr-detail-number\"\u003e\n          02\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          Large Nail Clipper\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          Designed for larger nails and controlled trimming.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n      \u003c!-- 03 --\u003e\n\n      \u003cdiv class=\"velr-detail-card\"\u003e\n\n        \u003cdiv class=\"velr-detail-number\"\u003e\n          03\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          Precision Nail Clipper\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          For more controlled and detailed trimming.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n      \u003c!-- 04 --\u003e\n\n      \u003cdiv class=\"velr-detail-card\"\u003e\n\n        \u003cdiv class=\"velr-detail-number\"\u003e\n          04\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          Grooming Scissors\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          For precise cutting and fine detailing.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n      \u003c!-- 05 --\u003e\n\n      \u003cdiv class=\"velr-detail-card\"\u003e\n\n        \u003cdiv class=\"velr-detail-number\"\u003e\n          05\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          Cuticle Nipper\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          For neat and controlled cuticle maintenance.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n      \u003c!-- 06 --\u003e\n\n      \u003cdiv class=\"velr-detail-card\"\u003e\n\n        \u003cdiv class=\"velr-detail-number\"\u003e\n          06\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          Nail File\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          Smooths and shapes rough nail edges.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n      \u003c!-- 07 --\u003e\n\n      \u003cdiv class=\"velr-detail-card\"\u003e\n\n        \u003cdiv class=\"velr-detail-number\"\u003e\n          07\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          Cuticle Pusher\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          Designed for maintaining clean, tidy cuticles.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n      \u003c!-- 08 --\u003e\n\n      \u003cdiv class=\"velr-detail-card\"\u003e\n\n        \u003cdiv class=\"velr-detail-number\"\u003e\n          08\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          V-Groove Nail Tool\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          For detailed nail care and precision work.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n      \u003c!-- 09 --\u003e\n\n      \u003cdiv class=\"velr-detail-card\"\u003e\n\n        \u003cdiv class=\"velr-detail-number\"\u003e\n          09\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          Precision Cleaning Tool\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          Reaches smaller, harder-to-reach areas.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n      \u003c!-- 10 --\u003e\n\n      \u003cdiv class=\"velr-detail-card\"\u003e\n\n        \u003cdiv class=\"velr-detail-number\"\u003e\n          10\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          Nail Detail Tool\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          For precise grooming and finer details.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n      \u003c!-- 11 --\u003e\n\n      \u003cdiv class=\"velr-detail-card\"\u003e\n\n        \u003cdiv class=\"velr-detail-number\"\u003e\n          11\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          Fine Point Tool\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          Designed for detailed grooming and care.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n      \u003c!-- 12 --\u003e\n\n      \u003cdiv class=\"velr-detail-card\"\u003e\n\n        \u003cdiv class=\"velr-detail-number\"\u003e\n          12\n        \u003c\/div\u003e\n\n        \u003ch3\u003e\n          Dual-Purpose Grooming Tool\n        \u003c\/h3\u003e\n\n        \u003cp\u003e\n          For additional nail and cuticle maintenance.\n        \u003c\/p\u003e\n\n      \u003c\/div\u003e\n\n\n    \u003c\/div\u003e\n\n\n    \u003c!-- CASE --\u003e\n\n    \u003cdiv class=\"velr-detail-case\"\u003e\n\n      \u003cdiv class=\"velr-detail-case-label\"\u003e\n        The VELR Case\n      \u003c\/div\u003e\n\n      \u003ch2\u003e\n        Everything in its place.\n      \u003c\/h2\u003e\n\n      \u003cp\u003e\n        Keep all 12 essentials organised inside a sleek,\n        protective case designed for your bathroom counter,\n        grooming drawer or travel bag.\n      \u003c\/p\u003e\n\n    \u003c\/div\u003e\n\n\n    \u003c!-- FINAL --\u003e\n\n    \u003cdiv class=\"velr-detail-final\"\u003e\n\n      \u003cdiv class=\"velr-detail-final-small\"\u003e\n        Complete. Precise. Refined.\n      \u003c\/div\u003e\n\n      \u003ch2\u003e\n        12 essentials.\u003cbr\u003e\n        One refined routine.\n      \u003c\/h2\u003e\n\n      \u003cdiv class=\"velr-detail-accent\"\u003e\n        Your grooming routine, elevated\n      \u003c\/div\u003e\n\n    \u003c\/div\u003e\n\n\n  \u003c\/div\u003e\n\n\u003c\/section\u003e","brand":"My Store","offers":[{"title":"Default Title","offer_id":54197103165804,"sku":null,"price":649.99,"currency_code":"ZAR","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/1007\/6533\/5916\/files\/ChatGPTImageAug14_2026_09_10_01PM.png?v=1786734651"}],"url":"https:\/\/velr.co.za\/collections\/velr-collection.oembed","provider":"VELR","version":"1.0","type":"link"}