@import url('https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,200..800;1,6..72,200..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,200..800&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Hanken+Grotesk:ital,wght@0,100..900;1,100..900&display=swap');


:root {
    --primary-color: #1A1612;
    --font-primary: 'Inter';
    --font-secondary: 'Newsreader';
    --white-color: #fff;
}

.logo {
    max-width: 90px;
}

.navigation ul li a {
    color: rgba(155, 152, 152, .75);
}

.navigation ul li button svg {
    stroke: rgba(155, 152, 152, .75);
}

.currency_switcher .form-select {
    padding: 0 20px 0 0;
    border: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' stroke='rgba(155, 152, 152, .75)' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' viewBox='0 0 24 24' class='transition-transform group-aria-expanded:rotate-180' aria-hidden='true'%3E%3Cpath d='m6 9 6 6 6-6'%3E%3C/path%3E%3C/svg%3E");
    background-position: right;
    color: rgba(155, 152, 152, .75);
}

.currency_switcher nav button {
    color: rgba(155, 152, 152, .75);
}

.navigation nav .hover\:border-primary:hover {
    border-color: rgba(155, 152, 152, .75);
}

#menu-search-icon,
#customer-menu,
#menu-cart-icon {
    padding: 0;
    border: none;
}

#menu-search-icon:hover,
#customer-menu:hover,
#menu-cart-icon:hover {
    background: none;
}

#menu-search-icon svg,
#customer-menu svg,
#menu-cart-icon svg {
    stroke: rgba(155, 152, 152, .75);
}

.header-right {
    gap: 10px;
}

.home_bannerslider {
    padding: 4rem 10rem;
}

.home_bannerslider .panth-banner-slider {
    padding: 0;
}

.page-wrapper {
    background-color: #f4ecdd;
}

.product-info-main .page-title {
    font-size: 42px;
    line-height: 44px;
    letter-spacing: -.21px;
    color: var(--primary-color);
    font-family: var(--font-secondary);
    font-weight: 500;
}

.leading-relaxed.short-description {
    font-size: 14px;
    line-height: 25px;
    color: #4A413A;
    font-family: var(--font-primary);
    font-style: normal;
    margin-bottom: 29px;
}

.product-option-label-title {
    font-size: 12px;
    line-height: 19px;
    color: #7B6E62;
    letter-spacing: 1.44px;
}

.product-option-label-value {
    font-size: 15px;
    line-height: 24px;
    color: var(--primary-color);
    font-family: var(--font-secondary);
}

.swatch-attribute .swatch-attribute-options .swatch-option input {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    z-index: 0;
    box-shadow: 0 0 1px rgba(0, 0, 0, .3) inset;
    padding: 0;
    margin: 0;
    min-width: unset;
    opacity: 1;
    background: none;
}

.swatch-attribute .swatch-attribute-options .swatch-option .attribute_lable_show {
    font-size: 12px;
    line-height: 19px;
    color: var(--primary-color);
}

.swatch-attribute .swatch-attribute-options .swatch-option {
    gap: 5px;
    width: 96px;
    height: 75px;
    border: 1px solid #D8CDB6;
    background: #FAF5EA;
    border-radius: 6px;
    padding: 0;
    margin: 0;
}

.swatch-attribute-options {
    gap: 7px;
}

.swatch-attribute .swatch-attribute-options .swatch-option.ring {
    border-color: var(--primary-color);
    box-shadow: none;
}

.swatch-attribute.bundle .swatch-attribute-options {
    flex-direction: column;
}

.swatch-attribute.bundle .swatch-attribute-options .swatch-option-box {
    width: 100%;
}

.swatch-attribute.bundle .swatch-attribute-options .swatch-option {
    width: 100%;
    flex-direction: row;
    justify-content: space-between;
    padding: 18px 20px;
    height: auto;
    min-height: 88px;
}

.swatch-attribute.bundle .swatch-attribute-options .swatch-option input {
    width: 18px;
    height: 18px;
    border: 1px solid var(--primary-color);
    background: none;
    position: relative;
}

.swatch-attribute.bundle .swatch-attribute-options .swatch-option input:checked::after {
    width: 10px;
    height: 10px;
    background: var(--primary-color);
    content: "";
    position: absolute;
    border-radius: 50%;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.swatch-attribute.bundle .swatch-attribute-options .swatch-option .swatch-bundle-books {
    font-size: 18px;
    line-height: 28px;
    color: var(--primary-color);
    font-family: var(--font-secondary);
    font-weight: 500;
    max-width: calc(100% - 100px);
}

.swatch-attribute.bundle .swatch-attribute-options .swatch-option .swatch-bundle-price {
    font-size: 20px;
    line-height: 31px;
    font-family: var(--font-secondary);
    color: var(--primary-color);
    font-weight: 500;
}

.swatch-attribute.bundle .swatch-attribute-options .swatch-option .swatch-bundle-price span {
    font-size: inherit;
    line-height: inherit;
    font-weight: inherit;
    color: inherit;
}

.swatch-attribute.bundle .swatch-attribute-options .swatch-option .swatch-bundle-price .actual_price {
    font-size: 11px;
    line-height: 19px;
    color: #7B6E62;
    font-family: var(--font-primary);
    text-decoration: line-through;
}

.swatch-attribute.bundle .swatch-attribute-options .swatch-option.ring {
    background: #ECE2CE;
}

.swatch-attribute.bundle {
    margin-top: 28px;
}

.product-options-wrapper-gift {
    border: 1px solid #D8CDB6;
    background: #FAF5EA;
    border-radius: 8px;
}

.product-options-wrapper-gift .Gift>label {
    display: none;
}

.product-options-wrapper-gift .Gift .field .form-checkbox {
    appearance: none;
    width: 36px;
    height: 20px;
    background: var(--primary-color);
    border-radius: 30px;
    position: relative;
    cursor: pointer;
}

.product-options-wrapper-gift .Gift .field .form-checkbox::after {
    content: "";
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--white-color);
    position: absolute;
    left: 2px;
    transition: all .3s linear;
    top: 2px;
}

.product-options-wrapper-gift .Gift .field .form-checkbox:checked::after {
    left: calc(100% - 18px);
}

.product-options-wrapper-gift .Gift .field .form-checkbox:checked {
    background: #7A2E2E;
}

.product-options-wrapper-gift .Gift .field {
    margin: 0;
    display: flex;
    gap: 14px;
}

.product-options-wrapper-gift .Gift .field label {
    font-size: 17px;
    line-height: 26px;
    color: var(--primary-color);
    font-family: var(--font-secondary);
    font-weight: 500;
    margin: 0;
}

.product-options-wrapper-gift .flex.Gift {
    padding: 33px 20px 18px 20px;
    border: none;
}

.product-options-wrapper-gift .flex.Wrap {
    border-color: #D8CDB6;
    padding-top: 18px;
}

.product-options-wrapper-gift .flex .label span:first-child {
    font-size: 13px;
    line-height: 20px;
    font-family: var(--font-primary);
    color: var(--primary-color);
}

.product-options-wrapper-gift .flex .label {
    width: 100%;
    margin-bottom: 6px;
}

.product-options-wrapper-gift .flex {
    flex-wrap: wrap;
    flex-direction: row;
    padding: 0 20px;
}

.product-options-wrapper-gift .Wrap .options-list {
    gap: 8px;
    padding: 0;
}

.product-options-wrapper-gift .Wrap .options-list .field {
    flex: 0 0 calc(25% - 6px);
    margin: 0;
    position: relative;
}

.product-options-wrapper-gift .Wrap .options-list .field .label {
    background: var(--white-color);
    border: 1px solid #D8CDB6;
    border-radius: 6px;
    font-size: 12px;
    line-height: 19px;
    color: var(--primary-color);
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 65px;
}

.product-options-wrapper-gift .Wrap .options-list .field input {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.product-options-wrapper-gift .Wrap .options-list .field input:checked+.label {
    border-color: var(--primary-color);
    background: #ECE2CE;
}

.product-options-wrapper-gift .flex.Gift .options-list {
    padding: 0;
}

.product-options-wrapper-gift .Gift .field label span:first-child {
    font-size: inherit;
    font-family: inherit;
}

.product-options-wrapper-gift .message-card,
.product-options-wrapper-gift .date_field {
    margin-top: 14px;
}

.product-options-wrapper-gift .message-card .form-textarea {
    border: 1px solid #D8CDB6;
    color: var(--primary-color);
    padding: 10px 12px;
    font-size: 13px;
    line-height: 22px;
    border-radius: 4px;
    height: 66px;
    vertical-align: top;
}

.product-options-wrapper-gift .message-card .form-textarea:focus {
    border-color: #D8CDB6;
}

.product-options-wrapper-gift .date_field .flex {
    padding: 0;
}

.features-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 11px;
}

.feature-box {
    color: #4A413A;
    display: flex;
    align-items: flex-start;
    gap: 8px;
    box-sizing: border-box;
}

.feature-box span {
    font-size: 12px;
    line-height: 20px;
    width: calc(100% - 24px);
}

.product-info-main .pdt-wrap {
    background: none;
    border: none;
}

.product-info-main .pdt-wrap .pdt-tab-btn {
    font-size: 14px;
    line-height: 22px;
    color: #7B6E62;
    padding: 14px 18px;
    border-bottom: 2px solid transparent;
    font-family: var(--font-primary);
    margin-bottom: 0;
    font-weight: normal;
}

.product-info-main .pdt-wrap .pdt-tab-btn--active {
    border-bottom-color: #7A2E2E;
    color: var(--primary-color);
}

.product-info-main .pdt-nav {
    border-bottom: 1px solid #D8CDB6;
}

.product-info-main .pdt-wrap .pdt-panel {
    padding: 27px 0 0px;
}

.custom-delivery-date label {
    font-size: 12px;
    margin: 0;
    line-height: 20px;
    color: var(--primary-color)
}

.custom-delivery-date .optional_weeks {
    font-size: 12px;
    line-height: 20px;
    color: #7B6E62;
}

.custom-delivery-date {
    padding: 0 20px;
    margin: 21px 0 0;
}

.custom-delivery-date .flex {
    padding: 0;
}

.custom-delivery-date input {
    height: 46px;
    border-color: #D8CDB6;
    border-radius: 4px;
    padding-right: 16px;
    background: var(--white-color);
}

.add-to-cart-btn #product-addtocart-button::before {
    content: "";
    width: 100%;
    height: 61px;
    position: absolute;
    background: #7A2E2E;
    left: 0;
    z-index: 0;
    border-radius: 30px;
}

.add-to-cart-btn #product-addtocart-button {
    color: #FAF5EA;
    font-size: 15px;
    line-height: 29px;
}

.add-to-cart-btn {
    position: relative;
    width: 100%;
    gap: 10px;
}

.add-to-cart-btn .price-box .price {
    font-size: 16px;
    line-height: 29px;
    font-weight: normal;
    color: #FAF5EA;
    position: relative;
}

.add-to-cart-btn #product-addtocart-button span {
    position: relative;
    z-index: 1;
    display: block;
}

.add-to-cart-btn svg {
    position: relative;
    z-index: 1;
}

.features-wrapper {
    border-top: 1px solid #D8CDB6;
    padding: 18px 0 0;
    margin: 24px 0 0;
}

#gallery-main {
    border: 1px solid #E6DDC9;
    background: #FAF5EA;
    border-radius: 4px;
}

.rating-summary svg {
    stroke: #7A2E2E;
    width: 18px;
    height: auto;
}

.swatch-bundle-books .swatch-bundle-books-description {
    font-size: 11px;
    font-family: var(--font-primary);
    line-height: 19px;
    color: #7B6E62;
    margin-top: 2px;
    white-space: normal;
}

nav.breadcrumbs.bg-surface.shadow-sm {
    background: none;
    border: none;
    box-shadow: none;
}
.product-option-value-input {
    scroll-margin-top: 120px;
}
.catalog-product-view .columns {
    padding: 0;
    max-width: 100%;
}
.catalog-product-view .product-info-main{
    padding-left: 10rem;
    padding-right: 10rem;                       
}
.catalog-product-view nav.breadcrumbs.bg-surface.shadow-sm {
    padding-left: 10rem;
    padding-right: 10rem;
}
.catalog-product-view nav.breadcrumbs.bg-surface.shadow-sm .container {
    max-width: 100%;
    padding: 0;
}

.product-info-main section#description {
    display: none;
}
/* Scoped to bundle pages only. This rule used to hide the struck original price on every
   product, so a customer saw 34,90 with no sign that it was down from 49,99. The price
   template only renders .old-price when the final price is genuinely lower than the regular
   one, so there is nothing left for a blanket rule to protect against. Bundles keep the old
   behaviour because they show their own struck prices in the option swatches. */
.page-product-bundle .product-info-main .add-to-cart-btn .old-price {
    display: none;
}
.product-description [data-content-type=row][data-appearance=contained] {
    padding: 0;
}
.swatch-attribute.edition .swatch-attribute-options {
    margin-left: 0;
    margin-right: 0;
}
.price-label {
    display: none;
}

#gallery > .fixed {
    z-index: 100;
    background: #fff;
    max-height: 100vh;
    overflow: auto;
}
#gallery > .fixed #gallery-main {
    background: none;
    border: none;
    border-radius: 0;
    position: absolute;
    top: 0;
    transform: translate(-50%, 0);
    left: 50%;
    height: calc(100vh - 100px);
    margin: 0;
}
#gallery > .fixed #gallery-main > img {
    height: auto;
    width: auto;
    max-height: 90%;
}
#gallery > .fixed #gallery-main .js_thumbs_slides {
    justify-content: center;
}
#gallery > .fixed > .relative {
    height: 100%;
    overflow: auto;
}
#gallery > .fixed .js_thumbs_slides {
    justify-content: center;
}
.catalog-product-view .page-main {
    margin-top: 0px;
}
.navigation ul li a {
    padding: 0;
}


div#panth-search-autocomplete-hyva.psac-wrap .psac-input, #panth-search-autocomplete-luma .psac-wrap .psac-input
{
    height: 40px !important;
    padding-bottom: 2px !important;
}
#shopping-cart-table .product-item-name {
    word-break: break-word;
}

/* fieldset-bundle-options css start */

.fieldset-bundle-options .options-list-info {
    padding: 10px 17.5px 10px 20px;
    border: solid 2px #c6bbb2;
    border-radius: 10px;
    background: #fff;
    margin: 0 0 8.5px;
}
.fieldset-bundle-options .options-list-info input[type="radio"] {
    width: 15px;
    height: 15px;
    border: solid 2px #c6bbb2;
    margin: 0;
}
.fieldset-bundle-options .options-list-info input[type="radio"]:checked {
    border: solid 2px #fff;
    background: #492609;
    box-shadow: 0 0 0 .1rem #492609;
}
.options-list-info-showscontent select {
    margin: 0;
    padding: 3px 36px 3px 10px;
    height: auto;
}
.inner-list-options-info {
    padding: 0 20px;
}
div.options-list-info-showscontent {
    border: solid 2px #c6bbb2;
    border-radius: 0 0 10px 10px;
    border-top: none;
    background: #ece9e6;
    margin-top: -12px;
    padding-top: 20px;
    padding-bottom: 20px;
    margin-bottom: 10px;
    position: relative;
}
.fieldset-bundle-options .options-list-info.rounded-b-none {
    border-radius: 10px 10px 0 0;
}
.product-options-bottom button#product-addtocart-button {
    width: 100%;
    height: 61px;
    background: #7A2E2E;
    border-radius: 30px;
    color: #fff;
}
.page-product-bundle .flex.flex-col.sm\:flex-row.items-end.my-4{
    display: none;
}

/* fieldset-bundle-options css end */

legend#customizeTitle {
    display: none;
}
div.features-wrapper .feature-box svg {
    cursor: default;
    margin: 2px 0 0;
}
.pages .pages-item-previous[aria-disabled="true"],
.pages .pages-item-next[aria-disabled="true"] {
    pointer-events: none;
    background: grey;
}
.pages .pages-item-previous[aria-disabled="true"] svg,
.pages .pages-item-next[aria-disabled="true"] svg {
    stroke: white;
}
.banner-buttons .btn-secondary {
    background: none;
}
.banner-buttons .btn-secondary:hover{    
    border-color: #7A2E3E;
    background: #7A2E3E;
    color: #FAF5EA;
}

.hyva_checkout-index-index button.amwrap-btn {
    height: auto;
}
.hyva_checkout-index-index .field.required>label:after {
    width: 8px;
    height: 8px;
}
.checkout-onepage.hyva_checkout-index-index div.columns #hyva-checkout-container #billing-details .field label span:after,
.checkout-onepage.hyva_checkout-index-index div.columns #hyva-checkout-container #shipping-details .field label span:after {
    font-size: 8px;
}
#hyva-checkout-container .field.field-reserved {
    margin-block-end: 12px;
}
/*.banner-buttons .btn-primary::after{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='24' viewBox='0 0 15 24' fill='none'%3E%3Cpath d='M8.06463 17L7.24432 16.1903L10.6214 12.8132H1.875V11.6413H10.6214L7.24432 8.27486L8.06463 7.45455L12.8374 12.2273L8.06463 17Z' fill='%23FAF5EA'/%3E%3C/svg%3E");
    content: "";
    width: 14px;
    height: 22px;
    display: inline-block;
    vertical-align: middle;
}*/


@media (min-width: 768px) {
    .product-info-main .md\:block {
        display: block;
    }
}

@media (max-width:768px) {
    .home_bannerslider {
        padding: 2rem 1.5rem;
    }
}

@media (max-width: 1200px) {
    .container {
        max-width: 100%;
    }
}

@media (max-width: 1023px) {
    .store__switcher {
        display: none;
    }
    button[aria-label="Open menu"] {
        padding: 0;
        border: none;
    }
    .currency_switcher {
        display: none;
    }
}

@media (max-width: 767px) {
    .panth-banner-track .panth-banner-content {
        position: static;
    }
    .panth-banner-slider .panth-banner-track {
        height: auto;
        min-height: auto !important;
    }
    .panth-banner-track .panth-banner-slide {
        position: static;
    }
    .panth-banner-track .panth-banner-content-inner {
        padding: 0;
    }
    .panth-banner-track .panth-banner-content-inner h2, .panth-banner-track .panth-banner-content-inner h1 {
        font-size: 42px !important;
        line-height: 40px !important;
    }
    .swatch-attribute.bundle .swatch-attribute-options .swatch-option .swatch-bundle-books {
        max-width: 200px;
        white-space: normal;
    }
    .product-info-main .card {
        padding-left: 0;
        padding-right: 0;
    }
    .family-flipbook-book {
        flex: 0 0 100%;
        min-width: unset;
    }
    .family-flipbook-page--left .family-flipbook-page__number {
        right: 28px;
        left: auto;
    }
    .catalog-product-view .page-title {
        font-size: 30px;
        line-height: 32px;
        letter-spacing: -.21px;
        color: var(--primary-color);
        font-family: var(--font-secondary);
        font-weight: 500;
        margin: 0px 0 20px;
    }
    .catalog-product-view .product-info-main, .catalog-product-view nav.breadcrumbs.bg-surface.shadow-sm {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
    button.cms-footer-submit {
        width: 100px;
    }
    #gallery > .fixed #gallery-main > img {
        max-height: 300px;
    }
    .cms-bundle-section .cms-bundle-wrapper .cms-bundle-card div.cms-bundle-image-col {
        padding: 0;
    }
    section.cms-bundle-section {
        padding-top: 0;
    }
    .home_bannerslider.container {
        padding-bottom: 10px;
        padding-top: 0;
    }
    div.memory-books-banner {
        gap: 20px;
    }
}

@media (max-width: 350px) { 
    .swatch-attribute.edition .swatch-attribute-options{
        display: grid;
        grid-template-columns: repeat(3, calc(33.33333% - 5px));
    }
}


/* ---------------------------------------------------------------------------
   MANTIS-2745 — product page content sections

   WHY THIS EXISTS. The Moment Slider carries `padding: 60px 0 !important`
   (momentslider.css:1) and no max-width, and its inner `.top-moment-inner` has
   no CSS rule anywhere in the codebase — so it has never supplied its own
   horizontal gutter; it inherits one from whatever wraps it. On the home page
   that wrapper is CMS markup (`.cms-reviews-header`, padding 1.5rem). Dropped
   into the product page `content` container, which has no padding, there was
   nothing to inherit and it ran to the viewport edge with its first card
   clipped.

   WHY THE GUTTER IS NOT ON THE CONTAINER. That was tried and reverted. The
   reviews block inside this container is `.tnp-reviews-slider`, which already
   carries `lg:px-40` — its own 10rem gutter — on a `bg-cream` band that is
   meant to run the full width of the page. A gutter on the container would
   have indented it to 20rem AND inset its background, turning a full-bleed
   band into a floating panel. One container-level gutter cannot serve both a
   full-bleed child and an inset one.

   So the rule is: each section owns its gutter. The slider is the only one
   that cannot, because it has no stylesheet of its own to put it in. The two
   CMS blocks carry theirs inside the block content, where the people editing
   them can see it. The reviews block already had its own and is left alone.

   `!important` is required, not preferred: the declaration it beats is a
   shorthand carrying `!important`, which no plain longhand overrides at any
   specificity.

   10rem matches the gutter the theme uses at >=1024px, so these line up with
   the rest of the page. Scoped to `.catalog-product-view`; the home page
   slider is untouched.
   --------------------------------------------------------------------------- */
.catalog-product-view .family-pdp-sections {
    width: 100%;
}

@media (min-width: 768px) and (max-width: 1023px) {
    .catalog-product-view .family-pdp-sections .tnp-moment-slider {
        padding-left: 1.5rem !important;
        padding-right: 1.5rem !important;
    }
}

@media (min-width: 1024px) {
    .catalog-product-view .family-pdp-sections .tnp-moment-slider {
        padding-left: 10rem !important;
        padding-right: 10rem !important;
    }
}

/* MANTIS-2811 — phone gallery.
   Nicola asked for the product image as wide as possible on phones (90% of traffic)
   and for at least three thumbnails with the arrows still usable.

   Measured before: on a 375 screen the image was 325 wide, 87%, and the thumbnail
   strip showed two and a 7px sliver of the third. The missing width is the 24px
   gutter on .product-info-main, which the title, price and buy button need and keep —
   only the gallery steps out of it.

   The thumbnails are sized as a third of the strip rather than a fixed pixel width,
   so exactly three fit at any phone width. A fixed size fitted 375 and dropped back
   to two at 360. Verified at 320, 360 and 375: three visible, no horizontal overflow,
   arrows unchanged at 44px. */
@media (max-width: 767px) {
    .catalog-product-view .product-info-main .fs-gallery-main,
    .catalog-product-view .product-info-main #thumbs {
        width: calc(100% + 48px);
        margin-left: -24px;
        margin-right: -24px;
    }

    .catalog-product-view .product-info-main #thumbs {
        gap: 4px;
    }

    .catalog-product-view .product-info-main .js_thumbs_slide {
        flex: 0 0 calc((100% - 12px) / 3);
        margin-right: 6px;
    }

    .catalog-product-view .product-info-main .js_thumbs_slide:nth-child(3n) {
        margin-right: 0;
    }

    .catalog-product-view .product-info-main .js_thumbs_slide img {
        width: 100%;
        height: auto;
        aspect-ratio: 1 / 1;
        object-fit: cover;
    }
}

/* MANTIS-2811 — desktop gallery, the second half of Nicola's request
   ("also a little bit wider by PC").

   The product page is a two column grid and on desktop it is a plain 50/50
   split, so the image never gets more than half the content width. Measured
   before: 451 at 1280, 531 at 1440, 771 at 1920.

   Giving the image column 54% rather than 50% widens it by about 12% at every
   desktop width without touching anything else on the page. The buy column
   keeps 347px at its narrowest, which still holds the title, the price and the
   Add to Cart button comfortably.

   Left at 50/50 below 1280 on purpose: the buy column gets tight there, and
   that range is laptops and tablets rather than the desktop Nicola was looking
   at. The page gutter is untouched — see the ticket for why it is worth a
   separate look. */
@media (min-width: 1280px) {
    .catalog-product-view .product-info-main > section.grid {
        grid-template-columns: 54% minmax(0, 1fr);
    }
}
