{"id":482,"date":"2026-08-21T13:07:23","date_gmt":"2026-08-21T13:07:23","guid":{"rendered":"http:\/\/localhost\/Pcguard\/?page_id=482"},"modified":"2026-08-22T08:08:51","modified_gmt":"2026-08-22T08:08:51","slug":"pcguard-imports","status":"publish","type":"page","link":"https:\/\/pcguard.co.za\/?page_id=482","title":{"rendered":"PCGuard Imports"},"content":{"rendered":"\n<style>\n\/* =====================================================\n   PCGUARD IMPORTED PRODUCTS PAGE\n   ===================================================== *\/\n\n.pcg-import-page,\n.pcg-import-page * {\n    box-sizing: border-box;\n}\n\n.pcg-import-page {\n    --navy: #032849;\n    --blue: #087fc9;\n    --bright-blue: #0797ed;\n    --light-blue: #edf7fd;\n    --border: #cfe2ef;\n    --text: #082b4c;\n    --muted: #496781;\n\n    width: 100%;\n    margin: 0;\n    overflow: hidden;\n    color: var(--text);\n    font-family: inherit;\n}\n\n.pcg-import-page button,\n.pcg-import-page input,\n.pcg-import-page textarea {\n    font: inherit;\n}\n\n.pcg-import-page h1,\n.pcg-import-page h2,\n.pcg-import-page h3,\n.pcg-import-page p,\n.pcg-import-page ul {\n    margin-top: 0;\n}\n\n.pcg-import-container {\n    width: min(1160px, calc(100% - 40px));\n    margin: 0 auto;\n}\n\n\/* =====================================================\n   HERO\n   ===================================================== *\/\n\n.pcg-import-hero {\n    padding: 44px 0 49px;\n    color: #ffffff;\n    background:\n        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),\n        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px),\n        linear-gradient(115deg, #022847 0%, #074d85 100%);\n    background-size: 64px 64px, 64px 64px, auto;\n}\n\n.pcg-import-hero-content {\n    max-width: 900px;\n}\n\n.pcg-import-eyebrow {\n    margin-bottom: 13px !important;\n    color: #58bfff;\n    font-size: 14px;\n    font-weight: 800;\n    letter-spacing: 1.8px;\n    text-transform: uppercase;\n}\n\n.pcg-import-hero h1 {\n    margin-bottom: 16px;\n    color: #ffffff;\n    font-size: clamp(46px, 5vw, 68px);\n    font-weight: 800;\n    line-height: 1.04;\n    letter-spacing: -2px;\n}\n\n.pcg-import-hero-description {\n    max-width: 820px;\n    margin-bottom: 0;\n    color: #e7f3fb;\n    font-size: 18px;\n    line-height: 1.65;\n}\n\n\/* =====================================================\n   PRODUCT INTRODUCTION\n   ===================================================== *\/\n\n.pcg-import-products {\n    padding: 55px 0 68px;\n    background: #f4f9fc;\n}\n\n.pcg-import-heading {\n    margin-bottom: 32px;\n    text-align: center;\n}\n\n.pcg-import-label {\n    margin-bottom: 10px !important;\n    color: var(--blue);\n    font-size: 13px;\n    font-weight: 800;\n    letter-spacing: 1.8px;\n    text-transform: uppercase;\n}\n\n.pcg-import-heading h2 {\n    margin-bottom: 13px;\n    color: var(--text);\n    font-size: clamp(34px, 4vw, 46px);\n    line-height: 1.15;\n    letter-spacing: -1.2px;\n}\n\n.pcg-import-heading-description {\n    max-width: 800px;\n    margin: 0 auto;\n    color: var(--muted);\n    font-size: 16px;\n    line-height: 1.7;\n}\n\n\/* =====================================================\n   AVAILABILITY NOTICE\n   ===================================================== *\/\n\n.pcg-import-notice {\n    display: flex;\n    align-items: flex-start;\n    gap: 16px;\n    margin-bottom: 36px;\n    padding: 20px 23px;\n    border: 1px solid #badaef;\n    border-left: 5px solid var(--blue);\n    border-radius: 10px;\n    background: #eaf6fd;\n}\n\n.pcg-import-notice-icon {\n    display: flex;\n    flex: 0 0 38px;\n    align-items: center;\n    justify-content: center;\n    width: 38px;\n    height: 38px;\n    border-radius: 50%;\n    color: #ffffff;\n    background: var(--blue);\n    font-size: 20px;\n    font-weight: 800;\n}\n\n.pcg-import-notice p {\n    margin-bottom: 0;\n    color: #315873;\n    font-size: 15px;\n    line-height: 1.65;\n}\n\n\/* =====================================================\n   PRODUCT GRID\n   Six columns allow three cards above and two centred below\n   ===================================================== *\/\n\n.pcg-import-grid {\n    display: grid;\n    grid-template-columns: repeat(6, minmax(0, 1fr));\n    gap: 26px;\n}\n\n.pcg-import-card {\n    position: relative;\n    display: flex;\n    grid-column: span 2;\n    flex-direction: column;\n    overflow: hidden;\n    min-width: 0;\n    border: 1px solid var(--border);\n    border-radius: 14px;\n    background: #ffffff;\n    box-shadow: 0 12px 32px rgba(1, 42, 75, .07);\n    transition: transform .25s ease, box-shadow .25s ease;\n}\n\n\/* Centre the last two cards *\/\n.pcg-import-card:nth-of-type(4) {\n    grid-column: 2 \/ span 2;\n}\n\n.pcg-import-card:nth-of-type(5) {\n    grid-column: 4 \/ span 2;\n}\n\n.pcg-import-card:hover {\n    transform: translateY(-5px);\n    box-shadow: 0 18px 42px rgba(1, 42, 75, .13);\n}\n\n.pcg-import-card::before {\n    position: absolute;\n    z-index: 2;\n    top: 0;\n    right: 0;\n    left: 0;\n    height: 5px;\n    content: \"\";\n    background: linear-gradient(90deg, #0797ed, #064e87);\n}\n\n.pcg-import-image-button {\n    display: block;\n    width: 100%;\n    padding: 0;\n    border: 0;\n    cursor: pointer;\n    background: #f1f7fb;\n}\n\n.pcg-import-product-image {\n    display: block;\n    width: 100%;\n    height: 245px;\n    padding: 13px;\n    object-fit: contain;\n    transition: transform .25s ease;\n}\n\n.pcg-import-image-button:hover .pcg-import-product-image {\n    transform: scale(1.025);\n}\n\n.pcg-import-card-content {\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n    padding: 25px 24px 23px;\n}\n\n.pcg-import-product-type {\n    margin-bottom: 8px !important;\n    color: var(--blue);\n    font-size: 12px;\n    font-weight: 800;\n    letter-spacing: 1.3px;\n    text-transform: uppercase;\n}\n\n.pcg-import-card h3 {\n    margin-bottom: 11px;\n    color: var(--text);\n    font-size: 22px;\n    line-height: 1.25;\n}\n\n.pcg-import-summary {\n    margin-bottom: 20px;\n    color: var(--muted);\n    font-size: 15px;\n    line-height: 1.65;\n}\n\n.pcg-import-card-actions {\n    margin-top: auto;\n}\n\n.pcg-import-view-button {\n    width: 100%;\n    min-height: 49px;\n    margin-bottom: 13px;\n    padding: 11px 14px;\n    border: 1px solid var(--blue);\n    border-radius: 6px;\n    color: var(--blue);\n    cursor: pointer;\n    background: #ffffff;\n    font-size: 14px;\n    font-weight: 700;\n    transition: color .2s ease, background .2s ease;\n}\n\n.pcg-import-view-button:hover {\n    color: #ffffff;\n    background: var(--blue);\n}\n\n.pcg-import-select {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    width: 100%;\n    min-height: 49px;\n    padding: 11px 13px;\n    border: 1px solid #d3e1eb;\n    border-radius: 6px;\n    color: var(--text);\n    cursor: pointer;\n    background: #f6fafc;\n    font-size: 14px;\n    font-weight: 750;\n}\n\n.pcg-import-select input {\n    width: 19px;\n    height: 19px;\n    margin: 0;\n    accent-color: var(--blue);\n}\n\n.pcg-import-card.pcg-import-selected {\n    border-color: var(--blue);\n    box-shadow: 0 17px 40px rgba(8, 127, 201, .18);\n}\n\n.pcg-import-card.pcg-import-selected .pcg-import-select {\n    border-color: var(--blue);\n    background: #e8f5fd;\n}\n\n\/* =====================================================\n   QUOTE AREA\n   ===================================================== *\/\n\n.pcg-import-quote-area {\n    padding: 40px 0 60px;\n    text-align: center;\n    background: #f4f9fc;\n}\n\n.pcg-import-quote-area h2 {\n    margin-bottom: 10px;\n    color: var(--text);\n    font-size: clamp(30px, 4vw, 42px);\n}\n\n.pcg-import-quote-area p {\n    max-width: 700px;\n    margin: 0 auto 22px;\n    color: var(--muted);\n    font-size: 16px;\n    line-height: 1.65;\n}\n\n.pcg-import-selected-count {\n    display: inline-block;\n    margin-bottom: 18px;\n    padding: 7px 14px;\n    border-radius: 30px;\n    color: #07527f;\n    background: #d8effc;\n    font-size: 14px;\n    font-weight: 750;\n}\n\n.pcg-import-main-quote {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    min-width: 210px;\n    min-height: 54px;\n    padding: 14px 24px;\n    border: 0;\n    border-radius: 6px;\n    color: #ffffff;\n    cursor: pointer;\n    background: var(--blue);\n    box-shadow: 0 10px 24px rgba(8, 127, 201, .23);\n    font-size: 16px;\n    font-weight: 800;\n}\n\n.pcg-import-main-quote:hover {\n    background: #056daa;\n}\n\n\/* =====================================================\n   ORDERING PROCESS\n   ===================================================== *\/\n\n.pcg-import-process {\n    padding: 62px 0;\n    background: #ffffff;\n}\n\n.pcg-import-process-heading {\n    margin-bottom: 34px;\n    text-align: center;\n}\n\n.pcg-import-process-heading h2 {\n    margin-bottom: 0;\n    color: var(--text);\n    font-size: clamp(31px, 4vw, 44px);\n}\n\n.pcg-import-process-grid {\n    display: grid;\n    grid-template-columns: repeat(3, minmax(0, 1fr));\n    gap: 22px;\n}\n\n.pcg-import-process-card {\n    padding: 27px 25px;\n    border: 1px solid var(--border);\n    border-radius: 12px;\n    background: #ffffff;\n}\n\n.pcg-import-process-number {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 42px;\n    height: 42px;\n    margin-bottom: 17px;\n    border-radius: 8px;\n    color: #ffffff;\n    background: var(--blue);\n    font-weight: 800;\n}\n\n.pcg-import-process-card h3 {\n    margin-bottom: 9px;\n    color: var(--text);\n    font-size: 20px;\n}\n\n.pcg-import-process-card p {\n    margin-bottom: 0;\n    color: var(--muted);\n    font-size: 15px;\n    line-height: 1.65;\n}\n\n\/* =====================================================\n   CONTACT BANNER\n   ===================================================== *\/\n\n.pcg-import-contact {\n    padding: 48px 0;\n    color: #ffffff;\n    background: linear-gradient(105deg, #032a4d 0%, #07538d 100%);\n}\n\n.pcg-import-contact-inner {\n    display: grid;\n    grid-template-columns: 1fr auto;\n    align-items: center;\n    gap: 40px;\n}\n\n.pcg-import-contact h2 {\n    margin-bottom: 9px;\n    color: #ffffff;\n    font-size: clamp(31px, 4vw, 43px);\n    line-height: 1.15;\n}\n\n.pcg-import-contact p {\n    max-width: 730px;\n    margin-bottom: 0;\n    color: #e4f2fb;\n    font-size: 16px;\n    line-height: 1.65;\n}\n\n.pcg-import-contact-button {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    min-width: 145px;\n    min-height: 52px;\n    padding: 13px 22px;\n    border-radius: 6px;\n    color: #ffffff !important;\n    text-decoration: none !important;\n    background: var(--blue);\n    font-size: 15px;\n    font-weight: 800;\n}\n\n.pcg-import-contact-button:hover {\n    background: var(--bright-blue);\n}\n\n\/* =====================================================\n   MODALS\n   ===================================================== *\/\n\n.pcg-import-modal {\n    position: fixed;\n    z-index: 999999;\n    inset: 0;\n    display: none;\n    align-items: center;\n    justify-content: center;\n    padding: 22px;\n    background: rgba(1, 22, 40, .77);\n}\n\n.pcg-import-modal.pcg-import-modal-open {\n    display: flex;\n}\n\n.pcg-import-dialog {\n    position: relative;\n    width: min(920px, 100%);\n    max-height: 90vh;\n    overflow-y: auto;\n    border-radius: 14px;\n    background: #ffffff;\n    box-shadow: 0 28px 80px rgba(0, 0, 0, .29);\n}\n\n.pcg-import-quote-dialog {\n    width: min(680px, 100%);\n}\n\n.pcg-import-modal-close {\n    position: sticky;\n    z-index: 5;\n    top: 14px;\n    float: right;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 42px;\n    height: 42px;\n    margin: 14px 14px -56px 0;\n    border: 0;\n    border-radius: 50%;\n    color: #ffffff;\n    cursor: pointer;\n    background: var(--navy);\n    font-size: 25px;\n    line-height: 1;\n}\n\n.pcg-import-modal-body {\n    padding: 32px;\n    clear: both;\n}\n\n.pcg-import-modal-grid {\n    display: grid;\n    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);\n    gap: 32px;\n    align-items: start;\n}\n\n.pcg-import-modal-image {\n    display: block;\n    width: 100%;\n    max-height: 450px;\n    padding: 12px;\n    border-radius: 10px;\n    object-fit: contain;\n    background: #f1f7fb;\n}\n\n.pcg-import-modal-type {\n    margin-bottom: 8px !important;\n    color: var(--blue);\n    font-size: 12px;\n    font-weight: 800;\n    letter-spacing: 1.4px;\n    text-transform: uppercase;\n}\n\n.pcg-import-modal-body h2 {\n    margin-bottom: 18px;\n    color: var(--text);\n    font-size: clamp(28px, 4vw, 39px);\n    line-height: 1.15;\n}\n\n.pcg-import-spec-list {\n    margin: 0 0 24px;\n    padding: 0;\n    list-style: none;\n}\n\n.pcg-import-spec-list li {\n    position: relative;\n    margin-bottom: 10px;\n    padding-left: 24px;\n    color: #365d78;\n    font-size: 15px;\n    line-height: 1.55;\n}\n\n.pcg-import-spec-list li::before {\n    position: absolute;\n    top: 0;\n    left: 0;\n    content: \"\u2713\";\n    color: var(--blue);\n    font-weight: 900;\n}\n\n.pcg-import-modal-select {\n    min-height: 48px;\n    padding: 12px 19px;\n    border: 0;\n    border-radius: 6px;\n    color: #ffffff;\n    cursor: pointer;\n    background: var(--blue);\n    font-size: 14px;\n    font-weight: 800;\n}\n\n\/* =====================================================\n   QUOTE FORM\n   ===================================================== *\/\n\n.pcg-import-form-intro {\n    margin-bottom: 22px;\n    color: var(--muted);\n    font-size: 15px;\n    line-height: 1.65;\n}\n\n.pcg-import-selected-box {\n    margin-bottom: 22px;\n    padding: 16px 18px;\n    border: 1px solid var(--border);\n    border-radius: 8px;\n    background: var(--light-blue);\n}\n\n.pcg-import-selected-box strong {\n    display: block;\n    margin-bottom: 7px;\n    color: var(--text);\n}\n\n.pcg-import-selected-list {\n    margin: 0;\n    padding-left: 20px;\n    color: #315873;\n    font-size: 14px;\n    line-height: 1.6;\n}\n\n.pcg-import-form-grid {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 16px;\n}\n\n.pcg-import-form-field {\n    margin-bottom: 16px;\n}\n\n.pcg-import-form-full {\n    grid-column: 1 \/ -1;\n}\n\n.pcg-import-form-field label {\n    display: block;\n    margin-bottom: 6px;\n    color: var(--text);\n    font-size: 14px;\n    font-weight: 750;\n}\n\n.pcg-import-form-field input,\n.pcg-import-form-field textarea {\n    width: 100%;\n    padding: 12px 13px;\n    border: 1px solid #bfd5e4;\n    border-radius: 6px;\n    color: var(--text);\n    background: #ffffff;\n    outline: none;\n}\n\n.pcg-import-form-field input:focus,\n.pcg-import-form-field textarea:focus {\n    border-color: var(--blue);\n    box-shadow: 0 0 0 3px rgba(8, 127, 201, .12);\n}\n\n.pcg-import-form-field textarea {\n    min-height: 120px;\n    resize: vertical;\n}\n\n.pcg-import-send-button {\n    width: 100%;\n    min-height: 52px;\n    padding: 13px 20px;\n    border: 0;\n    border-radius: 6px;\n    color: #ffffff;\n    cursor: pointer;\n    background: var(--blue);\n    font-size: 16px;\n    font-weight: 800;\n}\n\n.pcg-import-form-note {\n    margin: 12px 0 0;\n    color: #667f91;\n    font-size: 12px;\n    line-height: 1.5;\n    text-align: center;\n}\n\n.pcg-import-form-status {\n    display: none;\n    margin: 14px 0 0;\n    padding: 12px 14px;\n    border-radius: 6px;\n    font-size: 14px;\n    line-height: 1.5;\n    text-align: center;\n}\n\n.pcg-import-form-status.is-success {\n    display: block;\n    color: #155724;\n    background: #dff3e4;\n}\n\n.pcg-import-form-status.is-error {\n    display: block;\n    color: #842029;\n    background: #f8d7da;\n}\n\n.pcg-import-honeypot {\n    position: absolute !important;\n    left: -9999px !important;\n    width: 1px !important;\n    height: 1px !important;\n    overflow: hidden !important;\n}\n\n\/* =====================================================\n   RESPONSIVE\n   ===================================================== *\/\n\n@media (max-width: 980px) {\n    .pcg-import-grid {\n        grid-template-columns: repeat(2, minmax(0, 1fr));\n    }\n\n    .pcg-import-card,\n    .pcg-import-card:nth-of-type(4),\n    .pcg-import-card:nth-of-type(5) {\n        grid-column: auto;\n    }\n\n    .pcg-import-card:nth-of-type(5) {\n        grid-column: 1 \/ -1;\n        width: calc(50% - 13px);\n        margin: 0 auto;\n    }\n\n    .pcg-import-process-grid {\n        grid-template-columns: 1fr;\n    }\n}\n\n@media (max-width: 760px) {\n    .pcg-import-grid {\n        grid-template-columns: 1fr;\n    }\n\n    .pcg-import-card:nth-of-type(5) {\n        grid-column: auto;\n        width: 100%;\n    }\n\n    .pcg-import-product-image {\n        height: 260px;\n    }\n\n    .pcg-import-modal-grid {\n        grid-template-columns: 1fr;\n    }\n\n    .pcg-import-contact-inner {\n        grid-template-columns: 1fr;\n        gap: 24px;\n    }\n\n    .pcg-import-contact-button {\n        justify-self: start;\n    }\n}\n\n@media (max-width: 620px) {\n    .pcg-import-container {\n        width: min(100% - 28px, 1160px);\n    }\n\n    .pcg-import-hero {\n        padding: 37px 0 42px;\n    }\n\n    .pcg-import-hero h1 {\n        letter-spacing: -1px;\n    }\n\n    .pcg-import-hero-description {\n        font-size: 17px;\n    }\n\n    .pcg-import-products {\n        padding: 43px 0 55px;\n    }\n\n    .pcg-import-product-image {\n        height: 230px;\n    }\n\n    .pcg-import-card-content {\n        padding: 23px 20px;\n    }\n\n    .pcg-import-modal {\n        padding: 10px;\n    }\n\n    .pcg-import-dialog {\n        max-height: 94vh;\n    }\n\n    .pcg-import-modal-body {\n        padding: 24px 20px;\n    }\n\n    .pcg-import-form-grid {\n        grid-template-columns: 1fr;\n    }\n\n    .pcg-import-form-full {\n        grid-column: auto;\n    }\n}\n<\/style>\n\n<div class=\"pcg-import-page\">\n\n    <!-- HERO -->\n    <section class=\"pcg-import-hero\">\n        <div class=\"pcg-import-container\">\n            <div class=\"pcg-import-hero-content\">\n                <p class=\"pcg-import-eyebrow\">Imported Technology<\/p>\n\n                <h1>PCGuard Products<\/h1>\n\n                <p class=\"pcg-import-hero-description\">\n                    Explore our range of imported notebooks, portable screen attachments\n                    and display solutions designed to expand your workspace and support\n                    the way you work.\n                <\/p>\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <!-- PRODUCTS -->\n    <section class=\"pcg-import-products\">\n        <div class=\"pcg-import-container\">\n\n            <div class=\"pcg-import-heading\">\n                <p class=\"pcg-import-label\">Product Enquiry<\/p>\n\n                <h2>Find the Right Product for Your Setup<\/h2>\n\n                <p class=\"pcg-import-heading-description\">\n                    Click a product to view its picture and specifications. Select the\n                    products you are interested in and submit one quote request to PCGuard.\n                <\/p>\n            <\/div>\n\n            <div class=\"pcg-import-notice\">\n                <div class=\"pcg-import-notice-icon\">i<\/div>\n\n                <p>\n                    These products are imported and availability may change. Product\n                    specifications may also differ slightly between available models.\n                    PCGuard will confirm the current configuration, availability and\n                    price before completing your order.\n                <\/p>\n            <\/div>\n\n            <div class=\"pcg-import-grid\">\n\n                <!-- DOUBLE SCREEN ATTACHMENT -->\n                <article class=\"pcg-import-card\" data-import-card=\"double-screen\">\n                    <button class=\"pcg-import-image-button\" type=\"button\" data-import-view=\"double-screen\" aria-label=\"View Double Screen Attachment\">\n                        <img decoding=\"async\" class=\"pcg-import-product-image\" src=\"https:\/\/pcguard.co.za\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-21-160118.png\" alt=\"Double screen notebook attachment\">\n                    <\/button>\n\n                    <div class=\"pcg-import-card-content\">\n                        <p class=\"pcg-import-product-type\">Portable Display<\/p>\n                        <h3>Double Screen Attachment<\/h3>\n\n                        <p class=\"pcg-import-summary\">\n                            Add two portable displays to your compatible notebook and\n                            create a flexible three-screen workspace.\n                        <\/p>\n\n                        <div class=\"pcg-import-card-actions\">\n                            <button class=\"pcg-import-view-button\" type=\"button\" data-import-view=\"double-screen\">\n                                View Picture &amp; Specifications\n                            <\/button>\n\n                            <label class=\"pcg-import-select\">\n                                <input class=\"pcg-import-checkbox\" type=\"checkbox\" value=\"Double Screen Attachment\" data-import-id=\"double-screen\">\n                                <span>Add to quote request<\/span>\n                            <\/label>\n                        <\/div>\n                    <\/div>\n                <\/article>\n\n                <!-- SINGLE SCREEN ATTACHMENT -->\n                <article class=\"pcg-import-card\" data-import-card=\"single-screen\">\n                    <button class=\"pcg-import-image-button\" type=\"button\" data-import-view=\"single-screen\" aria-label=\"View Single Screen Attachment\">\n                        <img decoding=\"async\" class=\"pcg-import-product-image\" src=\"https:\/\/pcguard.co.za\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-21-160312-1.png\" alt=\"Single screen notebook attachment\">\n                    <\/button>\n\n                    <div class=\"pcg-import-card-content\">\n                        <p class=\"pcg-import-product-type\">Portable Display<\/p>\n                        <h3>Single Screen Attachment<\/h3>\n\n                        <p class=\"pcg-import-summary\">\n                            Add a compact second display directly to a compatible\n                            notebook for easier multitasking.\n                        <\/p>\n\n                        <div class=\"pcg-import-card-actions\">\n                            <button class=\"pcg-import-view-button\" type=\"button\" data-import-view=\"single-screen\">\n                                View Picture &amp; Specifications\n                            <\/button>\n\n                            <label class=\"pcg-import-select\">\n                                <input class=\"pcg-import-checkbox\" type=\"checkbox\" value=\"Single Screen Attachment\" data-import-id=\"single-screen\">\n                                <span>Add to quote request<\/span>\n                            <\/label>\n                        <\/div>\n                    <\/div>\n                <\/article>\n\n                <!-- STAND-ALONE SCREEN -->\n                <article class=\"pcg-import-card\" data-import-card=\"standalone-screen\">\n                    <button class=\"pcg-import-image-button\" type=\"button\" data-import-view=\"standalone-screen\" aria-label=\"View Stand-Alone Screen\">\n                        <img decoding=\"async\" class=\"pcg-import-product-image\" src=\"https:\/\/pcguard.co.za\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-21-161006.png\" alt=\"Single stand-alone portable display\">\n                    <\/button>\n\n                    <div class=\"pcg-import-card-content\">\n                        <p class=\"pcg-import-product-type\">Portable Display<\/p>\n                        <h3>Single Stand-Alone Screen<\/h3>\n\n                        <p class=\"pcg-import-summary\">\n                            A portable independent display for meetings, travel,\n                            presentations and additional workspace.\n                        <\/p>\n\n                        <div class=\"pcg-import-card-actions\">\n                            <button class=\"pcg-import-view-button\" type=\"button\" data-import-view=\"standalone-screen\">\n                                View Picture &amp; Specifications\n                            <\/button>\n\n                            <label class=\"pcg-import-select\">\n                                <input class=\"pcg-import-checkbox\" type=\"checkbox\" value=\"Single Stand-Alone Screen\" data-import-id=\"standalone-screen\">\n                                <span>Add to quote request<\/span>\n                            <\/label>\n                        <\/div>\n                    <\/div>\n                <\/article>\n\n                <!-- i5 TRIPLE-SCREEN NOTEBOOK -->\n                <article class=\"pcg-import-card\" data-import-card=\"i5-triple\">\n                    <button class=\"pcg-import-image-button\" type=\"button\" data-import-view=\"i5-triple\" aria-label=\"View i5 Triple-Screen Notebook\">\n                        <img decoding=\"async\" class=\"pcg-import-product-image\" src=\"https:\/\/pcguard.co.za\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-Aug-21-2026-04_10_50-PM.png\" alt=\"Intel Core i5 triple-screen notebook\">\n                    <\/button>\n\n                    <div class=\"pcg-import-card-content\">\n                        <p class=\"pcg-import-product-type\">\n                            Multi-Screen Notebook\n                        <\/p>\n\n                        <h3>i5 Triple-Screen Notebook<\/h3>\n\n                        <p class=\"pcg-import-summary\">\n                            A portable multi-screen workstation with an Intel Core i5\n                            processor and two integrated side displays.\n                        <\/p>\n\n                        <div class=\"pcg-import-card-actions\">\n                            <button class=\"pcg-import-view-button\" type=\"button\" data-import-view=\"i5-triple\">\n                                View Picture &amp; Specifications\n                            <\/button>\n\n                            <label class=\"pcg-import-select\">\n                                <input class=\"pcg-import-checkbox\" type=\"checkbox\" value=\"i5 Triple-Screen Notebook\" data-import-id=\"i5-triple\">\n                                <span>Add to quote request<\/span>\n                            <\/label>\n                        <\/div>\n                    <\/div>\n                <\/article>\n\n                <!-- i9 NOTEBOOK -->\n                <article class=\"pcg-import-card\" data-import-card=\"i9-notebook\">\n                    <button class=\"pcg-import-image-button\" type=\"button\" data-import-view=\"i9-notebook\" aria-label=\"View i9 Notebook\">\n                        <img decoding=\"async\" class=\"pcg-import-product-image\" src=\"https:\/\/pcguard.co.za\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-21-161220.png\" alt=\"Intel Core i9 notebook\">\n                    <\/button>\n\n                    <div class=\"pcg-import-card-content\">\n                        <p class=\"pcg-import-product-type\">\n                            Performance Notebook\n                        <\/p>\n\n                        <h3>i9 Notebook<\/h3>\n\n                        <p class=\"pcg-import-summary\">\n                            A high-performance notebook for professionals, creators\n                            and users working with demanding applications.\n                        <\/p>\n\n                        <div class=\"pcg-import-card-actions\">\n                            <button class=\"pcg-import-view-button\" type=\"button\" data-import-view=\"i9-notebook\">\n                                View Picture &amp; Specifications\n                            <\/button>\n\n                            <label class=\"pcg-import-select\">\n                                <input class=\"pcg-import-checkbox\" type=\"checkbox\" value=\"i9 Notebook\" data-import-id=\"i9-notebook\">\n                                <span>Add to quote request<\/span>\n                            <\/label>\n                        <\/div>\n                    <\/div>\n                <\/article>\n\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <!-- QUOTE BUTTON -->\n    <section class=\"pcg-import-quote-area\">\n        <div class=\"pcg-import-container\">\n            <h2>Request a Product Quote<\/h2>\n\n            <p>\n                Choose the products that interest you and PCGuard will confirm\n                the current availability, configuration and price.\n            <\/p>\n\n            <div>\n                <span class=\"pcg-import-selected-count\" id=\"pcgImportSelectedCount\">\n                    No products selected\n                <\/span>\n            <\/div>\n\n            <button class=\"pcg-import-main-quote\" id=\"pcgImportOpenQuote\" type=\"button\">\n                Get a Quote\n            <\/button>\n        <\/div>\n    <\/section>\n\n    <!-- ORDER PROCESS -->\n    <section class=\"pcg-import-process\">\n        <div class=\"pcg-import-container\">\n            <div class=\"pcg-import-process-heading\">\n                <p class=\"pcg-import-label\">Ordering Through PCGuard<\/p>\n                <h2>Personal Assistance from Enquiry to Setup<\/h2>\n            <\/div>\n\n            <div class=\"pcg-import-process-grid\">\n                <div class=\"pcg-import-process-card\">\n                    <div class=\"pcg-import-process-number\">01<\/div>\n                    <h3>Tell Us What You Need<\/h3>\n                    <p>\n                        Select the products that interest you and explain how you\n                        intend to use the equipment.\n                    <\/p>\n                <\/div>\n\n                <div class=\"pcg-import-process-card\">\n                    <div class=\"pcg-import-process-number\">02<\/div>\n                    <h3>We Confirm Availability<\/h3>\n                    <p>\n                        PCGuard checks the available stock, specifications and\n                        importing options.\n                    <\/p>\n                <\/div>\n\n                <div class=\"pcg-import-process-card\">\n                    <div class=\"pcg-import-process-number\">03<\/div>\n                    <h3>You Receive a Quote<\/h3>\n                    <p>\n                        We provide the available configuration and current pricing\n                        for your consideration.\n                    <\/p>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <!-- CONTACT -->\n    <section class=\"pcg-import-contact\">\n        <div class=\"pcg-import-container pcg-import-contact-inner\">\n            <div>\n                <h2>Not Sure What You\u2019re Looking For?<\/h2>\n\n                <p>\n                    Contact us and we\u2019ll help you find equipment suited to your\n                    requirements and budget.\n                <\/p>\n            <\/div>\n\n            <a class=\"pcg-import-contact-button\" href=\"https:\/\/pcguard.co.za\/contact\/\">\n                Contact Us\n            <\/a>\n        <\/div>\n    <\/section>\n\n<\/div>\n\n<!-- PRODUCT SPECIFICATIONS MODAL -->\n<div class=\"pcg-import-page pcg-import-modal\" id=\"pcgImportProductModal\" aria-hidden=\"true\">\n    <div class=\"pcg-import-dialog\" role=\"dialog\" aria-modal=\"true\" aria-labelledby=\"pcgImportModalTitle\">\n        <button class=\"pcg-import-modal-close\" id=\"pcgImportCloseProduct\" type=\"button\" aria-label=\"Close product details\">\n            \u00d7\n        <\/button>\n\n        <div class=\"pcg-import-modal-body\">\n            <div class=\"pcg-import-modal-grid\">\n                <div>\n                    <img decoding=\"async\" class=\"pcg-import-modal-image\" id=\"pcgImportModalImage\" src=\"\" alt=\"\">\n                <\/div>\n\n                <div>\n                    <p class=\"pcg-import-modal-type\" id=\"pcgImportModalType\"><\/p>\n\n                    <h2 id=\"pcgImportModalTitle\"><\/h2>\n\n                    <ul class=\"pcg-import-spec-list\" id=\"pcgImportModalSpecs\"><\/ul>\n\n                    <button class=\"pcg-import-modal-select\" id=\"pcgImportModalSelect\" type=\"button\">\n                        Add to Quote Request\n                    <\/button>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>\n\n<!-- QUOTE MODAL -->\n<div class=\"pcg-import-page pcg-import-modal\" id=\"pcgImportQuoteModal\" aria-hidden=\"true\">\n    <div class=\"pcg-import-dialog pcg-import-quote-dialog\" role=\"dialog\" aria-modal=\"true\" aria-labelledby=\"pcgImportQuoteTitle\">\n        <button class=\"pcg-import-modal-close\" id=\"pcgImportCloseQuote\" type=\"button\" aria-label=\"Close quote form\">\n            \u00d7\n        <\/button>\n\n        <div class=\"pcg-import-modal-body\">\n            <p class=\"pcg-import-modal-type\">Product Enquiry<\/p>\n            <h2 id=\"pcgImportQuoteTitle\">Request a Quote<\/h2>\n\n            <p class=\"pcg-import-form-intro\">\n                Complete your details below and PCGuard will receive your quote\n                request directly by email.\n            <\/p>\n\n            <div class=\"pcg-import-selected-box\">\n                <strong>Selected products:<\/strong>\n\n                <ul class=\"pcg-import-selected-list\" id=\"pcgImportQuoteList\"><\/ul>\n            <\/div>\n\n            <form id=\"pcgImportQuoteForm\">\n                <div class=\"pcg-import-honeypot\" aria-hidden=\"true\">\n                    <label for=\"pcgImportWebsite\">Website<\/label>\n                    <input id=\"pcgImportWebsite\" name=\"website\" type=\"text\" tabindex=\"-1\" autocomplete=\"off\">\n                <\/div>\n                <div class=\"pcg-import-form-grid\">\n\n                    <div class=\"pcg-import-form-field\">\n                        <label for=\"pcgImportName\">Name *<\/label>\n                        <input id=\"pcgImportName\" type=\"text\" required=\"\">\n                    <\/div>\n\n                    <div class=\"pcg-import-form-field\">\n                        <label for=\"pcgImportPhone\">Contact number *<\/label>\n                        <input id=\"pcgImportPhone\" type=\"tel\" required=\"\">\n                    <\/div>\n\n                    <div class=\"pcg-import-form-field\">\n                        <label for=\"pcgImportEmail\">Email address *<\/label>\n                        <input id=\"pcgImportEmail\" type=\"email\" required=\"\">\n                    <\/div>\n\n                    <div class=\"pcg-import-form-field\">\n                        <label for=\"pcgImportQuantity\">Estimated quantity<\/label>\n                        <input id=\"pcgImportQuantity\" type=\"number\" min=\"1\" value=\"1\">\n                    <\/div>\n\n                    <div class=\"pcg-import-form-field pcg-import-form-full\">\n                        <label for=\"pcgImportMessage\">\n                            Requirements or questions\n                        <\/label>\n\n                        <textarea id=\"pcgImportMessage\" placeholder=\"Tell us how you plan to use the equipment or which specifications are important to you.\"><\/textarea>\n                    <\/div>\n                <\/div>\n\n                <button class=\"pcg-import-send-button\" type=\"submit\">\n                    Send Quote Request\n                <\/button>\n\n                <p class=\"pcg-import-form-note\">\n                    Your request will be sent directly to PCGuard.\n                <\/p>\n\n                <div class=\"pcg-import-form-status\" id=\"pcgImportFormStatus\" role=\"status\" aria-live=\"polite\"><\/div>\n            <\/form>\n        <\/div>\n    <\/div>\n<\/div>\n\n<script>\n(function () {\n    \"use strict\";\n\n    var products = {\n        \"double-screen\": {\n            name: \"Double Screen Attachment\",\n            type: \"Portable Display\",\n            image: \"https:\/\/pcguard.co.za\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-21-160118.png\",\n            specs: [\n                \"Two portable 14-inch side displays\",\n                \"Creates a three-screen notebook workspace\",\n                \"Full HD display configuration\",\n                \"Suitable for multitasking, office work and travel\",\n                \"Folds away for transport and storage\",\n                \"Laptop size and connection compatibility must be confirmed\",\n                \"Final model and specifications depend on availability\"\n            ]\n        },\n\n        \"single-screen\": {\n            name: \"Single Screen Attachment\",\n            type: \"Portable Display\",\n            image: \"https:\/\/pcguard.co.za\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-21-160312-1.png\",\n            specs: [\n                \"14-inch portable notebook screen attachment\",\n                \"Full HD 1920 \u00d7 1080 display\",\n                \"16:9 aspect ratio\",\n                \"60Hz refresh rate\",\n                \"Approximately 300-nit brightness\",\n                \"PC and ABS construction\",\n                \"Laptop size and connection compatibility must be confirmed\"\n            ]\n        },\n\n        \"standalone-screen\": {\n            name: \"Single Stand-Alone Screen\",\n            type: \"Portable Display\",\n            image: \"https:\/\/pcguard.co.za\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-21-161006.png\",\n            specs: [\n                \"16-inch portable stand-alone display\",\n                \"1920 \u00d7 1200 resolution\",\n                \"16:10 aspect ratio\",\n                \"60Hz refresh rate\",\n                \"Approximately 300-nit brightness\",\n                \"PC and ABS construction\",\n                \"Suitable for travel, presentations and additional workspace\",\n                \"Device connection compatibility must be confirmed\"\n            ]\n        },\n\n        \"i5-triple\": {\n            name: \"i5 Triple-Screen Notebook\",\n            type: \"Multi-Screen Notebook\",\n            image: \"https:\/\/pcguard.co.za\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-Aug-21-2026-04_10_50-PM.png\",\n            specs: [\n                \"Intel Core i5 processor\",\n                \"Main notebook display with two integrated side displays\",\n                \"Designed for multi-application workflows\",\n                \"Suitable for business users and multitaskers\",\n                \"Memory and storage configuration confirmed when quoted\",\n                \"Windows configuration confirmed when quoted\",\n                \"Ports and connectivity confirmed according to available model\",\n                \"Final specifications depend on current imported stock\"\n            ]\n        },\n\n        \"i9-notebook\": {\n            name: \"i9 Notebook\",\n            type: \"Performance Notebook\",\n            image: \"https:\/\/pcguard.co.za\/wp-content\/uploads\/2026\/08\/Screenshot-2026-08-21-161220.png\",\n            specs: [\n                \"15.6-inch IPS display\",\n                \"2560 \u00d7 1440 2K resolution\",\n                \"Intel Core i9-12900HK processor\",\n                \"2.5GHz to 5.0GHz\",\n                \"14 cores and 20 threads\",\n                \"Intel Iris Xe Graphics\",\n                \"Windows 11 Pro\",\n                \"32GB DDR4 RAM, upgradeable to 64GB\",\n                \"1TB SSD, upgradeable to 2TB or 4TB\",\n                \"Wi-Fi 5 dual-band and Bluetooth 4.0\",\n                \"All-metal back cover\",\n                \"Backlit keyboard\",\n                \"Built-in 1MP camera\",\n                \"RJ45, USB Type-C, USB 3.0, USB 2.0, HDMI and audio ports\",\n                \"11.55V 5000mAh battery\",\n                \"Final availability and configuration must be confirmed\"\n            ]\n        }\n    };\n\n    var productModal = document.getElementById(\"pcgImportProductModal\");\n    var quoteModal = document.getElementById(\"pcgImportQuoteModal\");\n    var modalImage = document.getElementById(\"pcgImportModalImage\");\n    var modalType = document.getElementById(\"pcgImportModalType\");\n    var modalTitle = document.getElementById(\"pcgImportModalTitle\");\n    var modalSpecs = document.getElementById(\"pcgImportModalSpecs\");\n    var modalSelect = document.getElementById(\"pcgImportModalSelect\");\n    var selectedCount = document.getElementById(\"pcgImportSelectedCount\");\n    var quoteList = document.getElementById(\"pcgImportQuoteList\");\n    var activeProductId = null;\n\n    function openModal(modal) {\n        modal.classList.add(\"pcg-import-modal-open\");\n        modal.setAttribute(\"aria-hidden\", \"false\");\n        document.body.style.overflow = \"hidden\";\n    }\n\n    function closeModal(modal) {\n        modal.classList.remove(\"pcg-import-modal-open\");\n        modal.setAttribute(\"aria-hidden\", \"true\");\n\n        if (\n            !productModal.classList.contains(\"pcg-import-modal-open\") &&\n            !quoteModal.classList.contains(\"pcg-import-modal-open\")\n        ) {\n            document.body.style.overflow = \"\";\n        }\n    }\n\n    function selectedProducts() {\n        var checked = document.querySelectorAll(\n            \".pcg-import-checkbox:checked\"\n        );\n\n        return Array.prototype.map.call(\n            checked,\n            function (checkbox) {\n                return {\n                    id: checkbox.getAttribute(\"data-import-id\"),\n                    name: checkbox.value\n                };\n            }\n        );\n    }\n\n    function updateSelections() {\n        document.querySelectorAll(\".pcg-import-checkbox\").forEach(\n            function (checkbox) {\n                var productId = checkbox.getAttribute(\"data-import-id\");\n\n                var card = document.querySelector(\n                    '[data-import-card=\"' + productId + '\"]'\n                );\n\n                if (card) {\n                    card.classList.toggle(\n                        \"pcg-import-selected\",\n                        checkbox.checked\n                    );\n                }\n            }\n        );\n\n        var selected = selectedProducts();\n\n        if (selected.length === 0) {\n            selectedCount.textContent = \"No products selected\";\n        } else if (selected.length === 1) {\n            selectedCount.textContent = \"1 product selected\";\n        } else {\n            selectedCount.textContent =\n                selected.length + \" products selected\";\n        }\n    }\n\n    function showProduct(productId) {\n        var product = products[productId];\n\n        if (!product) {\n            return;\n        }\n\n        activeProductId = productId;\n\n        modalImage.src = product.image;\n        modalImage.alt = product.name;\n        modalType.textContent = product.type;\n        modalTitle.textContent = product.name;\n        modalSpecs.innerHTML = \"\";\n\n        product.specs.forEach(function (specification) {\n            var item = document.createElement(\"li\");\n            item.textContent = specification;\n            modalSpecs.appendChild(item);\n        });\n\n        var checkbox = document.querySelector(\n            '.pcg-import-checkbox[data-import-id=\"' +\n            productId +\n            '\"]'\n        );\n\n        modalSelect.textContent =\n            checkbox && checkbox.checked\n                ? \"Remove from Quote Request\"\n                : \"Add to Quote Request\";\n\n        openModal(productModal);\n    }\n\n    document.querySelectorAll(\"[data-import-view]\").forEach(\n        function (button) {\n            button.addEventListener(\"click\", function () {\n                showProduct(\n                    button.getAttribute(\"data-import-view\")\n                );\n            });\n        }\n    );\n\n    document.querySelectorAll(\".pcg-import-checkbox\").forEach(\n        function (checkbox) {\n            checkbox.addEventListener(\"change\", updateSelections);\n        }\n    );\n\n    modalSelect.addEventListener(\"click\", function () {\n        if (!activeProductId) {\n            return;\n        }\n\n        var checkbox = document.querySelector(\n            '.pcg-import-checkbox[data-import-id=\"' +\n            activeProductId +\n            '\"]'\n        );\n\n        if (checkbox) {\n            checkbox.checked = !checkbox.checked;\n            updateSelections();\n        }\n\n        closeModal(productModal);\n    });\n\n    document\n        .getElementById(\"pcgImportCloseProduct\")\n        .addEventListener(\"click\", function () {\n            closeModal(productModal);\n        });\n\n    document\n        .getElementById(\"pcgImportCloseQuote\")\n        .addEventListener(\"click\", function () {\n            closeModal(quoteModal);\n        });\n\n    document\n        .getElementById(\"pcgImportOpenQuote\")\n        .addEventListener(\"click\", function () {\n            var selected = selectedProducts();\n\n            if (selected.length === 0) {\n                alert(\n                    \"Please select at least one product before requesting a quote.\"\n                );\n                return;\n            }\n\n            quoteList.innerHTML = \"\";\n\n            selected.forEach(function (product) {\n                var item = document.createElement(\"li\");\n                item.textContent = product.name;\n                quoteList.appendChild(item);\n            });\n\n            openModal(quoteModal);\n        });\n\n    document\n        .getElementById(\"pcgImportQuoteForm\")\n        .addEventListener(\"submit\", async function (event) {\n            event.preventDefault();\n\n            var form = event.currentTarget;\n            var submitButton = form.querySelector(\".pcg-import-send-button\");\n            var status = document.getElementById(\"pcgImportFormStatus\");\n            status.className = \"pcg-import-form-status\";\n            status.textContent = \"\";\n\n            var selected = selectedProducts();\n\n            if (selected.length === 0) {\n                alert(\"Please select at least one product.\");\n                closeModal(quoteModal);\n                return;\n            }\n\n            var name = document\n                .getElementById(\"pcgImportName\")\n                .value.trim();\n\n            var phone = document\n                .getElementById(\"pcgImportPhone\")\n                .value.trim();\n\n            var email = document\n                .getElementById(\"pcgImportEmail\")\n                .value.trim();\n\n            var quantity = document\n                .getElementById(\"pcgImportQuantity\")\n                .value.trim();\n\n            var message = document\n                .getElementById(\"pcgImportMessage\")\n                .value.trim();\n\n            var formData = new FormData();\n            formData.append(\"action\", \"pcg_refurb_quote\");\n            formData.append(\"enquiry_type\", \"imported\");\n            formData.append(\"name\", name);\n            formData.append(\"phone\", phone);\n            formData.append(\"email\", email);\n            formData.append(\"quantity\", quantity || \"1\");\n            formData.append(\"message\", message);\n            formData.append(\"products\", JSON.stringify(selected.map(function (product) {\n                return product.name;\n            })));\n            formData.append(\"website\", document.getElementById(\"pcgImportWebsite\").value);\n\n            submitButton.disabled = true;\n            submitButton.textContent = \"Sending...\";\n\n            try {\n                var response = await fetch(\"\/wp-admin\/admin-ajax.php\", {\n                    method: \"POST\",\n                    body: formData,\n                    credentials: \"same-origin\"\n                });\n                var result = await response.json();\n\n                if (!response.ok || !result.success) {\n                    throw new Error(\n                        result.data && result.data.message\n                            ? result.data.message\n                            : \"The request could not be sent. Please try again.\"\n                    );\n                }\n\n                status.className = \"pcg-import-form-status is-success\";\n                status.textContent = \"Thank you. Your quote request has been sent to PCGuard.\";\n                form.reset();\n                document.querySelectorAll(\".pcg-import-checkbox\").forEach(function (checkbox) {\n                    checkbox.checked = false;\n                });\n                updateSelections();\n            } catch (error) {\n                status.className = \"pcg-import-form-status is-error\";\n                status.textContent = error.message || \"The request could not be sent. Please try again.\";\n            } finally {\n                submitButton.disabled = false;\n                submitButton.textContent = \"Send Quote Request\";\n            }\n        });\n\n    [productModal, quoteModal].forEach(function (modal) {\n        modal.addEventListener(\"click\", function (event) {\n            if (event.target === modal) {\n                closeModal(modal);\n            }\n        });\n    });\n\n    document.addEventListener(\"keydown\", function (event) {\n        if (event.key === \"Escape\") {\n            closeModal(productModal);\n            closeModal(quoteModal);\n        }\n    });\n\n    updateSelections();\n})();\n<\/script>\n<style>\n\/* =====================================================\n   ENLARGE PCGUARD IMPORTED PRODUCT CARDS\n   ===================================================== *\/\n\n.pcg-import-container {\n    width: min(1400px, calc(100% - 48px)) !important;\n}\n\n.pcg-import-grid {\n    display: grid !important;\n    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;\n    gap: 30px !important;\n}\n\n\/* Reset all previous grid positioning *\/\n.pcg-import-card,\n.pcg-import-card:nth-of-type(4),\n.pcg-import-card:nth-of-type(5) {\n    grid-column: auto !important;\n    width: auto !important;\n    max-width: none !important;\n    margin: 0 !important;\n}\n\n\/* Centre the fifth product *\/\n.pcg-import-card:nth-of-type(5) {\n    grid-column: 1 \/ -1 !important;\n    width: calc(50% - 15px) !important;\n    margin-right: auto !important;\n    margin-left: auto !important;\n}\n\n\/* Larger image section *\/\n.pcg-import-image-button {\n    width: 100% !important;\n    height: 335px !important;\n    overflow: hidden !important;\n}\n\n\/* Enlarge the product inside the image *\/\n.pcg-import-product-image {\n    width: 100% !important;\n    height: 100% !important;\n    padding: 5px !important;\n    object-fit: contain !important;\n    transform: scale(1.08);\n    transition: transform .25s ease;\n}\n\n.pcg-import-image-button:hover .pcg-import-product-image {\n    transform: scale(1.13);\n}\n\n\/* Slightly larger card wording *\/\n.pcg-import-card-content {\n    padding: 28px 30px 27px !important;\n}\n\n.pcg-import-card h3 {\n    font-size: 26px !important;\n}\n\n.pcg-import-summary {\n    font-size: 16px !important;\n}\n\n.pcg-import-view-button,\n.pcg-import-select {\n    min-height: 52px !important;\n    font-size: 15px !important;\n}\n\n\/* Tablet *\/\n@media (max-width: 900px) {\n    .pcg-import-container {\n        width: min(100% - 32px, 1400px) !important;\n    }\n\n    .pcg-import-card:nth-of-type(5) {\n        width: calc(50% - 15px) !important;\n    }\n}\n\n\/* Mobile *\/\n@media (max-width: 760px) {\n    .pcg-import-grid {\n        grid-template-columns: 1fr !important;\n    }\n\n    .pcg-import-card:nth-of-type(5) {\n        grid-column: auto !important;\n        width: 100% !important;\n    }\n\n    .pcg-import-image-button {\n        height: 285px !important;\n    }\n\n    .pcg-import-product-image {\n        transform: scale(1.04);\n    }\n\n    .pcg-import-image-button:hover .pcg-import-product-image {\n        transform: scale(1.08);\n    }\n}\n\n@media (max-width: 480px) {\n    .pcg-import-container {\n        width: calc(100% - 26px) !important;\n    }\n\n    .pcg-import-image-button {\n        height: 235px !important;\n    }\n\n    .pcg-import-card-content {\n        padding: 23px 20px !important;\n    }\n}\n<\/style>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Imported Technology PCGuard Products Explore our range of imported notebooks, portable screen attachments and display solutions designed to expand your workspace and support the way you work. Product Enquiry Find the Right Product for Your Setup Click a product to view its picture and specifications. Select the products you are interested in and submit one [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"pagelayer_contact_templates":[],"_pagelayer_content":"","footnotes":""},"class_list":["post-482","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/pcguard.co.za\/index.php?rest_route=\/wp\/v2\/pages\/482","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pcguard.co.za\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/pcguard.co.za\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/pcguard.co.za\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/pcguard.co.za\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=482"}],"version-history":[{"count":7,"href":"https:\/\/pcguard.co.za\/index.php?rest_route=\/wp\/v2\/pages\/482\/revisions"}],"predecessor-version":[{"id":521,"href":"https:\/\/pcguard.co.za\/index.php?rest_route=\/wp\/v2\/pages\/482\/revisions\/521"}],"wp:attachment":[{"href":"https:\/\/pcguard.co.za\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=482"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}