:root {
    --purple: #65004f;
    --purple-dark: #430035;
    --black: #17181d;
    --text: #202229;
    --muted: #737781;
    --line: #e4e5e8;
    --soft: #f5f5f6;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    color: var(--text);
    background: #fff;
    font-family: Arial, Helvetica, sans-serif;
}

a {
    color: inherit;
    text-decoration: none;
}

.site-header {
    height: 76px;
    padding: 0 5%;
    display: flex;
    align-items: center;
    gap: 60px;
    border-bottom: 1px solid var(--line);
    background: #fff;
    position: relative;
    z-index: 10;
}

.brand {
    width: 170px;
    display: block;
}

.brand img {
    display: block;
    width: 100%;
    height: auto;
}

.site-header nav {
    display: flex;
    gap: 34px;
    align-items: center;
    flex: 1;
}

.site-header nav a {
    font-size: 14px;
    font-weight: 600;
}

.header-actions {
    display: flex;
    align-items: center;
    gap: 25px;
}

.header-actions button {
    border: 0;
    background: transparent;
    font-size: 25px;
    cursor: pointer;
}

.cart {
    font-size: 14px;
    font-weight: 600;
}

.cart span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    margin-left: 5px;
    border-radius: 50%;
    background: var(--purple);
    color: white;
    font-size: 10px;
}


.hero {
    min-height: 505px;
    display: grid;
    grid-template-columns: 46% 54%;
    background: var(--black);
    color: white;
}

.hero-copy {
    padding: 70px 7% 50px 8%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.eyebrow {
    color: #d00065;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 2px;
}

.hero h1 {
    margin: 18px 0;
    font-size: clamp(44px, 4.5vw, 70px);
    line-height: .98;
    letter-spacing: -3px;
}

.hero h1 em {
    color: #b90083;
    font-style: normal;
}

.hero-copy > p {
    max-width: 540px;
    margin: 0 0 28px;
    color: #d5d6da;
    font-size: 17px;
    line-height: 1.55;
}

.hero-search {
    max-width: 620px;
    height: 58px;
    display: flex;
    background: white;
    border-radius: 7px;
    overflow: hidden;
}

.hero-search input {
    min-width: 0;
    flex: 1;
    padding: 0 20px;
    border: 0;
    outline: 0;
    font-size: 15px;
}

.hero-search button {
    width: 64px;
    border: 0;
    background: var(--purple);
    color: white;
    font-size: 25px;
}

.usp-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 32px;
}

.usp-row div {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.usp-row b {
    font-size: 12px;
}

.usp-row span {
    color: #9fa1a8;
    font-size: 10px;
    line-height: 1.35;
}

.hero-visual {
    position: relative;
    overflow: hidden;
    min-height: 505px;
    background:
        radial-gradient(circle at 25% 25%, #45454a, transparent 32%),
        linear-gradient(135deg, #222329, #08090b);
}

.hero-visual:after {
    content: "";
    position: absolute;
    width: 420px;
    height: 520px;
    right: 8%;
    top: -45px;
    transform: rotate(10deg);
    background: linear-gradient(145deg, #303036, #08090b);
    box-shadow: 0 30px 70px #000;
}

.hero-paper {
    position: absolute;
    z-index: 2;
    padding: 25px;
    background: white;
    color: var(--purple);
    font-weight: 900;
    box-shadow: 0 25px 50px #0009;
}

.paper-one {
    width: 320px;
    height: 190px;
    top: 75px;
    left: 12%;
    transform: rotate(-7deg);
}

.paper-two {
    width: 250px;
    height: 110px;
    left: 28%;
    bottom: 65px;
    background: #111;
    color: white;
    transform: rotate(5deg);
}

.hero-message {
    position: absolute;
    z-index: 3;
    right: 14%;
    bottom: 80px;
    color: white;
    font-size: 34px;
    line-height: 1.05;
    text-align: right;
}

.hero-message strong {
    color: #c10087;
}


.categories,
.popular {
    max-width: 1400px;
    margin: auto;
    padding: 65px 5% 25px;
}

.section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 28px;
}

.section-head h2 {
    margin: 8px 0 0;
    font-size: 32px;
    letter-spacing: -1.5px;
}

.section-head > a {
    color: var(--purple);
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 5px;
}

.category-showcase {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: 220px;
    gap: 14px;
}

.category-tile {
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    background: linear-gradient(135deg, #303036, #777);
}

.category-tile:before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(transparent 25%, #000b);
}

.tile-1 {
    background: linear-gradient(135deg, #6b4d3e, #1f1b1b);
}

.tile-2 {
    background: linear-gradient(135deg, #68737d, #101217);
}

.tile-3 {
    background: linear-gradient(135deg, #44434b, #111116);
}

.tile-4 {
    background: linear-gradient(135deg, #6e7075, #151519);
}

.tile-5 {
    background: linear-gradient(135deg, #8a8a86, #242429);
}

.tile-6 {
    background: linear-gradient(135deg, #514d54, #141419);
}

.tile-content {
    position: absolute;
    z-index: 2;
    left: 20px;
    right: 20px;
    bottom: 18px;
    color: white;
}

.tile-content h3 {
    margin: 0 0 13px;
    font-size: 21px;
    line-height: 1.05;
}

.tile-content span {
    display: inline-block;
    padding: 10px 13px;
    border-radius: 5px;
    background: white;
    color: var(--text);
    font-size: 11px;
    font-weight: 700;
}


.popular {
    padding-top: 45px;
    padding-bottom: 65px;
}

.popular-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 14px;
}

.popular-card {
    border: 1px solid var(--line);
    border-radius: 9px;
    overflow: hidden;
    transition: .2s ease;
}

.popular-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 15px 35px #16182112;
}

.popular-image {
    height: 175px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--soft);
}

.popular-image span {
    font-size: 34px;
    font-weight: 900;
    color: var(--purple);
}

.popular-info {
    padding: 15px;
}

.popular-info h3 {
    min-height: 36px;
    margin: 0 0 14px;
    font-size: 14px;
    line-height: 1.25;
}

.popular-info div {
    display: flex;
    justify-content: space-between;
    color: var(--muted);
    font-size: 11px;
}

.popular-info strong {
    color: var(--purple);
    font-size: 18px;
}


.feature-strip {
    max-width: 1400px;
    margin: 0 auto 65px;
    padding: 28px 35px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
    border-radius: 10px;
    background: var(--black);
    color: white;
}

.feature-strip div {
    padding-right: 25px;
    border-right: 1px solid #ffffff22;
}

.feature-strip div:last-child {
    border: 0;
}

.feature-strip strong {
    display: block;
    margin-bottom: 8px;
    color: #bd0080;
    font-size: 23px;
}

.feature-strip h3 {
    margin: 0 0 7px;
    font-size: 15px;
}

.feature-strip p {
    margin: 0;
    color: #a7a8ae;
    font-size: 11px;
    line-height: 1.45;
}


.site-footer {
    padding: 55px 8%;
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 50px;
    background: #202128;
    color: white;
}

.site-footer div {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.site-footer strong {
    font-size: 13px;
}

.site-footer p,
.site-footer a {
    margin: 0;
    color: #999ba2;
    font-size: 12px;
}


@media (max-width: 900px) {
    .site-header {
        gap: 25px;
        padding: 0 20px;
    }

    .site-header nav {
        display: none;
    }

    .hero {
        grid-template-columns: 1fr;
    }

    .hero-visual {
        display: none;
    }

    .category-showcase {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: repeat(3, 190px);
    }

    .tile-1,
    .tile-2 {
        grid-row: span 1;
    }

    .popular-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .feature-strip {
        margin-left: 20px;
        margin-right: 20px;
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 550px) {
    .hero-copy {
        padding: 45px 20px;
    }

    .usp-row {
        grid-template-columns: 1fr 1fr;
    }

    .categories,
    .popular {
        padding-left: 20px;
        padding-right: 20px;
    }

    .category-showcase {
        grid-template-columns: 1fr;
        grid-template-rows: repeat(6, 180px);
    }

    .popular-grid {
        grid-template-columns: 1fr 1fr;
    }

    .feature-strip {
        grid-template-columns: 1fr;
    }

    .site-footer {
        grid-template-columns: 1fr;
    }
}

/* PRODUCT PAGE */

.product-page {
    max-width: 1400px;
    margin: 0 auto;
    padding: 45px 5% 80px;
}

.product-breadcrumbs {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-bottom: 35px;
    color: var(--muted);
    font-size: 13px;
}

.product-breadcrumbs strong {
    color: var(--text);
}

.product-layout {
    display: grid;
    grid-template-columns: minmax(320px, .9fr) minmax(520px, 1.4fr);
    gap: 70px;
    align-items: start;
}

.product-summary {
    position: sticky;
    top: 105px;
}

.product-placeholder {
    min-height: 420px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 30px;
    border-radius: 12px;
    background: var(--soft);
}

.product-placeholder span {
    color: var(--purple);
    font-size: 68px;
    font-weight: 900;
}

.product-summary h1 {
    margin: 0 0 10px;
    font-size: 38px;
    line-height: 1.05;
    letter-spacing: -1.5px;
}

.product-code {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
}

.product-configurator {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
}

.config-group {
    padding: 28px 30px;
    border-bottom: 1px solid var(--line);
}

.config-group:last-child {
    border-bottom: 0;
}

.config-group h2 {
    margin: 0 0 22px;
    font-size: 20px;
    letter-spacing: -.5px;
}

.config-field {
    margin-bottom: 20px;
}

.config-field:last-child {
    margin-bottom: 0;
}

.config-field label {
    display: block;
    margin-bottom: 8px;
    font-size: 13px;
    font-weight: 700;
}

.config-field label span {
    color: var(--purple);
}

.config-field select {
    width: 100%;
    min-height: 48px;
    padding: 0 14px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: white;
    color: var(--text);
    font-size: 14px;
}

.config-field select:focus {
    outline: 2px solid #65004f20;
    border-color: var(--purple);
}

.config-field select option:disabled {
    color: #b8bac0;
}

@media (max-width: 900px) {
    .product-layout {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .product-summary {
        position: static;
    }

    .product-placeholder {
        min-height: 300px;
    }
}

@media (max-width: 550px) {
    .product-page {
        padding: 30px 20px 55px;
    }

    .product-summary h1 {
        font-size: 30px;
    }

    .config-group {
        padding: 22px 18px;
    }
}

/* PRINTGROUP FINAL DESIGN */

:root {
    --purple: #65004f;
    --purple-dark: #430035;
    --black: #17181d;
    --text: #202229;
    --muted: #737781;
    --line: #e4e5e8;
    --soft: #f5f5f6;
}

body {
    background:#fff;
    color:var(--text);
    font-family:Arial,Helvetica,sans-serif;
}

.site-header {
    height:82px;
    padding:0 5%;
    gap:55px;
    border-bottom:1px solid #eee;
    box-shadow:0 2px 12px #00000008;
}

.brand { width:175px; }

.site-header nav { gap:32px; }

.site-header nav a {
    font-size:14px;
    font-weight:600;
}

.header-actions { gap:22px; }

.hero {
    min-height:560px;
    grid-template-columns:48% 52%;
    background:#17181d;
}

.hero-copy {
    padding:70px 7% 60px 9%;
}

.eyebrow {
    color:#bd0080;
    font-size:12px;
    letter-spacing:2.5px;
}

.hero h1 {
    margin:18px 0 22px;
    max-width:650px;
    font-size:clamp(48px,5vw,76px);
    line-height:.96;
    letter-spacing:-4px;
}

.hero h1 em { color:#bd0080; }

.hero-copy > p {
    max-width:560px;
    margin-bottom:30px;
    font-size:17px;
}

.hero-search {
    max-width:590px;
    height:60px;
    border-radius:8px;
}

.hero-search button {
    width:68px;
    background:var(--purple);
}

.usp-row {
    grid-template-columns:repeat(4,1fr);
    gap:18px;
    margin-top:34px;
}

.usp-row b { font-size:12px; }
.usp-row span { font-size:10px; }

.hero-visual {
    min-height:560px;
    background:
        radial-gradient(circle at 25% 25%,#44454b 0,#25262b 28%,transparent 55%),
        linear-gradient(135deg,#292a30,#090a0c);
}

.hero-visual:before {
    content:"";
    position:absolute;
    z-index:2;
    width:390px;
    height:245px;
    left:10%;
    top:85px;
    background:linear-gradient(145deg,#fff,#dedee1);
    transform:rotate(-7deg);
    box-shadow:0 30px 65px #0009;
}

.hero-visual:after {
    width:390px;
    height:490px;
    right:8%;
    top:-5px;
    transform:rotate(7deg);
    background:linear-gradient(145deg,#292a30,#08090b);
}

.hero-message {
    right:15%;
    bottom:82px;
    font-size:38px;
    line-height:1;
}

.hero-message strong { color:#bd0080; }

.categories,
.popular {
    max-width:1500px;
    padding:72px 5% 30px;
}

.section-head {
    margin-bottom:30px;
}

.section-head h2 {
    font-size:36px;
    letter-spacing:-1.8px;
}

.section-head > a {
    color:var(--purple);
}

.category-showcase {
    display:grid;
    grid-template-columns:repeat(6,1fr);
    grid-template-rows:230px;
    gap:14px;
}

.category-tile {
    min-height:230px;
    border-radius:12px;
    box-shadow:0 8px 25px #00000012;
    transition:transform .2s ease,box-shadow .2s ease;
}

.category-tile:hover {
    transform:translateY(-4px);
    box-shadow:0 16px 35px #00000020;
}

.category-tile:before {
    background:linear-gradient(transparent 20%,#000c);
}

.tile-1 { background:linear-gradient(135deg,#806456,#211c1b); }
.tile-2 { background:linear-gradient(135deg,#73818d,#15191e); }
.tile-3 { background:linear-gradient(135deg,#68646d,#18171c); }
.tile-4 { background:linear-gradient(135deg,#73777d,#17191c); }
.tile-5 { background:linear-gradient(135deg,#9b9b96,#29292b); }
.tile-6 { background:linear-gradient(135deg,#67616b,#18171c); }

.tile-content {
    left:20px;
    right:20px;
    bottom:20px;
}

.tile-content h3 {
    font-size:20px;
    line-height:1.05;
}

.tile-content span {
    padding:9px 12px;
    border-radius:5px;
}

.popular {
    padding-top:55px;
    padding-bottom:75px;
}

.popular-grid {
    grid-template-columns:repeat(6,1fr);
    gap:16px;
}

.popular-card {
    background:#fff;
    border:1px solid #e5e5e7;
    border-radius:12px;
}

.popular-image {
    height:185px;
    background:#f3f3f4;
}

.popular-info { padding:17px; }

.popular-info h3 { font-size:15px; }

.feature-strip {
    max-width:1400px;
    margin:0 auto 75px;
    border-radius:12px;
    padding:32px 38px;
}

.site-footer {
    padding:60px 8%;
}

/* responsive */
@media (max-width:1200px) {
    .category-showcase {
        grid-template-columns:repeat(3,1fr);
        grid-template-rows:repeat(2,210px);
    }
    .popular-grid {
        grid-template-columns:repeat(3,1fr);
    }
}

@media (max-width:900px) {
    .site-header { padding:0 20px; }
    .hero { grid-template-columns:1fr; }
    .hero-visual { min-height:350px; }
    .category-showcase {
        grid-template-columns:repeat(2,1fr);
        grid-template-rows:repeat(3,190px);
    }
    .popular-grid { grid-template-columns:repeat(2,1fr); }
}

@media (max-width:550px) {
    .hero-copy { padding:45px 20px; }
    .hero h1 {
        font-size:42px;
        letter-spacing:-2px;
    }
    .usp-row { grid-template-columns:1fr 1fr; }
    .category-showcase {
        grid-template-columns:1fr;
        grid-template-rows:repeat(6,180px);
    }
    .popular-grid { grid-template-columns:1fr 1fr; }
}


/* PRINTGROUP HOMEPAGE PROPORTIONS */

main {
    width: 100%;
}

.hero {
    min-height: 540px;
    grid-template-columns: 50% 50%;
}

.hero-copy {
    padding-left: 7%;
    padding-right: 6%;
}

.hero h1 {
    font-size: clamp(52px, 5vw, 78px);
}

.hero-visual {
    min-height: 540px;
}

.categories,
.popular {
    max-width: 1500px;
    padding-left: 3.5%;
    padding-right: 3.5%;
}

.section-head {
    margin-bottom: 24px;
}

.section-head h2 {
    font-size: 36px;
}

.category-showcase {
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: 250px;
    gap: 12px;
}

.category-tile {
    min-height: 250px;
}

.tile-content {
    left: 18px;
    right: 18px;
    bottom: 18px;
}

.tile-content h3 {
    font-size: 19px;
}

.popular {
    padding-top: 60px;
    padding-bottom: 70px;
}

.popular-grid {
    grid-template-columns: repeat(6, 1fr);
    gap: 12px;
}

.popular-image {
    height: 210px;
}

.popular-info {
    padding: 16px;
}

.feature-strip {
    max-width: 1420px;
    margin-left: auto;
    margin-right: auto;
}

@media (max-width: 1200px) {
    .categories,
    .popular {
        padding-left: 3%;
        padding-right: 3%;
    }

    .category-showcase {
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(2, 220px);
    }

    .category-tile {
        min-height: 220px;
    }

    .popular-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 900px) {
    .hero {
        grid-template-columns: 1fr;
    }

    .hero-visual {
        min-height: 360px;
    }

    .category-showcase {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(3, 200px);
    }

    .popular-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 550px) {
    .category-showcase {
        grid-template-columns: 1fr;
        grid-template-rows: repeat(6, 180px);
    }

    .popular-grid {
        grid-template-columns: 1fr 1fr;
    }
}


/* PRINTGROUP - STRONGER DESKTOP COMPOSITION */

.site-header {
    height: 88px;
    padding: 0 5%;
}

.brand {
    width: 185px;
}

.hero {
    min-height: 610px;
    grid-template-columns: 48% 52%;
}

.hero-copy {
    padding: 85px 8% 70px 7%;
}

.hero h1 {
    max-width: 720px;
    font-size: clamp(58px, 5.4vw, 86px);
    line-height: .94;
}

.hero-copy > p {
    max-width: 590px;
    font-size: 18px;
}

.hero-search {
    max-width: 650px;
    height: 64px;
}

.hero-visual {
    min-height: 610px;
}

.hero-visual:before {
    width: 470px;
    height: 300px;
    left: 8%;
    top: 75px;
}

.hero-visual:after {
    width: 440px;
    height: 560px;
    right: 4%;
}

.hero-message {
    right: 12%;
    bottom: 90px;
    font-size: 42px;
}

.categories,
.popular {
    max-width: 1550px;
    padding-left: 2.5%;
    padding-right: 2.5%;
}

.categories {
    padding-top: 82px;
}

.section-head h2 {
    font-size: 40px;
}

.category-showcase {
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: 285px;
    gap: 14px;
}

.category-tile {
    min-height: 285px;
}

.tile-content {
    left: 22px;
    right: 22px;
    bottom: 22px;
}

.tile-content h3 {
    font-size: 21px;
}

.popular {
    padding-top: 70px;
    padding-bottom: 85px;
}

.popular-grid {
    grid-template-columns: repeat(6, 1fr);
    gap: 14px;
}

.popular-image {
    height: 240px;
}

.popular-info {
    padding: 18px;
}

.popular-info h3 {
    font-size: 16px;
}

.feature-strip {
    max-width: 1450px;
    padding: 35px 45px;
    margin-bottom: 85px;
}

@media (max-width: 1200px) {
    .category-showcase {
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(2, 240px);
    }

    .category-tile {
        min-height: 240px;
    }

    .popular-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .popular-image {
        height: 210px;
    }
}


/* LEESBAARHEID HOMEPAGE */

.feature-strip {
    padding: 38px 45px;
}

.feature-strip strong {
    font-size: 26px;
    margin-bottom: 10px;
}

.feature-strip h3 {
    font-size: 18px;
    margin-bottom: 9px;
}

.feature-strip p {
    font-size: 14px;
    line-height: 1.5;
}

.tile-content h3 {
    font-size: 20px;
    line-height: 1.12;
}

.tile-content span {
    font-size: 12px;
}

/* PRINTGROUP HOMEPAGE */

.pg-header-final{height:96px;padding:0 5%;display:flex;align-items:center;gap:50px;background:#fff;border-bottom:1px solid #e5e5e7;box-sizing:border-box}
.pg-header-logo{width:210px;flex:0 0 210px;display:flex;align-items:center}
.pg-header-logo img{width:190px;height:auto;display:block}
.pg-header-nav{flex:1;display:flex;justify-content:center;align-items:center;gap:42px}
.pg-header-nav a{font-size:17px;font-weight:600;color:#17181d;text-decoration:none;white-space:nowrap}
.pg-header-actions{display:flex;align-items:center;gap:27px}
.pg-header-actions button{border:0;background:none;padding:0;font-size:30px;color:#17181d}
.pg-header-cart{font-size:16px;font-weight:600;color:#17181d;text-decoration:none;white-space:nowrap}
.pg-header-cart span{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;margin-left:5px;border-radius:50%;background:#bd0080;color:#fff;font-size:11px}

.pg-home-hero{width:100%;height:600px;display:grid;grid-template-columns:46% 54%;background:#fff;overflow:hidden}
.pg-home-hero-copy{display:flex;flex-direction:column;justify-content:center;padding:40px 50px 40px 7%;background:#fff}
.pg-home-hero-copy h1{margin:0 0 25px;font-size:clamp(52px,5vw,76px);line-height:.98;letter-spacing:-3.5px;font-weight:800;color:#17181d}
.pg-home-hero-copy h1 strong{color:#bd0080}
.pg-home-hero-copy p{margin:0 0 35px;font-size:21px;line-height:1.45;color:#292b31}
.pg-home-button{width:max-content;display:inline-flex;align-items:center;gap:28px;padding:16px 23px 16px 27px;border-radius:8px;background:#bd0080;color:#fff!important;text-decoration:none!important;font-size:18px;font-weight:700}
.pg-home-button span{font-size:30px;line-height:1}
.pg-home-hero-image{height:600px;overflow:hidden;background:#fff}
.pg-home-hero-image img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}

.pg-home-popular{padding:35px 7% 50px;background:#fff}
.pg-home-popular h2{margin:0 0 25px;font-size:31px;line-height:1.1;color:#17181d}
.pg-home-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:22px}
.pg-home-cards a{height:96px;padding:0 21px;display:flex;align-items:center;gap:17px;background:#fff;border:1px solid #e8e8eb;border-radius:9px;box-shadow:0 7px 20px rgba(0,0,0,.07);color:#17181d!important;text-decoration:none!important}
.pg-home-cards i{width:40px;flex:0 0 40px;text-align:center;color:#bd0080;font-style:normal;font-size:36px}
.pg-home-cards strong{font-size:17px;font-weight:700}
.pg-home-cards b{margin-left:auto;font-size:32px;font-weight:300}

@media(max-width:1050px){
.pg-header-final{gap:25px}.pg-header-nav{gap:20px}.pg-home-cards{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:750px){
.pg-header-final{height:auto;min-height:76px;padding:15px 25px;flex-wrap:wrap}
.pg-header-logo{width:170px;flex-basis:170px}.pg-header-logo img{width:160px}
.pg-header-nav{order:3;width:100%;overflow:auto;justify-content:flex-start}
.pg-home-hero{height:auto;grid-template-columns:1fr}
.pg-home-hero-copy{padding:55px 30px 45px}
.pg-home-hero-image{height:420px}
.pg-home-cards{grid-template-columns:1fr}
}