{"id":2442,"date":"2026-09-09T17:01:54","date_gmt":"2026-09-09T17:01:54","guid":{"rendered":"https:\/\/sampletestlinks.com\/jill\/?page_id=2442"},"modified":"2026-09-29T20:36:10","modified_gmt":"2026-09-29T20:36:10","slug":"about","status":"publish","type":"page","link":"https:\/\/sampletestlinks.com\/jill\/about\/","title":{"rendered":"About"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"2442\" class=\"elementor elementor-2442\">\n\t\t\t\t<div class=\"elementor-element elementor-element-33354fc e-con-full e-flex e-con e-parent\" data-id=\"33354fc\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ecc41b7 elementor-widget elementor-widget-html\" data-id=\"ecc41b7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\r\n.ubt-about-hero-image-wrapper img {\r\n    border-radius: 10px;\r\n}\r\n    \/* =========================================\r\n   UBUTBETTER ABOUT PAGE - HERO ONLY\r\n   All classes are uniquely prefixed\r\n========================================= *\/\r\n\r\n.ubt-about-hero-section {\r\n    width: 100%;\r\n    padding: 80px 0;\r\n    background: linear-gradient(\r\n        135deg,\r\n        #e9f7fb 0%,\r\n        #ffffff 65%\r\n    );\r\n    overflow: hidden;\r\n}\r\n\r\n.ubt-about-hero-container {\r\n    width: 92%;\r\n    max-width: 1160px;\r\n    margin: 0 auto;\r\n\r\n    display: grid;\r\n    grid-template-columns: 1fr 1fr;\r\n    align-items: center;\r\n    gap: 65px;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   HERO CONTENT\r\n========================================= *\/\r\n\r\n.ubt-about-hero-content {\r\n    width: 100%;\r\n}\r\n\r\n.ubt-about-hero-eyebrow {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 9px;\r\n\r\n    color: #4b075d;\r\n    font-family: Arial, sans-serif;\r\n\r\n    font-size: 12px;\r\n    font-weight: 700;\r\n    letter-spacing: 2px;\r\n    text-transform: uppercase;\r\n}\r\n\r\n.ubt-about-hero-eyebrow::before {\r\n    content: \"\";\r\n    width: 28px;\r\n    height: 2px;\r\n    background: #4b075d;\r\n}\r\n\r\n\r\n.ubt-about-hero-title {\r\n    margin: 15px 0 20px;\r\n\r\n    color: #24152a;\r\n\r\n    font-family: Georgia, \"Times New Roman\", serif;\r\n    font-size: clamp(42px, 5vw, 68px);\r\n    font-weight: 500;\r\n\r\n    line-height: 1.08;\r\n    letter-spacing: -2px;\r\n}\r\n\r\n\r\n.ubt-about-hero-description {\r\n    max-width: 600px;\r\n\r\n    margin: 0;\r\n\r\n    color: #675d6b;\r\n\r\n    font-family: Arial, sans-serif;\r\n    font-size: 17px;\r\n    line-height: 1.75;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   HERO BUTTONS\r\n========================================= *\/\r\n\r\n.ubt-about-hero-buttons {\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 12px;\r\n    flex-wrap: wrap;\r\n\r\n    margin-top: 30px;\r\n}\r\n\r\n\r\n.ubt-about-hero-btn-primary,\r\n.ubt-about-hero-btn-secondary {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    min-height: 48px;\r\n    padding: 0 25px;\r\n\r\n    border-radius: 50px;\r\n\r\n    font-family: Arial, sans-serif;\r\n    font-size: 14px;\r\n    font-weight: 700;\r\n\r\n    text-decoration: none;\r\n\r\n    transition: all 0.25s ease;\r\n}\r\n\r\n\r\n.ubt-about-hero-btn-primary {\r\n    background: #4b075d;\r\n    color: #ffffff;\r\n}\r\n\r\n\r\n.ubt-about-hero-btn-primary:hover {\r\n    background: #32033e;\r\n    color: #ffffff;\r\n    transform: translateY(-2px);\r\n}\r\n\r\n\r\n.ubt-about-hero-btn-secondary {\r\n    background: #ffffff;\r\n    color: #4b075d;\r\n\r\n    border: 1px solid #4b075d;\r\n}\r\n\r\n\r\n.ubt-about-hero-btn-secondary:hover {\r\n    background: #4b075d;\r\n    color: #ffffff;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   HERO IMAGE\r\n========================================= *\/\r\n\r\n.ubt-about-hero-image-wrapper {\r\n    position: relative;\r\n    width: 100%;\r\n}\r\n\r\n\r\n.ubt-about-hero-image {\r\n    display: block;\r\n\r\n    width: 100%;\r\n    height: 560px;\r\n\r\n    object-fit: cover;\r\n\r\n    border-radius: 26px;\r\n\r\n    box-shadow:\r\n        0 25px 70px rgba(75, 7, 93, 0.16);\r\n}\r\n\r\n\r\n\/* =========================================\r\n   FLOATING CARD\r\n========================================= *\/\r\n\r\n.ubt-about-hero-floating-card {\r\n    position: absolute;\r\n\r\n    left: -25px;\r\n    bottom: 28px;\r\n\r\n    padding: 18px 21px;\r\n\r\n    background: #ffffff;\r\n\r\n    border-radius: 18px;\r\n\r\n    box-shadow:\r\n        0 15px 40px rgba(33, 20, 40, 0.14);\r\n}\r\n\r\n\r\n.ubt-about-hero-floating-card strong {\r\n    display: block;\r\n\r\n    margin-bottom: 3px;\r\n\r\n    color: #4b075d;\r\n\r\n    font-family: Arial, sans-serif;\r\n    font-size: 19px;\r\n}\r\n\r\n\r\n.ubt-about-hero-floating-card span {\r\n    display: block;\r\n\r\n    color: #675d6b;\r\n\r\n    font-family: Arial, sans-serif;\r\n    font-size: 12px;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   TABLET\r\n========================================= *\/\r\n\r\n@media (max-width: 900px) {\r\n\r\n    .ubt-about-hero-section {\r\n        padding: 65px 0;\r\n    }\r\n\r\n    .ubt-about-hero-container {\r\n        grid-template-columns: 1fr;\r\n        gap: 45px;\r\n    }\r\n\r\n    .ubt-about-hero-content {\r\n        text-align: center;\r\n    }\r\n\r\n    .ubt-about-hero-eyebrow {\r\n        justify-content: center;\r\n    }\r\n\r\n    .ubt-about-hero-description {\r\n        margin-left: auto;\r\n        margin-right: auto;\r\n    }\r\n\r\n    .ubt-about-hero-buttons {\r\n        justify-content: center;\r\n    }\r\n\r\n    .ubt-about-hero-image {\r\n        height: 450px;\r\n    }\r\n\r\n}\r\n\r\n\r\n\/* =========================================\r\n   MOBILE\r\n========================================= *\/\r\n\r\n@media (max-width: 600px) {\r\n\r\n    .ubt-about-hero-section {\r\n        padding: 50px 0;\r\n    }\r\n\r\n    .ubt-about-hero-container {\r\n        width: 90%;\r\n        gap: 35px;\r\n    }\r\n\r\n    .ubt-about-hero-title {\r\n        font-size: 41px;\r\n        line-height: 1.1;\r\n        letter-spacing: -1.2px;\r\n    }\r\n\r\n    .ubt-about-hero-description {\r\n        font-size: 15px;\r\n        line-height: 1.65;\r\n    }\r\n\r\n    .ubt-about-hero-buttons {\r\n        flex-direction: column;\r\n        width: 100%;\r\n    }\r\n\r\n    .ubt-about-hero-btn-primary,\r\n    .ubt-about-hero-btn-secondary {\r\n        width: 100%;\r\n    }\r\n\r\n    .ubt-about-hero-image {\r\n        height: 330px;\r\n        border-radius: 20px;\r\n    }\r\n\r\n    .ubt-about-hero-floating-card {\r\n        left: 12px;\r\n        bottom: 12px;\r\n\r\n        padding: 13px 15px;\r\n    }\r\n\r\n    .ubt-about-hero-floating-card strong {\r\n        font-size: 16px;\r\n    }\r\n\r\n    .ubt-about-hero-floating-card span {\r\n        font-size: 11px;\r\n    }\r\n\r\n}\r\n\r\n\/* =========================================================\r\n   UBUTBETTER HERO - PREMIUM HOVER & MOTION EFFECTS\r\n   Add this AFTER your existing Hero CSS\r\n========================================================= *\/\r\n\r\n\r\n\/* -----------------------------------------\r\n   HERO IMAGE HOVER\r\n----------------------------------------- *\/\r\n\r\n.ubt-about-hero-image-wrapper {\r\n    perspective: 1000px;\r\n}\r\n\r\n\r\n.ubt-about-hero-image {\r\n    transition:\r\n        transform 0.7s cubic-bezier(.2,.8,.2,1),\r\n        box-shadow 0.5s ease,\r\n        filter 0.5s ease;\r\n\r\n    will-change: transform;\r\n}\r\n\r\n\r\n\/* subtle zoom + lift *\/\r\n\r\n.ubt-about-hero-image-wrapper:hover .ubt-about-hero-image {\r\n\r\n    transform: scale(1.025) translateY(-6px);\r\n\r\n    box-shadow:\r\n        0 35px 80px rgba(75, 7, 93, 0.22);\r\n\r\n    filter: brightness(1.02);\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   FLOATING CARD HOVER\r\n----------------------------------------- *\/\r\n\r\n.ubt-about-hero-floating-card {\r\n\r\n    transition:\r\n        transform 0.4s cubic-bezier(.2,.8,.2,1),\r\n        box-shadow 0.4s ease;\r\n\r\n    animation:\r\n        ubtHeroFloat 4s ease-in-out infinite;\r\n}\r\n\r\n\r\n.ubt-about-hero-floating-card:hover {\r\n\r\n    transform: translateY(-8px) scale(1.03);\r\n\r\n    box-shadow:\r\n        0 22px 50px rgba(33, 20, 40, 0.20);\r\n\r\n}\r\n\r\n\r\n\/* Floating animation *\/\r\n\r\n@keyframes ubtHeroFloat {\r\n\r\n    0%,\r\n    100% {\r\n        transform: translateY(0);\r\n    }\r\n\r\n    50% {\r\n        transform: translateY(-7px);\r\n    }\r\n\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   PRIMARY BUTTON\r\n----------------------------------------- *\/\r\n\r\n.ubt-about-hero-btn-primary {\r\n\r\n    position: relative;\r\n\r\n    overflow: hidden;\r\n\r\n    transition:\r\n        transform 0.3s ease,\r\n        box-shadow 0.3s ease,\r\n        background 0.3s ease;\r\n}\r\n\r\n\r\n.ubt-about-hero-btn-primary::before {\r\n\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n\r\n    top: 0;\r\n    left: -120%;\r\n\r\n    width: 80%;\r\n    height: 100%;\r\n\r\n    background: linear-gradient(\r\n        90deg,\r\n        transparent,\r\n        rgba(255,255,255,.30),\r\n        transparent\r\n    );\r\n\r\n    transform: skewX(-20deg);\r\n\r\n    transition: left 0.65s ease;\r\n}\r\n\r\n\r\n.ubt-about-hero-btn-primary:hover::before {\r\n\r\n    left: 140%;\r\n\r\n}\r\n\r\n\r\n.ubt-about-hero-btn-primary:hover {\r\n\r\n    transform: translateY(-3px);\r\n\r\n    box-shadow:\r\n        0 12px 25px rgba(75, 7, 93, .25);\r\n\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   SECONDARY BUTTON\r\n----------------------------------------- *\/\r\n\r\n.ubt-about-hero-btn-secondary {\r\n\r\n    transition:\r\n        transform 0.3s ease,\r\n        background 0.3s ease,\r\n        color 0.3s ease,\r\n        box-shadow 0.3s ease;\r\n}\r\n\r\n\r\n.ubt-about-hero-btn-secondary:hover {\r\n\r\n    transform: translateY(-3px);\r\n\r\n    box-shadow:\r\n        0 10px 25px rgba(75, 7, 93, .12);\r\n\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   EYEBROW ANIMATION\r\n----------------------------------------- *\/\r\n\r\n.ubt-about-hero-eyebrow {\r\n\r\n    transition:\r\n        letter-spacing 0.4s ease,\r\n        transform 0.4s ease;\r\n}\r\n\r\n\r\n.ubt-about-hero-eyebrow:hover {\r\n\r\n    letter-spacing: 2.8px;\r\n\r\n    transform: translateX(4px);\r\n\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   EYEBROW LINE\r\n----------------------------------------- *\/\r\n\r\n.ubt-about-hero-eyebrow::before {\r\n\r\n    transition:\r\n        width 0.4s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-hero-eyebrow:hover::before {\r\n\r\n    width: 42px;\r\n\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   HERO TITLE\r\n----------------------------------------- *\/\r\n\r\n.ubt-about-hero-title {\r\n\r\n    transition:\r\n        transform 0.5s ease,\r\n        letter-spacing 0.5s ease;\r\n}\r\n\r\n\r\n.ubt-about-hero-title:hover {\r\n\r\n    transform: translateX(4px);\r\n\r\n    letter-spacing: -1.5px;\r\n\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   DESCRIPTION\r\n----------------------------------------- *\/\r\n\r\n.ubt-about-hero-description {\r\n\r\n    transition:\r\n        opacity 0.4s ease,\r\n        transform 0.4s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-hero-description:hover {\r\n\r\n    transform: translateX(3px);\r\n\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   IMAGE WRAPPER - LIGHT GLOW\r\n----------------------------------------- *\/\r\n\r\n.ubt-about-hero-image-wrapper::before {\r\n\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n\r\n    inset: -2px;\r\n\r\n    border-radius: 28px;\r\n\r\n    background:\r\n        linear-gradient(\r\n            135deg,\r\n            rgba(75,7,93,.15),\r\n            transparent 45%,\r\n            rgba(233,247,251,.5)\r\n        );\r\n\r\n    opacity: 0;\r\n\r\n    transition: opacity .5s ease;\r\n\r\n    pointer-events: none;\r\n\r\n    z-index: 0;\r\n\r\n}\r\n\r\n\r\n.ubt-about-hero-image-wrapper:hover::before {\r\n\r\n    opacity: 1;\r\n\r\n}\r\n\r\n\r\n\/* Image stays above glow *\/\r\n\r\n.ubt-about-hero-image {\r\n\r\n    position: relative;\r\n\r\n    z-index: 1;\r\n\r\n}\r\n\r\n\r\n\/* Floating card stays above image *\/\r\n\r\n.ubt-about-hero-floating-card {\r\n\r\n    z-index: 3;\r\n\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   HERO CONTENT ENTRANCE ANIMATION\r\n----------------------------------------- *\/\r\n\r\n@keyframes ubtHeroContentReveal {\r\n\r\n    from {\r\n\r\n        opacity: 0;\r\n\r\n        transform:\r\n            translateY(25px);\r\n\r\n    }\r\n\r\n    to {\r\n\r\n        opacity: 1;\r\n\r\n        transform:\r\n            translateY(0);\r\n\r\n    }\r\n\r\n}\r\n\r\n\r\n.ubt-about-hero-content {\r\n\r\n    animation:\r\n        ubtHeroContentReveal\r\n        0.9s\r\n        cubic-bezier(.2,.8,.2,1)\r\n        both;\r\n\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   HERO IMAGE ENTRANCE\r\n----------------------------------------- *\/\r\n\r\n@keyframes ubtHeroImageReveal {\r\n\r\n    from {\r\n\r\n        opacity: 0;\r\n\r\n        transform:\r\n            translateX(35px)\r\n            scale(.97);\r\n\r\n    }\r\n\r\n    to {\r\n\r\n        opacity: 1;\r\n\r\n        transform:\r\n            translateX(0)\r\n            scale(1);\r\n\r\n    }\r\n\r\n}\r\n\r\n\r\n.ubt-about-hero-image-wrapper {\r\n\r\n    animation:\r\n        ubtHeroImageReveal\r\n        1s\r\n        cubic-bezier(.2,.8,.2,1)\r\n        .15s\r\n        both;\r\n\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   BUTTONS ENTRANCE\r\n----------------------------------------- *\/\r\n\r\n.ubt-about-hero-buttons {\r\n\r\n    animation:\r\n        ubtHeroContentReveal\r\n        .8s\r\n        cubic-bezier(.2,.8,.2,1)\r\n        .25s\r\n        both;\r\n\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   MOBILE - REDUCE MOTION\r\n----------------------------------------- *\/\r\n\r\n@media (max-width: 600px) {\r\n\r\n    .ubt-about-hero-image-wrapper:hover\r\n    .ubt-about-hero-image {\r\n\r\n        transform: scale(1.015) translateY(-3px);\r\n\r\n    }\r\n\r\n    .ubt-about-hero-title:hover {\r\n\r\n        transform: none;\r\n\r\n    }\r\n\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   ACCESSIBILITY\r\n----------------------------------------- *\/\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n\r\n    .ubt-about-hero-content,\r\n    .ubt-about-hero-image-wrapper,\r\n    .ubt-about-hero-floating-card {\r\n\r\n        animation: none;\r\n\r\n    }\r\n\r\n    .ubt-about-hero-image,\r\n    .ubt-about-hero-btn-primary,\r\n    .ubt-about-hero-btn-secondary {\r\n\r\n        transition: none;\r\n\r\n    }\r\n\r\n}\r\n<\/style>\r\n\r\n<section class=\"ubt-about-hero-section\">\r\n\r\n  <div class=\"ubt-about-hero-container\">\r\n\r\n    <div class=\"ubt-about-hero-content\">\r\n\r\n      <span class=\"ubt-about-hero-eyebrow\">\r\n        OUR STORY\r\n      <\/span>\r\n\r\n      <h1 class=\"ubt-about-hero-title\">\r\n        Travel made exceptional.\r\n        <br>\r\n        Better, by design.\r\n      <\/h1>\r\n\r\n      <p class=\"ubt-about-hero-description\">\r\n        At UButBetter, we believe the little things can change the way a\r\n        journey feels. We thoughtfully select practical, beautiful travel\r\n        essentials that help you pack smarter, stay organized and enjoy\r\n        the moments that matter.\r\n      <\/p>\r\n\r\n      <div class=\"ubt-about-hero-buttons\">\r\n\r\n        <a href=\"\/jill\/shop\/\" class=\"ubt-about-hero-btn-primary\">\r\n          Explore the Collection\r\n        <\/a>\r\n\r\n        <!--<a href=\"#our-values\" class=\"ubt-about-hero-btn-secondary\">-->\r\n        <!--  What We Believe-->\r\n        <!--<\/a>-->\r\n\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n\r\n    <div class=\"ubt-about-hero-image-wrapper\">\r\n\r\n      <img decoding=\"async\"\r\n        src=\"https:\/\/sampletestlinks.com\/jill\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-29-2026-12_12_48-AM.webp\"\r\n        alt=\"UButBetter Travel Essentials\"\r\n        class=\"ubt-about-hero-image\"\r\n      >\r\n\r\n      <div class=\"ubt-about-hero-floating-card\">\r\n\r\n        <strong>\r\n          Made for better journeys\r\n        <\/strong>\r\n\r\n        <span>\r\n          Practical \u2022 Thoughtful \u2022 Beautiful\r\n        <\/span>\r\n\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n  <\/div>\r\n\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-b5e8e7a e-flex e-con-boxed e-con e-parent\" data-id=\"b5e8e7a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-38c4a85 elementor-widget elementor-widget-html\" data-id=\"38c4a85\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\r\n\/* =====================================================\r\n   UBUTBETTER ABOUT PAGE\r\n   ELEMENTOR FULL WIDTH FIX\r\n   HERO KO TOUCH NAHI KARTA\r\n===================================================== *\/\r\n\r\n\r\n\/* =====================================================\r\n   FULL WIDTH SECTIONS\r\n   Elementor HTML Widget ke constrained column se\r\n   sections ko viewport tak stretch karta hai.\r\n===================================================== *\/\r\n\r\n.ubt-about-stats,\r\n.ubt-about-story,\r\n.ubt-about-values,\r\n.ubt-about-visual,\r\n.ubt-about-standard,\r\n.ubt-about-cta {\r\n\r\n    width: 99.4vw !important;\r\n\r\n    margin-left: calc((100% - 100vw) \/ 2) !important;\r\n    margin-right: 0 !important;\r\n\r\n    position: relative;\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   CONTAINER\r\n===================================================== *\/\r\n\r\n.ubt-about-container {\r\n\r\n    width: 92%;\r\n    max-width: 1160px;\r\n\r\n    margin-left: auto;\r\n    margin-right: auto;\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   EYEBROW\r\n===================================================== *\/\r\n\r\n.ubt-about-eyebrow {\r\n\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 8px;\r\n\r\n    color: #4b075d;\r\n\r\n    font-family: Arial, Helvetica, sans-serif;\r\n\r\n    font-size: 12px;\r\n    font-weight: 700;\r\n\r\n    letter-spacing: 2px;\r\n    text-transform: uppercase;\r\n\r\n}\r\n\r\n\r\n.ubt-about-eyebrow::before {\r\n\r\n    content: \"\";\r\n\r\n    width: 28px;\r\n    height: 2px;\r\n\r\n    background: #4b075d;\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   STATS\r\n===================================================== *\/\r\n\r\n.ubt-about-stats {\r\n\r\n    padding: 38px 0;\r\n\r\n    background: #4b075d;\r\n\r\n    color: #ffffff;\r\n\r\n}\r\n\r\n\r\n.ubt-about-stats-grid {\r\n\r\n    display: grid;\r\n\r\n    grid-template-columns: repeat(3, 1fr);\r\n\r\n    gap: 20px;\r\n\r\n}\r\n\r\n\r\n.ubt-about-stat {\r\n\r\n    text-align: center;\r\n\r\n    padding: 10px 15px;\r\n\r\n}\r\n\r\n\r\n.ubt-about-stat strong {\r\n\r\n    display: block;\r\n\r\n    font-family: Georgia, \"Times New Roman\", serif;\r\n\r\n    font-size: 30px;\r\n\r\n    font-weight: 500;\r\n\r\n    line-height: 1.2;\r\n\r\n}\r\n\r\n\r\n.ubt-about-stat span {\r\n\r\n    display: block;\r\n\r\n    margin-top: 5px;\r\n\r\n    font-family: Arial, sans-serif;\r\n\r\n    font-size: 11px;\r\n\r\n    letter-spacing: 1px;\r\n\r\n    text-transform: uppercase;\r\n\r\n    opacity: .82;\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   STORY SECTION\r\n===================================================== *\/\r\n\r\n.ubt-about-story {\r\n\r\n    padding: 100px 0;\r\n\r\n    background: #ffffff;\r\n\r\n}\r\n\r\n\r\n.ubt-about-story-grid {\r\n\r\n    display: grid;\r\n\r\n    grid-template-columns: .9fr 1.1fr;\r\n\r\n    gap: 70px;\r\n\r\n    align-items: center;\r\n\r\n}\r\n\r\n\r\n.ubt-about-story-image {\r\n\r\n    position: relative;\r\n\r\n}\r\n\r\n\r\n.ubt-about-story-image img {\r\n\r\n    position: relative;\r\n\r\n    z-index: 2;\r\n\r\n    display: block;\r\n\r\n    width: 100%;\r\n\r\n    height: 550px;\r\n\r\n    object-fit: cover;\r\n\r\n    border-radius: 25px;\r\n\r\n}\r\n\r\n\r\n.ubt-about-story-image::after {\r\n\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n\r\n    right: -18px;\r\n\r\n    bottom: -18px;\r\n\r\n    width: 45%;\r\n\r\n    height: 45%;\r\n\r\n    border: 2px solid #d9bde1;\r\n\r\n    border-radius: 24px;\r\n\r\n}\r\n\r\n\r\n.ubt-about-story-content h2 {\r\n\r\n    margin: 15px 0 20px;\r\n\r\n    color: #24152a;\r\n\r\n    font-family: Georgia, \"Times New Roman\", serif;\r\n\r\n    font-size: clamp(38px, 4vw, 55px);\r\n\r\n    font-weight: 500;\r\n\r\n    line-height: 1.1;\r\n\r\n}\r\n\r\n\r\n.ubt-about-story-content p {\r\n\r\n    margin: 0 0 16px;\r\n\r\n    color: #675d6b;\r\n\r\n    font-family: Arial, Helvetica, sans-serif;\r\n\r\n    font-size: 15px;\r\n\r\n    line-height: 1.75;\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   VALUES\r\n===================================================== *\/\r\n\r\n.ubt-about-values {\r\n\r\n    padding: 90px 0;\r\n\r\n    background: #f8f5ed;\r\n\r\n}\r\n\r\n\r\n.ubt-about-section-heading {\r\n\r\n    max-width: 760px;\r\n\r\n    margin: 0 auto 50px;\r\n\r\n    text-align: center;\r\n\r\n}\r\n\r\n\r\n.ubt-about-section-heading .ubt-about-eyebrow {\r\n\r\n    justify-content: center;\r\n\r\n}\r\n\r\n\r\n.ubt-about-section-heading h2 {\r\n\r\n    margin: 15px 0;\r\n\r\n    color: #24152a;\r\n\r\n    font-family: Georgia, \"Times New Roman\", serif;\r\n\r\n    font-size: clamp(38px, 4vw, 55px);\r\n\r\n    font-weight: 500;\r\n\r\n    line-height: 1.1;\r\n\r\n}\r\n\r\n\r\n.ubt-about-section-heading p {\r\n\r\n    max-width: 650px;\r\n\r\n    margin: 0 auto;\r\n\r\n    color: #675d6b;\r\n\r\n    font-family: Arial, sans-serif;\r\n\r\n    font-size: 15px;\r\n\r\n    line-height: 1.7;\r\n\r\n}\r\n\r\n\r\n.ubt-about-values-grid {\r\n\r\n    display: grid;\r\n\r\n    grid-template-columns: repeat(3, 1fr);\r\n\r\n    gap: 20px;\r\n\r\n}\r\n\r\n\r\n.ubt-about-value-card {\r\n\r\n    padding: 32px;\r\n\r\n    background: #ffffff;\r\n\r\n    border: 1px solid rgba(75, 7, 93, .08);\r\n\r\n    border-radius: 22px;\r\n\r\n    transition: .25s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-value-card:hover {\r\n\r\n    transform: translateY(-5px);\r\n\r\n    box-shadow:\r\n        0 18px 40px rgba(75, 7, 93, .10);\r\n\r\n}\r\n\r\n\r\n.ubt-about-icon {\r\n\r\n    width: 48px;\r\n    height: 48px;\r\n\r\n    display: grid;\r\n    place-items: center;\r\n\r\n    margin-bottom: 20px;\r\n\r\n    background: #f0e4f3;\r\n\r\n    color: #4b075d;\r\n\r\n    border-radius: 50%;\r\n\r\n    font-size: 20px;\r\n\r\n}\r\n\r\n\r\n.ubt-about-value-card h3 {\r\n\r\n    margin: 0 0 10px;\r\n\r\n    color: #24152a;\r\n\r\n    font-family: Georgia, \"Times New Roman\", serif;\r\n\r\n    font-size: 24px;\r\n\r\n    font-weight: 500;\r\n\r\n    line-height: 1.2;\r\n\r\n}\r\n\r\n\r\n.ubt-about-value-card p {\r\n\r\n    margin: 0;\r\n\r\n    color: #675d6b;\r\n\r\n    font-family: Arial, sans-serif;\r\n\r\n    font-size: 14px;\r\n\r\n    line-height: 1.7;\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   VISUAL SECTION\r\n===================================================== *\/\r\n\r\n.ubt-about-visual {\r\n\r\n    padding: 90px 0;\r\n\r\n    background: #ffffff;\r\n\r\n}\r\n\r\n\r\n.ubt-about-visual-grid {\r\n\r\n    display: grid;\r\n\r\n    grid-template-columns: 1.1fr .9fr;\r\n\r\n    gap: 20px;\r\n\r\n}\r\n\r\n\r\n.ubt-about-visual-main img {\r\n\r\n    display: block;\r\n\r\n    width: 100%;\r\n\r\n    height: 640px;\r\n\r\n    object-fit: cover;\r\n\r\n    border-radius: 22px;\r\n\r\n}\r\n\r\n\r\n.ubt-about-visual-side {\r\n\r\n    display: grid;\r\n\r\n    grid-template-rows: 1fr 1fr;\r\n\r\n    gap: 20px;\r\n\r\n}\r\n\r\n\r\n.ubt-about-visual-content {\r\n\r\n    display: flex;\r\n\r\n    flex-direction: column;\r\n\r\n    justify-content: center;\r\n\r\n    padding: 35px;\r\n\r\n    background: #4b075d;\r\n\r\n    color: #ffffff;\r\n\r\n    border-radius: 22px;\r\n\r\n}\r\n\r\n\r\n.ubt-about-visual-content .ubt-about-eyebrow {\r\n\r\n    color: #ffffff;\r\n\r\n}\r\n\r\n\r\n.ubt-about-visual-content .ubt-about-eyebrow::before {\r\n\r\n    background: #ffffff;\r\n\r\n}\r\n\r\n\r\n.ubt-about-visual-content h3 {\r\n\r\n    margin: 12px 0;\r\n\r\n    color: #ffffff;\r\n\r\n    font-family: Georgia, \"Times New Roman\", serif;\r\n\r\n    font-size: 36px;\r\n\r\n    font-weight: 500;\r\n\r\n    line-height: 1.15;\r\n\r\n}\r\n\r\n\r\n.ubt-about-visual-content p {\r\n\r\n    margin: 0;\r\n\r\n    color: rgba(255,255,255,.82);\r\n\r\n    font-family: Arial, sans-serif;\r\n\r\n    font-size: 14px;\r\n\r\n    line-height: 1.7;\r\n\r\n}\r\n\r\n\r\n.ubt-about-visual-image img {\r\n\r\n    display: block;\r\n\r\n    width: 100%;\r\n\r\n    height: 100%;\r\n\r\n    object-fit: cover;\r\n\r\n    border-radius: 22px;\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   UBUTBETTER STANDARD\r\n===================================================== *\/\r\n\r\n.ubt-about-standard {\r\n\r\n    padding: 90px 0;\r\n\r\n    background: #e9f7fb;\r\n\r\n}\r\n\r\n\r\n.ubt-about-standard-grid {\r\n\r\n    display: grid;\r\n\r\n    grid-template-columns: repeat(4, 1fr);\r\n\r\n    gap: 18px;\r\n\r\n}\r\n\r\n\r\n.ubt-about-step {\r\n\r\n    padding: 28px 24px;\r\n\r\n    background: #ffffff;\r\n\r\n    border-radius: 20px;\r\n\r\n}\r\n\r\n\r\n.ubt-about-step > span {\r\n\r\n    display: block;\r\n\r\n    margin-bottom: 20px;\r\n\r\n    color: #4b075d;\r\n\r\n    font-family: Georgia, \"Times New Roman\", serif;\r\n\r\n    font-size: 34px;\r\n\r\n    line-height: 1;\r\n\r\n}\r\n\r\n\r\n.ubt-about-step h3 {\r\n\r\n    margin: 0 0 8px;\r\n\r\n    color: #24152a;\r\n\r\n    font-family: Arial, sans-serif;\r\n\r\n    font-size: 17px;\r\n\r\n}\r\n\r\n\r\n.ubt-about-step p {\r\n\r\n    margin: 0;\r\n\r\n    color: #675d6b;\r\n\r\n    font-family: Arial, sans-serif;\r\n\r\n    font-size: 13px;\r\n\r\n    line-height: 1.7;\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   FINAL CTA\r\n\r\n   IMPORTANT:\r\n   CTA ko 92% nahi rakha.\r\n   Full section background + inner content.\r\n===================================================== *\/\r\n\r\n.ubt-about-cta {\r\n\r\n    padding: 90px 0;\r\n\r\n    background: #ffffff;\r\n\r\n}\r\n\r\n\r\n.ubt-about-cta::before {\r\n\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n\r\n    left: 4%;\r\n\r\n    right: 4%;\r\n\r\n    top: 50%;\r\n\r\n    bottom: 0;\r\n\r\n    background: #4b075d;\r\n\r\n    border-radius: 28px;\r\n\r\n    transform: translateY(-50%);\r\n\r\n    z-index: 0;\r\n    height: 75%;\r\n\r\n}\r\n\r\n\r\n.ubt-about-cta-inner {\r\n\r\n    position: relative;\r\n\r\n    z-index: 2;\r\n\r\n    width: 92%;\r\n\r\n    max-width: 1160px;\r\n\r\n    margin: auto;\r\n\r\n    padding: 55px 65px;\r\n\r\n    color: #ffffff;\r\n\r\n}\r\n\r\n\r\n.ubt-about-cta-eyebrow {\r\n\r\n    display: block;\r\n\r\n    margin-bottom: 12px;\r\n\r\n    font-family: Arial, sans-serif;\r\n\r\n    font-size: 11px;\r\n\r\n    font-weight: 700;\r\n\r\n    letter-spacing: 2px;\r\n\r\n}\r\n\r\n\r\n.ubt-about-cta h2 {\r\n\r\n    max-width: 750px;\r\n\r\n    margin: 0 0 15px;\r\n\r\n    color: #ffffff;\r\n\r\n    font-family: Georgia, \"Times New Roman\", serif;\r\n\r\n    font-size: clamp(35px, 4vw, 52px);\r\n\r\n    font-weight: 500;\r\n\r\n    line-height: 1.1;\r\n\r\n}\r\n\r\n\r\n.ubt-about-cta p {\r\n\r\n    max-width: 650px;\r\n\r\n    margin: 0;\r\n\r\n    color: rgba(255,255,255,.82);\r\n\r\n    font-family: Arial, sans-serif;\r\n\r\n    font-size: 15px;\r\n\r\n}\r\n\r\n\r\n.ubt-about-cta-button {\r\n\r\n    display: inline-flex;\r\n\r\n    align-items: center;\r\n\r\n    justify-content: center;\r\n\r\n    min-height: 48px;\r\n\r\n    margin-top: 22px;\r\n\r\n    padding: 0 25px;\r\n\r\n    background: #ffffff;\r\n\r\n    color: #4b075d;\r\n\r\n    border-radius: 50px;\r\n\r\n    font-family: Arial, sans-serif;\r\n\r\n    font-size: 13px;\r\n\r\n    font-weight: 700;\r\n\r\n    text-decoration: none;\r\n\r\n    transition: .25s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-cta-button:hover {\r\n\r\n    background: #f3eaf5;\r\n\r\n    color: #4b075d;\r\n\r\n    transform: translateY(-2px);\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   TABLET\r\n===================================================== *\/\r\n\r\n@media (max-width: 900px) {\r\n\r\n    .ubt-about-stats-grid {\r\n\r\n        grid-template-columns: repeat(2, 1fr);\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-story-grid {\r\n\r\n        grid-template-columns: 1fr;\r\n\r\n        gap: 45px;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-values-grid {\r\n\r\n        grid-template-columns: 1fr 1fr;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-visual-grid {\r\n\r\n        grid-template-columns: 1fr;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-visual-main img {\r\n\r\n        height: 450px;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-standard-grid {\r\n\r\n        grid-template-columns: 1fr 1fr;\r\n\r\n    }\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   MOBILE\r\n===================================================== *\/\r\n\r\n@media (max-width: 600px) {\r\n\r\n    .ubt-about-container {\r\n\r\n        width: 90%;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-stats {\r\n\r\n        padding: 30px 0;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-stat strong {\r\n\r\n        font-size: 24px;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-stat span {\r\n\r\n        font-size: 9px;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-story,\r\n    .ubt-about-values,\r\n    .ubt-about-visual,\r\n    .ubt-about-standard {\r\n\r\n        padding: 65px 0;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-story-image img {\r\n\r\n        height: 340px;\r\n\r\n        border-radius: 20px;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-story-content h2 {\r\n\r\n        font-size: 39px;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-values-grid {\r\n\r\n        grid-template-columns: 1fr;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-visual-main img {\r\n\r\n        height: 320px;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-visual-side {\r\n\r\n        grid-template-rows: auto;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-visual-content {\r\n\r\n        min-height: 300px;\r\n\r\n        padding: 30px;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-visual-image img {\r\n\r\n        height: 320px;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-standard-grid {\r\n\r\n        grid-template-columns: 1fr;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-cta {\r\n\r\n        padding: 65px 0;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-cta::before {\r\n\r\n        left: 5%;\r\n\r\n        right: 5%;\r\n\r\n        border-radius: 22px;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-cta-inner {\r\n\r\n        width: 90%;\r\n\r\n        padding: 42px 25px;\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-cta h2 {\r\n\r\n        font-size: 36px;\r\n\r\n    }\r\n\r\n}\r\n\r\n\/* =========================================================\r\n   UBUTBETTER ABOUT PAGE\r\n   PREMIUM ANIMATIONS + HOVER EFFECTS\r\n   Elementor Safe \/ Scoped\r\n========================================================= *\/\r\n\r\n\r\n\/* =========================================================\r\n   GLOBAL ABOUT PAGE MOTION\r\n========================================================= *\/\r\n\r\n.ubt-about-story-image,\r\n.ubt-about-value-card,\r\n.ubt-about-step,\r\n.ubt-about-visual-main,\r\n.ubt-about-visual-image,\r\n.ubt-about-visual-content,\r\n.ubt-about-stat,\r\n.ubt-about-cta {\r\n    will-change: transform;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   STATS\r\n========================================================= *\/\r\n\r\n.ubt-about-stat {\r\n    position: relative;\r\n\r\n    transition:\r\n        transform .35s ease,\r\n        opacity .35s ease;\r\n}\r\n\r\n\r\n.ubt-about-stat:hover {\r\n    transform: translateY(-5px);\r\n}\r\n\r\n\r\n.ubt-about-stat strong {\r\n    transition:\r\n        transform .35s ease,\r\n        letter-spacing .35s ease;\r\n}\r\n\r\n\r\n.ubt-about-stat:hover strong {\r\n    transform: scale(1.08);\r\n\r\n    letter-spacing: .5px;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   STORY IMAGE\r\n========================================================= *\/\r\n\r\n.ubt-about-story-image {\r\n    overflow: visible;\r\n}\r\n\r\n\r\n.ubt-about-story-image img {\r\n    transition:\r\n        transform .7s cubic-bezier(.2,.8,.2,1),\r\n        box-shadow .5s ease,\r\n        filter .5s ease;\r\n}\r\n\r\n\r\n.ubt-about-story-image:hover img {\r\n\r\n    transform:\r\n        scale(1.025)\r\n        translateY(-5px);\r\n\r\n    box-shadow:\r\n        0 25px 55px rgba(75,7,93,.16);\r\n\r\n    filter: brightness(1.02);\r\n}\r\n\r\n\r\n\/* Decorative corner *\/\r\n\r\n.ubt-about-story-image::after {\r\n\r\n    transition:\r\n        transform .5s ease,\r\n        width .5s ease,\r\n        height .5s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-story-image:hover::after {\r\n\r\n    transform:\r\n        translate(7px,7px);\r\n\r\n    width: 47%;\r\n    height: 47%;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   STORY CONTENT\r\n========================================================= *\/\r\n\r\n.ubt-about-story-content h2 {\r\n\r\n    transition:\r\n        transform .45s ease,\r\n        letter-spacing .45s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-story-content:hover h2 {\r\n\r\n    transform: translateX(4px);\r\n\r\n    letter-spacing: -.8px;\r\n\r\n}\r\n\r\n\r\n.ubt-about-story-content p {\r\n\r\n    transition:\r\n        transform .35s ease,\r\n        color .35s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-story-content p:hover {\r\n\r\n    transform: translateX(3px);\r\n\r\n    color: #4b075d;\r\n\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   EYEBROWS\r\n========================================================= *\/\r\n\r\n.ubt-about-eyebrow {\r\n\r\n    transition:\r\n        letter-spacing .4s ease,\r\n        transform .4s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-eyebrow:hover {\r\n\r\n    letter-spacing: 2.8px;\r\n\r\n    transform: translateX(3px);\r\n\r\n}\r\n\r\n\r\n.ubt-about-eyebrow::before {\r\n\r\n    transition:\r\n        width .4s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-eyebrow:hover::before {\r\n\r\n    width: 42px;\r\n\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   VALUE CARDS\r\n========================================================= *\/\r\n\r\n.ubt-about-value-card {\r\n\r\n    position: relative;\r\n\r\n    overflow: hidden;\r\n\r\n    transition:\r\n        transform .4s cubic-bezier(.2,.8,.2,1),\r\n        box-shadow .4s ease,\r\n        border-color .4s ease;\r\n\r\n}\r\n\r\n\r\n\/* Top animated line *\/\r\n\r\n.ubt-about-value-card::before {\r\n\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n\r\n    left: 0;\r\n    top: 0;\r\n\r\n    width: 0;\r\n    height: 3px;\r\n\r\n    background: #4b075d;\r\n\r\n    transition:\r\n        width .45s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-value-card:hover::before {\r\n\r\n    width: 100%;\r\n\r\n}\r\n\r\n\r\n.ubt-about-value-card:hover {\r\n\r\n    transform:\r\n        translateY(-9px);\r\n\r\n    box-shadow:\r\n        0 22px 45px rgba(75,7,93,.13);\r\n\r\n    border-color:\r\n        rgba(75,7,93,.18);\r\n\r\n}\r\n\r\n\r\n\/* Icon *\/\r\n\r\n.ubt-about-icon {\r\n\r\n    transition:\r\n        transform .45s cubic-bezier(.2,.8,.2,1),\r\n        background .35s ease,\r\n        color .35s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-value-card:hover .ubt-about-icon {\r\n\r\n    transform:\r\n        rotate(8deg)\r\n        scale(1.12);\r\n\r\n    background: #4b075d;\r\n\r\n    color: #ffffff;\r\n\r\n}\r\n\r\n\r\n\/* Card heading *\/\r\n\r\n.ubt-about-value-card h3 {\r\n\r\n    transition:\r\n        color .3s ease,\r\n        transform .3s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-value-card:hover h3 {\r\n\r\n    color: #4b075d;\r\n\r\n    transform: translateX(3px);\r\n\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   VISUAL SECTION\r\n========================================================= *\/\r\n\r\n\r\n\/* Main image *\/\r\n\r\n.ubt-about-visual-main {\r\n\r\n    overflow: hidden;\r\n\r\n    border-radius: 22px;\r\n\r\n}\r\n\r\n\r\n.ubt-about-visual-main img {\r\n\r\n    transition:\r\n        transform .8s cubic-bezier(.2,.8,.2,1),\r\n        filter .5s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-visual-main:hover img {\r\n\r\n    transform:\r\n        scale(1.045);\r\n\r\n    filter:\r\n        brightness(1.04);\r\n\r\n}\r\n\r\n\r\n\/* Side image *\/\r\n\r\n.ubt-about-visual-image {\r\n\r\n    overflow: hidden;\r\n\r\n    border-radius: 22px;\r\n\r\n}\r\n\r\n\r\n.ubt-about-visual-image img {\r\n\r\n    transition:\r\n        transform .7s cubic-bezier(.2,.8,.2,1),\r\n        filter .5s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-visual-image:hover img {\r\n\r\n    transform:\r\n        scale(1.06);\r\n\r\n    filter:\r\n        brightness(1.04);\r\n\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   PURPLE VISUAL CARD\r\n========================================================= *\/\r\n\r\n.ubt-about-visual-content {\r\n\r\n    position: relative;\r\n\r\n    overflow: hidden;\r\n\r\n    transition:\r\n        transform .4s ease,\r\n        box-shadow .4s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-visual-content::after {\r\n\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n\r\n    width: 180px;\r\n    height: 180px;\r\n\r\n    right: -90px;\r\n    bottom: -90px;\r\n\r\n    border:\r\n        1px solid rgba(255,255,255,.18);\r\n\r\n    border-radius: 50%;\r\n\r\n    transition:\r\n        transform .7s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-visual-content:hover {\r\n\r\n    transform:\r\n        translateY(-6px);\r\n\r\n    box-shadow:\r\n        0 20px 45px rgba(75,7,93,.20);\r\n\r\n}\r\n\r\n\r\n.ubt-about-visual-content:hover::after {\r\n\r\n    transform:\r\n        scale(1.5);\r\n\r\n}\r\n\r\n\r\n\/* Visual heading *\/\r\n\r\n.ubt-about-visual-content h3 {\r\n\r\n    transition:\r\n        transform .4s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-visual-content:hover h3 {\r\n\r\n    transform:\r\n        translateX(4px);\r\n\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   STANDARD \/ FOUR STEPS\r\n========================================================= *\/\r\n\r\n.ubt-about-step {\r\n\r\n    position: relative;\r\n\r\n    overflow: hidden;\r\n\r\n    transition:\r\n        transform .4s cubic-bezier(.2,.8,.2,1),\r\n        box-shadow .4s ease;\r\n\r\n}\r\n\r\n\r\n\/* Animated background number *\/\r\n\r\n.ubt-about-step::after {\r\n\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n\r\n    right: -25px;\r\n    bottom: -40px;\r\n\r\n    width: 120px;\r\n    height: 120px;\r\n\r\n    border-radius: 50%;\r\n\r\n    background:\r\n        rgba(75,7,93,.045);\r\n\r\n    transform:\r\n        scale(0);\r\n\r\n    transition:\r\n        transform .55s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-step:hover::after {\r\n\r\n    transform:\r\n        scale(1);\r\n\r\n}\r\n\r\n\r\n.ubt-about-step:hover {\r\n\r\n    transform:\r\n        translateY(-7px);\r\n\r\n    box-shadow:\r\n        0 18px 35px rgba(75,7,93,.11);\r\n\r\n}\r\n\r\n\r\n\/* Number *\/\r\n\r\n.ubt-about-step > span {\r\n\r\n    position: relative;\r\n\r\n    z-index: 2;\r\n\r\n    transition:\r\n        transform .4s ease,\r\n        color .3s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-step:hover > span {\r\n\r\n    transform:\r\n        translateX(5px)\r\n        scale(1.08);\r\n\r\n    color: #65147a;\r\n\r\n}\r\n\r\n\r\n\/* Step heading *\/\r\n\r\n.ubt-about-step h3 {\r\n\r\n    position: relative;\r\n\r\n    z-index: 2;\r\n\r\n    transition:\r\n        color .3s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-step:hover h3 {\r\n\r\n    color: #4b075d;\r\n\r\n}\r\n\r\n\r\n\/* Step paragraph *\/\r\n\r\n.ubt-about-step p {\r\n\r\n    position: relative;\r\n\r\n    z-index: 2;\r\n\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   CTA\r\n========================================================= *\/\r\n\r\n.ubt-about-cta {\r\n\r\n    transition:\r\n        transform .4s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-cta-inner {\r\n\r\n    transition:\r\n        transform .4s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-cta:hover .ubt-about-cta-inner {\r\n\r\n    transform:\r\n        translateY(-3px);\r\n\r\n}\r\n\r\n\r\n\/* CTA heading *\/\r\n\r\n.ubt-about-cta h2 {\r\n\r\n    transition:\r\n        transform .45s ease,\r\n        letter-spacing .45s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-cta:hover h2 {\r\n\r\n    transform:\r\n        translateX(4px);\r\n\r\n    letter-spacing:\r\n        -.5px;\r\n\r\n}\r\n\r\n\r\n\/* CTA button *\/\r\n\r\n.ubt-about-cta-button {\r\n\r\n    position: relative;\r\n\r\n    overflow: hidden;\r\n\r\n    transition:\r\n        transform .3s ease,\r\n        box-shadow .3s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-cta-button::before {\r\n\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n\r\n    top: 0;\r\n    left: -120%;\r\n\r\n    width: 80%;\r\n    height: 100%;\r\n\r\n    background:\r\n        linear-gradient(\r\n            90deg,\r\n            transparent,\r\n            rgba(75,7,93,.12),\r\n            transparent\r\n        );\r\n\r\n    transform:\r\n        skewX(-20deg);\r\n\r\n    transition:\r\n        left .65s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-cta-button:hover::before {\r\n\r\n    left: 140%;\r\n\r\n}\r\n\r\n\r\n.ubt-about-cta-button:hover {\r\n\r\n    transform:\r\n        translateY(-4px);\r\n\r\n    box-shadow:\r\n        0 12px 28px rgba(0,0,0,.16);\r\n\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   SECTION HEADINGS\r\n========================================================= *\/\r\n\r\n.ubt-about-section-heading h2 {\r\n\r\n    transition:\r\n        transform .45s ease,\r\n        letter-spacing .45s ease;\r\n\r\n}\r\n\r\n\r\n.ubt-about-section-heading:hover h2 {\r\n\r\n    transform:\r\n        translateY(-2px);\r\n\r\n    letter-spacing:\r\n        -.6px;\r\n\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   IMAGE HOVER - UNIVERSAL\r\n========================================================= *\/\r\n\r\n.ubt-about-story-image img,\r\n.ubt-about-visual-main img,\r\n.ubt-about-visual-image img {\r\n\r\n    cursor: pointer;\r\n\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   PAGE LOAD ANIMATION\r\n========================================================= *\/\r\n\r\n@keyframes ubtAboutFadeUp {\r\n\r\n    from {\r\n\r\n        opacity: 0;\r\n\r\n        transform:\r\n            translateY(25px);\r\n\r\n    }\r\n\r\n    to {\r\n\r\n        opacity: 1;\r\n\r\n        transform:\r\n            translateY(0);\r\n\r\n    }\r\n\r\n}\r\n\r\n\r\n.ubt-about-story-content,\r\n.ubt-about-section-heading,\r\n.ubt-about-values-grid,\r\n.ubt-about-visual-grid,\r\n.ubt-about-standard-grid,\r\n.ubt-about-cta-inner {\r\n\r\n    animation:\r\n        ubtAboutFadeUp\r\n        .8s\r\n        cubic-bezier(.2,.8,.2,1)\r\n        both;\r\n\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   MOBILE\r\n========================================================= *\/\r\n\r\n@media (max-width: 600px) {\r\n\r\n    .ubt-about-value-card:hover {\r\n\r\n        transform:\r\n            translateY(-4px);\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-step:hover {\r\n\r\n        transform:\r\n            translateY(-4px);\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-story-image:hover img {\r\n\r\n        transform:\r\n            scale(1.015)\r\n            translateY(-2px);\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-visual-main:hover img,\r\n    .ubt-about-visual-image:hover img {\r\n\r\n        transform:\r\n            scale(1.025);\r\n\r\n    }\r\n\r\n\r\n    .ubt-about-story-content h2:hover,\r\n    .ubt-about-section-heading h2:hover,\r\n    .ubt-about-cta h2:hover {\r\n\r\n        transform: none;\r\n\r\n    }\r\n\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   ACCESSIBILITY\r\n========================================================= *\/\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n\r\n    .ubt-about-story-image img,\r\n    .ubt-about-value-card,\r\n    .ubt-about-step,\r\n    .ubt-about-visual-main img,\r\n    .ubt-about-visual-image img,\r\n    .ubt-about-visual-content,\r\n    .ubt-about-cta-inner,\r\n    .ubt-about-stat,\r\n    .ubt-about-section-heading h2 {\r\n\r\n        transition: none !important;\r\n\r\n        animation: none !important;\r\n\r\n    }\r\n\r\n}\r\n\r\n<\/style>\r\n\r\n<!-- =========================================\r\n     ABOUT PAGE - REST OF PAGE\r\n========================================= -->\r\n\r\n<!--<section class=\"ubt-about-stats\">-->\r\n\r\n<!--    <div class=\"ubt-about-container\">-->\r\n\r\n<!--        <div class=\"ubt-about-stats-grid\">-->\r\n\r\n<!--            <div class=\"ubt-about-stat\">-->\r\n<!--                <strong>100%<\/strong>-->\r\n<!--                <span>Thoughtfully Selected<\/span>-->\r\n<!--            <\/div>-->\r\n\r\n<!--            <div class=\"ubt-about-stat\">-->\r\n<!--                <strong>30-Day<\/strong>-->\r\n<!--                <span>Money-Back Guarantee<\/span>-->\r\n<!--            <\/div>-->\r\n\r\n<!--            <div class=\"ubt-about-stat\">-->\r\n<!--                <strong>Worldwide<\/strong>-->\r\n<!--                <span>Shipping<\/span>-->\r\n<!--            <\/div>-->\r\n\r\n<!--        <\/div>-->\r\n\r\n<!--    <\/div>-->\r\n\r\n<!--<\/section>-->\r\n\r\n\r\n<!-- STORY -->\r\n\r\n<section class=\"ubt-about-story\">\r\n\r\n    <div class=\"ubt-about-container ubt-about-story-grid\">\r\n\r\n        <div class=\"ubt-about-story-image\">\r\n            <img decoding=\"async\"\r\n                src=\"https:\/\/sampletestlinks.com\/jill\/wp-content\/uploads\/2026\/08\/H4ce9c06f7483438b8d299aa926b892daM_4d99046d-d056-4ced-98cb-bd9de4cb96c3.webp\"\r\n                alt=\"UButBetter travel lifestyle\"\r\n            >\r\n        <\/div>\r\n\r\n        <div class=\"ubt-about-story-content\">\r\n\r\n            <span class=\"ubt-about-eyebrow\">\r\n                WHY UBUTBETTER\r\n            <\/span>\r\n\r\n            <h2>\r\n                We solve the small travel problems.\r\n            <\/h2>\r\n\r\n            <p>\r\n                Travel should feel exciting \u2014 not like a series of tiny\r\n                inconveniences. From keeping your essentials organized to\r\n                making it easier to move through a busy airport, UButBetter\r\n                is built around those moments where a simple, well-designed\r\n                item can make a real difference.\r\n            <\/p>\r\n\r\n            <p>\r\n                Our collection brings together travel gear, organizers,\r\n                accessories, comfort essentials and everyday pieces that\r\n                are useful on the road and just as useful at home.\r\n            <\/p>\r\n\r\n            <p>\r\n                We keep the focus simple: products should earn their place\r\n                in your bag. If it does not make your trip easier, calmer,\r\n                more organized or more enjoyable, it does not belong in\r\n                the UButBetter experience.\r\n            <\/p>\r\n\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n<!-- VALUES -->\r\n\r\n<section class=\"ubt-about-values\" id=\"our-values\">\r\n\r\n    <div class=\"ubt-about-container\">\r\n\r\n        <div class=\"ubt-about-section-heading\">\r\n\r\n            <span class=\"ubt-about-eyebrow\">\r\n                OUR PHILOSOPHY\r\n            <\/span>\r\n\r\n            <h2>\r\n                Better travel starts with better details.\r\n            <\/h2>\r\n\r\n            <p>\r\n                Every piece in the UButBetter world is chosen with the same\r\n                question in mind: will this make someone's journey a little better?\r\n            <\/p>\r\n\r\n        <\/div>\r\n\r\n\r\n        <div class=\"ubt-about-values-grid\">\r\n\r\n            <div class=\"ubt-about-value-card\">\r\n\r\n                <div class=\"ubt-about-icon\">\u2726<\/div>\r\n\r\n                <h3>\r\n                    Thoughtful Selection\r\n                <\/h3>\r\n\r\n                <p>\r\n                    We look beyond trends and focus on products that are\r\n                    genuinely useful, practical and enjoyable to use.\r\n                <\/p>\r\n\r\n            <\/div>\r\n\r\n\r\n            <div class=\"ubt-about-value-card\">\r\n\r\n                <div class=\"ubt-about-icon\">\u2661<\/div>\r\n\r\n                <h3>\r\n                    Made for Real Life\r\n                <\/h3>\r\n\r\n                <p>\r\n                    From airport days to weekend escapes, our essentials\r\n                    are designed around the way people actually travel.\r\n                <\/p>\r\n\r\n            <\/div>\r\n\r\n\r\n            <div class=\"ubt-about-value-card\">\r\n\r\n                <div class=\"ubt-about-icon\">\u2197<\/div>\r\n\r\n                <h3>\r\n                    Small Upgrades, Big Difference\r\n                <\/h3>\r\n\r\n                <p>\r\n                    Better organization, easier packing and a little more\r\n                    comfort can completely change the feel of a trip.\r\n                <\/p>\r\n\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n<!-- VISUAL STORY -->\r\n\r\n<section class=\"ubt-about-visual\">\r\n\r\n    <div class=\"ubt-about-container ubt-about-visual-grid\">\r\n\r\n        <div class=\"ubt-about-visual-main\">\r\n\r\n            <img decoding=\"async\"\r\n                src=\"https:\/\/sampletestlinks.com\/jill\/wp-content\/uploads\/2026\/09\/ChatGPT-Image-Sep-30-2026-01_32_37-AM.png\"\r\n                alt=\"UButBetter travel essentials\"\r\n            >\r\n\r\n        <\/div>\r\n\r\n\r\n        <div class=\"ubt-about-visual-side\">\r\n\r\n            <div class=\"ubt-about-visual-content\">\r\n\r\n                <span class=\"ubt-about-eyebrow\">\r\n                    PACK BETTER\r\n                <\/span>\r\n\r\n                <h3>\r\n                    Less chaos.<br>\r\n                    More adventure.\r\n                <\/h3>\r\n\r\n                <p>\r\n                    Build a travel setup around what you actually need \u2014\r\n                    nothing more, nothing less.\r\n                <\/p>\r\n\r\n            <\/div>\r\n\r\n\r\n            <div class=\"ubt-about-visual-image\">\r\n\r\n                <img decoding=\"async\"\r\n                    src=\"https:\/\/sampletestlinks.com\/jill\/wp-content\/uploads\/2026\/08\/H4ce9c06f7483438b8d299aa926b892daM_4d99046d-d056-4ced-98cb-bd9de4cb96c3.webp\"\r\n                    alt=\"UButBetter accessories\"\r\n                >\r\n\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n<!-- STANDARD -->\r\n\r\n<section class=\"ubt-about-standard\">\r\n\r\n    <div class=\"ubt-about-container\">\r\n\r\n        <div class=\"ubt-about-section-heading\">\r\n\r\n            <span class=\"ubt-about-eyebrow\">\r\n                THE UBUTBETTER STANDARD\r\n            <\/span>\r\n\r\n            <h2>\r\n                Choose better. Pack lighter. Go farther.\r\n            <\/h2>\r\n\r\n        <\/div>\r\n\r\n\r\n        <div class=\"ubt-about-standard-grid\">\r\n\r\n            <div class=\"ubt-about-step\">\r\n                <span>01<\/span>\r\n                <h3>Spot the Problem<\/h3>\r\n                <p>\r\n                    We start with the everyday annoyances that can make\r\n                    travel harder than it needs to be.\r\n                <\/p>\r\n            <\/div>\r\n\r\n\r\n            <div class=\"ubt-about-step\">\r\n                <span>02<\/span>\r\n                <h3>Find the Better Answer<\/h3>\r\n                <p>\r\n                    We search for practical products with thoughtful\r\n                    details and real everyday value.\r\n                <\/p>\r\n            <\/div>\r\n\r\n\r\n            <div class=\"ubt-about-step\">\r\n                <span>03<\/span>\r\n                <h3>Keep It Useful<\/h3>\r\n                <p>\r\n                    Great design should make sense in your hand,\r\n                    your suitcase and your routine.\r\n                <\/p>\r\n            <\/div>\r\n\r\n\r\n            <div class=\"ubt-about-step\">\r\n                <span>04<\/span>\r\n                <h3>Make Travel Feel Better<\/h3>\r\n                <p>\r\n                    The goal is simple: fewer frustrations and more\r\n                    room to enjoy the journey.\r\n                <\/p>\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n<!-- FINAL CTA -->\r\n\r\n<section class=\"ubt-about-cta\">\r\n\r\n    <div class=\"ubt-about-cta-inner\">\r\n\r\n        <span class=\"ubt-about-cta-eyebrow\">\r\n            READY FOR YOUR NEXT TRIP?\r\n        <\/span>\r\n\r\n        <h2>\r\n            Find the little upgrades that make a big difference.\r\n        <\/h2>\r\n\r\n        <p>\r\n            Explore UButBetter's collection of travel essentials and\r\n            build a setup that works for the way you move.\r\n        <\/p>\r\n\r\n        <a href=\"\/jill\/shop\/\" class=\"ubt-about-cta-button\">\r\n            Shop UButBetter\r\n        <\/a>\r\n\r\n    <\/div>\r\n\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>OUR STORY Travel made exceptional. Better, by design. At UButBetter, we believe the little things can change the way a journey feels. We thoughtfully select practical, beautiful travel essentials that help you pack smarter, stay organized and enjoy the moments that matter. Explore the Collection Made for better journeys Practical \u2022 Thoughtful \u2022 Beautiful WHY [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-2442","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/sampletestlinks.com\/jill\/wp-json\/wp\/v2\/pages\/2442","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sampletestlinks.com\/jill\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sampletestlinks.com\/jill\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sampletestlinks.com\/jill\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sampletestlinks.com\/jill\/wp-json\/wp\/v2\/comments?post=2442"}],"version-history":[{"count":67,"href":"https:\/\/sampletestlinks.com\/jill\/wp-json\/wp\/v2\/pages\/2442\/revisions"}],"predecessor-version":[{"id":3095,"href":"https:\/\/sampletestlinks.com\/jill\/wp-json\/wp\/v2\/pages\/2442\/revisions\/3095"}],"wp:attachment":[{"href":"https:\/\/sampletestlinks.com\/jill\/wp-json\/wp\/v2\/media?parent=2442"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}