{"id":1609,"date":"2026-10-09T10:24:59","date_gmt":"2026-10-09T10:24:59","guid":{"rendered":"https:\/\/richierich.com.my\/staging\/?page_id=1609"},"modified":"2026-10-16T07:00:36","modified_gmt":"2026-10-16T07:00:36","slug":"graphic-design","status":"publish","type":"page","link":"https:\/\/richierich.com.my\/staging\/graphic-design\/","title":{"rendered":"Graphic Design"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1609\" class=\"elementor elementor-1609\">\n\t\t\t\t  <div class=\"elementor-element elementor-element-8738c43 e-con-full e-flex e-con e-parent\" data-id=\"8738c43\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8102d64 elementor-widget elementor-widget-html\" data-id=\"8102d64\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\nbody,\n#page,\n#content,\n.site-content,\n.ast-separate-container {\n    background-color: var(--rr-bg, #050505) !important;\n}\n\n.site-content > .ast-container {\n    max-width: 100% !important;\n    width: 100% !important;\n    padding-left: 0 !important;\n    padding-right: 0 !important;\n    display: block !important;\n}\n\n#primary {\n    width: 100% !important;\n    max-width: 100% !important;\n    margin: 0 !important;\n    padding: 0 !important;\n}\n\n\/* HERO *\/\n.rr-pk-hero {\n    background-color: var(--rr-bg, #050505);\n    padding: 130px 5vw 90px;\n    min-height: 100vh;\n    box-sizing: border-box;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n}\n\n.rr-pk-eyebrow {\n    font-family: 'Montserrat', sans-serif;\n    font-weight: 700;\n    font-size: 0.85rem;\n    letter-spacing: 0.25em;\n    text-transform: uppercase;\n    color: var(--rr-accent3, #ccff00);\n    margin: 0 0 1.5rem;\n}\n\n.rr-pk-title {\n    margin: 0 0 2rem;\n    font-family: 'Anton', sans-serif !important;\n    text-transform: uppercase;\n    font-size: clamp(3rem, min(9vw, 13vh), 10rem);\n    line-height: 0.95;\n    font-weight: 400;\n    color: var(--rr-text, #f0f0f0) !important;\n}\n\n.rr-pk-title .rr-line {\n    display: block;\n    overflow: hidden;\n}\n\n.rr-pk-title .rr-line > span {\n    display: inline-block;\n}\n\n.rr-pk-title .rr-accent {\n    color: var(--rr-accent3, #ccff00);\n}\n\n.rr-pk-sub {\n    font-family: 'Inter', sans-serif;\n    font-size: clamp(1rem, 1.6vw, 1.4rem);\n    font-weight: 300;\n    line-height: 1.6;\n    max-width: 640px;\n    color: var(--rr-text, #f0f0f0);\n    opacity: 0.75;\n    margin: 0 0 3rem;\n}\n\n.rr-pk-hero-btns {\n    display: flex;\n    flex-wrap: wrap;\n    gap: 1rem;\n}\n\n.rr-pk-hbtn {\n    display: inline-block;\n    padding: 20px 44px;\n    border-radius: 100px;\n    border: 1px solid rgba(255, 255, 255, 0.3);\n    font-family: 'Montserrat', sans-serif;\n    font-weight: 700;\n    font-size: 0.95rem;\n    letter-spacing: 0.1em;\n    text-transform: uppercase;\n    text-decoration: none;\n    color: var(--rr-text, #f0f0f0);\n    transition: background-color 0.3s, color 0.3s, border-color 0.3s;\n}\n\n.rr-pk-hbtn:hover {\n    border-color: var(--rr-accent3, #ccff00);\n    color: var(--rr-accent3, #ccff00);\n}\n\n.rr-pk-hbtn.rr-primary {\n    background-color: var(--rr-accent3, #ccff00);\n    border-color: var(--rr-accent3, #ccff00);\n    color: var(--rr-bg, #050505);\n}\n\n.rr-pk-hbtn.rr-primary:hover {\n    background-color: transparent;\n    color: var(--rr-accent3, #ccff00);\n}\n\n.rr-pk-hero-inner {\n    will-change: filter, opacity;\n}\n\n\/* Lets the services section scroll OVER the pinned hero *\/\n.rr-gd-services {\n    position: relative;\n    z-index: 2;\n    background-color: transparent !important;\n}\n\n\/* Frosted cards (already styled in the services widget), so the blurred hero text doesn't show through them *\/\n.rr-gd-card {\n    -webkit-backdrop-filter: blur(18px);\n    backdrop-filter: blur(18px);\n}\n<\/style>\n\n<section class=\"rr-pk-hero\">\n  <div class=\"rr-pk-hero-inner\">\n    <p class=\"rr-pk-eyebrow\">Graphic Design<\/p>\n\n    <h1 class=\"rr-pk-title\">\n        <span class=\"rr-line\"><span>Graphic design<\/span><\/span>\n        <span class=\"rr-line\"><span>that makes people<\/span><\/span>\n        <span class=\"rr-line\"><span class=\"rr-accent\">stop scrolling.<\/span><\/span>\n    <\/h1>\n\n    <p class=\"rr-pk-sub\">From logos to social media creatives, we design visuals that make your brand look sharp and get remembered.<\/p>\n\n    <div class=\"rr-pk-hero-btns\">\n        <a class=\"rr-pk-hbtn rr-primary rr-hoverable\" href=\"#services\">View services<\/a>\n        <a class=\"rr-pk-hbtn rr-hoverable\" href=\"\/staging\/contact-us\/\">Talk to us<\/a>\n    <\/div>\n  <\/div>\n<\/section>\n\n<script>\n(function () {\n    function rrInitPkHero() {\n        if (typeof gsap === 'undefined' || typeof ScrollTrigger === 'undefined') {\n            setTimeout(rrInitPkHero, 200);\n            return;\n        }\n        if (typeof window.rrBindHoverables === 'function') window.rrBindHoverables();\n        if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) return;\n\n        gsap.from('.rr-pk-eyebrow', { opacity: 0, y: 20, duration: 0.8, ease: 'power3.out', delay: 0.2 });\n        gsap.from('.rr-pk-title .rr-line > span', {\n            yPercent: 110,\n            duration: 1.2,\n            ease: 'power4.out',\n            stagger: 0.12,\n            delay: 0.35\n        });\n        gsap.from('.rr-pk-sub', { opacity: 0, y: 30, duration: 1, ease: 'power3.out', delay: 1 });\n        gsap.from('.rr-pk-hero-btns', { opacity: 0, y: 30, duration: 1, ease: 'power3.out', delay: 1.2 });\n\n        \/\/ ---- Scroll effect: blur + dim, pinned behind the services section ----\n        var hero = document.querySelector('.rr-pk-hero');\n        var inner = document.querySelector('.rr-pk-hero-inner');\n        if (!hero || !inner) return;\n\n        \/\/ Phase 1: blur and dim as you start scrolling\n        gsap.fromTo(inner,\n            { filter: 'blur(0px)', opacity: 1 },\n            {\n                filter: 'blur(16px)',\n                opacity: 0.3,\n                ease: 'none',\n                scrollTrigger: {\n                    trigger: hero,\n                    start: 'top top',\n                    end: function () { return '+=' + (window.innerHeight * 0.7); },\n                    scrub: true,\n                    invalidateOnRefresh: true,\n                    \/\/ buttons stop being clickable once they're blurred out\n                    onUpdate: function (self) {\n                        inner.style.pointerEvents = self.progress > 0.3 ? 'none' : '';\n                    }\n                }\n            }\n        );\n\n        \/\/ Phase 2: stay pinned until the services section ends, then fade out\n        var services = document.querySelector('.rr-gd-services');\n        if (services) {\n            ScrollTrigger.create({\n                trigger: hero,\n                start: 'top top',\n                endTrigger: services,\n                end: 'bottom bottom',\n                pin: true,\n                pinSpacing: false\n            });\n\n            gsap.fromTo(inner,\n                { opacity: 0.3 },\n                {\n                    opacity: 0,\n                    ease: 'none',\n                    immediateRender: false,\n                    scrollTrigger: {\n                        trigger: services,\n                        start: 'bottom 150%',\n                        end: 'bottom 100%',\n                        scrub: true\n                    }\n                }\n            );\n        }\n    }\n    rrInitPkHero();\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-18b4b6b e-con-full e-flex e-con e-parent\" data-id=\"18b4b6b\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-98e625b elementor-widget elementor-widget-html\" data-id=\"98e625b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\n.rr-gd-services {\n    position: relative;\n    z-index: 2;\n    background-color: transparent;\n    padding: 8vh 5vw 12vh;\n}\n\n.rr-gd-head {\n    max-width: 1300px;\n    margin: 0 auto 7vh;\n}\n\n.rr-gd-label {\n    font-family: 'Montserrat', sans-serif;\n    font-weight: 700;\n    font-size: 0.85rem;\n    letter-spacing: 0.25em;\n    text-transform: uppercase;\n    color: var(--rr-accent3, #ccff00);\n    margin: 0 0 1rem;\n}\n\n.rr-gd-heading {\n    margin: 0;\n    font-family: 'Anton', sans-serif !important;\n    font-weight: 400;\n    text-transform: uppercase;\n    font-size: clamp(2.5rem, 6vw, 6rem);\n    line-height: 1;\n    color: var(--rr-text, #f0f0f0) !important;\n}\n\n.rr-gd-grid {\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 2vw;\n    max-width: 1300px;\n    margin: 0 auto;\n}\n\n.rr-gd-card {\n    padding: 2.4rem 2rem 2.6rem;\n    background: rgba(255, 255, 255, 0.04);\n    border: 1px solid rgba(255, 255, 255, 0.12);\n    border-radius: 18px;\n    -webkit-backdrop-filter: blur(18px);\n    backdrop-filter: blur(18px);\n    transition: transform 0.4s ease, border-color 0.4s ease, background 0.4s ease;\n}\n\n.rr-gd-card:hover {\n    transform: translateY(-8px);\n    border-color: var(--rr-accent3, #ccff00);\n    background: rgba(255, 255, 255, 0.07);\n}\n\n.rr-gd-num {\n    font-family: 'Anton', sans-serif;\n    font-size: clamp(3rem, 5vw, 5rem);\n    line-height: 1;\n    color: transparent;\n    -webkit-text-stroke: 2px rgba(255, 255, 255, 0.35);\n    margin-bottom: 1.2rem;\n    transition: -webkit-text-stroke-color 0.4s ease;\n}\n\n.rr-gd-card:hover .rr-gd-num {\n    -webkit-text-stroke-color: var(--rr-accent3, #ccff00);\n}\n\n.rr-gd-card h3 {\n    margin: 0 0 0.8rem;\n    font-family: 'Anton', sans-serif !important;\n    font-weight: 400;\n    text-transform: uppercase;\n    font-size: clamp(1.5rem, 2.2vw, 2.2rem);\n    line-height: 1.1;\n    color: var(--rr-text, #f0f0f0) !important;\n}\n\n.rr-gd-card p {\n    margin: 0;\n    font-family: 'Inter', sans-serif;\n    font-size: 0.98rem;\n    line-height: 1.6;\n    color: var(--rr-text, #f0f0f0);\n    opacity: 0.7;\n}\n\n@media (max-width: 900px) {\n    .rr-gd-grid { grid-template-columns: repeat(2, 1fr); gap: 3vh 4vw; }\n}\n\n@media (max-width: 600px) {\n    .rr-gd-grid { grid-template-columns: 1fr; }\n}\n<\/style>\n\n<section class=\"rr-gd-services\" id=\"services\">\n\n    <div class=\"rr-gd-head\">\n        <p class=\"rr-gd-label\">What we design<\/p>\n        <h2 class=\"rr-gd-heading\">Visuals that<br>work for you<\/h2>\n    <\/div>\n\n    <div class=\"rr-gd-grid\">\n\n        <div class=\"rr-gd-card\">\n            <div class=\"rr-gd-num\">01<\/div>\n            <h3>Logo and brand identity<\/h3>\n            <p>Logos, colors and typography that make your brand instantly recognisable.<\/p>\n        <\/div>\n\n        <div class=\"rr-gd-card\">\n            <div class=\"rr-gd-num\">02<\/div>\n            <h3>Social media creatives<\/h3>\n            <p>Posts, stories and campaign visuals designed to stop the scroll.<\/p>\n        <\/div>\n\n        <div class=\"rr-gd-card\">\n            <div class=\"rr-gd-num\">03<\/div>\n            <h3>Print and packaging<\/h3>\n            <p>Brochures, flyers, labels and packaging that are ready for the printer.<\/p>\n        <\/div>\n\n        <div class=\"rr-gd-card\">\n            <div class=\"rr-gd-num\">04<\/div>\n            <h3>Banners and signage<\/h3>\n            <p>Event banners, roll-ups and signage that get noticed from across the room.<\/p>\n        <\/div>\n\n        <div class=\"rr-gd-card\">\n            <div class=\"rr-gd-num\">05<\/div>\n            <h3>Presentations and decks<\/h3>\n            <p>Pitch decks and company profiles that look as good as your ideas.<\/p>\n        <\/div>\n\n        <div class=\"rr-gd-card\">\n            <div class=\"rr-gd-num\">06<\/div>\n            <h3>Brand guidelines<\/h3>\n            <p>A simple guide so everyone uses your brand the same way, every time.<\/p>\n        <\/div>\n\n    <\/div>\n<\/section>\n\n<script>\n(function () {\n    function rrInitGdServices() {\n        if (typeof gsap === 'undefined' || typeof ScrollTrigger === 'undefined') {\n            setTimeout(rrInitGdServices, 200);\n            return;\n        }\n        if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) return;\n\n        gsap.from('.rr-gd-head', {\n            y: 40, opacity: 0, duration: 1, ease: 'power3.out',\n            scrollTrigger: { trigger: '.rr-gd-head', start: 'top 85%' }\n        });\n\n        \/\/ clearProps hands transform control back to CSS afterwards,\n        \/\/ so the hover lift keeps working\n        gsap.from('.rr-gd-card', {\n            y: 70, opacity: 0, duration: 0.9, ease: 'power3.out', stagger: 0.1,\n            clearProps: 'transform,opacity',\n            scrollTrigger: { trigger: '.rr-gd-grid', start: 'top 85%' }\n        });\n    }\n    rrInitGdServices();\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-2ac37e5 e-con-full e-flex e-con e-parent\" data-id=\"2ac37e5\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e1cf941 elementor-widget elementor-widget-html\" data-id=\"e1cf941\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\n.rr-pf-grid-section {\n    background-color: var(--rr-bg, #050505);\n    padding: 6vh 6vw 12vh;\n}\n\n.rr-pf-grid {\n    display: grid;\n    grid-template-columns: repeat(2, 1fr);\n    gap: 8vh 4vw;\n}\n\n.rr-pf-card {\n    display: block;\n    text-decoration: none;\n    color: var(--rr-text, #f0f0f0);\n}\n\n@media (min-width: 769px) {\n    .rr-pf-card:nth-child(even) { margin-top: 10vh; }\n}\n\n.rr-pf-img {\n    position: relative;\n    overflow: hidden;\n    aspect-ratio: 4 \/ 3;\n    border-radius: 12px;\n    background-color: #111;\n}\n\n.rr-pf-img-inner {\n    position: absolute;\n    left: 0;\n    right: 0;\n    top: -10%;\n    height: 120%;\n    background-size: cover;\n    background-position: center;\n    transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);\n    will-change: transform;\n}\n\n.rr-pf-card:hover .rr-pf-img-inner { transform: scale(1.06); }\n\n.rr-pf-title {\n    font-family: 'Anton', sans-serif;\n    text-transform: uppercase;\n    font-size: clamp(1.4rem, 2.4vw, 2.4rem);\n    line-height: 1.1;\n    margin: 1.2rem 0 0.8rem;\n}\n\n.rr-pf-tags {\n    display: flex;\n    flex-wrap: wrap;\n    gap: 0.5rem;\n}\n\n.rr-pf-tags span {\n    font-family: 'Montserrat', sans-serif;\n    font-size: 0.75rem;\n    font-weight: 600;\n    letter-spacing: 0.08em;\n    text-transform: uppercase;\n    padding: 0.35rem 0.9rem;\n    border: 1px solid rgba(255, 255, 255, 0.25);\n    border-radius: 100px;\n}\n\n.rr-pf-title { color: var(--rr-text, #f0f0f0) !important; }\n\n@media (max-width: 768px) {\n    .rr-pf-grid { grid-template-columns: 1fr; }\n}\n\n.rr-pf-gd-head {\n    max-width: 1300px;\n    margin: 0 auto 7vh;\n}\n\n.rr-pf-gd-label {\n    font-family: 'Montserrat', sans-serif;\n    font-weight: 700;\n    font-size: 0.85rem;\n    letter-spacing: 0.25em;\n    text-transform: uppercase;\n    color: var(--rr-accent3, #ccff00);\n    margin: 0 0 1rem;\n}\n\n.rr-pf-gd-heading {\n    margin: 0;\n    font-family: 'Anton', sans-serif !important;\n    font-weight: 400;\n    text-transform: uppercase;\n    font-size: clamp(2.5rem, 6vw, 6rem);\n    line-height: 1;\n    color: var(--rr-text, #f0f0f0) !important;\n}\n<\/style>\n\n<section class=\"rr-pf-grid-section\">\n    <div class=\"rr-pf-gd-head\">\n        <p class=\"rr-pf-gd-label\">Selected work<\/p>\n        <h2 class=\"rr-pf-gd-heading\">Designs we're proud of<\/h2>\n    <\/div>\n\n    <div class=\"rr-pf-grid\">\n\n        <a class=\"rr-pf-card\" href=\"#\">\n            <div class=\"rr-pf-img\">\n                <div class=\"rr-pf-img-inner\" style=\"background-image: url('REPLACE_IMAGE_1'), linear-gradient(135deg, #ff0055, #4d4dff);\"><\/div>\n            <\/div>\n            <h3 class=\"rr-pf-title\">Project Name One<\/h3>\n            <div class=\"rr-pf-tags\"><span>Logo<\/span><span>Branding<\/span><\/div>\n        <\/a>\n\n        <a class=\"rr-pf-card\" href=\"#\">\n            <div class=\"rr-pf-img\">\n                <div class=\"rr-pf-img-inner\" style=\"background-image: url('REPLACE_IMAGE_2'), linear-gradient(135deg, #4d4dff, #00c2ff);\"><\/div>\n            <\/div>\n            <h3 class=\"rr-pf-title\">Project Name Two<\/h3>\n            <div class=\"rr-pf-tags\"><span>Social Media<\/span><\/div>\n        <\/a>\n\n        <a class=\"rr-pf-card\" href=\"#\">\n            <div class=\"rr-pf-img\">\n                <div class=\"rr-pf-img-inner\" style=\"background-image: url('REPLACE_IMAGE_3'), linear-gradient(135deg, #ccff00, #00a86b);\"><\/div>\n            <\/div>\n            <h3 class=\"rr-pf-title\">Project Name Three<\/h3>\n            <div class=\"rr-pf-tags\"><span>Print<\/span><span>Packaging<\/span><\/div>\n        <\/a>\n\n        <a class=\"rr-pf-card\" href=\"#\">\n            <div class=\"rr-pf-img\">\n                <div class=\"rr-pf-img-inner\" style=\"background-image: url('REPLACE_IMAGE_4'), linear-gradient(135deg, #ff9a00, #ff0055);\"><\/div>\n            <\/div>\n            <h3 class=\"rr-pf-title\">Project Name Four<\/h3>\n            <div class=\"rr-pf-tags\"><span>Brochure<\/span><\/div>\n        <\/a>\n\n        <a class=\"rr-pf-card\" href=\"#\">\n            <div class=\"rr-pf-img\">\n                <div class=\"rr-pf-img-inner\" style=\"background-image: url('REPLACE_IMAGE_5'), linear-gradient(135deg, #7b2ff7, #f107a3);\"><\/div>\n            <\/div>\n            <h3 class=\"rr-pf-title\">Project Name Five<\/h3>\n            <div class=\"rr-pf-tags\"><span>Logo Design<\/span><\/div>\n        <\/a>\n\n        <a class=\"rr-pf-card\" href=\"#\">\n            <div class=\"rr-pf-img\">\n                <div class=\"rr-pf-img-inner\" style=\"background-image: url('REPLACE_IMAGE_6'), linear-gradient(135deg, #00c2ff, #4d4dff);\"><\/div>\n            <\/div>\n            <h3 class=\"rr-pf-title\">Project Name Six<\/h3>\n            <div class=\"rr-pf-tags\"><span>Social Media<\/span><span>Campaign<\/span><\/div>\n        <\/a>\n\n    <\/div>\n<\/section>\n\n<script>\n(function () {\n    function rrInitPfGrid() {\n        if (typeof gsap === 'undefined' || typeof ScrollTrigger === 'undefined') {\n            setTimeout(rrInitPfGrid, 200);\n            return;\n        }\n        if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) return;\n\n        gsap.utils.toArray('.rr-pf-card').forEach(function (card) {\n            gsap.from(card, {\n                y: 80,\n                opacity: 0,\n                duration: 1,\n                ease: 'power3.out',\n                scrollTrigger: { trigger: card, start: 'top 88%' }\n            });\n\n            var inner = card.querySelector('.rr-pf-img-inner');\n            if (inner) {\n                gsap.fromTo(inner,\n                    { yPercent: -7 },\n                    {\n                        yPercent: 7,\n                        ease: 'none',\n                        scrollTrigger: {\n                            trigger: card,\n                            start: 'top bottom',\n                            end: 'bottom top',\n                            scrub: true\n                        }\n                    }\n                );\n            }\n        });\n    }\n    rrInitPfGrid();\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-6161c98 e-con-full e-flex e-con e-parent\" data-id=\"6161c98\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e31f170 elementor-widget elementor-widget-html\" data-id=\"e31f170\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\n.rr-pk-process {\n    background-color: var(--rr-bg, #050505);\n    padding: 10vh 5vw 12vh;\n}\n\n.rr-pk-wrap {\n    max-width: 1300px;\n    margin: 0 auto;\n}\n\n.rr-pk-label {\n    font-family: 'Montserrat', sans-serif;\n    font-weight: 700;\n    font-size: 0.85rem;\n    letter-spacing: 0.25em;\n    text-transform: uppercase;\n    color: var(--rr-accent3, #ccff00);\n    margin: 0 0 1rem;\n}\n\n.rr-pk-h2 {\n    margin: 0 0 6vh;\n    font-family: 'Anton', sans-serif !important;\n    font-weight: 400;\n    text-transform: uppercase;\n    font-size: clamp(2.5rem, 6vw, 6rem);\n    line-height: 1;\n    color: var(--rr-text, #f0f0f0) !important;\n}\n\n\/* Included in every project *\/\n.rr-pk-included {\n    display: grid;\n    grid-template-columns: repeat(4, 1fr);\n    gap: 2vw;\n    margin-bottom: 14vh;\n}\n\n.rr-pk-inc {\n    padding-top: 1.5rem;\n    border-top: 1px solid rgba(255, 255, 255, 0.2);\n}\n\n.rr-pk-inc h3 {\n    margin: 0 0 0.6rem;\n    font-family: 'Montserrat', sans-serif !important;\n    font-weight: 700;\n    font-size: 1.1rem;\n    color: var(--rr-text, #f0f0f0) !important;\n}\n\n.rr-pk-inc p {\n    margin: 0;\n    font-family: 'Inter', sans-serif;\n    font-size: 0.95rem;\n    line-height: 1.55;\n    color: var(--rr-text, #f0f0f0);\n    opacity: 0.65;\n}\n\n\/* Process steps *\/\n.rr-pk-step {\n    display: grid;\n    grid-template-columns: minmax(120px, 22%) 1fr;\n    gap: 3vw;\n    align-items: center;\n    padding: 4vh 0;\n    border-top: 1px solid rgba(255, 255, 255, 0.2);\n}\n\n.rr-pk-step:last-child {\n    border-bottom: 1px solid rgba(255, 255, 255, 0.2);\n}\n\n.rr-pk-num {\n    font-family: 'Anton', sans-serif;\n    font-size: clamp(4.5rem, 11vw, 11rem);\n    line-height: 1;\n    color: transparent;\n    -webkit-text-stroke: 2px rgba(255, 255, 255, 0.35);\n    transition: -webkit-text-stroke-color 0.4s ease;\n}\n\n.rr-pk-step:hover .rr-pk-num {\n    -webkit-text-stroke-color: var(--rr-accent3, #ccff00);\n}\n\n.rr-pk-step h3 {\n    margin: 0 0 0.8rem;\n    font-family: 'Anton', sans-serif !important;\n    font-weight: 400;\n    text-transform: uppercase;\n    font-size: clamp(1.8rem, 3.4vw, 3.4rem);\n    color: var(--rr-text, #f0f0f0) !important;\n}\n\n.rr-pk-step p {\n    margin: 0;\n    max-width: 560px;\n    font-family: 'Inter', sans-serif;\n    font-size: clamp(0.95rem, 1.2vw, 1.15rem);\n    line-height: 1.6;\n    color: var(--rr-text, #f0f0f0);\n    opacity: 0.7;\n}\n\n@media (max-width: 900px) {\n    .rr-pk-included { grid-template-columns: repeat(2, 1fr); gap: 5vh 4vw; }\n}\n\n@media (max-width: 600px) {\n    .rr-pk-included { grid-template-columns: 1fr; }\n    .rr-pk-step { grid-template-columns: 1fr; gap: 1rem; }\n}\n<\/style>\n\n<section class=\"rr-pk-process\">\n    <div class=\"rr-pk-wrap\">\n\n        <p class=\"rr-pk-label\">Every project includes<\/p>\n        <h2 class=\"rr-pk-h2\">What you always get<\/h2>\n\n        <div class=\"rr-pk-included\">\n            <div class=\"rr-pk-inc\">\n                <h3>Editable source files<\/h3>\n                <p>You get the working files, so your designs are yours to use and update.<\/p>\n            <\/div>\n            <div class=\"rr-pk-inc\">\n                <h3>Multiple concepts<\/h3>\n                <p>We explore more than one direction before refining the strongest.<\/p>\n            <\/div>\n            <div class=\"rr-pk-inc\">\n                <h3>Print and web ready<\/h3>\n                <p>Files exported correctly for print, social media and websites.<\/p>\n            <\/div>\n            <div class=\"rr-pk-inc\">\n                <h3>Clear revisions<\/h3>\n                <p>A set number of revision rounds keeps feedback focused and timelines on track.<\/p>\n            <\/div>\n        <\/div>\n\n        <p class=\"rr-pk-label\">How it works<\/p>\n        <h2 class=\"rr-pk-h2\">From brief to final files<\/h2>\n\n        <div class=\"rr-pk-steps\">\n            <div class=\"rr-pk-step\">\n                <div class=\"rr-pk-num\">01<\/div>\n                <div>\n                    <h3>Brief<\/h3>\n                    <p>We learn about your brand, your goals and your audience, then agree on exactly what needs designing.<\/p>\n                <\/div>\n            <\/div>\n            <div class=\"rr-pk-step\">\n                <div class=\"rr-pk-num\">02<\/div>\n                <div>\n                    <h3>Concepts<\/h3>\n                    <p>We sketch and design a few directions and share them with you for early feedback.<\/p>\n                <\/div>\n            <\/div>\n            <div class=\"rr-pk-step\">\n                <div class=\"rr-pk-num\">03<\/div>\n                <div>\n                    <h3>Refine<\/h3>\n                    <p>We polish the direction you pick, apply your feedback, and fine-tune every detail.<\/p>\n                <\/div>\n            <\/div>\n            <div class=\"rr-pk-step\">\n                <div class=\"rr-pk-num\">04<\/div>\n                <div>\n                    <h3>Deliver<\/h3>\n                    <p>You receive the final files in every format you need, ready to print or post.<\/p>\n                <\/div>\n            <\/div>\n        <\/div>\n\n    <\/div>\n<\/section>\n\n<script>\n(function () {\n    function rrInitPkProcess() {\n        if (typeof gsap === 'undefined' || typeof ScrollTrigger === 'undefined') {\n            setTimeout(rrInitPkProcess, 200);\n            return;\n        }\n        if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) return;\n\n        gsap.from('.rr-pk-inc', {\n            y: 50, opacity: 0, duration: 0.9, ease: 'power3.out', stagger: 0.12,\n            scrollTrigger: { trigger: '.rr-pk-included', start: 'top 85%' }\n        });\n\n        gsap.utils.toArray('.rr-pk-step').forEach(function (step) {\n            gsap.from(step, {\n                y: 60, opacity: 0, duration: 1, ease: 'power3.out',\n                scrollTrigger: { trigger: step, start: 'top 88%' }\n            });\n        });\n    }\n    rrInitPkProcess();\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-cb46af6 e-con-full e-flex e-con e-parent\" data-id=\"cb46af6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b606e08 elementor-widget elementor-widget-html\" data-id=\"b606e08\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\n.rr-pk-faq {\n    background-color: var(--rr-bg, #050505);\n    padding: 8vh 5vw 12vh;\n}\n\n.rr-pk-faq-wrap {\n    max-width: 1000px;\n    margin: 0 auto;\n}\n\n.rr-pk-faq-label {\n    font-family: 'Montserrat', sans-serif;\n    font-weight: 700;\n    font-size: 0.85rem;\n    letter-spacing: 0.25em;\n    text-transform: uppercase;\n    color: var(--rr-accent3, #ccff00);\n    margin: 0 0 1rem;\n}\n\n.rr-pk-faq-h2 {\n    margin: 0 0 6vh;\n    font-family: 'Anton', sans-serif !important;\n    font-weight: 400;\n    text-transform: uppercase;\n    font-size: clamp(2.5rem, 6vw, 6rem);\n    line-height: 1;\n    color: var(--rr-text, #f0f0f0) !important;\n}\n\n.rr-pk-faq details {\n    border-top: 1px solid rgba(255, 255, 255, 0.2);\n}\n\n.rr-pk-faq details:last-of-type {\n    border-bottom: 1px solid rgba(255, 255, 255, 0.2);\n}\n\n.rr-pk-faq summary {\n    position: relative;\n    list-style: none;\n    cursor: pointer;\n    padding: 2rem 3rem 2rem 0;\n    font-family: 'Montserrat', sans-serif;\n    font-weight: 600;\n    font-size: clamp(1.05rem, 1.7vw, 1.5rem);\n    line-height: 1.35;\n    color: var(--rr-text, #f0f0f0);\n    transition: color 0.3s;\n}\n\n.rr-pk-faq summary::-webkit-details-marker { display: none; }\n\n.rr-pk-faq summary::after {\n    content: '+';\n    position: absolute;\n    right: 0;\n    top: 50%;\n    transform: translateY(-50%);\n    font-size: 2rem;\n    font-weight: 300;\n    color: var(--rr-accent3, #ccff00);\n    transition: transform 0.3s ease;\n}\n\n.rr-pk-faq details[open] summary::after {\n    transform: translateY(-50%) rotate(45deg);\n}\n\n.rr-pk-faq summary:hover {\n    color: var(--rr-accent3, #ccff00);\n}\n\n.rr-pk-faq details p {\n    margin: 0;\n    padding: 0 3rem 2rem 0;\n    max-width: 760px;\n    font-family: 'Inter', sans-serif;\n    font-size: 1rem;\n    line-height: 1.7;\n    color: var(--rr-text, #f0f0f0);\n    opacity: 0.7;\n}\n<\/style>\n\n<section class=\"rr-pk-faq\">\n    <div class=\"rr-pk-faq-wrap\">\n\n        <p class=\"rr-pk-faq-label\">FAQ<\/p>\n        <h2 class=\"rr-pk-faq-h2\">Questions, answered<\/h2>\n\n        <details name=\"rr-pk-faq\">\n            <summary>How long does a design project take?<\/summary>\n            <p>A single piece like a logo or a social media set usually takes days to a couple of weeks, depending on the scope and how quickly we get your feedback. We'll confirm a timeline once we know what you need.<\/p>\n        <\/details>\n\n        <details name=\"rr-pk-faq\">\n            <summary>How many revisions are included?<\/summary>\n            <p>Each project includes a set number of revision rounds, which we agree on up front. Extra rounds can be added if you need them.<\/p>\n        <\/details>\n\n        <details name=\"rr-pk-faq\">\n            <summary>Do I own the final designs?<\/summary>\n            <p>Yes. Once the project is paid for, the final designs are yours to use, and we can hand over the editable source files too.<\/p>\n        <\/details>\n\n        <details name=\"rr-pk-faq\">\n            <summary>What file formats will I receive?<\/summary>\n            <p>We supply the formats you need, such as print-ready PDFs, PNG and JPG for social media, and vector files for logos.<\/p>\n        <\/details>\n\n        <details name=\"rr-pk-faq\">\n            <summary>Can you work with our existing brand guidelines?<\/summary>\n            <p>Absolutely. Share your logo, colors and fonts and we'll design to match, or we can help you build brand guidelines if you don't have any yet.<\/p>\n        <\/details>\n\n        <details name=\"rr-pk-faq\">\n            <summary>Do you handle printing as well?<\/summary>\n            <p>We prepare print-ready files and can advise on the best materials and finishes. Ask us if you'd like us to coordinate printing for you.<\/p>\n        <\/details>\n\n    <\/div>\n<\/section>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3e33905 e-con-full elementor-hidden-desktop elementor-hidden-laptop elementor-hidden-tablet elementor-hidden-mobile e-flex e-con e-parent\" data-id=\"3e33905\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-96f52b7 elementor-widget elementor-widget-html\" data-id=\"96f52b7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\n.rr-pf-logos2 {\n    background-color: var(--rr-bg, #050505);\n    padding: 12vh 4vw;\n    overflow: hidden;\n}\n\n.rr-pf-logos2-row {\n    display: flex;\n    align-items: center;\n    gap: 2vw;\n    will-change: transform;\n}\n\n.rr-pf-logos2-row + .rr-pf-logos2-row {\n    margin-top: 6vh;\n}\n\n.rr-pf-logo2 {\n    flex: 1 1 0;\n    min-width: 0;\n    height: clamp(50px, 6vw, 90px);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.rr-pf-logo2 img {\n    max-width: 100%;\n    max-height: 100%;\n    width: auto;\n    height: auto;\n    object-fit: contain;\n    filter: grayscale(1) brightness(1.15);\n    opacity: 0.65;\n    transition: filter 0.4s ease, opacity 0.4s ease;\n}\n\n.rr-pf-logo2:hover img {\n    filter: grayscale(0) brightness(1);\n    opacity: 1;\n}\n\n@media (max-width: 768px) {\n    .rr-pf-logos2-row {\n        flex-wrap: wrap;\n        justify-content: center;\n        gap: 4vw;\n    }\n    .rr-pf-logo2 {\n        flex: 0 0 28%;\n        height: 48px;\n    }\n}\n<\/style>\n\n<section class=\"rr-pf-logos2\">\n\n    <div class=\"rr-pf-logos2-row\" data-dir=\"left\">\n        <div class=\"rr-pf-logo2\"><img decoding=\"async\" src=\"https:\/\/richierich.com.my\/staging\/wp-content\/uploads\/2026\/08\/finamics-01.png\" alt=\"Finamics\"><\/div>\n        <div class=\"rr-pf-logo2\"><img decoding=\"async\" src=\"https:\/\/richierich.com.my\/staging\/wp-content\/uploads\/2026\/08\/euda-01.png\" alt=\"EUDA\"><\/div>\n        <div class=\"rr-pf-logo2\"><img decoding=\"async\" src=\"https:\/\/richierich.com.my\/staging\/wp-content\/uploads\/2026\/08\/honda-01.png\" alt=\"Honda\"><\/div>\n        <div class=\"rr-pf-logo2\"><img decoding=\"async\" src=\"https:\/\/richierich.com.my\/staging\/wp-content\/uploads\/2026\/08\/acmar-01.png\" alt=\"acmar\"><\/div>\n        <div class=\"rr-pf-logo2\"><img decoding=\"async\" src=\"https:\/\/richierich.com.my\/staging\/wp-content\/uploads\/2026\/08\/mesuma-01.png\" alt=\"mesuma\"><\/div>\n        <div class=\"rr-pf-logo2\"><img decoding=\"async\" src=\"https:\/\/richierich.com.my\/staging\/wp-content\/uploads\/2026\/08\/perodua-01.png\" alt=\"perodua\"><\/div>\n    <\/div>\n\n    <div class=\"rr-pf-logos2-row\" data-dir=\"right\">\n        <div class=\"rr-pf-logo2\"><img decoding=\"async\" src=\"https:\/\/richierich.com.my\/staging\/wp-content\/uploads\/2026\/08\/iw-global-01.png\" alt=\"IW global\"><\/div>\n        <div class=\"rr-pf-logo2\"><img decoding=\"async\" src=\"https:\/\/richierich.com.my\/staging\/wp-content\/uploads\/2026\/10\/velabay-01.png\" alt=\"velabay\"><\/div>\n        <div class=\"rr-pf-logo2\"><img decoding=\"async\" src=\"https:\/\/richierich.com.my\/staging\/wp-content\/uploads\/2026\/08\/odyssey-01.png\" alt=\"odyssey\"><\/div>\n        <div class=\"rr-pf-logo2\"><img decoding=\"async\" src=\"https:\/\/richierich.com.my\/staging\/wp-content\/uploads\/2026\/08\/smart-01.png\" alt=\"smart\"><\/div>\n        <div class=\"rr-pf-logo2\"><img decoding=\"async\" src=\"https:\/\/richierich.com.my\/staging\/wp-content\/uploads\/2026\/08\/tcm-01.png\" alt=\"tcm\"><\/div>\n        <div class=\"rr-pf-logo2\"><img decoding=\"async\" src=\"https:\/\/richierich.com.my\/staging\/wp-content\/uploads\/2026\/08\/boules-01.png\" alt=\"boules\"><\/div>\n    <\/div>\n\n<\/section>\n\n<script>\n(function () {\n    function rrInitPfLogos2() {\n        if (typeof gsap === 'undefined' || typeof ScrollTrigger === 'undefined') {\n            setTimeout(rrInitPfLogos2, 200);\n            return;\n        }\n\n        var section = document.querySelector('.rr-pf-logos2');\n        if (!section) return;\n\n        \/\/ Only animate on desktop\/tablet and when motion is allowed\n        var mm = gsap.matchMedia();\n        mm.add('(min-width: 769px) and (prefers-reduced-motion: no-preference)', function () {\n            section.querySelectorAll('.rr-pf-logos2-row').forEach(function (row) {\n                var goLeft = row.getAttribute('data-dir') === 'left';\n                gsap.fromTo(row,\n                    { xPercent: goLeft ? 7 : -7 },\n                    {\n                        xPercent: goLeft ? -7 : 7,\n                        ease: 'none',\n                        scrollTrigger: {\n                            trigger: section,\n                            start: 'top bottom',\n                            end: 'bottom top',\n                            scrub: 1\n                        }\n                    }\n                );\n            });\n        });\n    }\n    rrInitPfLogos2();\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-78fc280 e-con-full e-flex e-con e-parent\" data-id=\"78fc280\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1d67ff4 elementor-widget elementor-widget-html\" data-id=\"1d67ff4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\n.rr-pf-cta {\n    background-color: var(--rr-bg, #050505);\n    padding: 12vh 0;\n    overflow: hidden;\n    text-align: center;\n}\n\n.rr-pf-cta-band {\n    white-space: nowrap;\n    font-family: 'Anton', sans-serif;\n    text-transform: uppercase;\n    font-size: clamp(3.5rem, 11vw, 12rem);\n    line-height: 1.05;\n    color: var(--rr-text, #f0f0f0);\n    will-change: transform;\n}\n\n.rr-pf-cta-band span {\n    display: inline-block;\n    padding-right: 4vw;\n}\n\n.rr-pf-cta-band span:nth-child(even) {\n    color: transparent;\n    -webkit-text-stroke: 2px var(--rr-text, #f0f0f0);\n}\n\n.rr-pf-cta-btn {\n    display: inline-block;\n    margin-top: 6vh;\n    padding: 28px 64px;\n    border: 1px solid rgba(255, 255, 255, 0.3);\n    border-radius: 100px;\n    font-family: 'Montserrat', sans-serif;\n    font-weight: 700;\n    font-size: 1.2rem;\n    letter-spacing: 0.1em;\n    text-decoration: none;\n    color: var(--rr-text, #f0f0f0);\n    position: relative;\n    overflow: hidden;\n    isolation: isolate;\n    transition: color 0.3s, border-color 0.3s;\n}\n\n.rr-pf-cta-btn::before {\n    content: '';\n    position: absolute;\n    left: 0;\n    top: 100%;\n    width: 100%;\n    height: 100%;\n    background-color: var(--rr-accent3, #ccff00);\n    transition: transform 0.5s cubic-bezier(0.76, 0, 0.24, 1);\n    z-index: -1;\n    border-radius: 50% 50% 0 0;\n}\n\n.rr-pf-cta-btn:hover {\n    color: var(--rr-bg, #050505);\n    border-color: var(--rr-accent3, #ccff00);\n}\n\n.rr-pf-cta-btn:hover::before {\n    transform: translateY(-100%);\n    border-radius: 0;\n}\n<\/style>\n\n<section class=\"rr-pf-cta\">\n    <div class=\"rr-pf-cta-band\">\n        <span>Let's work together<\/span><span>Let's work together<\/span><span>Let's work together<\/span><span>Let's work together<\/span>\n    <\/div>\n    <a class=\"rr-pf-cta-btn rr-hoverable\" href=\"\/staging\/contact-us\/\">SAY HELLO<\/a>\n<\/section>\n\n<script>\n(function () {\n    function rrInitPfCta() {\n        if (typeof gsap === 'undefined' || typeof ScrollTrigger === 'undefined') {\n            setTimeout(rrInitPfCta, 200);\n            return;\n        }\n\n        if (typeof window.rrBindHoverables === 'function') window.rrBindHoverables();\n\n        if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) return;\n\n        var section = document.querySelector('.rr-pf-cta');\n        var band = document.querySelector('.rr-pf-cta-band');\n        if (!section || !band) return;\n\n        gsap.fromTo(band,\n            { xPercent: -30 },\n            {\n                xPercent: 0,\n                ease: 'none',\n                scrollTrigger: {\n                    trigger: section,\n                    start: 'top bottom',\n                    end: 'bottom top',\n                    scrub: 1\n                }\n            }\n        );\n    }\n    rrInitPfCta();\n})();\n<\/script>\n\t\t\t\t<\/div>\n\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>Graphic Design Graphic design that makes people stop scrolling. From logos to social media creatives, we design visuals that make [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-1609","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/richierich.com.my\/staging\/wp-json\/wp\/v2\/pages\/1609","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/richierich.com.my\/staging\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/richierich.com.my\/staging\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/richierich.com.my\/staging\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/richierich.com.my\/staging\/wp-json\/wp\/v2\/comments?post=1609"}],"version-history":[{"count":38,"href":"https:\/\/richierich.com.my\/staging\/wp-json\/wp\/v2\/pages\/1609\/revisions"}],"predecessor-version":[{"id":1844,"href":"https:\/\/richierich.com.my\/staging\/wp-json\/wp\/v2\/pages\/1609\/revisions\/1844"}],"wp:attachment":[{"href":"https:\/\/richierich.com.my\/staging\/wp-json\/wp\/v2\/media?parent=1609"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}