/* Page composition only. Global tokens and primitives live in system.css. */ * { box-sizing: border-box; } html { scroll-behavior: smooth; } body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--font-body); font-size: var(--type-body); line-height: var(--leading-body); } button, input, select { font: inherit; } button, a { -webkit-tap-highlight-color: transparent; } button { cursor: pointer; } a { color: inherit; text-decoration: none; } img { display: block; max-width: 100%; } .shell { width: var(--shell); margin: 0 auto; } .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .demo-notice { background: var(--ink); border-bottom: 3px solid var(--orange); color: #fff; font-size: 12px; letter-spacing: .03em; } .demo-notice__inner { display: flex; gap: 24px; align-items: center; min-height: 34px; } .demo-notice__inner span:first-child { color: #fff; font-weight: 700; } .demo-notice__inner span:last-child { color: #cbd3d6; } .site-header { position: sticky; top: 0; z-index: 10; background: rgba(250, 251, 251, .97); border-bottom: 1px solid var(--line); backdrop-filter: blur(12px); } .header-inner { min-height: 86px; display: flex; gap: 28px; align-items: center; justify-content: space-between; } .brand { width: 220px; flex: 0 0 auto; } .brand img { width: 100%; max-height: 48px; object-fit: contain; object-position: left center; } .desktop-nav { display: flex; align-items: stretch; align-self: stretch; margin-inline-start: auto; } .desktop-nav > a, .nav-with-panel > a { display: flex; align-items: center; padding: 0 13px; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .055em; border-inline: 1px solid transparent; } .desktop-nav > a:hover, .nav-with-panel:hover > a, .desktop-nav .is-active { color: var(--teal); border-color: var(--line); background: var(--white); } .nav-with-panel { position: relative; display: flex; } .nav-panel { display: none; position: absolute; inset-block-start: 100%; inset-inline-start: 0; min-width: 220px; padding: 14px; background: var(--white); border: 1px solid var(--line); border-block-start: 3px solid var(--orange); box-shadow: 0 16px 30px rgba(31,37,43,.11); } .nav-with-panel:hover .nav-panel { display: grid; gap: 2px; } .nav-panel a { padding: 9px 8px; font-size: 13px; font-weight: 700; } .nav-panel a:hover { color: var(--teal); background: var(--paper); } .nav-panel span { display: block; padding: 10px 8px 2px; color: var(--grey); border-top: 1px solid var(--line); font-size: 12px; } .nav-panel--wide { min-width: 260px; } .header-actions { display: flex; align-items: center; gap: 8px; } .text-control { padding: 8px 6px; border: 0; background: transparent; color: var(--ink); font-size: 13px; font-weight: 700; } .text-control:hover { color: var(--teal); } .cart-link { position: relative; } .cart-count { display: inline-grid; place-items: center; min-width: 18px; height: 18px; margin-inline-start: 2px; border-radius: 50%; background: var(--orange); color: #fff; font-size: 11px; } .menu-button { display: none; padding: 8px 0 8px 12px; border: 0; background: transparent; color: var(--ink); font-size: 13px; font-weight: 700; text-transform: uppercase; } .mobile-nav { display: none; } .hero { border-bottom: 1px solid var(--line); background: var(--white); } .hero-grid { display: grid; grid-template-columns: .9fr 1.1fr; min-height: 550px; } .hero-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding-block: 72px; padding-inline: 0 72px; border-inline-end: 1px solid var(--line); } .eyebrow { margin: 0 0 14px; color: var(--teal); font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; } h1, h2, h3, p { margin-top: 0; } h1 { max-width: 700px; margin-bottom: 22px; font-size: clamp(42px, 5vw, 76px); line-height: .97; letter-spacing: -.06em; } h2 { margin-bottom: 12px; font-size: clamp(29px, 3.2vw, 48px); line-height: 1.02; letter-spacing: -.045em; } h3 { margin-bottom: 7px; font-size: 20px; letter-spacing: -.025em; } .hero-copy > p:not(.eyebrow) { max-width: 550px; color: #40515a; font-size: 18px; } .button-row, .matrix-summary { display: flex; flex-wrap: wrap; gap: 10px; } .button { min-height: 45px; padding: 12px 18px; border: 1px solid var(--ink); border-radius: var(--radius-control); font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; transition: background .18s ease, color .18s ease, border-color .18s ease; } .button--primary { border-color: var(--orange); background: var(--orange); color: #fff; } .button--primary:hover { border-color: var(--ink); background: var(--ink); } .button--secondary { background: transparent; color: var(--ink); } .button--secondary:hover { border-color: var(--teal); background: var(--teal); color: #fff; } .button--light { border-color: #fff; background: #fff; color: var(--ink); } .button--light:hover { background: var(--ink); color: #fff; } .hero-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; width: 100%; margin: 58px 0 0; border-top: 1px solid var(--line); } .hero-metrics div { padding-top: 13px; } .hero-metrics dt { color: var(--grey); font-size: 10px; font-weight: 700; letter-spacing: .12em; } .hero-metrics dd { margin: 3px 0 0; font-size: 14px; font-weight: 700; } .hero-visual { position: relative; min-height: 420px; overflow: hidden; background: var(--ink); } .hero-visual > img { width: 100%; height: 100%; min-height: 550px; object-fit: cover; filter: saturate(.82) contrast(1.04); } .hero-caption { position: absolute; inset-block-end: 0; inset-inline-end: 0; display: flex; gap: 17px; align-items: center; width: min(430px, 85%); padding: 18px 24px; border-block-start: 3px solid var(--orange); background: rgba(31, 37, 43, .92); color: #fff; } .hero-caption span { color: var(--orange); font-size: 48px; font-weight: 700; letter-spacing: -.08em; } .hero-caption p { margin: 0; color: #d7dfe2; font-size: 13px; } .section { padding: 96px 0; } .section--tint { background: #edf1f2; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); } .section--special { background: var(--ink); color: var(--white); } .section--special .section-head { border-color: rgba(255,255,255,.24); } .section--special .section-head > p { color: #d7dfe2; } .section--special .eyebrow, .section--special .inline-link { color: var(--orange); } .section--special .inline-link:hover { color: var(--white); } .section--special .content-placeholder { border-color: rgba(255,255,255,.24); color: var(--white); } /* Compact homepage brand directory: six stable columns, then wrap. */ .brand-strip { padding: var(--space-md) 0; border-bottom: 1px solid var(--line); background: var(--white); } .brand-strip__head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-sm); margin-bottom: var(--space-sm); } .brand-strip__head h2 { margin: 0; font-family: var(--font-display); font-size: 20px; line-height: 1.15; letter-spacing: -.02em; } .brand-strip .brand-grid--strip { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-flow: row; gap: var(--space-xs); border: 0; background: transparent; } .brand-strip .brand-card { position: relative; display: grid; min-width: 0; min-height: 88px; place-items: center; padding: var(--space-sm) var(--space-md); border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--white); color: var(--ink); text-align: center; transition: border-color var(--duration-state) var(--ease-state), transform var(--duration-state) var(--ease-state), background var(--duration-state) var(--ease-state); } .brand-strip .brand-card:hover { border-color: var(--orange); background: #f7f8f8; color: var(--ink); transform: translateY(-2px); } .brand-strip .brand-card:focus-visible { outline: 2px solid var(--orange); outline-offset: 3px; } .brand-strip .brand-card__logo { width: 100%; max-width: 150px; height: 50px; object-fit: contain; object-position: center; filter: none; } .brand-strip .brand-card__flag { position: absolute; inset-block-start: var(--space-xs); inset-inline-end: var(--space-xs); display: block; width: 18px; height: 12px; overflow: hidden; border-radius: 2px; box-shadow: 0 0 0 1px rgba(23, 33, 41, .2); } .brand-strip .brand-card__flag svg { display: block; width: 100%; height: 100%; } .brand-strip .brand-card__wordmark { max-width: 100%; font-family: var(--font-display); font-size: clamp(13px, 1.2vw, 18px); line-height: 1.15; letter-spacing: -.02em; overflow-wrap: anywhere; hyphens: auto; } @media (max-width: 1100px) { .brand-strip { padding: var(--space-md) 0; } .brand-strip .brand-grid--strip { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (max-width: 760px) { .brand-strip { padding: var(--space-md) 0; } .brand-strip__head { margin-bottom: var(--space-sm); } .brand-strip__head h2 { font-size: 18px; } .brand-strip .brand-grid--strip { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-xs); } .brand-strip .brand-card { min-height: 88px; padding: var(--space-sm); } .brand-strip .brand-card__logo { max-width: 120px; height: 50px; } } .section-head { display: grid; grid-template-columns: 1.15fr .75fr auto; gap: 30px; align-items: end; margin-bottom: 38px; padding-bottom: 20px; border-bottom: 1px solid var(--line); } .section-head h2 { margin: 0; } .section-head > p { max-width: 430px; margin: 0; color: #52626a; font-size: 15px; } .inline-link { padding: 0; border: 0; border-bottom: 1px solid currentColor; background: transparent; color: var(--teal); font-size: 13px; font-weight: 700; white-space: nowrap; } .inline-link:hover { color: var(--orange); } .brand-grid { display: grid; grid-template-columns: 1fr 1fr .6fr; gap: 1px; background: var(--line); border: 1px solid var(--line); } .brand-card, .brand-note { min-height: 245px; padding: 28px; border: 0; background: var(--white); text-align: start; } .brand-card { display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; transition: background .18s ease, color .18s ease; } .brand-card:hover { background: var(--teal); color: #fff; } .brand-card--dark { background: var(--ink); color: #fff; } .brand-card span { color: var(--orange); font-size: 12px; font-weight: 700; letter-spacing: .1em; } .brand-card strong { font-size: clamp(28px, 3.5vw, 48px); letter-spacing: -.06em; } .brand-card em { font-style: normal; font-size: 13px; } .brand-note { display: flex; flex-direction: column; justify-content: flex-end; color: var(--grey); } .brand-note p { margin-bottom: 7px; color: var(--ink); font-size: 19px; font-weight: 700; line-height: 1.15; } .brand-note span { font-size: 13px; } .product-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; } .product-grid--home { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; } .section--brand-showcase { padding-block: 52px; } .brand-showcase__action { display: flex; justify-content: center; margin-top: 28px; } .product-grid--home .product-card__body { display: flex; flex: 1; flex-direction: column; padding: 10px; color: var(--ink); } .product-grid--home .product-card__brand { margin-bottom: 2px; } .product-grid--home .product-card h3 { margin-bottom: 0; color: var(--ink); font-size: 16px; line-height: 1.15; } .product-grid--home .product-card h3 a { color: inherit; } .product-grid--home .twelve-product-price-gate { align-items: stretch; flex-direction: column; gap: 8px; margin-top: auto; padding-top: 8px; } .product-grid--home .twelve-product-price-gate__amount strong, .product-grid--home .twelve-product-price-gate__real-price { font-size: 21px; } .product-grid--home .twelve-product-price-gate__detail { align-self: auto; width: fit-content; justify-content: flex-start; } @supports selector(.twelve-product-price-gate:has(.twelve-product-price-gate__register)) { .product-grid--home .twelve-product-price-gate:has(.twelve-product-price-gate__register) { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto 44px; align-items: center; column-gap: 8px; row-gap: 4px; } .product-grid--home .twelve-product-price-gate:has(.twelve-product-price-gate__register) .twelve-product-price-gate__access { display: contents; } .product-grid--home .twelve-product-price-gate:has(.twelve-product-price-gate__register) .twelve-product-price-gate__amount { grid-column: 1 / -1; grid-row: 1; } .product-grid--home .twelve-product-price-gate:has(.twelve-product-price-gate__register) .twelve-product-price-gate__register { grid-column: 1; grid-row: 2; min-width: 0; } .product-grid--home .twelve-product-price-gate:has(.twelve-product-price-gate__register) .twelve-product-price-gate__detail { grid-column: 2; grid-row: 2; margin-bottom: 0; } } .product-card { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: var(--radius-media); background: var(--white); overflow: hidden; transition: border-color var(--duration-state) var(--ease-state), transform var(--duration-state) var(--ease-state); } .product-card:hover { border-color: var(--ink); transform: translateY(-2px); } .product-card__image { display: block; width: 100%; overflow: hidden; padding: 12px 12px 0; border: 0; background: var(--white); } .product-card__status { position: absolute; inset-block-start: 12px; inset-inline-start: 12px; z-index: 1; padding: 7px 10px; border-radius: var(--radius-control); background: var(--ink); color: var(--white); font-size: 10px; font-weight: 700; letter-spacing: .08em; line-height: 1; text-transform: uppercase; } .product-card__image .twelve-product-media { aspect-ratio: 1 / 1; } .product-card__image img { width: 100%; height: 100%; object-fit: cover; } .product-card__body { padding: 16px; } .product-card__brand { margin-bottom: 5px; color: var(--teal); font-size: 11px; font-weight: 700; letter-spacing: .12em; } .product-card h3 { margin-bottom: 3px; font-size: 23px; } .product-card__body > p:not(.product-card__brand) { margin-bottom: 18px; color: var(--grey); font-size: 13px; } .twelve-product-price-gate { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-top: 15px; padding-top: 13px; border-top: 1px solid var(--line); } .twelve-product-price-gate__access { display: grid; gap: 4px; min-width: 0; } .twelve-product-price-gate__amount { display: flex; align-items: baseline; gap: 7px; color: var(--ink); font-variant-numeric: tabular-nums; unicode-bidi: isolate; white-space: nowrap; } .twelve-product-price-gate__amount strong { font-family: var(--font-display); font-size: 25px; font-weight: 800; line-height: .9; letter-spacing: normal; } .twelve-product-price-gate__amount small { color: var(--grey); font-size: var(--type-label); font-weight: 700; letter-spacing: .045em; line-height: 1.2; white-space: nowrap; } .twelve-product-price-gate__amount--approved { align-items: flex-end; } .twelve-product-price-gate__real-price { color: var(--ink); font-family: var(--font-display); font-size: 25px; font-weight: 800; line-height: .9; letter-spacing: normal; white-space: nowrap; } .twelve-product-price-gate__real-price .price { display: inline; } .twelve-product-price-gate__real-price del { color: var(--grey); font-size: .7em; font-weight: 600; } .twelve-product-price-gate__real-price ins { color: var(--ink); text-decoration: none; } .twelve-product-price-gate__pending { color: var(--grey); font-size: 13px; font-weight: 700; } .twelve-product-price-gate__register { display: inline-flex; align-items: center; width: fit-content; min-height: 44px; color: var(--teal); font-size: 11px; font-weight: 700; line-height: 1.2; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; } .twelve-product-price-gate__register:hover { color: var(--orange); } .twelve-product-price-gate__detail { flex: 0 0 auto; margin-bottom: 2px; font-size: 11px; } .center-action { display: flex; justify-content: center; margin-top: 34px; } .benefit-layout { display: grid; grid-template-columns: .72fr 1.28fr; gap: 64px; } .benefit-intro h2 { margin: 0; } .benefit-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border: 1px solid var(--line); } .benefit-grid article { min-height: 200px; padding: 25px; border-inline-end: 1px solid var(--line); border-bottom: 1px solid var(--line); } .benefit-grid article:nth-child(2n) { border-inline-end: 0; } .benefit-grid article:nth-last-child(-n+2) { border-bottom: 0; } .benefit-grid span { color: var(--orange); font-size: 12px; font-weight: 700; } .benefit-grid h3 { margin-top: 45px; font-size: 19px; } .benefit-grid p { margin: 0; color: var(--grey); font-size: 13px; } .wholesale-strip { padding: 45px 0; background: var(--teal); color: #fff; } .wholesale-strip__inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; } .wholesale-strip .eyebrow { color: #b9d4dd; } .wholesale-strip h2 { margin: 0; } .page-hero { padding: 104px 0 75px; border-bottom: 1px solid var(--line); background: var(--white); } .page-hero h1 { margin: 0 0 18px; max-width: 880px; } .page-hero p:not(.eyebrow) { max-width: 650px; margin-bottom: 0; color: #52626a; font-size: 18px; } .page-hero--brands { background: linear-gradient(90deg, var(--ink) 0 60%, var(--teal) 60% 100%); color: #fff; } .page-hero--brands .eyebrow { color: var(--orange); } .page-hero--brands p:not(.eyebrow), .page-hero--dashboard p:not(.eyebrow) { color: #c9d4d8; } .page-hero--dashboard { background: var(--ink); color: #fff; } .page-hero--dashboard .eyebrow { color: var(--orange); } .brand-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; } .brand-detail { display: grid; grid-template-columns: 1.1fr .9fr; min-height: 380px; overflow: hidden; background: var(--white); border: 1px solid var(--line); } .brand-detail > div { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 35px; } .brand-detail p:not(.eyebrow) { color: var(--grey); } .brand-detail > img { width: 100%; height: 100%; object-fit: cover; } .brand-detail--gornornie { background: var(--ink); color: #fff; border-color: var(--ink); } .brand-detail--gornornie p:not(.eyebrow) { color: #d0d9dc; } .brand-detail--gornornie .eyebrow { color: var(--orange); } .module-list { display: flex; flex-wrap: wrap; gap: 10px; } .module-list span { padding: 11px 13px; border: 1px solid var(--line); background: var(--white); font-size: 13px; font-weight: 700; } .catalog-layout { display: grid; grid-template-columns: 265px 1fr; gap: 40px; padding-top: 44px; padding-bottom: 96px; } .filter-panel { align-self: start; border-block-start: 3px solid var(--orange); background: var(--white); border-inline: 1px solid var(--line); border-bottom: 1px solid var(--line); } .filter-panel__head { display: flex; align-items: center; justify-content: space-between; padding: 16px; border-bottom: 1px solid var(--line); } .filter-panel__head h2 { margin: 0; font-size: 22px; } .filter-panel details { padding: 14px 16px; border-bottom: 1px solid var(--line); } .filter-panel details:last-child { border-bottom: 0; } .filter-panel summary { cursor: pointer; font-size: 13px; font-weight: 700; } .filter-panel label { display: block; margin-top: 10px; color: #52626a; font-size: 13px; } .filter-panel input { margin-inline-end: 7px; accent-color: var(--teal); } .catalog-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 22px; padding-bottom: 16px; border-bottom: 1px solid var(--line); } .catalog-toolbar p { margin: 0; font-size: 13px; } .catalog-toolbar p span { color: var(--grey); } .sort-control { color: var(--grey); font-size: 13px; } .sort-control select { margin-inline-start: 6px; padding: 8px; border: 1px solid var(--line); background: var(--white); color: var(--ink); } .filter-drawer-button { display: none; padding: 8px 12px; border: 1px solid var(--ink); background: transparent; font-size: 13px; font-weight: 700; } .product-grid--catalog { grid-template-columns: repeat(3, 1fr); } .product-card--compact .product-card__image { aspect-ratio: 1 / .86; } .product-card--compact .product-card__body { padding: 13px; } .product-card--compact h3 { font-size: 19px; } .breadcrumbs { display: flex; gap: 8px; align-items: center; padding-top: 26px; color: var(--grey); font-size: 13px; } .product-detail { display: grid; grid-template-columns: 1.1fr .9fr; gap: 64px; padding-top: 25px; padding-bottom: 68px; } .product-main-image { aspect-ratio: 1 / .78; border: 1px solid var(--line); background: #f0f2f2; } .product-main-image img { width: 100%; height: 100%; object-fit: cover; } .thumbnail-row { display: flex; gap: 8px; margin-top: 10px; } .thumbnail-row button { width: 84px; height: 70px; padding: 0; overflow: hidden; border: 1px solid var(--line); background: #fff; } .thumbnail-row button.is-current { border: 2px solid var(--orange); } .thumbnail-row img { width: 100%; height: 100%; object-fit: cover; } .product-info { padding-top: 9px; } .product-info h1 { margin-bottom: 8px; font-size: clamp(40px, 4.8vw, 64px); } .style-id { margin-bottom: 27px; color: var(--grey); font-size: 12px; font-weight: 700; letter-spacing: .08em; } .price-placeholder { display: flex; flex-direction: column; gap: 4px; padding: 17px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); } .price-placeholder span { color: var(--grey); font-size: 12px; font-weight: 700; text-transform: uppercase; } .price-placeholder strong { font-size: 20px; } .spec-list { margin: 25px 0 0; } .spec-list div { display: grid; grid-template-columns: 165px 1fr; gap: 20px; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 14px; } .spec-list dt { color: var(--grey); } .spec-list dd { margin: 0; font-weight: 700; } .matrix-head { display: grid; grid-template-columns: 1fr .7fr; gap: 40px; align-items: end; margin-bottom: 25px; } .matrix-head h2 { margin: 0; } .matrix-head > p { margin: 0; color: var(--grey); font-size: 14px; } .matrix-wrap { overflow-x: auto; border: 1px solid var(--line); background: var(--white); } .size-matrix { width: 100%; min-width: 720px; border-collapse: collapse; } .size-matrix th, .size-matrix td { padding: 14px; border-inline-end: 1px solid var(--line); border-bottom: 1px solid var(--line); text-align: center; } .size-matrix thead th { background: #edf1f2; font-size: 12px; letter-spacing: .05em; text-transform: uppercase; } .size-matrix tbody th { min-width: 160px; text-align: start; font-size: 13px; } .size-matrix input { width: 64px; padding: 8px; border: 1px solid var(--line); text-align: center; } .matrix-summary { align-items: center; justify-content: flex-end; gap: 18px; margin-top: 18px; } .matrix-summary span { color: var(--grey); font-size: 13px; } .matrix-summary strong { display: block; color: var(--ink); } .cart-layout { display: grid; grid-template-columns: 1fr 330px; gap: 34px; padding-top: 45px; padding-bottom: 96px; } .cart-table-wrap { overflow-x: auto; } .cart-table { width: 100%; min-width: 760px; border-collapse: collapse; background: var(--white); } .cart-table th, .cart-table td { padding: 16px; border: 1px solid var(--line); text-align: start; vertical-align: middle; font-size: 13px; } .cart-table th { background: #edf1f2; font-size: 11px; letter-spacing: .07em; text-transform: uppercase; } .cart-product { display: flex; gap: 13px; align-items: center; min-width: 235px; } .cart-product img { width: 68px; height: 52px; object-fit: cover; } .cart-product div, .cart-table td span { display: flex; flex-direction: column; } .cart-product span, .cart-table td span + span { margin-top: 3px; color: var(--grey); font-size: 12px; } .cart-table input { width: 64px; padding: 8px; border: 1px solid var(--line); } .order-summary { align-self: start; padding: 22px; border-block-start: 3px solid var(--orange); background: var(--white); border-inline: 1px solid var(--line); border-bottom: 1px solid var(--line); } .order-summary > div { display: flex; justify-content: space-between; gap: 15px; padding: 13px 0; border-bottom: 1px solid var(--line); color: var(--grey); font-size: 13px; } .order-summary > div strong { color: var(--ink); text-align: end; } .order-summary .summary-total { color: var(--ink); font-size: 18px; font-weight: 700; } .order-summary .button { width: 100%; margin-top: 16px; } .order-summary .button + .button { margin-top: 8px; } .dashboard-layout { display: grid; grid-template-columns: 230px 1fr; gap: 44px; padding-top: 46px; padding-bottom: 96px; } .dashboard-nav { display: flex; flex-direction: column; align-self: start; background: var(--white); border: 1px solid var(--line); } .dashboard-nav strong { padding: 17px; background: var(--ink); color: #fff; font-size: 14px; } .dashboard-nav button { padding: 12px 16px; border: 0; border-bottom: 1px solid var(--line); background: transparent; text-align: start; font-size: 13px; } .dashboard-nav button:hover, .dashboard-nav button.is-active { background: #edf1f2; color: var(--teal); font-weight: 700; } .dashboard-title { display: flex; justify-content: space-between; gap: 20px; align-items: end; padding-bottom: 22px; border-bottom: 1px solid var(--line); } .dashboard-title h2 { margin: 0; } .overview-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; margin-top: 24px; background: var(--line); border: 1px solid var(--line); } .overview-grid article { min-height: 185px; padding: 19px; background: var(--white); } .overview-grid span { color: var(--teal); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; } .overview-grid strong { display: block; margin: 23px 0 8px; font-size: 36px; line-height: 1; } .overview-grid p { margin: 0; color: var(--grey); font-size: 12px; } .approval-panel { margin-top: 24px; padding: 27px; border-top: 2px solid var(--orange); background: #edf1f2; } .approval-panel h3 { margin-bottom: 6px; font-size: 25px; } .approval-panel p:not(.eyebrow) { max-width: 720px; color: #52626a; } .content-placeholder { padding: 46px; border: 1px solid var(--line); background: var(--white); } .content-placeholder p { color: var(--grey); } .site-footer { background: var(--ink); color: #fff; } .site-footer > .shell { width: min(1240px, calc(100% - 64px)); max-width: none; margin-inline: auto; } .footer-brand-bar { position: relative; display: grid; grid-template-columns: 220px minmax(0, 1fr); align-items: end; gap: clamp(36px, 4.4vw, 68px); padding-block: clamp(30px, 3vw, 44px); } .footer-brand-lockup { display: grid; gap: var(--space-xs); } .footer-brand-link { display: inline-flex; width: fit-content; } .footer-logo { width: 220px; max-height: 74px; object-fit: contain; object-position: left center; } .footer-lede { grid-column: 2; margin: 0; color: #fff; font-family: Impact, Haettenschweiler, "Arial Narrow Bold", var(--font-display); font-size: clamp(24px, 2.6vw, 42px); font-weight: 800; letter-spacing: .015em; line-height: .95; text-align: center; text-transform: uppercase; text-wrap: balance; } .footer-social-panel { display: grid; grid-template-columns: 380px auto; align-items: end; gap: 80px; min-width: 0; padding-inline: 28px; } .footer-social-contact, .footer-social-follow { display: grid; gap: 10px; min-width: 0; } .footer-social-heading { margin: 0; color: var(--orange); font-size: 13px; font-weight: 700; letter-spacing: .13em; line-height: 1.2; text-transform: uppercase; } .footer-whatsapp-cta { display: inline-flex; width: min(100%, 380px); min-height: 68px; align-items: center; gap: 14px; padding: 15px 18px; border: 1px solid rgba(37,211,102,.7); border-radius: 9px; background: rgba(7,18,25,.58); color: #fff; font-size: clamp(16px, 1.35vw, 19px); font-weight: 400; line-height: 1.2; text-decoration: none; transition: background var(--duration-state) var(--ease-state), border-color var(--duration-state) var(--ease-state), transform var(--duration-state) var(--ease-state); } .footer-whatsapp-cta img { width: 36px; height: 36px; flex: 0 0 36px; object-fit: contain; } .footer-whatsapp-cta:hover, .footer-whatsapp-cta:focus-visible { border-color: #49e47e; background: rgba(20,49,40,.82); color: #fff; transform: translateY(-2px); } .footer-social { display: flex; flex-wrap: nowrap; justify-content: flex-start; gap: 12px; } .footer-social a, .footer-social__placeholder { display: grid; width: 62px; height: 58px; flex: 0 0 62px; place-items: center; border: 1px solid rgba(174,192,201,.22); border-radius: 8px; background: rgba(7,18,25,.58); text-decoration: none; } .footer-social a { transition: background var(--duration-state) var(--ease-state), border-color var(--duration-state) var(--ease-state), transform var(--duration-state) var(--ease-state); } .footer-social a:hover, .footer-social a:focus-visible { border-color: rgba(255,255,255,.58); background: rgba(28,47,58,.86); transform: translateY(-2px); } .footer-social__placeholder { cursor: default; opacity: .72; } .footer-social img { width: 32px; height: 32px; object-fit: contain; } .footer-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, 1.7fr); gap: clamp(32px, 3vw, 48px); padding-block: var(--space-lg); border-top: 1px solid rgba(255,255,255,.16); } .footer-grid h2 { margin: 0 0 var(--space-sm); color: var(--orange); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; } .footer-grid p, .footer-grid address { max-width: 62ch; margin: 10px 0 0; color: #bdc8cc; font-size: 13px; font-style: normal; line-height: 1.6; } .footer-grid a, .footer-grid span { color: #e4ebed; font-size: 13px; line-height: 1.45; } .footer-links, .footer-menu, .footer-company__contacts { display: grid; gap: 10px; } .footer-menu { margin: 0; padding: 0; list-style: none; } .footer-menu li { margin: 0; } .footer-links a, .footer-menu a, .footer-company__contacts a { display: inline-block; width: fit-content; text-decoration: none; } .footer-region-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px var(--space-sm); } .footer-region-list a { width: fit-content; text-decoration: none; } .footer-entity { color: #fff !important; font-family: var(--font-display); font-weight: 700; letter-spacing: .015em; } .footer-company { display: grid; gap: 32px; } .footer-company section { min-width: 0; } .footer-company__contacts { margin-top: 10px; } .footer-company__contacts span { color: #bdc8cc; } .footer-payments { display: flex; align-items: center; justify-content: space-between; gap: var(--space-lg); padding-block: var(--space-md); border-top: 1px solid rgba(255,255,255,.16); } .footer-payments__copy { flex: 0 1 360px; } .footer-payments h2 { margin: 0 0 4px; color: var(--orange); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; } .footer-payments p { margin: 0; color: #bdc8cc; font-size: 12px; line-height: 1.45; } .footer-payment-marks { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; } .footer-payment-mark { display: inline-grid; min-width: 70px; height: 42px; place-items: center; padding: 5px 9px; border: 1px solid rgba(255,255,255,.2); border-radius: 7px; background: #fff; } .footer-payment-mark svg { display: block; width: auto; max-width: 100%; height: 28px; } .footer-payment-mark--bank { min-width: 128px; } .footer-payment-mark--cards { min-width: 86px; background: #fff url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgNjYgNDIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTM2IDNhMiAyIDAgMCAxIDItMmgyNC42NmEyIDIgMCAwIDEgMiAydjE0YTIgMiAwIDAgMS0yIDJIMzhhMiAyIDAgMCAxLTItMlYzeiIgZmlsbD0iI2ZmZiIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMzggMGgyNC42NmEzIDMgMCAwIDEgMyAzdjE0YTMgMyAwIDAgMS0zIDNIMzhhMyAzIDAgMCAxLTMtM1YzYTMgMyAwIDAgMSAzLTN6bTAgMWEyIDIgMCAwIDAtMiAydjE0YTIgMiAwIDAgMCAyIDJoMjQuNjZhMiAyIDAgMCAwIDItMlYzYTIgMiAwIDAgMC0yLTJIMzh6IiBmaWxsPSIjREREIi8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik02MC4wNTUgMTMuMDQ4di0uMjExaC0uMDU0bC0uMDY0LjE0NS0uMDYzLS4xNDVoLS4wNTV2LjIxaC4wMzl2LS4xNThsLjA1OS4xMzdoLjA0bC4wNi0uMTM4di4xNmguMDM5em0tLjM0OCAwdi0uMTc1aC4wN3YtLjAzNmgtLjE4di4wMzZoLjA3MnYuMTc1aC4wMzh6bS4zNi0zLjEzN2MwIDMuMjY1LTIuNjQgNS45MTItNS44OTcgNS45MTItMy4yNTYgMC01Ljg5Ni0yLjY0Ny01Ljg5Ni01LjkxMkM0OC4yNzQgNi42NDcgNTAuOTE0IDQgNTQuMTcgNGMzLjI1NyAwIDUuODk3IDIuNjQ3IDUuODk3IDUuOTExeiIgZmlsbD0iI0Y3OUYxQSIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNNTIuNzkzIDkuOTExYzAgMy4yNjUtMi42NCA1LjkxMi01Ljg5NyA1LjkxMkM0My42NCAxNS44MjMgNDEgMTMuMTc2IDQxIDkuOTEgNDEgNi42NDcgNDMuNjQgNCA0Ni44OTcgNGMzLjI1NiAwIDUuODk2IDIuNjQ3IDUuODk2IDUuOTExeiIgZmlsbD0iI0VBMDAxQiIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNNTAuNTMzIDUuMjU4YTUuOTA1IDUuOTA1IDAgMCAwLTIuMjU4IDQuNjUzYzAgMS44ODkuODgzIDMuNTcyIDIuMjU4IDQuNjU0YTUuOTA3IDUuOTA3IDAgMCAwIDIuMjYtNC42NTQgNS45MDUgNS45MDUgMCAwIDAtMi4yNi00LjY1M3oiIGZpbGw9IiNGRjVGMDEiLz48cGF0aCBkPSJNMSAzLjA2YTIgMiAwIDAgMSAyLTJoMjQuNjZhMiAyIDAgMCAxIDIgMnYxNGEyIDIgMCAwIDEtMiAySDNhMiAyIDAgMCAxLTItMnYtMTR6IiBmaWxsPSIjZmZmIi8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0zIC4wNmgyNC42NmEzIDMgMCAwIDEgMyAzdjE0YTMgMyAwIDAgMS0zIDNIM2EzIDMgMCAwIDEtMy0zdi0xNGEzIDMgMCAwIDEgMy0zem0wIDFhMiAyIDAgMCAwLTIgMnYxNGEyIDIgMCAwIDAgMiAyaDI0LjY2YTIgMiAwIDAgMCAyLTJ2LTE0YTIgMiAwIDAgMC0yLTJIM3oiIGZpbGw9IiNEREQiLz48cGF0aCBkPSJNMTMuODIgMTMuMzIzaC0xLjczN2wxLjA4Ny02LjNoMS43MzdsLTEuMDg2IDYuM3ptNi4zLTYuMTQ3YTQuNTM0IDQuNTM0IDAgMCAwLTEuNTU5LS4yNjhjLTEuNzE2IDAtMi45MjQuODU4LTIuOTMyIDIuMDg1LS4wMTQuOTA0Ljg2NiAxLjQwNyAxLjUyMyAxLjcwOS42NzMuMzA4LjkwMS41MS45MDEuNzg0LS4wMDcuNDIyLS41NDMuNjE3LTEuMDQzLjYxNy0uNjk0IDAtMS4wNjYtLjEtMS42My0uMzM1bC0uMjMtLjEwMS0uMjQzIDEuNDE0Yy40MDguMTc0IDEuMTU5LjMyOSAxLjkzOC4zMzYgMS44MjQgMCAzLjAxLS44NDUgMy4wMjUtMi4xNTIuMDA2LS43MTctLjQ1OC0xLjI2Ny0xLjQ1OS0xLjcxNi0uNjA4LS4yODgtLjk4LS40ODItLjk4LS43NzcuMDA3LS4yNjkuMzE1LS41NDMgMS0uNTQzYTMuMTIgMy4xMiAwIDAgMSAxLjI5NS4yNDFsLjE1Ny4wNjcuMjM3LTEuMzZ6IiBmaWxsPSIjMUExRjcxIi8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yMy4yMyA3LjAyMmgxLjM0NWwxLjQwMiA2LjNoLTEuNjFzLS4xNTctLjcyMy0uMjA3LS45NDRoLTIuMjNsLS4zNjYuOTQ1aC0xLjgyM2wyLjU4MS01Ljc3OGMuMTgtLjQwOS40OTQtLjUyMy45MDktLjUyM3ptLS4xMDcgMi4zMDYtLjY5MyAxLjc2M2gxLjQ0NGMtLjA3Mi0uMzE1LS40LTEuODIzLS40LTEuODIzbC0uMTIyLS41NDNjLS4wNTEuMTQtLjEyNS4zMzItLjE3NS40NjFsLS4wNTQuMTQyek00LjU1NCA3LjAyMkg3LjM1Yy4zNzkuMDE0LjY4Ni4xMjguNzg2LjUzbC42MDggMi44OTUuMTg2Ljg3MiAxLjcwMi00LjI5N2gxLjgzN2wtMi43MzEgNi4yOTRINy45TDYuMzUyIDcuODQyYTcuMzU5IDcuMzU5IDAgMCAwLTEuODI3LS42OTJsLjAyOS0uMTI4eiIgZmlsbD0iIzFBMUY3MSIvPjxwYXRoIGQ9Ik0zNiAyNWEyIDIgMCAwIDEgMi0yaDI0LjY2YTIgMiAwIDAgMSAyIDJ2MTRhMiAyIDAgMCAxLTIgMkgzOGEyIDIgMCAwIDEtMi0yVjI1eiIgZmlsbD0idXJsKCNhKSIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMzggMjJoMjQuNjZhMyAzIDAgMCAxIDMgM3YxNGEzIDMgMCAwIDEtMyAzSDM4YTMgMyAwIDAgMS0zLTNWMjVhMyAzIDAgMCAxIDMtM3ptMCAxYTIgMiAwIDAgMC0yIDJ2MTRhMiAyIDAgMCAwIDIgMmgyNC42NmEyIDIgMCAwIDAgMi0yVjI1YTIgMiAwIDAgMC0yLTJIMzh6IiBmaWxsPSIjREREIi8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik00NS43MyAzMS44NjNoNC43OTVjLS4wNDMtMS4wMzctLjI4NC0yLjEwNS0xLjAxNy0yLjc5Mi0uODczLS44MTgtMi40MDEtMS4xMjEtMy43NjctMS4xMjEtMS40MjEgMC0yLjk5My4zMzMtMy44NyAxLjIxLS43NTcuNzU2LS45MiAxLjk3Mi0uOTIgMy4wNjUgMCAxLjE0NC4zMiAyLjQ3NiAxLjE0IDMuMjQyLjg3My44MTYgMi4yODYgMS4wMzMgMy42NSAxLjAzMyAxLjMyNSAwIDIuNzYtLjI0NSAzLjYyNy0xLjAyLjg2Ni0uNzczIDEuMTY1LTIuMDc2IDEuMTY1LTMuMjU1di0uMDA2aC00LjgwNHYtLjM1NnptNS4xMTcuMzU2djQuMDloNi42NzJ2LS4wMDZjLjk3Ni0uMDUzIDEuNzUzLS45MzMgMS43NTMtMi4wMTQgMC0xLjA4MS0uNzc3LTIuMDE4LTEuNzUzLTIuMDcxdi4wMDFoLTYuNjcyem02LjU5Ni00LjA5OGMuOTUxIDAgMS43MDYuODI2IDEuNzA2IDEuODY3IDAgLjk4Ny0uNjkzIDEuNzkyLTEuNTc1IDEuODc1aC02LjcyN3YtMy43NDhoNi4zODVhLjcuNyAwIDAgMSAuMTMuMDAyYy4wMjguMDAyLjA1NS4wMDQuMDguMDA0eiIgZmlsbD0iI0ZFRkVGRSIvPjxwYXRoIGQ9Ik0xIDI1YTIgMiAwIDAgMSAyLTJoMjQuNjZhMiAyIDAgMCAxIDIgMnYxNGEyIDIgMCAwIDEtMiAySDNhMiAyIDAgMCAxLTItMlYyNXoiIGZpbGw9IiMyNTU3RDYiLz48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTMgMjJoMjQuNjZhMyAzIDAgMCAxIDMgM3YxNGEzIDMgMCAwIDEtMyAzSDNhMyAzIDAgMCAxLTMtM1YyNWEzIDMgMCAwIDEgMy0zem0wIDFhMiAyIDAgMCAwLTIgMnYxNGEyIDIgMCAwIDAgMiAyaDI0LjY2YTIgMiAwIDAgMCAyLTJWMjVhMiAyIDAgMCAwLTItMkgzeiIgZmlsbD0iI0RERCIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMSAzMS40NTNoMS4zNzdsLjMxLS43NDVoLjY5NWwuMzEuNzQ1SDYuNHYtLjU3bC4yNDEuNTcySDguMDVsLjI0Mi0uNTh2LjU3OGg2LjczMWwtLjAwMy0xLjIyNGguMTNjLjA5Mi4wMDMuMTE4LjAxMi4xMTguMTYydjEuMDYyaDMuNDgydi0uMjg1Yy4yOC4xNS43MTguMjg1IDEuMjkyLjI4NWgxLjQ2NWwuMzE0LS43NDVoLjY5NWwuMzA2Ljc0NWgyLjgyM3YtLjcwOGwuNDI3LjcwOGgyLjI2M3YtNC42ODJoLTIuMjR2LjU1M2wtLjMxMy0uNTUzaC0yLjI5N3YuNTUzbC0uMjg3LS41NTNoLTMuMTA0Yy0uNTE5IDAtLjk3NS4wNzItMS4zNDQuMjczdi0uMjczaC0yLjE0MXYuMjczYy0uMjM1LS4yMDctLjU1NS0uMjczLS45MS0uMjczSDcuODc2bC0uNTI2IDEuMjEtLjUzOC0xLjIxSDQuMzQ4di41NTNsLS4yNy0uNTUzSDEuOTc1TDEgMjguOTk3djIuNDU2em04LjY5LS42NzVoLS44MjZsLS4wMDMtMi42My0xLjE2OCAyLjYzaC0uNzA4bC0xLjE3LTIuNjMydjIuNjMxaC0xLjY0bC0uMzEtLjc0OEgyLjE4OGwtLjMxMy43NDlIMWwxLjQ0My0zLjM1N0gzLjY0bDEuMzcgMy4xNzh2LTMuMTc4aDEuMzE1bDEuMDU1IDIuMjc3Ljk2OS0yLjI3N0g5LjY5djMuMzU3em0tNi4xLTEuNDQ1LS41NTEtMS4zMzgtLjU0OSAxLjMzN2gxLjF6bTkuMzg4IDEuNDQ1aC0yLjY5MlYyNy40MmgyLjY5MnYuN2gtMS44ODZ2LjYwNGgxLjg0di42ODhoLTEuODR2LjY3aDEuODg2di42OTV6bTMuNzkzLTIuNDUzYS45NDYuOTQ2IDAgMCAxLS41NjguODk1LjkyOS45MjkgMCAwIDEgLjM5OS4yODNjLjExNC4xNjcuMTMzLjMxNi4xMzMuNjE1di42NmgtLjgxM2wtLjAwMy0uNDIzYzAtLjIwMi4wMi0uNDkzLS4xMjctLjY1NC0uMTE4LS4xMTgtLjI5Ny0uMTQ0LS41ODctLjE0NGgtLjg2NXYxLjIyaC0uODA2di0zLjM1NmgxLjg1NGMuNDExIDAgLjcxNS4wMTEuOTc1LjE2LjI1NS4xNTEuNDA4LjM3LjQwOC43NDR6bS0xLjAxOS40OTljLS4xMS4wNjctLjI0MS4wNjktLjM5OC4wNjloLS45Nzl2LS43NDZoLjk5MmMuMTQgMCAuMjg3LjAwNy4zODIuMDYuMTA1LjA1LjE3LjE1NC4xNy4yOTggMCAuMTQ2LS4wNjIuMjY0LS4xNjcuMzE5em0yLjMxMSAxLjk1NGgtLjgyMlYyNy40MmguODIydjMuMzU3em05LjU0NSAwaC0xLjE0MmwtMS41MjctMi41MnYyLjUyaC0xLjY0MmwtLjMxMy0uNzQ5SDIxLjMxbC0uMzA0Ljc1aC0uOTQzYy0uMzkyIDAtLjg4OC0uMDg3LTEuMTY4LS4zNzItLjI4NC0uMjg1LS40MzEtLjY3MS0uNDMxLTEuMjgyIDAtLjQ5OC4wODgtLjk1My40MzQtMS4zMTIuMjYxLS4yNjguNjY5LS4zOTIgMS4yMjQtLjM5MmguNzh2LjcyaC0uNzYzYy0uMjk0IDAtLjQ2LjA0My0uNjIuMTk4LS4xMzguMTQyLS4yMzIuNDEtLjIzMi43NiAwIC4zNi4wNzIuNjIuMjIyLjc5LjEyNC4xMzIuMzQ5LjE3Mi41NjEuMTcyaC4zNjJsMS4xMzYtMi42NGgxLjIwN2wxLjM2NCAzLjE3NXYtMy4xNzVoMS4yMjdsMS40MTYgMi4zMzh2LTIuMzM4aC44MjZ2My4zNTd6bS00Ljg5OC0xLjQ0NS0uNTU4LTEuMzM4LS41NTQgMS4zMzdoMS4xMTJ6bTYuOTUgNi44MDVjLS4xOTUuMjg1LS41NzYuNDMtMS4wOTMuNDNoLTEuNTU2di0uNzJoMS41NWMuMTU0IDAgLjI2MS0uMDIxLjMyNi0uMDg0YS4yOTYuMjk2IDAgMCAwIC4wOTYtLjIxOS4yNzYuMjc2IDAgMCAwLS4wOTktLjIyMmMtLjA1OC0uMDUxLS4xNDQtLjA3NS0uMjg0LS4wNzUtLjc1Ny0uMDI1LTEuNy4wMjQtMS43LTEuMDQgMC0uNDg2LjMxLS45OTggMS4xNTYtLjk5OGgxLjYwNXYtLjY2OGgtMS40OTJjLS40NSAwLS43NzcuMTA3LTEuMDA4LjI3NHYtLjI3NGgtMi4yMDZjLS4zNTIgMC0uNzY2LjA4Ny0uOTYyLjI3NHYtLjI3NGgtMy45Mzl2LjI3NGMtLjMxMy0uMjI2LS44NDMtLjI3NC0xLjA4Ni0uMjc0aC0yLjU5OXYuMjc0Yy0uMjQ4LS4yNC0uOC0uMjc0LTEuMTM1LS4yNzRoLTIuOTA4bC0uNjY1LjcxNi0uNjIzLS43MTZINi42OTR2NC42ODVoNC4yNjJsLjY4NS0uNzI5LjY0Ni43MjkgMi42MjcuMDAydi0xLjEwMmguMjU4Yy4zNDkuMDA1Ljc2LS4wMDkgMS4xMjMtLjE2NXYxLjI2NGgyLjE2NnYtMS4yMmguMTA1Yy4xMzQgMCAuMTQ3LjAwNS4xNDcuMTM3djEuMDgzaDYuNTgxYy40MTggMCAuODU1LS4xMDcgMS4wOTctLjN2LjNoMi4wODhjLjQzNCAwIC44NTktLjA2MSAxLjE4MS0uMjE2di0uODczem0tMTMuMDUtMS44MDNjMCAuOTMzLS43IDEuMTI2LTEuNDAzIDEuMTI2SDE0LjJ2MS4xMjZoLTEuNTY2bC0uOTkyLTEuMTEyLTEuMDMxIDEuMTEySDcuNDJWMzMuMjNoMy4yNGwuOTkyIDEuMTAxIDEuMDI1LTEuMWgyLjU3NWMuNjQgMCAxLjM1OC4xNzYgMS4zNTggMS4xMDV6bS02LjQwNiAxLjU0Nkg4LjIyM3YtLjY2OGgxLjc2OXYtLjY4NWgtMS43N3YtLjYxaDIuMDJsLjg4Mi45NzgtLjkyLjk4NXptMy4xOTEuMzg0LTEuMjM2LTEuMzY4IDEuMjM2LTEuMzI0djIuNjkyem0xLjgzLTEuNDkzaC0xLjA0MXYtLjg1NWgxLjA1Yy4yOTEgMCAuNDkzLjExOC40OTMuNDEyIDAgLjI5LS4xOTIuNDQzLS41MDIuNDQzem01LjQ1NS0xLjU0MmgyLjY5di42OTRoLTEuODg3di42MWgxLjg0di42ODVoLTEuODR2LjY2OGwxLjg4Ny4wMDR2LjY5NmgtMi42OVYzMy4yM3ptLTEuMDMzIDEuNzk3YS44NzcuODc3IDAgMCAxIC4zOTQuMjgxYy4xMTQuMTY1LjEzLjMxOC4xMzQuNjEzdi42NjZoLS44MXYtLjQyYzAtLjIwMi4wMi0uNS0uMTMtLjY1Ny0uMTE3LS4xMi0uMjk2LS4xNS0uNTktLjE1aC0uODYydjEuMjI3aC0uODFWMzMuMjNoMS44NmMuNDA5IDAgLjcwNi4wMTguOTcuMTU5LjI1NS4xNTMuNDE1LjM2My40MTUuNzQ1IDAgLjUzNi0uMzYuODEtLjU3MS44OTR6bS0uNDU2LS40MjVjLS4xMDguMDY0LS4yNC4wNy0uMzk4LjA3aC0uOTc5di0uNzU1aC45OTNjLjE0MyAwIC4yODYuMDAzLjM4NC4wNi4xMDQuMDU1LjE2Ny4xNi4xNjcuMzAzYS4zNi4zNiAwIDAgMS0uMTY3LjMyMnptNy4yNzQuMjE0Yy4xNTcuMTYyLjI0MS4zNjYuMjQxLjcxMSAwIC43MjMtLjQ1MyAxLjA2LTEuMjY2IDEuMDZoLTEuNTd2LS43MmgxLjU2NGMuMTUzIDAgLjI2MS0uMDIuMzMtLjA4M2EuMjk5LjI5OSAwIDAgMC0uMDA0LS40NDFjLS4wNjEtLjA1MS0uMTQ3LS4wNzUtLjI4Ny0uMDc1LS43NTMtLjAyNS0xLjY5Ny4wMjMtMS42OTctMS4wNCAwLS40ODYuMzA3LS45OTggMS4xNTItLjk5OGgxLjYxNXYuNzE0aC0xLjQ3OGMtLjE0NiAwLS4yNDIuMDA1LS4zMjMuMDYtLjA4OC4wNTUtLjEyLjEzNi0uMTIuMjQyYS4yNTcuMjU3IDAgMCAwIC4xNzUuMjUuOTMuOTMgMCAwIDAgLjMxNC4wMzlsLjQzNC4wMTFjLjQzNy4wMS43MzguMDg2LjkyLjI3em0zLjE5Ny0uODk5aC0xLjQ2OGMtLjE0NyAwLS4yNDQuMDA2LS4zMjYuMDYtLjA4NS4wNTUtLjExOC4xMzYtLjExOC4yNDNhLjI1My4yNTMgMCAwIDAgLjE3Ni4yNS45MzEuOTMxIDAgMCAwIC4zMS4wMzhsLjQzNy4wMTFjLjQ0MS4wMTEuNzM1LjA4Ny45MTUuMjcuMDMyLjAyNi4wNTIuMDU1LjA3NC4wODR2LS45NTZ6IiBmaWxsPSIjZmZmIi8+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJhIiB4MT0iNDIuMjA3IiB5MT0iMTguNjA1IiB4Mj0iMzYuMDYzIiB5Mj0iMzkuNDE4IiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+PHN0b3Agc3RvcC1jb2xvcj0iIzIyMkU3MiIvPjxzdG9wIG9mZnNldD0iLjU5MiIgc3RvcC1jb2xvcj0iIzQwQ0JGRiIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iIzNDQjc5MiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjwvc3ZnPgoK") center / 76px auto no-repeat; } .footer-payment-mark--stripe { background: #fff url("https://12footwear.com/wp-content/plugins/woocommerce/assets/images/onboarding/icons/stripe.svg") center / 62px auto no-repeat; } .footer-payment-mark--stripe svg { display: none; } .footer-payment-mark--apple-pay { min-width: 86px; background: #fff url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjQiIGhlaWdodD0iNDAiIHZpZXdCb3g9IjAgMCA2NCA0MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48Zz48Y2xpcFBhdGggaWQ9ImNsaXAiPjxyZWN0IHg9IjEyIiB5PSIxMCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjI0Ij48L3JlY3Q+PC9jbGlwUGF0aD48ZyBjbGlwLXBhdGg9InVybCggI2NsaXAgKSI+PHBhdGggZD0iTTIxLjg2NiwxMi44OUMyMS4yMzMsMTMuNjQ3IDIwLjIyLDE0LjI0NCAxOS4yMDgsMTQuMTU5QzE5LjA4MSwxMy4xMzUgMTkuNTc3LDEyLjA0NyAyMC4xNTcsMTEuMzc2QzIwLjc5LDEwLjU5NyAyMS44OTcsMTAuMDQzIDIyLjc5NCwxMEMyMi44OTksMTEuMDY2IDIyLjQ4OCwxMi4xMTEgMjEuODY2LDEyLjg5Wk0yMi43ODMsMTQuMzYxQzIxLjg5MSwxNC4zMSAyMS4wNzcsMTQuNjMzIDIwLjQyLDE0Ljg5NEMxOS45OTcsMTUuMDYyIDE5LjYzOSwxNS4yMDQgMTkuMzY2LDE1LjIwNEMxOS4wNiwxNS4yMDQgMTguNjg3LDE1LjA1NCAxOC4yNjgsMTQuODg2QzE3LjcyLDE0LjY1IDE3LjA5MiwxNC40MTMgMTYuNDM0LDE0LjQyNUMxNC45MjYsMTQuNDQ3IDEzLjUyMywxNS4zMSAxMi43NTMsMTYuNjg2QzExLjE3MSwxOS40MzcgMTIuMzQyLDIzLjUxMSAxMy44NzEsMjUuNzVDMTQuNjIsMjYuODU5IDE1LjUxNywyOC4wNzUgMTYuNjk4LDI4LjAzMkMxNy4yMTcsMjguMDEyIDE3LjU5MSwyNy44NTIgMTcuOTc4LDI3LjY4NkMxOC40MjQsMjcuNDk1IDE4Ljg4NiwyNy4yOTYgMTkuNjA5LDI3LjI5NkMyMC4zMDYsMjcuMjk2IDIwLjc0OSwyNy40OSAyMS4xNzMsMjcuNjc1QzIxLjU3NywyNy44NTIgMjEuOTY1LDI4LjAyMSAyMi41NDEsMjguMDExQzIzLjc2NCwyNy45ODkgMjQuNTM0LDI2LjkwMiAyNS4yODMsMjUuNzkzQzI2LjA5MSwyNC42MDIgMjYuNDQ2LDIzLjQ0MSAyNi41LDIzLjI2NUwyNi41MDYsMjMuMjQ0QzI2LjUwNSwyMy4yNDMgMjYuNDk1LDIzLjIzOCAyNi40NzgsMjMuMjNMMjYuNDc3LDIzLjIzQzI2LjIwNywyMy4xMDUgMjQuMTQyLDIyLjE0OSAyNC4xMjMsMTkuNTg3QzI0LjEwMywxNy40MzUgMjUuNzYsMTYuMzQ2IDI2LjAyMSwxNi4xNzRDMjYuMDM3LDE2LjE2MyAyNi4wNDgsMTYuMTU3IDI2LjA1MywxNi4xNTNDMjQuOTk4LDE0LjU3NSAyMy4zNTMsMTQuNDA0IDIyLjc4MywxNC4zNjFaTTMxLjI1MiwyNy44OTNMMzEuMjUyLDExLjI2OUwzNy40MjIsMTEuMjY5QzQwLjYwOCwxMS4yNjkgNDIuODMzLDEzLjQ4NyA0Mi44MzMsMTYuNzI5QzQyLjgzMywxOS45NyA0MC41NjUsMjIuMjEgMzcuMzM4LDIyLjIxTDMzLjgwNSwyMi4yMUwzMy44MDUsMjcuODkzTDMxLjI1MiwyNy44OTNaTTMzLjgwNSwxMy40NDRMMzYuNzQ3LDEzLjQ0NEMzOC45NjIsMTMuNDQ0IDQwLjIyOCwxNC42MzkgNDAuMjI4LDE2LjczOUM0MC4yMjgsMTguODQgMzguOTYyLDIwLjA0NSAzNi43MzcsMjAuMDQ1TDMzLjgwNSwyMC4wNDVMMzMuODA1LDEzLjQ0NFpNNTEuMjYsMjUuODk5QzUwLjU4NSwyNy4yIDQ5LjA5OCwyOC4wMjEgNDcuNDk1LDI4LjAyMUM0NS4xMjIsMjguMDIxIDQzLjQ2NiwyNi41OTIgNDMuNDY2LDI0LjQzOEM0My40NjYsMjIuMzA2IDQ1LjA2OSwyMS4wNzkgNDguMDMzLDIwLjg5OEw1MS4yMTgsMjAuNzA2TDUxLjIxOCwxOS43ODlDNTEuMjE4LDE4LjQzNSA1MC4zNDIsMTcuNjk5IDQ4Ljc4MSwxNy42OTlDNDcuNDk1LDE3LjY5OSA0Ni41NTYsMTguMzcxIDQ2LjM2NiwxOS4zOTVMNDQuMDY3LDE5LjM5NUM0NC4xNDEsMTcuMjQxIDQ2LjE0NSwxNS42NzMgNDguODU1LDE1LjY3M0M1MS43NzcsMTUuNjczIDUzLjY3NSwxNy4yMTkgNTMuNjc1LDE5LjYxOUw1My42NzUsMjcuODkzTDUxLjMxMywyNy44OTNMNTEuMzEzLDI1Ljg5OUw1MS4yNiwyNS44OTlaTTQ4LjE4LDI2LjA0OUM0Ni44MiwyNi4wNDkgNDUuOTU1LDI1LjM4NyA0NS45NTUsMjQuMzc0QzQ1Ljk1NSwyMy4zMjkgNDYuNzg4LDIyLjcyMiA0OC4zODEsMjIuNjI2TDUxLjIxOCwyMi40NDRMNTEuMjE4LDIzLjM4M0M1MS4yMTgsMjQuOTQgNDkuOTEsMjYuMDQ5IDQ4LjE4LDI2LjA0OVpNNjEuNTExLDI4LjU0NEM2MC40ODgsMzEuNDU1IDU5LjMxOCwzMi40MTUgNTYuODI5LDMyLjQxNUM1Ni42MzksMzIuNDE1IDU2LjAwNiwzMi4zOTMgNTUuODU4LDMyLjM1MUw1NS44NTgsMzAuMzU3QzU2LjAxNywzMC4zNzggNTYuNDA3LDMwLjM5OSA1Ni42MDcsMzAuMzk5QzU3LjczNiwzMC4zOTkgNTguMzY4LDI5LjkxOSA1OC43NTksMjguNjcyTDU4Ljk5MSwyNy45MzZMNTQuNjY3LDE1LjgzM0w1Ny4zMzUsMTUuODMzTDYwLjM0MSwyNS42NTRMNjAuMzkzLDI1LjY1NEw2My4zOTksMTUuODMzTDY1Ljk5NCwxNS44MzNMNjEuNTExLDI4LjU0NFoiIGZpbGw9IiMwMDAiPjwvcGF0aD48L2c+PC9nPjxwYXRoIGQ9Ik01MS45ODMsMjAuMDhDNTEuOTg0LDE5LjU0MiA1MS45MzcsMTkuMDA1IDUxLjg0MiwxOC40NzRMNDQuMTUzLDE4LjQ3NEw0NC4xNTMsMjEuNTE2TDQ4LjU1NywyMS41MTZDNDguMzc1LDIyLjQ5OCA0Ny43ODcsMjMuMzY2IDQ2LjkyOSwyMy45MTdMNDYuOTI5LDI1Ljg5Mkw0OS41NTcsMjUuODkyQzUxLjA5NiwyNC41MTcgNTEuOTgzLDIyLjQ4NCA1MS45ODMsMjAuMDhaIiBmaWxsPSJyZ2IoIDY2LCAxMzMsIDI0NCApIj48L3BhdGg+PHBhdGggZD0iTTQ0LjE1MywyNy44QzQ2LjM1MywyNy44IDQ4LjIwNiwyNy4xIDQ5LjU1NywyNS44OTNMNDYuOTI5LDIzLjkxOEM0Ni4xOTcsMjQuMzk5IDQ1LjI1NSwyNC42NzMgNDQuMTUzLDI0LjY3M0M0Mi4wMjYsMjQuNjczIDQwLjIyMSwyMy4yODQgMzkuNTc2LDIxLjQxMkwzNi44NjgsMjEuNDEyTDM2Ljg2OCwyMy40NDhDMzguMjUyLDI2LjExNiA0MS4wNzEsMjcuOCA0NC4xNTMsMjcuOFoiIGZpbGw9InJnYiggNTIsIDE2OCwgODMgKSI+PC9wYXRoPjxwYXRoIGQ9Ik0zOS41NzYsMjEuNDEyQzM5LjIzNSwyMC40MzEgMzkuMjM1LDE5LjM2OSAzOS41NzYsMTguMzg4TDM5LjU3NiwxNi4zNTNMMzYuODY4LDE2LjM1M0MzNS43MTEsMTguNTg1IDM1LjcxMSwyMS4yMTYgMzYuODY4LDIzLjQ0OEwzOS41NzYsMjEuNDEyWiIgZmlsbD0icmdiKCAyNTEsIDE4OCwgNCApIj48L3BhdGg+PHBhdGggZD0iTTQ0LjE1MywxNS4xMjhDNDUuMzE2LDE1LjEwOSA0Ni40MzksMTUuNTM1IDQ3LjI4MSwxNi4zMTNMNDkuNjA4LDE0LjA1OEM0OC4xMzIsMTIuNzE1IDQ2LjE3NywxMS45NzggNDQuMTUzLDEyLjAwMUM0MS4wNzEsMTIuMDAxIDM4LjI1MiwxMy42ODUgMzYuODY4LDE2LjM1M0wzOS41NzYsMTguMzg4QzQwLjIyMSwxNi41MTcgNDIuMDI2LDE1LjEyOCA0NC4xNTMsMTUuMTI4WiIgZmlsbD0icmdiKCAyMzQsIDY3LCA1MyApIj48L3BhdGg+PC9zdmc+Cg==") center / 70px auto no-repeat; } .footer-payment-mark--apple-pay svg { display: none; } .footer-payment-mark--google-pay { display: none; } .footer-payment-mark--link { min-width: 86px; background: #fff url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjQiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA3MiAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTM2LjEyIDMuNjc2ODNDMzYuMTIgMi41NDg4MiAzNy4wNzA0IDEuNjMyMDIgMzguMTg4OCAxLjYzMjAyQzM5LjMwNzIgMS42MzIwMiA0MC4yNTc2IDIuNTUzNjIgNDAuMjU3NiAzLjY3NjgzQzQwLjI1NzYgNC44MDAwMyAzOS4zNDA4IDUuNzQ1NjMgMzguMTg4OCA1Ljc0NTYzQzM3LjAzNjggNS43NDU2MyAzNi4xMiA0LjgyODgzIDM2LjEyIDMuNjc2ODNaIiBmaWxsPSIjMDExRTBGIi8+CjxwYXRoIGQ9Ik0yOS45ODA4IDEuOTIwMDFIMzMuNTgwOFYyMi4wOEgyOS45ODA4VjEuOTIwMDFaIiBmaWxsPSIjMDExRTBGIi8+CjxwYXRoIGQ9Ik00MC4wMDggNy42ODAwMUgzNi4zNzkyVjIyLjA4SDQwLjAwOFY3LjY4MDAxWiIgZmlsbD0iIzAxMUUwRiIvPgo8cGF0aCBkPSJNNjYuMDk2IDE0LjM5MDRDNjguODI3MiAxMi43MTA0IDcwLjY4NDggMTAuMjA5NiA3MS40MTkyIDcuNjc1MjRINjcuNzkwNEM2Ni44NDQ4IDEwLjA5NDQgNjQuNjc1MiAxMS45MTM2IDYyLjI4OTYgMTIuNjg2NFYxLjkxNTIzSDU4LjY2MDhWMjIuMDc1Mkg2Mi4yODk2VjE2LjA4QzY1LjA1OTIgMTYuNzcxMiA2Ny4yNDggMTkuMTY2NCA2Ny45OTY4IDIyLjA3NTJINzEuNjQ5NkM3MS4wOTI4IDE5LjAyMjQgNjkuMDA0OCAxNi4xNjY0IDY2LjA5NiAxNC4zOTA0WiIgZmlsbD0iIzAxMUUwRiIvPgo8cGF0aCBkPSJNNDYuNDQgOS4yOTI4M0M0Ny4zOTA0IDguMDMwNDMgNDkuMjQzMiA3LjI5NjAyIDUwLjc0NTYgNy4yOTYwMkM1My41NDg4IDcuMjk2MDIgNTUuODY3MiA5LjM0NTYzIDU1Ljg3MiAxMi40NDE2VjIyLjA3NTJINTIuMjQzMlYxMy4yNDMyQzUyLjI0MzIgMTEuOTcxMiA1MS42NzY4IDEwLjUwMjQgNDkuODM4NCAxMC41MDI0QzQ3LjY3ODQgMTAuNTAyNCA0Ni40MzUyIDEyLjQxNzYgNDYuNDM1MiAxNC42NTkyVjIyLjA4NDhINDIuODA2NFY3LjY4OTYySDQ2LjQ0VjkuMjkyODNaIiBmaWxsPSIjMDExRTBGIi8+CjxwYXRoIGQ9Ik0xMiAyNEMxOC42Mjc0IDI0IDI0IDE4LjYyNzQgMjQgMTJDMjQgNS4zNzI1NyAxOC42Mjc0IDAgMTIgMEM1LjM3MjU5IDAgMCA1LjM3MjU3IDAgMTJDMCAxOC42Mjc0IDUuMzcyNTkgMjQgMTIgMjRaIiBmaWxsPSIjMDBENjZGIi8+CjxwYXRoIGQ9Ik0xMS40NDc5IDQuODAwMDVINy43NDcwN0M4LjQ2NzA3IDcuODA5NjUgMTAuNTY5NSAxMC4zODI0IDEzLjE5OTkgMTJDMTAuNTY0NyAxMy42MTc2IDguNDY3MDcgMTYuMTkwNCA3Ljc0NzA3IDE5LjJIMTEuNDQ3OUMxMi4zNjQ3IDE2LjQxNiAxNC45MDM5IDEzLjk5NjggMTguMDIzOSAxMy41MDI0VjEwLjQ5MjlDMTQuODk5MSAxMC4wMDMzIDEyLjM1OTkgNy41ODQwNSAxMS40NDc5IDQuODAwMDVaIiBmaWxsPSIjMDExRTBGIi8+Cjwvc3ZnPgoK") center / 72px auto no-repeat; } .footer-payment-mark--link svg { display: none; } .footer-payment-mark--bank { min-width: 140px; } .footer-payment-mark--bank svg { width: 112px; max-width: none; overflow: visible; } /* Compact transparent payment marks: one brand per mark. */ .footer-payment-marks { align-items: center; gap: 14px; } .footer-payment-mark { display: inline-block; width: 48px; min-width: 0; height: 25px; padding: 0; border: 0; border-radius: 0; background-color: transparent; background-position: center; background-repeat: no-repeat; background-size: contain; } .footer-payment-mark svg { display: none; } .footer-payment-mark--visa { width: 48px; background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiMxQTFGNzEiIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDI0IDI0Ij48dGl0bGU+VmlzYTwvdGl0bGU+PHBhdGggZD0iTTkuMTEyIDguMjYyTDUuOTcgMTUuNzU4SDMuOTJMMi4zNzQgOS43NzVjLS4wOTQtLjM2OC0uMTc1LS41MDMtLjQ2MS0uNjU4QzEuNDQ3IDguODY0LjY3NyA4LjYyNyAwIDguNDc5bC4wNDYtLjIxN2gzLjNhLjkwNC45MDQgMCAwMS44OTQuNzY0bC44MTcgNC4zMzggMi4wMTgtNS4xMDJ6bTguMDMzIDUuMDQ5Yy4wMDgtMS45NzktMi43MzYtMi4wODgtMi43MTctMi45NzIuMDA2LS4yNjkuMjYyLS41NTUuODIyLS42MjhhMy42NiAzLjY2IDAgMDExLjkxMy4zMzZsLjM0LTEuNTlhNS4yMDcgNS4yMDcgMCAwMC0xLjgxNC0uMzMzYy0xLjkxNyAwLTMuMjY2IDEuMDItMy4yNzggMi40NzktLjAxMiAxLjA3OS45NjMgMS42OCAxLjY5OCAyLjA0Ljc1Ni4zNjcgMS4wMS42MDMgMS4wMDYuOTMxLS4wMDUuNTA0LS42MDIuNzI1LTEuMTYuNzM0LS45NzUuMDE1LTEuNTQtLjI2My0xLjk5Mi0uNDczbC0uMzUxIDEuNjQyYy40NTMuMjA4IDEuMjg5LjM5IDIuMTU2LjM5OCAyLjAzNyAwIDMuMzctMS4wMDYgMy4zNzctMi41NjRtNS4wNjEgMi40NDdIMjRsLTEuNTY1LTcuNDk2aC0xLjY1NmEuODgzLjg4MyAwIDAwLS44MjYuNTVsLTIuOTA5IDYuOTQ2aDIuMDM2bC40MDUtMS4xMmgyLjQ4OHptLTIuMTYzLTIuNjU2bDEuMDItMi44MTUuNTg4IDIuODE1em0tOC4xNi00Ljg0bC0xLjYwMyA3LjQ5Nkg4LjM0bDEuNjA1LTcuNDk2eiIvPjwvc3ZnPg=="); } .footer-payment-mark--mastercard { position: relative; width: 38px; } .footer-payment-mark--mastercard::before, .footer-payment-mark--mastercard::after { position: absolute; top: 3px; width: 19px; height: 19px; border-radius: 50%; content: ""; } .footer-payment-mark--mastercard::before { left: 2px; background: #eb001b; } .footer-payment-mark--mastercard::after { right: 2px; background: #f79e1b; opacity: .92; } .footer-payment-mark--stripe { width: 42px; background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiM2MzVCRkYiIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDI0IDI0Ij48dGl0bGU+U3RyaXBlPC90aXRsZT48cGF0aCBkPSJNMTMuOTc2IDkuMTVjLTIuMTcyLS44MDYtMy4zNTYtMS40MjYtMy4zNTYtMi40MDkgMC0uODMxLjY4My0xLjMwNSAxLjkwMS0xLjMwNSAyLjIyNyAwIDQuNTE1Ljg1OCA2LjA5IDEuNjMxbC44OS01LjQ5NEMxOC4yNTIuOTc1IDE1LjY5NyAwIDEyLjE2NSAwIDkuNjY3IDAgNy41ODkuNjU0IDYuMTA0IDEuODcyIDQuNTYgMy4xNDcgMy43NTcgNC45OTIgMy43NTcgNy4yMThjMCA0LjAzOSAyLjQ2NyA1Ljc2IDYuNDc2IDcuMjE5IDIuNTg1LjkyIDMuNDQ1IDEuNTc0IDMuNDQ1IDIuNTgzIDAgLjk4LS44NCAxLjU0NS0yLjM1NCAxLjU0NS0xLjg3NSAwLTQuOTY1LS45MjEtNi45OS0yLjEwOWwtLjkgNS41NTVDNS4xNzUgMjIuOTkgOC4zODUgMjQgMTEuNzE0IDI0YzIuNjQxIDAgNC44NDMtLjYyNCA2LjMyOC0xLjgxMyAxLjY2NC0xLjMwNSAyLjUyNS0zLjIzNiAyLjUyNS01LjczMiAwLTQuMTI4LTIuNTI0LTUuODUxLTYuNTk0LTcuMzA1aC4wMDN6Ii8+PC9zdmc+"); } .footer-payment-mark--apple-pay { width: 52px; background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiMwMDAwMDAiIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDI0IDI0Ij48dGl0bGU+QXBwbGUgUGF5PC90aXRsZT48cGF0aCBkPSJNMi4xNSA0LjMxOGE0Mi4xNiA0Mi4xNiAwIDAgMC0uNDU0LjAwM2MtLjE1LjAwNS0uMzAzLjAxMy0uNDUyLjA0YTEuNDQgMS40NCAwIDAgMC0xLjA2Ljc3MmMtLjA3LjEzOC0uMTE0LjI3OC0uMTQuNDMtLjAyOC4xNDgtLjAzNy4zLS4wNC40NUExMC4yIDEwLjIgMCAwIDAgMCA2LjIyMnYxMS41NTdjMCAuMDcuMDAyLjEzOC4wMDMuMjA3LjAwNC4xNS4wMTMuMzAzLjA0LjQ1Mi4wMjcuMTUuMDcyLjI5MS4xNDIuNDI5YTEuNDM2IDEuNDM2IDAgMCAwIC42My42M2MuMTM4LjA3LjI3OC4xMTUuNDMuMTQyLjE0OC4wMjcuMy4wMzYuNDUuMDRsLjIwOC4wMDNoMjAuMTk0bC4yMDctLjAwM2MuMTUtLjAwNC4zMDMtLjAxMy40NTItLjA0LjE1LS4wMjcuMjkxLS4wNzEuNDI4LS4xNDFhMS40MzIgMS40MzIgMCAwIDAgLjYzMS0uNjMxYy4wNy0uMTM4LjExNS0uMjc4LjE0MS0uNDMuMDI3LS4xNDguMDM2LS4zLjA0LS40NS4wMDItLjA3LjAwMy0uMTM4LjAwMy0uMjA4bC4wMDEtLjI0NlY2LjIyMWMwLS4wNy0uMDAyLS4xMzgtLjAwNC0uMjA3YTIuOTk1IDIuOTk1IDAgMCAwLS4wNC0uNDUyIDEuNDQ2IDEuNDQ2IDAgMCAwLTEuMi0xLjIwMSAzLjAyMiAzLjAyMiAwIDAgMC0uNDUyLS4wNCAxMC40NDggMTAuNDQ4IDAgMCAwLS40NTMtLjAwM3ptMCAuNTEyaDE5Ljk0MmMuMDY2IDAgLjEzMS4wMDIuMTk3LjAwMy4xMTUuMDA0LjI1LjAxLjM3NS4wMzIuMTA5LjAyLjIuMDUuMjg3LjA5NGEuOTI3LjkyNyAwIDAgMSAuNDA3LjQwNy45OTcuOTk3IDAgMCAxIC4wOTQuMjg4Yy4wMjIuMTIzLjAyOC4yNTguMDMxLjM3NC4wMDIuMDY1LjAwMy4xMy4wMDMuMTk3djExLjU1MmMwIC4wNjUgMCAuMTMtLjAwMy4xOTYtLjAwMy4xMTUtLjAwOS4yNS0uMDMyLjM3NWEuOTI3LjkyNyAwIDAgMS0uNS42OTMgMS4wMDIgMS4wMDIgMCAwIDEtLjI4Ni4wOTQgMi41OTggMi41OTggMCAwIDEtLjM3My4wMzJsLS4yLjAwM0gxLjkwNmMtLjA2NiAwLS4xMzMtLjAwMi0uMTk2LS4wMDNhMi42MSAyLjYxIDAgMCAxLS4zNzUtLjAzMmMtLjEwOS0uMDItLjItLjA1LS4yODgtLjA5NGEuOTE4LjkxOCAwIDAgMS0uNDA2LS40MDcgMS4wMDYgMS4wMDYgMCAwIDEtLjA5NC0uMjg4IDIuNTMxIDIuNTMxIDAgMCAxLS4wMzItLjM3MyA5LjU4OCA5LjU4OCAwIDAgMS0uMDAyLS4xOTdWNi4yMjRjMC0uMDY1IDAtLjEzMS4wMDItLjE5Ny4wMDQtLjExNC4wMS0uMjQ4LjAzMi0uMzc1LjAyLS4xMDguMDUtLjE5OS4wOTQtLjI4N2EuOTI1LjkyNSAwIDAgMSAuNDA3LS40MDYgMS4wMyAxLjAzIDAgMCAxIC4yODctLjA5NGMuMTI1LS4wMjIuMjYtLjAyOS4zNzUtLjAzMi4wNjUtLjAwMi4xMzEtLjAwMi4xOTYtLjAwM3ptNC43MSAzLjdjLS4zLjAxNi0uNjY4LjE5OS0uODguNDU2LS4xOTEuMjItLjM2LjU4LS4zMTYuOTE4LjMzOC4wMy42NzUtLjE2OS44ODgtLjQxOC4yMDUtLjI1OC4zNDUtLjYwMy4zMDgtLjk1NXptMi4yMDcuNDJ2NS40OTNoLjg1MnYtMS44NzdoMS4xOGMxLjA3OCAwIDEuODM1LS43MzkgMS44MzUtMS44MTIgMC0xLjA3LS43NDItMS44MDUtMS44MDgtMS44MDV6bS44NTIuNzE5aC45ODJjLjczOSAwIDEuMTYxLjM5NiAxLjE2MSAxLjA4OSAwIC42OTItLjQyMiAxLjA5Mi0xLjE2NCAxLjA5MmgtLjk3OXptLTMuMTU0LjNjLS40NS4wMS0uODMuMjgtMS4wNS4yOC0uMjM1IDAtLjU5My0uMjY0LS45ODEtLjI1N2ExLjQ0NiAxLjQ0NiAwIDAgMC0xLjIzLjc0N2MtLjUyNy45MDgtLjEzOSAyLjI1NS4zNzQgMi45OTUuMjQ5LjM2Ni41NDkuNzY5Ljk0NC43NTQuMzczLS4wMTQuNTItLjI0Mi45NzMtLjI0Mi40NTQgMCAuNTg2LjI0Mi45OC4yMzUuNDEtLjAwNy42NjctLjM2Ni45MTUtLjczMy4yODYtLjQxNy40MDMtLjgyLjQxLS44NDEtLjAwNy0uMDA4LS43OS0uMzA4LS43OTctMS4yMDktLjAwOC0uNzU0LjYxNS0xLjExMy42NDQtMS4xMzUtLjM1Mi0uNTItLjktLjU3OC0xLjA5LS41OTNhMS4xMjMgMS4xMjMgMCAwIDAtLjA5Mi0uMDAyem04LjIwNC4zOTdjLS45OSAwLTEuNjA2LjUzMy0xLjY1MiAxLjI1NmguNzc3Yy4wNzItLjM1OC4zNjktLjU4Ni44NDUtLjU4Ni41MDIgMCAuODAzLjI2Ni44MDMuNzExdi4zMDlsLTEuMDk3LjA2NGMtLjk1MS4wNTQtMS40ODguNDg0LTEuNDg4IDEuMTg0IDAgLjcyLjU0OCAxLjIwNyAxLjMzMiAxLjIwNy41MjYgMCAxLjAzMi0uMjgxIDEuMjY0LS43MjdoLjAxOXYuNjU5aC43ODh2LTIuNzZjMC0uODAzLS42Mi0xLjMxNy0xLjU5MS0xLjMxN3ptMS45NC4wNzJsMS40NDYgNC4wMDljMCAuMDAzLS4wNzMuMjQtLjA3My4yNDctLjEyNS40MS0uMzMuNTcxLS43MTEuNTcxLS4wNjkgMC0uMjA2IDAtLjI2Ny0uMDE1di42NjZjLjA2LjAxMS4yNjcuMDE5LjMzNS4wMTkuODMgMCAxLjIyNi0uMzEyIDEuNTY4LTEuMjgzbDEuNS00LjIxNGgtLjg2OGwtMS4wMTIgMy4yNTloLS4wMTVsLTEuMDEzLTMuMjZ6bS0xLjE2NyAyLjE4OXYuMzE2YzAgLjUyMS0uNDUuOTE3LTEuMDI0LjkxNy0uNDQyIDAtLjczMS0uMjI4LS43MzEtLjU3OSAwLS4zNDIuMjc4LS41Ni43NjktLjU5M3oiLz48L3N2Zz4="); filter: invert(1); } .footer-payment-mark--google-pay { display: inline-block; width: 54px; background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiM0Mjg1RjQiIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDI0IDI0Ij48dGl0bGU+R29vZ2xlIFBheTwvdGl0bGU+PHBhdGggZD0iTTMuOTYzIDcuMjM1QTMuOTYzIDMuOTYzIDAgMDAuNDIyIDkuNDE5YTMuOTYzIDMuOTYzIDAgMDAwIDMuNTU5IDMuOTYzIDMuOTYzIDAgMDAzLjU0MSAyLjE4NGMxLjA3IDAgMS45Ny0uMzUyIDIuNjI3LS45NTcuNzQ4LS42OSAxLjE4LTEuNzEgMS4xOC0yLjkxNmE0LjcyMiA0LjcyMiAwIDAwLS4wNy0uODA2SDMuOTY0djEuNTI2aDIuMTRhMS44MzUgMS44MzUgMCAwMS0uNzkgMS4yMDVjLS4zNTYuMjQxLS44MTQuMzc5LTEuMzUuMzc5LTEuMDM0IDAtMS45MTEtLjY5Ny0yLjIyNS0xLjYzNmEyLjM3NSAyLjM3NSAwIDAxMC0xLjUxN2MuMzE0LS45NCAxLjE5MS0xLjYzNiAyLjIyNS0xLjYzNmEyLjE1MiAyLjE1MiAwIDAxMS41Mi41OTRsMS4xMzItMS4xM2EzLjgwOCAzLjgwOCAwIDAwLTIuNjUyLTEuMDMzem02LjUwMS41NXY2LjloLjg4NlYxMS44OWgxLjQ2NWMuNjAzIDAgMS4xMS0uMTk2IDEuNTIyLS41ODhhMS45MTEgMS45MTEgMCAwMC42MzUtMS40NjQgMS45MiAxLjkyIDAgMDAtLjYzNS0xLjQ1NiAyLjEyNSAyLjEyNSAwIDAwLTEuNTIyLS41OTh6bTIuNDI3Ljg1YTEuMTU2IDEuMTU2IDAgMDEuODIzLjM2NSAxLjE3NiAxLjE3NiAwIDAxMCAxLjY4NiAxLjE3MSAxLjE3MSAwIDAxLS44NzcuMzU3SDExLjM1VjguNjM1aDEuNDg3YTEuMTU2IDEuMTU2IDAgMDEuMDU0IDB6bTQuMTI0IDEuMTc1Yy0uODQyIDAtMS40NzcuMzA4LTEuOTA3LjkyNWwuNzgxLjQ5MWMuMjg4LS40MTcuNjgtLjYyNiAxLjE3NS0uNjI2YTEuMjU1IDEuMjU1IDAgMDEuODU2LjMyMyAxLjAwOSAxLjAwOSAwIDAxLjM2Ni43ODV2LjIwMmMtLjM0LS4xOTMtLjc3NC0uMjg5LTEuMy0uMjg5LS42MTcgMC0xLjExLjE0NS0xLjQ3OS40MzQtLjM3LjI4OC0uNTU0LjY3Ny0uNTU0IDEuMTY1YTEuNDc2IDEuNDc2IDAgMDAuNTI1IDEuMTU2Yy4zNS4zMDguNzg1LjQ2MyAxLjMwNS40NjMuNjEgMCAxLjA5OC0uMjcgMS40NjUtLjgxaC4wMzh2LjY1NWguODQ4di0yLjkwOWMwLS42MS0uMTktMS4wOS0uNTY4LTEuNDQtLjM4LS4zNS0uODk2LS41MjUtMS41NTEtLjUyNXptMi4yNjMuMTU0bDEuOTQ2IDQuNDIyLTEuMDk4IDIuMzhoLjkxNUwyNCA5Ljk2M2gtLjk2NWwtMS4zNjggMy4zOTFoLS4wMmwtMS40MDYtMy4zOXptLTIuMTQ2IDIuMzY4Yy40OTQgMCAuODguMTEgMS4xNTYuMzMgMCAuMzcyLS4xNDcuNjk2LS40NC45NzNhMS40MTMgMS40MTMgMCAwMS0uOTk3LjQxNCAxLjA4MSAxLjA4MSAwIDAxLS42OS0uMjMyLjcwOC43MDggMCAwMS0uMjkzLS41NzhjMC0uMjU3LjEyLS40Ny4zNjMtLjY0Ny4yNC0uMTczLjU0LS4yNi45LS4yNloiLz48L3N2Zz4="); } .footer-payment-mark--link { display: inline-block; width: 52px; min-width: 0; background-color: transparent; background-size: contain; } .footer-payment-mark--bank { width: 96px; min-width: 0; } .footer-payment-mark--bank svg { display: block; width: 96px; height: 25px; max-width: none; overflow: visible; filter: brightness(0) invert(1); } .footer-legal { padding-block: var(--space-md); border-top: 1px solid rgba(255,255,255,.16); color: #aebbc0; font-size: .8125rem; line-height: 1.6; } .footer-legal__copy { max-width: 78ch; } .footer-legal__copy p { margin: 0 0 var(--space-xs); } .footer-meta { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); margin-top: var(--space-sm); } .footer-copyright { margin: 0; color: #e4ebed; font-family: var(--font-display); font-size: var(--type-label); font-weight: 700; letter-spacing: .04em; } .footer-policies { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--space-sm); } .footer-policies a { color: #d8e2e5; font-size: var(--type-label); text-decoration: none; } .site-footer a { transition: color var(--duration-state) var(--ease-state); } .site-footer a:hover { color: var(--orange); } .site-footer a:focus-visible { outline-color: var(--orange); } .mobile-whatsapp-float { display: none; } @media (max-width: 760px) { .mobile-whatsapp-float { position: fixed; right: 12px; bottom: calc(120px + env(safe-area-inset-bottom, 0px)); z-index: 100000; display: grid; width: 48px; height: 48px; place-items: center; border: 2px solid #fff; border-radius: 50%; background: #25d366; box-shadow: 0 6px 18px rgba(7, 18, 25, .28); text-decoration: none; transition: transform var(--duration-state) var(--ease-state), box-shadow var(--duration-state) var(--ease-state); } .mobile-whatsapp-float img { width: 27px; height: 27px; filter: brightness(0) invert(1); } .mobile-whatsapp-float:active { transform: scale(.94); } .mobile-whatsapp-float:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; } } @media (max-width: 1100px) { :root { --shell: min(100% - 40px, 1000px); } .desktop-nav { display: none; } .menu-button { display: inline-block; } .mobile-nav:not([hidden]) { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); background: var(--white); } .mobile-nav a { padding: 13px 20px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); font-size: 12px; font-weight: 700; text-transform: uppercase; } .hero-grid { grid-template-columns: 1fr; } .hero-copy { padding: 62px 0 42px; border-right: 0; } .hero-visual > img { min-height: 420px; } .hero-metrics { max-width: 650px; } .benefit-layout { grid-template-columns: 1fr; gap: 35px; } .brand-detail { grid-template-columns: 1fr .8fr; } .product-grid--home { grid-template-columns: repeat(3, minmax(0, 1fr)); } .product-grid--catalog { grid-template-columns: repeat(2, 1fr); } .overview-grid { grid-template-columns: 1fr 1fr; } .site-footer > .shell { width: min(100% - 48px, 1000px); } .footer-brand-bar { grid-template-columns: 1fr; align-items: start; } .footer-social-panel { grid-template-columns: minmax(320px, 1fr) auto; } .footer-lede { grid-column: 1 / -1; grid-row: 2; justify-self: center; } .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-lg) 48px; } } @media (max-width: 760px) { :root { --shell: calc(100vw - 32px); } .demo-notice__inner { min-height: 40px; gap: 10px; align-items: flex-start; flex-direction: column; justify-content: center; line-height: 1.25; } .demo-notice__inner span:last-child { display: none; } .header-inner { min-height: 68px; gap: 12px; } .brand { width: 172px; } .header-actions { gap: 2px; } .header-actions .text-control:not(.search-control) { display: none; } .menu-button { font-size: 12px; } .mobile-nav:not([hidden]) { grid-template-columns: 1fr 1fr; } .hero-copy { padding: 46px 0 33px; } h1 { font-size: 44px; letter-spacing: -.065em; } h2 { font-size: 32px; } .hero-copy > p:not(.eyebrow) { font-size: 16px; } .hero-metrics { margin-top: 40px; } .hero-visual > img { min-height: 330px; } .hero-caption { width: 92%; padding: 13px 16px; } .hero-caption span { font-size: 40px; } .section { padding: 62px 0; } .section-head { grid-template-columns: 1fr; gap: 14px; margin-bottom: 26px; } .section-head .inline-link { justify-self: start; } .brand-grid, .product-grid, .benefit-grid, .brand-detail-grid { grid-template-columns: 1fr; } .brand-card, .brand-note { min-height: 185px; } .benefit-grid article, .benefit-grid article:nth-child(2n), .benefit-grid article:nth-last-child(-n+2) { min-height: 165px; border-right: 0; border-bottom: 1px solid var(--line); } .benefit-grid article:last-child { border-bottom: 0; } .wholesale-strip__inner { align-items: flex-start; flex-direction: column; } .page-hero { padding: 70px 0 52px; } .page-hero--brands { background: var(--ink); } .brand-detail { grid-template-columns: 1fr; } .brand-detail > img { min-height: 250px; max-height: 310px; } .catalog-layout, .product-detail, .cart-layout, .dashboard-layout { grid-template-columns: 1fr; gap: 24px; padding-top: 30px; padding-bottom: 62px; } .filter-panel { display: none; } .filter-drawer-button { display: inline-block; margin-right: 8px; } .product-grid--catalog { grid-template-columns: 1fr 1fr; gap: 10px; } .product-grid--home { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .product-grid--special > .product-card:nth-child(n+3), .product-grid--recommended > .product-card:nth-child(n+3) { display: none; } .section--brand-showcase { padding-block: 46px; } .product-card__body { padding: 12px; } .product-card h3 { font-size: 19px; } .product-card__foot { display: block; } .product-card__foot .inline-link { display: block; margin-top: 8px; } .product-main-image { aspect-ratio: 1 / .9; } .spec-list div { grid-template-columns: 1fr; gap: 2px; } .matrix-head { grid-template-columns: 1fr; gap: 12px; } .matrix-summary { align-items: stretch; justify-content: flex-start; flex-direction: column; } .matrix-summary .button { width: 100%; } .dashboard-nav { display: grid; grid-template-columns: 1fr 1fr; } .dashboard-nav strong { grid-column: 1 / -1; } .dashboard-nav button { min-height: 46px; } .dashboard-title { align-items: flex-start; flex-direction: column; } .overview-grid { grid-template-columns: 1fr 1fr; } .overview-grid article { min-height: 155px; } .site-footer > .shell { width: calc(100% - 32px); } .footer-brand-bar { grid-template-columns: 1fr; align-items: flex-start; gap: 24px; padding-block: 28px; } .footer-brand-lockup { grid-column: 1; } .footer-lede { grid-column: 1; grid-row: 2; justify-self: center; font-size: clamp(24px, 8vw, 34px); } .footer-social-panel { width: 100%; grid-template-columns: 1fr; gap: 26px; padding-inline: 0; } .footer-whatsapp-cta { width: 100%; min-height: 58px; } .footer-social { max-width: 100%; gap: 9px; overflow-x: auto; padding-bottom: 3px; scrollbar-width: thin; } .footer-social a, .footer-social__placeholder { width: 54px; height: 52px; flex-basis: 54px; } .footer-social img { width: 28px; height: 28px; } .footer-grid { grid-template-columns: 1fr; gap: 0; padding-block: 32px; } .footer-grid > * + * { margin-top: 28px; padding-top: 28px; border-top: 1px solid rgba(255,255,255,.12); } .footer-region-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .footer-company { gap: 28px; } .footer-payments { align-items: flex-start; flex-direction: column; gap: var(--space-sm); } .footer-payment-marks { width: 100%; justify-content: flex-start; } .footer-payment-mark { min-width: 64px; height: 40px; } .footer-payment-mark--bank { min-width: 122px; } .footer-meta { align-items: flex-start; flex-direction: column; gap: 12px; } .footer-policies { justify-content: flex-start; } } /* Phase 1 redesign: a sourcing catalogue, not a generic retail template. */ body { background: var(--paper); font-family: var(--font-body); letter-spacing: 0; } .site-header { position: sticky; top: 0; z-index: var(--z-nav); background: rgba(255,255,255,.96); border-top: 4px solid var(--orange); border-bottom: 1px solid rgba(23,33,41,.2); backdrop-filter: blur(12px); } .header-inner { min-height: 82px; gap: 32px; } .brand { width: 238px; } .brand img { max-height: 68px; } .desktop-nav { gap: 2px; margin-inline-start: auto; } .desktop-nav > a, .nav-with-panel > a { padding: 0 13px; font-family: var(--font-display); font-size: var(--type-label); letter-spacing: .08em; } .desktop-nav > a:hover, .nav-with-panel:hover > a, .desktop-nav .is-active { position: relative; color: var(--ink); border-color: transparent; background: transparent; } .desktop-nav > a:hover::after, .nav-with-panel:hover > a::after, .desktop-nav .is-active::after { position: absolute; inset-inline: 13px; bottom: 18px; height: 2px; background: var(--orange); content: ""; } .header-actions { padding-inline-start: 16px; border-inline-start: 1px solid var(--line); } .text-control { font-family: var(--font-display); font-size: var(--type-label); letter-spacing: .07em; text-transform: uppercase; } .cart-count { border-radius: 999px; background: var(--orange); } .account-switcher { position: relative; flex: 0 0 auto; margin: 0; } .account-switcher summary { list-style: none; } .account-switcher summary::-webkit-details-marker, .account-switcher summary::marker { display: none; content: ""; } .account-control { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; color: var(--ink); } .account-control--guest { padding-inline: 6px; } .account-control--signed-in { width: 44px; padding: 0; cursor: pointer; } .account-control__avatar { display: grid; width: 32px; height: 32px; place-items: center; border: 1px solid var(--ink); border-radius: 50%; transition: border-color var(--duration-state) var(--ease-state), background var(--duration-state) var(--ease-state), color var(--duration-state) var(--ease-state); } .account-control__avatar svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; } .account-switcher summary:hover .account-control__avatar, .account-switcher summary:focus-visible .account-control__avatar, .account-switcher[open] .account-control__avatar { border-color: var(--orange); background: var(--orange); color: #fff; } .account-menu { position: absolute; inset-block-start: calc(100% + 14px); inset-inline-end: 0; z-index: var(--z-dropdown); display: grid; min-width: 210px; padding: 10px; border: 1px solid var(--line); border-block-start: 2px solid var(--orange); border-radius: 0 0 var(--radius-control) var(--radius-control); background: var(--white); box-shadow: 0 16px 36px rgba(23,33,41,.15); } .account-menu a { display: flex; min-height: 44px; align-items: center; padding: 8px 10px; color: var(--ink); font-family: var(--font-display); font-size: var(--type-label); font-weight: 600; letter-spacing: .04em; text-decoration: none; } .account-menu a:hover, .account-menu a:focus-visible { background: #edf1f2; color: var(--teal); } .account-menu .account-menu__logout { margin-top: 3px; border-top: 1px solid var(--line); color: var(--orange); } .nav-panel { border-top: 2px solid var(--orange); box-shadow: 0 16px 36px rgba(23,33,41,.15); } .nav-panel a { display: block; border: 0; text-decoration: none; } .nav-panel a::after { display: none !important; } .language-switcher { position: relative; } .language-switcher summary { display: flex; gap: 5px; align-items: center; list-style: none; white-space: nowrap; cursor: pointer; } .language-switcher summary::-webkit-details-marker { display: none; } .language-switcher summary::after { width: 6px; height: 6px; margin-block-start: -3px; margin-inline-start: 3px; border-inline-end: 1px solid currentColor; border-block-end: 1px solid currentColor; content: ""; transform: rotate(45deg); } .language-switcher[open] summary { color: var(--orange); } .language-menu { position: absolute; inset-block-start: calc(100% + 18px); inset-inline-end: 0; display: grid; min-width: 156px; padding: 12px 14px 14px; border-block-start: 2px solid var(--orange); background: var(--white); box-shadow: 0 10px 24px rgba(23,33,41,.14); } .language-menu > span, .language-menu > strong { padding: 6px 0; color: var(--ink); font-family: var(--font-display); font-size: var(--type-label); font-weight: 600; letter-spacing: .04em; } .language-menu > span:first-child { padding: 2px 0 9px; color: var(--grey); font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; } .language-menu > strong { color: var(--orange); } .mobile-language-switcher { display: none; } .hero--catalog { position: relative; min-height: min(720px, calc(100svh - 86px)); overflow: hidden; background: var(--ink); } .hero--catalog .hero-visual { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; object-fit: cover; object-position: 66% 50%; filter: saturate(.82) contrast(1.04); } .hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(13,22,29,.96) 0%, rgba(13,22,29,.79) 30%, rgba(13,22,29,.22) 61%, rgba(13,22,29,.08) 100%); } .hero-frame { position: relative; display: flex; min-height: min(720px, calc(100svh - 86px)); align-items: center; justify-content: space-between; padding-bottom: 92px; color: #fff; } .hero-activity { position: absolute; inset-block-start: 16px; inset-inline-start: 0; z-index: 1; width: clamp(300px, 28vw, 360px); min-height: 88px; padding: 13px 16px 15px; overflow: hidden; border-block-start: 3px solid var(--orange); border-radius: var(--radius-control); background: rgba(23,33,41,.94); color: #fff; contain: layout paint; } .hero-activity__label { display: block; margin-bottom: 6px; color: #ef8c59; font-family: var(--font-display); font-size: 10px; font-weight: 700; letter-spacing: .1em; line-height: 1.2; text-transform: uppercase; } .hero-activity__viewport { position: relative; min-height: 42px; } .hero-activity__item { position: absolute; inset: 0; margin: 0; opacity: 0; transform: translateY(7px); color: #fff; font-size: 14px; font-weight: 600; line-height: 1.42; pointer-events: none; transition: opacity 500ms cubic-bezier(.22,1,.36,1), transform 500ms cubic-bezier(.22,1,.36,1); } .hero-activity__item.is-active { opacity: 1; transform: translateY(0); } .hero-copy { display: block; max-width: 660px; padding: 0; border: 0; } .hero-copy .eyebrow { color: #ef8c59; font-size: 11px; letter-spacing: .17em; } .hero-copy h1 { max-width: 650px; margin: 0 0 25px; color: #fff; font-family: var(--font-display); font-size: var(--type-display); font-weight: 700; line-height: .9; letter-spacing: -.035em; } .hero-copy h1 em { font: inherit; } .hero-copy__mobile { display: none; } .hero-copy > p:not(.eyebrow) { max-width: 500px; margin-bottom: 31px; color: #e1e8e8; font-size: 18px; line-height: 1.45; } .button { min-height: 48px; padding: 13px 18px; border-width: 1px; font-family: var(--font-display); font-size: var(--type-label); letter-spacing: .08em; } .button--primary { border-color: var(--orange); background: var(--orange); } .button--primary:hover { border-color: #fff; background: #fff; color: var(--ink); } .hero--catalog .button--secondary { border-color: rgba(255,255,255,.82); color: #fff; } .hero--catalog .button--secondary:hover { border-color: #fff; background: #fff; color: var(--ink); } .hero-marker { align-self: flex-end; display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: center; max-width: 290px; margin-bottom: 45px; padding: 18px 0 0; border-top: 2px solid var(--orange); color: #fff; } .hero-marker span { color: var(--orange); font-size: 48px; font-weight: 700; line-height: .8; letter-spacing: -.035em; } .hero-marker p { margin: 0; font-size: 12px; font-weight: 700; line-height: 1.25; letter-spacing: .06em; text-transform: uppercase; } .hero-baseline { position: absolute; inset-inline: 0; bottom: 0; border-top: 1px solid rgba(255,255,255,.26); background: rgba(23,33,41,.88); } .hero-baseline .shell { display: grid; grid-template-columns: repeat(4, 1fr); } .hero-baseline span { min-height: 65px; padding: 23px 18px; border-inline-end: 1px solid rgba(255,255,255,.16); color: #e6ebeb; font-size: 11px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; } .hero-baseline span:first-child { padding-inline-start: 0; } .hero-baseline span:last-child { border-inline-end: 0; } .section { padding: 118px 0; } .section--tint { background: #e8edec; border-color: transparent; } .section-head { grid-template-columns: 1.1fr .7fr auto; gap: 50px; margin-bottom: 48px; padding-bottom: 22px; border-color: var(--ink); } .section-head h2 { max-width: 610px; font-family: var(--font-display); font-size: var(--type-section); letter-spacing: -.035em; } .section-head > p { max-width: 400px; color: #43545b; font-size: 15px; line-height: 1.55; } .eyebrow { margin-bottom: 15px; color: var(--teal); font-family: var(--font-display); font-size: var(--type-label); letter-spacing: .08em; } .inline-link { border-width: 2px; color: var(--ink); font-family: var(--font-display); font-size: var(--type-label); letter-spacing: .07em; text-transform: uppercase; } .inline-link:hover { color: var(--orange); } .brand-grid { grid-template-columns: 1fr 1fr; gap: 2px; border: 0; background: transparent; } .brand-card, .brand-note { min-height: 320px; padding: 32px; } .brand-card { background: var(--ink); color: #fff; } .brand-card--dark { background: var(--teal); } .brand-card--traceable { background: #5d6c62; } .brand-card--zeroland { background: #353f45; } .brand-card:hover { background: var(--orange); color: #fff; } .brand-card strong { max-width: 300px; font-family: var(--font-display); font-size: var(--type-section); line-height: .94; letter-spacing: -.035em; } .brand-card em { max-width: 210px; color: rgba(255,255,255,.82); font-size: 13px; } .brand-card:hover em { color: #fff; } .brand-card__logo { display: block; width: min(100%, 330px); height: 148px; object-fit: contain; object-position: left center; filter: brightness(0) invert(1); } .brand-card--dark .brand-card__logo { width: min(82%, 210px); } .brand-note { justify-content: space-between; background: #fff; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); } .brand-note::before { color: var(--orange); font-size: 44px; font-weight: 700; line-height: 1; content: "+"; } .brand-note p { max-width: 180px; font-size: 23px; letter-spacing: -.045em; } .brand-note span { max-width: 180px; color: var(--grey); } .product-grid { gap: 24px; } .product-card { position: relative; border: 1px solid var(--line); border-radius: var(--radius-media); background: var(--white); overflow: hidden; } .product-card__image { padding: 12px 12px 0; border: 0; background: var(--white); } .product-card__body { padding: 16px; } .product-card__brand { color: var(--teal); font-size: 10px; letter-spacing: .14em; } .product-card h2, .product-card h3 { margin-bottom: 4px; font-family: var(--font-display); font-size: var(--type-title); letter-spacing: -.025em; } .product-card__body > p:not(.product-card__brand) { color: #52636a; } .product-card__foot { padding-top: 13px; border-color: var(--line); color: var(--grey); } .center-action { margin-top: 46px; } .benefit-layout { grid-template-columns: .8fr 1.2fr; gap: 80px; } .benefit-intro h2 { font-family: var(--font-display); font-size: var(--type-section); letter-spacing: -.035em; } .benefit-grid { gap: 0 36px; border: 0; background: transparent; } .benefit-grid article, .benefit-grid article:nth-child(2n), .benefit-grid article:nth-last-child(-n+2) { min-height: 180px; padding: 0 0 25px; border: 0; border-bottom: 1px solid var(--line); } .benefit-grid article:nth-child(n+3) { padding-top: 25px; } .benefit-grid h3 { margin-top: 35px; font-size: 22px; letter-spacing: -.04em; } .benefit-grid p { color: #53636a; font-size: 14px; } .wholesale-strip { padding: 72px 0; background: var(--orange); } .wholesale-strip .eyebrow { color: var(--ink); } .wholesale-strip h2 { max-width: 680px; font-size: clamp(39px, 4.8vw, 66px); letter-spacing: -.035em; } .wholesale-strip .button--light { border-color: var(--ink); background: var(--ink); color: #fff; } .wholesale-strip .button--light:hover { background: #fff; color: var(--ink); } .page-hero { position: relative; overflow: hidden; padding: 112px 0 86px; border-bottom: 0; background: var(--ink); color: #fff; } .page-hero::after { position: absolute; inset-inline-end: 0; bottom: 0; width: 33%; height: 6px; background: var(--orange); content: ""; } .page-hero h1 { max-width: 980px; font-family: var(--font-display); font-size: var(--type-display); letter-spacing: -.035em; } .page-hero p:not(.eyebrow) { color: #c5d1d4; } .page-hero .eyebrow { color: #ef8c59; } .page-hero--brands { background: var(--teal); } .page-hero--dashboard { background: var(--ink); } .brand-detail-grid { gap: 28px; } .brand-detail { min-height: 440px; border: 0; } .brand-detail > div { padding: 42px; } .brand-detail h2 { font-family: var(--font-display); font-size: var(--type-title); letter-spacing: -.025em; } .brand-detail--gornornie { background: var(--ink); } .brand-detail--traceable { background: #5d6c62; color: #fff; } .brand-detail--traceable .eyebrow { color: #dce8dd; } .brand-detail--traceable p:not(.eyebrow) { color: #e2e9e4; } .brand-detail--zeroland { background: #353f45; color: #fff; } .brand-detail--zeroland .eyebrow { color: var(--orange); } .brand-detail--zeroland p:not(.eyebrow) { color: #dce4e7; } .brand-detail--zeroland .brand-detail__logo { filter: brightness(0) invert(1); } .brand-detail__logo { display: block; width: min(100%, 260px); max-height: 136px; margin: 0 0 28px; object-fit: contain; object-position: left center; } .brand-detail__logo--light { filter: brightness(0) invert(1); } .brand-detail__logo-panel { display: grid; min-height: 100%; place-items: center; padding: 42px; border-inline-start: 1px solid rgba(255,255,255,.25); background: #fff; } .brand-detail__logo-panel img { width: min(100%, 390px); max-height: 235px; object-fit: contain; } .module-list { gap: 0; border-top: 1px solid var(--ink); border-inline-start: 1px solid var(--ink); } .module-list span { padding: 15px 18px; border: 0; border-inline-end: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: transparent; font-size: 12px; } .catalog-layout { grid-template-columns: 230px 1fr; gap: 54px; padding-top: 54px; } .filter-panel { border: 0; border-top: 4px solid var(--orange); background: transparent; } .filter-panel__head { padding: 15px 0; border-color: var(--ink); } .filter-panel details { padding: 15px 0; border-color: var(--line); } .catalog-toolbar { padding-bottom: 18px; border-color: var(--ink); } .product-grid--catalog { gap: 40px 22px; } .product-card--compact .product-card__image { aspect-ratio: 1 / 1; } .product-card--compact .product-card__body { padding: 14px; } .product-card--compact h2, .product-card--compact h3 { font-size: 24px; } .breadcrumbs { padding-top: 32px; } .product-detail { gap: 74px; padding-top: 30px; padding-bottom: 92px; } .product-main-image { aspect-ratio: 1 / .9; border: 0; } .thumbnail-row { gap: 10px; } .thumbnail-row button { width: 90px; height: 74px; border: 0; } .thumbnail-row button.is-current { outline: 3px solid var(--orange); border: 0; } .product-info h1 { font-size: clamp(56px, 6.2vw, 88px); } .price-placeholder { padding: 20px 0; border-color: var(--ink); } .price-placeholder strong { font-size: 23px; letter-spacing: -.03em; } .spec-list div { padding: 12px 0; } .matrix-head { gap: 80px; } .matrix-head h2 { font-family: var(--font-display); font-size: var(--type-section); letter-spacing: -.035em; } .matrix-wrap { border-color: var(--ink); } .size-matrix thead th { background: var(--ink); color: #fff; } .size-matrix th, .size-matrix td { border-color: var(--line); } .size-matrix input { border-color: var(--ink); } .matrix-summary { padding-top: 16px; border-top: 2px solid var(--ink); } .cart-layout { gap: 48px; padding-top: 58px; } .cart-table { border-top: 3px solid var(--orange); } .cart-table th { background: var(--ink); color: #fff; } .cart-table th, .cart-table td { border-color: var(--line); } .order-summary { padding: 26px; border: 0; border-top: 4px solid var(--orange); box-shadow: none; } .dashboard-layout { gap: 58px; padding-top: 58px; } .dashboard-nav { border: 0; border-top: 4px solid var(--orange); } .dashboard-nav strong { background: var(--ink); } .dashboard-nav button { background: #fff; } .dashboard-title { border-color: var(--ink); } .overview-grid { gap: 0; border: 0; background: transparent; } .overview-grid article { min-height: 205px; border-inline-end: 1px solid var(--line); border-bottom: 1px solid var(--line); background: transparent; } .overview-grid article:first-child { border-inline-start: 1px solid var(--line); } .approval-panel { padding: 34px; background: #e6edec; } .site-footer { background: var(--ink); } @media (max-width: 1100px) { :root { --shell: min(100% - 48px, 1000px); } .hero-frame { min-height: 650px; } .hero-copy h1 { font-size: clamp(65px, 9vw, 100px); } .hero-baseline span { padding: 19px 12px; } .section-head { grid-template-columns: 1fr .8fr; } .section-head .inline-link { grid-column: 1 / -1; justify-self: start; } .product-grid--catalog { gap: 32px 18px; } } @media (max-width: 760px) { :root { --shell: calc(100vw - 32px); } .site-header { border-top-width: 3px; } .header-inner { min-height: 70px; } .brand { width: 182px; } .header-actions { padding-inline-start: 4px; border-inline-start: 0; } .hero--catalog { min-height: 650px; } .hero--catalog .hero-visual { object-position: 62% center; } .hero-shade { background: linear-gradient(90deg, rgba(13,22,29,.91) 0%, rgba(13,22,29,.57) 100%); } .hero-frame { min-height: 650px; align-items: flex-start; padding-top: 87px; padding-bottom: 145px; } .hero--has-activity .hero-frame { padding-top: 150px; } .hero-activity { inset-block-start: 16px; width: min(100%, 360px); } .hero-copy__desktop { display: none; } .hero-copy__mobile { display: inline; } .hero-copy h1 { max-width: 330px; font-size: clamp(44px, 12vw, 58px); line-height: .94; letter-spacing: -.03em; } .hero-copy > p:not(.eyebrow) { max-width: 280px; margin-bottom: 22px; font-size: 14px; line-height: 1.4; } .hero-copy .button-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: min(100%, 286px); gap: 8px; } .hero-copy .button { display: inline-flex; min-width: 0; justify-content: center; padding-inline: 8px; } .hero-marker { position: absolute; inset-inline-end: 0; bottom: 98px; max-width: 184px; margin: 0; padding-block: 10px; padding-inline: 8px 0; gap: 8px; } .hero-marker span { font-size: 32px; } .hero-marker p { font-size: 10px; line-height: 1.3; letter-spacing: .035em; } .hero-baseline .shell { grid-template-columns: 1fr 1fr; } .hero-baseline span { min-height: 38px; padding: 11px 0; border-inline-end: 0; font-size: 8px; letter-spacing: .07em; } .hero-baseline span:nth-child(even) { padding-inline-start: 12px; border-inline-start: 1px solid rgba(255,255,255,.16); } .section { padding: 76px 0; } .section-head { gap: 18px; margin-bottom: 30px; border-color: var(--ink); } .section-head h2, .benefit-intro h2 { font-size: 39px; } .brand-grid { gap: 2px; } .brand-card, .brand-note { min-height: 235px; padding: 25px; } .brand-card strong { font-size: 47px; } .brand-note { min-height: 170px; } .product-grid { gap: 34px; } .product-grid--catalog { gap: 28px 14px; } .product-card h3 { font-size: 27px; } .product-grid--catalog h3 { font-size: 21px; } .product-grid--catalog .product-card__foot { font-size: 10px; } .benefit-grid { gap: 0; } .wholesale-strip { padding: 55px 0; } .wholesale-strip h2 { font-size: 46px; } .page-hero { padding: 75px 0 58px; } .page-hero h1 { font-size: 54px; } .catalog-layout, .product-detail, .cart-layout, .dashboard-layout { padding-top: 38px; } .brand-detail { min-height: auto; } .brand-detail h2 { font-size: 39px; } .overview-grid article:first-child { border-inline-start: 0; } .overview-grid article:nth-child(2n) { border-inline-end: 0; } } @media (prefers-reduced-motion: reduce) { .hero-activity__item { transform: none; transition: none; } } /* Carton ordering: wholesale quantity is a sealed carton, never an editable size matrix. */ .carton-order-section { padding-top: 78px; background: var(--white); border-top: 1px solid var(--line); } .carton-order__head { display: grid; grid-template-columns: 1.1fr .62fr; gap: 70px; align-items: end; margin-bottom: 35px; padding-bottom: 23px; border-bottom: 2px solid var(--ink); } .carton-order__head h2 { margin: 0; max-width: 650px; font-family: var(--font-display); font-size: var(--type-section); letter-spacing: -.035em; } .carton-order__head > p { max-width: 390px; margin: 0; color: #43545b; font-size: 15px; line-height: 1.6; } .carton-order { display: grid; grid-template-columns: minmax(0, 1fr) 365px; gap: 64px; align-items: start; } .carton-order__options { display: grid; gap: 34px; } .carton-order fieldset { min-width: 0; margin: 0; padding: 0; border: 0; } .carton-order legend { margin-bottom: 12px; color: var(--ink); font-family: var(--font-display); font-size: var(--type-ui); font-weight: 700; } .variant-options { display: flex; flex-wrap: wrap; gap: 10px; } .variant-option { min-height: 48px; padding: 12px 16px; border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--white); color: var(--ink); font-family: var(--font-display); font-size: var(--type-ui); font-weight: 600; transition: background var(--duration-state) var(--ease-state), border-color var(--duration-state) var(--ease-state), color var(--duration-state) var(--ease-state); } .variant-option:hover { border-color: var(--ink); } .variant-option.is-selected { border-color: var(--orange); background: var(--orange); color: #fff; } .carton-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); } .carton-facts div { min-height: 113px; padding-block: 18px; padding-inline: 0 20px; border-inline-end: 1px solid var(--line); } .carton-facts div + div { padding-inline-start: 20px; } .carton-facts div:last-child { border-inline-end: 0; } .carton-facts dt { margin-bottom: 15px; color: var(--grey); font-size: var(--type-label); font-weight: 700; letter-spacing: .07em; text-transform: uppercase; } .carton-facts dd { margin: 0; color: var(--ink); font-family: var(--font-display); font-size: 16px; font-weight: 650; line-height: 1.3; } .product-detail-panel { border-bottom: 1px solid var(--line); } .product-detail-panel:first-of-type { border-top: 1px solid var(--line); } .product-detail-panel summary { padding-block: 17px; padding-inline: 0 30px; color: var(--ink); cursor: pointer; font-family: var(--font-display); font-size: var(--type-ui); font-weight: 700; } .product-detail-panel p { max-width: 66ch; margin: 0 0 18px; color: #52636a; font-size: 14px; } .carton-order__summary { padding: 27px; border-top: 4px solid var(--orange); background: #e8edec; } .carton-order__summary .eyebrow { margin-bottom: 26px; } .carton-order__selection { display: flex; justify-content: space-between; gap: 12px; margin: 0; padding-bottom: 17px; border-bottom: 1px solid var(--line); color: var(--grey); font-size: 14px; } .carton-order__selection strong { color: var(--ink); } .carton-stepper { display: grid; grid-template-columns: 50px 1fr 50px; gap: 8px; align-items: stretch; margin: 18px 0; } .carton-stepper button { min-height: 55px; border: 1px solid var(--ink); background: var(--white); color: var(--ink); font-size: 25px; line-height: 1; } .carton-stepper button:hover:not(:disabled) { border-color: var(--orange); color: var(--orange); } .carton-stepper button:disabled { cursor: not-allowed; opacity: .35; } .carton-stepper output { display: flex; flex-direction: column; align-items: center; justify-content: center; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--grey); } .carton-stepper output strong { color: var(--ink); font-family: var(--font-display); font-size: 23px; line-height: 1; } .carton-stepper output span { margin-top: 3px; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; } .carton-order__summary-lines { border-top: 1px solid var(--line); } .carton-order__summary-lines div { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); color: var(--grey); font-size: 13px; } .carton-order__summary-lines strong { color: var(--ink); text-align: end; } .carton-order__summary .button { width: 100%; margin-top: 15px; } .carton-order__summary .button + .button { margin-top: 8px; } .carton-order__note { margin: 15px 0 0; color: #52636a; font-size: 12px; line-height: 1.45; } .related-products { display: grid; grid-template-columns: .55fr 1.45fr; gap: 44px; align-items: start; } .related-products h2 { margin: 0; font-family: var(--font-display); font-size: clamp(32px, 3.2vw, 48px); letter-spacing: -.035em; } .carton-count-cell { color: var(--ink) !important; font-family: var(--font-display); font-weight: 700; } .empty-cart { min-height: 260px; display: flex; align-items: center; } /* Product desktop: image, compact facts and carton ordering live in one buying view. */ .product-detail--ordering { grid-template-columns: minmax(0, 1.08fr) minmax(390px, .92fr); gap: 48px; align-items: start; } .product-aside { display: grid; gap: var(--space-sm); align-content: start; } .product-detail--ordering .product-info { padding-top: 4px; } .product-detail--ordering .product-info .eyebrow { margin-bottom: var(--space-xs); } .product-detail--ordering .product-info h1 { margin-bottom: 4px; font-size: clamp(26px, 2.4vw, 36px); line-height: 1.05; letter-spacing: -.025em; } .product-detail--ordering .style-id { margin-bottom: var(--space-xs); font-size: 10px; } .product-detail--ordering .price-placeholder { padding: var(--space-xs) 0; } .product-detail--ordering .price-placeholder strong { font-size: var(--type-body); } .spec-list--compact { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 var(--space-sm); margin-top: var(--space-xs); } .spec-list.spec-list--compact div { display: block; min-height: 56px; padding: var(--space-xs) 0; } .spec-list--compact dt { margin-bottom: 4px; color: var(--grey); font-size: 10px; } .spec-list--compact dd { font-size: 12px; line-height: 1.3; } .carton-order__summary--product { margin: 0; min-height: 0; padding: var(--space-sm); border-radius: var(--radius-media); overflow: hidden; } .carton-order__summary--product .eyebrow { margin-bottom: var(--space-xs); } .carton-order__summary--product fieldset { min-width: 0; margin: 0; padding: 0 0 var(--space-xs); border: 0; border-bottom: 1px solid var(--line); } .carton-order__summary--product legend { margin-bottom: 4px; color: var(--grey); font-size: 11px; } .carton-order__summary--product .variant-options { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; } .carton-order__summary--product .variant-option { min-height: 44px; padding: var(--space-xs); font-size: 11px; } .carton-order__summary--product .carton-stepper { grid-template-columns: 44px 1fr 44px; gap: var(--space-xs); margin: var(--space-xs) 0; } .carton-order__summary--product .carton-stepper button { min-height: 44px; } .carton-order__summary--product .carton-stepper output strong { font-size: 18px; } .carton-order__summary--product .carton-order__summary-lines { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); } .carton-order__summary--product .carton-order__summary-lines div { display: flex; min-width: 0; flex-direction: column; gap: 4px; justify-content: flex-start; padding: var(--space-xs); border-inline-end: 1px solid var(--line); border-bottom: 0; } .carton-order__summary--product .carton-order__summary-lines div:first-child { padding-inline-start: 0; } .carton-order__summary--product .carton-order__summary-lines div:last-child { padding-inline-end: 0; border-inline-end: 0; } .carton-order__summary--product .carton-order__summary-lines span { font-size: 10px; } .carton-order__summary--product .carton-order__summary-lines strong { text-align: start; font-size: 11px; line-height: 1.25; } .carton-order__actions { display: grid; grid-template-columns: 1.4fr 1fr; gap: var(--space-xs); } .carton-order__summary--product .carton-order__actions .button { min-height: 44px; margin: var(--space-xs) 0 0; padding: var(--space-xs); font-size: 10px; } .carton-order__summary--product .carton-order__note { margin-top: var(--space-xs); font-size: 11px; line-height: 1.35; } .product-support-section { padding: 42px 0 58px; border-top: 1px solid var(--line); background: var(--white); } .product-support { display: grid; grid-template-columns: 1.15fr .85fr; gap: 54px; align-items: start; } .product-support .carton-facts { margin: 0; } .product-support__details { border-top: 1px solid var(--line); } @media (max-width: 1100px) { .carton-order { grid-template-columns: minmax(0, 1fr) 330px; gap: 38px; } .carton-order__head { gap: 36px; } .product-detail--ordering { grid-template-columns: 1fr; gap: var(--space-md); } .mobile-language-switcher { display: block; padding: 13px 20px; border-inline-end: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--ink); font-family: var(--font-display); font-size: 12px; font-weight: 700; text-transform: uppercase; } .mobile-language-switcher summary { cursor: pointer; } .mobile-language-switcher div { display: grid; gap: 7px; padding-top: 12px; color: var(--grey); font-size: 12px; font-weight: 500; text-transform: none; } } @media (max-width: 760px) { .carton-order-section { padding-top: 60px; } .product-detail--ordering { grid-template-columns: 1fr; gap: 28px; } .product-aside { gap: 24px; } .spec-list--compact { grid-template-columns: 1fr 1fr; } .carton-order__actions { grid-template-columns: 1fr; } .product-support { grid-template-columns: 1fr; gap: 28px; } .carton-order__head, .carton-order, .related-products { grid-template-columns: 1fr; gap: 24px; } .carton-order__head { margin-bottom: 26px; padding-bottom: 18px; } .carton-order__head h2 { font-size: 39px; } .carton-order__options { gap: 26px; } .carton-facts { grid-template-columns: 1fr; } .carton-facts div, .carton-facts div + div { min-height: auto; padding: 15px 0; border-inline-end: 0; border-bottom: 1px solid var(--line); } .carton-facts div:last-child { border-bottom: 0; } .carton-facts dt { margin-bottom: 5px; } .carton-order__summary { padding: 22px; } .related-products { gap: 28px; } .related-products .product-grid { grid-template-columns: 1fr 1fr; gap: 14px; } } /* Internationalisation: custom WPML bridge, resilient labels and RTL-ready layout. */ html:lang(ar) { --font-display: "Noto Sans Arabic", "Segoe UI", Tahoma, Arial, sans-serif; --font-body: "Noto Sans Arabic", "Segoe UI", Tahoma, Arial, sans-serif; } html:lang(ja) { --font-display: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic UI", "Yu Gothic", Meiryo, sans-serif; --font-body: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic UI", "Yu Gothic", Meiryo, sans-serif; } html:lang(ko) { --font-display: "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif; --font-body: "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif; } html:lang(zh-Hant), html:lang(zh-TW), html:lang(zh-HK), html:lang(zh-MO) { --font-display: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif; --font-body: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif; } .language-menu [lang|="ar"] { font-family: "Noto Sans Arabic", "Segoe UI", Tahoma, Arial, sans-serif; } .language-menu [lang|="ja"] { font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic UI", "Yu Gothic", Meiryo, sans-serif; } .language-menu [lang|="ko"] { font-family: "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif; } .language-menu [lang="zh-hant"], .language-menu [lang="zh-Hant"], .language-menu [lang="zh-tw"], .language-menu [lang="zh-TW"], .language-menu [lang="zh-hk"], .language-menu [lang="zh-HK"] { font-family: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif; } .header-inner, .desktop-nav, .desktop-nav .primary-menu, .header-actions, .language-switcher-slot, .brand-grid > *, .brand-detail > *, .product-detail > *, .product-aside, .carton-order > *, .footer-grid > * { min-width: 0; } .desktop-nav a, .mobile-nav a, .language-switcher, .language-menu a, .button, .inline-link, .brand-card, .brand-detail, .product-info, .carton-order__summary, .footer-grid { overflow-wrap: anywhere; } .language-switcher-slot { position: relative; display: flex; flex: 0 1 auto; align-items: center; } .language-switcher { position: relative; margin: 0; } .language-switcher summary { display: inline-flex; min-height: 44px; align-items: center; padding: 8px 10px; border-radius: var(--radius-control); list-style: none; white-space: nowrap; cursor: pointer; } .language-switcher summary::-webkit-details-marker, .language-switcher summary::marker { display: none; content: ""; } .language-switcher summary:hover, .language-switcher summary:focus-visible, .language-switcher[open] summary { background: #edf1f2; color: var(--teal); } .language-menu { inset-block-start: calc(100% + 10px); inset-inline-start: auto; inset-inline-end: 0; z-index: var(--z-dropdown); min-width: min(250px, calc(100vw - 32px)); max-height: min(70vh, 520px); padding: 10px; overflow-y: auto; overscroll-behavior: contain; border: 1px solid var(--line); border-block-start: 3px solid var(--orange); border-radius: 0 0 var(--radius-control) var(--radius-control); background: var(--white); box-shadow: 0 16px 36px rgba(23, 33, 41, .15); } .language-menu > span, .language-menu > strong { min-width: 0; padding: 0; } .language-menu > span:first-child { padding: 4px 8px 9px; } .language-menu a, .language-menu > strong[aria-current="page"] { display: flex; min-height: 40px; align-items: center; padding: 8px; border-radius: var(--radius-control); color: var(--ink); font-size: 13px; line-height: 1.35; text-decoration: none; } .language-menu a:hover, .language-menu a:focus-visible { background: #edf1f2; color: var(--teal); } .language-menu > strong[aria-current="page"] { background: rgba(242, 99, 34, .1); color: var(--orange); } html:lang(ar) body { line-height: 1.65; } html:lang(ar) h1, html:lang(ar) h2, html:lang(ar) h3 { line-height: 1.2; } html:lang(ar) .hero-copy h1 em { font-style: normal; } :is(html:lang(ar), html:lang(ja), html:lang(ko), html:lang(zh-Hant), html:lang(zh-TW), html:lang(zh-HK), html:lang(zh-MO)) :is(h1, h2, h3, .demo-notice, .desktop-nav, .text-control, .menu-button, .eyebrow, .button, .inline-link, .hero-marker p, .hero-baseline span, .product-card__brand, .style-id, .price-placeholder span, .size-matrix thead th, .cart-table th, .overview-grid span, .footer-grid h2, .footer-lede, .footer-copyright, .carton-facts dt, .carton-stepper output span, .language-menu > span:first-child) { letter-spacing: normal; text-transform: none; } html[dir="rtl"] body, body.rtl { direction: rtl; text-align: start; } html[dir="rtl"] .brand img, html[dir="rtl"] .brand-card__logo, html[dir="rtl"] .brand-detail__logo, html[dir="rtl"] .footer-logo, body.rtl .brand img, body.rtl .brand-card__logo, body.rtl .brand-detail__logo, body.rtl .footer-logo { object-position: right center; } html[dir="rtl"] .hero-shade, body.rtl .hero-shade { background: linear-gradient(270deg, rgba(13, 22, 29, .96) 0%, rgba(13, 22, 29, .79) 30%, rgba(13, 22, 29, .22) 61%, rgba(13, 22, 29, .08) 100%); } html[dir="rtl"] .language-switcher summary::after, body.rtl .language-switcher summary::after { transform: rotate(-45deg); } html[dir="rtl"] :is(input[type="email"], input[type="tel"], input[type="url"], input[type="number"]), body.rtl :is(input[type="email"], input[type="tel"], input[type="url"], input[type="number"]) { direction: ltr; text-align: start; unicode-bidi: isolate; } html[dir="rtl"] :is(.cart-count, .style-id, .carton-count-cell, .carton-stepper output), body.rtl :is(.cart-count, .style-id, .carton-count-cell, .carton-stepper output) { unicode-bidi: isolate; } @media (max-width: 1100px) { .benefit-layout { grid-template-columns: minmax(0, 1fr); } .language-switcher-slot { display: none; } .mobile-nav__language { grid-column: 1 / -1; min-width: 0; padding: 0; } .mobile-nav__language > .language-switcher { display: block; width: 100%; } .mobile-nav__language .language-switcher summary { width: calc(100% - 16px); min-height: 48px; justify-content: space-between; margin: 8px; padding: 12px 16px; background: #edf1f2; } .mobile-nav__language .language-menu { position: static; width: calc(100% - 16px); min-width: 0; max-height: min(52vh, 440px); margin: 0 8px 8px; border-block-start-width: 2px; border-radius: var(--radius-control); box-shadow: none; } .mobile-nav .sub-menu { padding-inline-start: 12px; } } @media (max-width: 760px) { :is(html:lang(ar), html:lang(ja), html:lang(ko), html:lang(zh-Hant), html:lang(zh-TW), html:lang(zh-HK), html:lang(zh-MO)) :is(.hero-copy h1, .page-hero h1, .brand-card strong, .wholesale-strip h2, .carton-order__head h2) { line-height: 1.2; } } @media (max-width: 380px) { .header-inner { gap: 8px; } .brand { width: 150px; } .header-actions { gap: 0; } } /* Header utilities: icon-only search and the live cart count on the account avatar. */ .search-control { display: inline-flex; width: 40px; min-height: 44px; align-items: center; justify-content: center; padding: 0; } .search-control svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; } .whatsapp-control { display: inline-flex; width: 40px; min-height: 44px; align-items: center; justify-content: center; padding: 0; color: #128c4a; } .whatsapp-control:hover { color: #0b6f39; } .whatsapp-control svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; } .mobile-nav__search { display: flex; align-items: center; justify-content: center; } .mobile-nav__search svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; } .account-control { position: relative; } .account-control .cart-count { position: absolute; inset-block-start: 1px; inset-inline-end: 0; z-index: 1; min-width: 17px; height: 17px; margin: 0; padding-inline: 4px; border: 2px solid var(--white); font-size: 9px; line-height: 1; } /* Keep the primary menu and utility controls on one desktop baseline. */ @media (min-width: 1101px) { .desktop-nav { height: 44px; align-self: center; align-items: center; } .desktop-nav > .primary-menu { height: 44px; align-items: center; } .desktop-nav > .primary-menu > .menu-item { display: flex; height: 44px; align-items: center; } .desktop-nav > .primary-menu > .menu-item > a, .desktop-nav > .primary-menu > .menu-item > .primary-menu__toggle { height: 44px; min-height: 44px; } .desktop-nav > .primary-menu > .menu-item > .sub-menu { inset-block-start: calc(100% + 18px); } .desktop-nav > .primary-menu > .menu-item > .sub-menu::before { position: absolute; inset-block-start: -18px; inset-inline: 0; height: 18px; content: ""; } .language-switcher-slot { order: 2; } .cart-link { order: 3; } .account-switcher, .account-control--guest { order: 4; } } /* Use a real vector flag instead of letter/emoji glyphs in the language slot. */ .language-placeholder { width: 40px; justify-content: center; padding: 0; font-size: 0; line-height: 1; } .site-header .language-placeholder::before { width: 26px; height: 17px; border-radius: 2px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 30'%3E%3Cpath fill='%23012169' d='M0 0h60v30H0z'/%3E%3Cpath stroke='%23fff' stroke-width='6' d='m0 0 60 30m0-30L0 30'/%3E%3Cpath stroke='%23C8102E' stroke-width='2' d='m0 0 60 30m0-30L0 30'/%3E%3Cpath stroke='%23fff' stroke-width='10' d='M30 0v30M0 15h60'/%3E%3Cpath stroke='%23C8102E' stroke-width='6' d='M30 0v30M0 15h60'/%3E%3C/svg%3E"); background-position: center; background-repeat: no-repeat; background-size: cover; box-shadow: 0 0 0 1px rgba(23, 33, 41, .18); content: ""; } .mobile-nav__language > span { display: flex; min-height: 48px; align-items: center; justify-content: center; margin: 8px; border-radius: var(--radius-control); background: #edf1f2; font-size: 0; } .site-header .mobile-nav__language > span::before { width: 26px; height: 17px; border-radius: 2px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 30'%3E%3Cpath fill='%23012169' d='M0 0h60v30H0z'/%3E%3Cpath stroke='%23fff' stroke-width='6' d='m0 0 60 30m0-30L0 30'/%3E%3Cpath stroke='%23C8102E' stroke-width='2' d='m0 0 60 30m0-30L0 30'/%3E%3Cpath stroke='%23fff' stroke-width='10' d='M30 0v30M0 15h60'/%3E%3Cpath stroke='%23C8102E' stroke-width='6' d='M30 0v30M0 15h60'/%3E%3C/svg%3E"); background-position: center; background-repeat: no-repeat; background-size: cover; box-shadow: 0 0 0 1px rgba(23, 33, 41, .18); content: ""; } /* Homepage merchandising labels. */ .section--special .product-card__status { background: var(--orange); color: var(--ink); } .section--tint .product-card__status { background: var(--teal); color: #fff; } @media (max-width: 760px) { .footer-payment-marks { gap: 10px 13px; } .footer-payment-mark { min-width: 0; height: 24px; } .footer-payment-mark--visa { width: 46px; } .footer-payment-mark--mastercard { width: 36px; } .footer-payment-mark--stripe { width: 40px; } .footer-payment-mark--apple-pay { width: 50px; } .footer-payment-mark--google-pay { width: 52px; } .footer-payment-mark--link { width: 50px; min-width: 0; } .footer-payment-mark--bank { width: 92px; min-width: 0; } .footer-payment-mark--bank svg { width: 92px; height: 24px; } } /* Footer payment badges: selected compact dark treatment. */ .footer-payments { justify-content: flex-start; gap: 22px; padding-block: 30px; } .footer-payments__copy { flex: 0 0 190px; } .footer-payments h2 { margin: 0; color: #8495a5; font-size: 13px; font-weight: 700; letter-spacing: .1em; white-space: nowrap; } .footer-payments p { display: none; } .footer-payment-marks { display: flex; flex: 1 1 auto; min-width: 0; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: nowrap; } .footer-payment-mark { display: inline-grid; width: 112px; min-width: 112px; height: 58px; place-items: center; padding: 10px 18px; border: 1px solid rgba(151, 173, 189, .28); border-radius: 9px; background-color: rgba(5, 15, 24, .34); background-position: center; background-repeat: no-repeat; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025); } .footer-payment-mark--visa { width: 112px; background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiNGRkZGRkYiIHJvbGU9ImltZyIgdmlld0JveD0iMCAwIDI0IDI0Ij48dGl0bGU+VmlzYTwvdGl0bGU+PHBhdGggZD0iTTkuMTEyIDguMjYyTDUuOTcgMTUuNzU4SDMuOTJMMi4zNzQgOS43NzVjLS4wOTQtLjM2OC0uMTc1LS41MDMtLjQ2MS0uNjU4QzEuNDQ3IDguODY0LjY3NyA4LjYyNyAwIDguNDc5bC4wNDYtLjIxN2gzLjNhLjkwNC45MDQgMCAwMS44OTQuNzY0bC44MTcgNC4zMzggMi4wMTgtNS4xMDJ6bTguMDMzIDUuMDQ5Yy4wMDgtMS45NzktMi43MzYtMi4wODgtMi43MTctMi45NzIuMDA2LS4yNjkuMjYyLS41NTUuODIyLS42MjhhMy42NiAzLjY2IDAgMDExLjkxMy4zMzZsLjM0LTEuNTlhNS4yMDcgNS4yMDcgMCAwMC0xLjgxNC0uMzMzYy0xLjkxNyAwLTMuMjY2IDEuMDItMy4yNzggMi40NzktLjAxMiAxLjA3OS45NjMgMS42OCAxLjY5OCAyLjA0Ljc1Ni4zNjcgMS4wMS42MDMgMS4wMDYuOTMxLS4wMDUuNTA0LS42MDIuNzI1LTEuMTYuNzM0LS45NzUuMDE1LTEuNTQtLjI2My0xLjk5Mi0uNDczbC0uMzUxIDEuNjQyYy40NTMuMjA4IDEuMjg5LjM5IDIuMTU2LjM5OCAyLjAzNyAwIDMuMzctMS4wMDYgMy4zNzctMi41NjRtNS4wNjEgMi40NDdIMjRsLTEuNTY1LTcuNDk2aC0xLjY1NmEuODgzLjg4MyAwIDAwLS44MjYuNTVsLTIuOTA5IDYuOTQ2aDIuMDM2bC40MDUtMS4xMmgyLjQ4OHptLTIuMTYzLTIuNjU2bDEuMDItMi44MTUuNTg4IDIuODE1em0tOC4xNi00Ljg0bC0xLjYwMyA3LjQ5Nkg4LjM0bDEuNjA1LTcuNDk2eiIvPjwvc3ZnPg=="); background-size: 64px auto; } .footer-payment-mark--mastercard { position: static; width: 112px; background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA5OTkuMiA2MTgiIHJvbGU9ImltZyIgYXJpYS1sYWJlbGxlZGJ5PSJtYXN0ZXJjYXJkLXRpdGxlIj4KCTx0aXRsZSBpZD0ibWFzdGVyY2FyZC10aXRsZSI+TWFzdGVyY2FyZDwvdGl0bGU+Cgk8cmVjdCB4PSIzNjQiIHk9IjY2LjEiIHdpZHRoPSIyNzAuNCIgaGVpZ2h0PSI0ODUuOCIgZmlsbD0iI2ZmNWEwMCIvPgoJPHBhdGggZmlsbD0iI2ViMDAxYiIgZD0iTTM4MiAzMDljMC05OC43IDQ2LjQtMTg2LjMgMTE3LjYtMjQyLjlDNDQ3LjIgMjQuOSAzODEuMSAwIDMwOSAwIDEzOC4yIDAgMCAxMzguMiAwIDMwOXMxMzguMiAzMDkgMzA5IDMwOWM3Mi4xIDAgMTM4LjItMjQuOSAxOTAuNi02Ni4xQzQyOC4zIDQ5Ni4xIDM4MiA0MDcuNyAzODIgMzA5eiIvPgoJPHBhdGggZmlsbD0iI2Y3OWUxYiIgZD0iTTk5OS4yIDMwOWMwIDE3MC44LTEzOC4yIDMwOS0zMDkgMzA5LTcyLjEgMC0xMzguMi0yNC45LTE5MC42LTY2LjEgNzIuMS01Ni43IDExNy42LTE0NC4yIDExNy42LTI0Mi45UzU3MC44IDEyMi43IDQ5OS42IDY2LjFDNTUxLjkgMjQuOSA2MTggMCA2OTAuMSAwYzE3MC44IDAgMzA5IDEzOS4xIDMwOSAzMDl6Ii8+Cjwvc3ZnPgo="); background-size: 54px auto; } .footer-payment-mark--mastercard::before, .footer-payment-mark--mastercard::after { display: none; } .footer-payment-mark--stripe { width: 112px; background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzYwIiBoZWlnaHQ9IjE1MCIgdmlld0JveD0iMCAwIDM2MCAxNTAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMzYwIDc3LjQwMDFDMzYwIDUxLjgwMDEgMzQ3LjYgMzEuNjAwMSAzMjMuOSAzMS42MDAxQzMwMC4xIDMxLjYwMDEgMjg1LjcgNTEuODAwMSAyODUuNyA3Ny4yMDAxQzI4NS43IDEwNy4zIDMwMi43IDEyMi41IDMyNy4xIDEyMi41QzMzOSAxMjIuNSAzNDggMTE5LjggMzU0LjggMTE2Vjk2LjAwMDFDMzQ4IDk5LjQwMDEgMzQwLjIgMTAxLjUgMzMwLjMgMTAxLjVDMzIwLjYgMTAxLjUgMzEyIDk4LjEwMDEgMzEwLjkgODYuMzAwMUgzNTkuOEMzNTkuOCA4NS4wMDAxIDM2MCA3OS44MDAxIDM2MCA3Ny40MDAxWk0zMTAuNiA2Ny45MDAxQzMxMC42IDU2LjYwMDEgMzE3LjUgNTEuOTAwMSAzMjMuOCA1MS45MDAxQzMyOS45IDUxLjkwMDEgMzM2LjQgNTYuNjAwMSAzMzYuNCA2Ny45MDAxSDMxMC42WiIgZmlsbD0iIzUzM0FGRCIvPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTI0Ny4xIDMxLjYwMDFDMjM3LjMgMzEuNjAwMSAyMzEgMzYuMjAwMSAyMjcuNSAzOS40MDAxTDIyNi4yIDMzLjIwMDFIMjA0LjJWMTQ5LjhMMjI5LjIgMTQ0LjVMMjI5LjMgMTE2LjJDMjMyLjkgMTE4LjggMjM4LjIgMTIyLjUgMjQ3IDEyMi41QzI2NC45IDEyMi41IDI4MS4yIDEwOC4xIDI4MS4yIDc2LjQwMDFDMjgxLjEgNDcuNDAwMSAyNjQuNiAzMS42MDAxIDI0Ny4xIDMxLjYwMDFaTTI0MS4xIDEwMC41QzIzNS4yIDEwMC41IDIzMS43IDk4LjQwMDEgMjI5LjMgOTUuODAwMUwyMjkuMiA1OC43MDAxQzIzMS44IDU1LjgwMDEgMjM1LjQgNTMuODAwMSAyNDEuMSA1My44MDAxQzI1MC4yIDUzLjgwMDEgMjU2LjUgNjQuMDAwMSAyNTYuNSA3Ny4xMDAxQzI1Ni41IDkwLjUwMDEgMjUwLjMgMTAwLjUgMjQxLjEgMTAwLjVaIiBmaWxsPSIjNTMzQUZEIi8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTY5LjggMjUuN0wxOTQuOSAyMC4zVjBMMTY5LjggNS4zVjI1LjdaIiBmaWxsPSIjNTMzQUZEIi8+CjxwYXRoIGQ9Ik0xOTQuOSAzMy4zSDE2OS44VjEyMC44SDE5NC45VjMzLjNaIiBmaWxsPSIjNTMzQUZEIi8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTQyLjkgNDAuN0wxNDEuMyAzMy4zSDExOS43VjEyMC44SDE0NC43VjYxLjVDMTUwLjYgNTMuOCAxNjAuNiA1NS4yIDE2My43IDU2LjNWMzMuM0MxNjAuNSAzMi4xIDE0OC44IDI5LjkgMTQyLjkgNDAuN1oiIGZpbGw9IiM1MzNBRkQiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05Mi44OTk5IDExLjYwMDFMNjguNDk5OSAxNi44MDAxTDY4LjM5OTkgOTYuOTAwMUM2OC4zOTk5IDExMS43IDc5LjQ5OTkgMTIyLjYgOTQuMjk5OSAxMjIuNkMxMDIuNSAxMjIuNiAxMDguNSAxMjEuMSAxMTEuOCAxMTkuM1Y5OS4wMDAxQzEwOC42IDEwMC4zIDkyLjc5OTkgMTA0LjkgOTIuNzk5OSA5MC4xMDAxVjU0LjYwMDFIMTExLjhWMzMuMzAwMUg5Mi43OTk5TDkyLjg5OTkgMTEuNjAwMVoiIGZpbGw9IiM1MzNBRkQiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yNS4zIDU4LjcwMDFDMjUuMyA1NC44MDAxIDI4LjUgNTMuMzAwMSAzMy44IDUzLjMwMDFDNDEuNCA1My4zMDAxIDUxIDU1LjYwMDEgNTguNiA1OS43MDAxVjM2LjIwMDFDNTAuMyAzMi45MDAxIDQyLjEgMzEuNjAwMSAzMy44IDMxLjYwMDFDMTMuNSAzMS42MDAxIDAgNDIuMjAwMSAwIDU5LjkwMDFDMCA4Ny41MDAxIDM4IDgzLjEwMDEgMzggOTUuMDAwMUMzOCA5OS42MDAxIDM0IDEwMS4xIDI4LjQgMTAxLjFDMjAuMSAxMDEuMSA5LjUgOTcuNzAwMSAxLjEgOTMuMTAwMVYxMTYuOUMxMC40IDEyMC45IDE5LjggMTIyLjYgMjguNCAxMjIuNkM0OS4yIDEyMi42IDYzLjUgMTEyLjMgNjMuNSA5NC40MDAxQzYzLjQgNjQuNjAwMSAyNS4zIDY5LjkwMDEgMjUuMyA1OC43MDAxWiIgZmlsbD0iIzUzM0FGRCIvPgo8L3N2Zz4K"); background-size: 62px auto; } .footer-payment-mark--stripe svg { display: none; } .footer-payment-mark--apple-pay { width: 112px; background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyLjQzZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgNTEyIDIxMSI+PHBhdGggZmlsbD0iI2ZmZmZmZiIgZD0iTTkzLjU1MiAyNy4xMDNjLTYgNy4xLTE1LjYwMiAxMi43MDItMjUuMjAzIDExLjkwMWMtMS4yLTkuNiAzLjUtMTkuODAyIDkuMDAxLTI2LjEwM0M4My4zNSA1LjYwMSA5My44NTIuNCAxMDIuMzUzIDBjMSAxMC4wMDEtMi45IDE5LjgwMi04LjggMjcuMTAzbTguNzAxIDEzLjgwMmMtMTMuOTAyLS44LTI1LjgwMyA3LjktMzIuNDA0IDcuOWMtNi43IDAtMTYuODAyLTcuNS0yNy44MDMtNy4zYy0xNC4zMDEuMi0yNy42MDMgOC4zLTM0LjkwNCAyMS4yMDJjLTE1LjAwMiAyNS44MDMtMy45IDY0LjAwOCAxMC42MDEgODUuMDFjNy4xMDEgMTAuNDAxIDE1LjYwMiAyMS44MDIgMjYuODAzIDIxLjQwMmMxMC42MDItLjQgMTQuODAyLTYuOSAyNy42MDQtNi45YzEyLjkwMSAwIDE2LjYwMiA2LjkgMjcuODAzIDYuN2MxMS42MDEtLjIgMTguOTAyLTEwLjQgMjYuMDAzLTIwLjgwMmM4LjEtMTEuODAxIDExLjQwMS0yMy4zMDMgMTEuNjAxLTIzLjkwM2MtLjItLjItMjIuNDAyLTguNy0yMi42MDItMzQuMzA0Yy0uMi0yMS40MDIgMTcuNTAyLTMxLjYwMyAxOC4zMDItMzIuMjAzYy0xMC4wMDItMTQuODAyLTI1LjYwMy0xNi40MDItMzEuMDA0LTE2LjgwMm04MC4zMS0yOS4wMDRWMTY3LjgyaDI0LjIwMnYtNTMuMzA2aDMzLjUwNGMzMC42MDMgMCA1Mi4xMDYtMjEuMDAyIDUyLjEwNi01MS40MDZjMC0zMC40MDMtMjEuMTAzLTUxLjIwNi01MS4zMDYtNTEuMjA2em0yNC4yMDIgMjAuNDAzaDI3LjkwM2MyMS4wMDMgMCAzMy4wMDQgMTEuMjAxIDMzLjAwNCAzMC45MDNzLTEyLjAwMSAzMS4wMDQtMzMuMTA0IDMxLjAwNGgtMjcuODAzek0zMzYuNTggMTY5LjAxOWMxNS4yMDIgMCAyOS4zMDMtNy43IDM1LjcwNC0xOS45MDJoLjV2MTguNzAyaDIyLjQwM1Y5MC4yMWMwLTIyLjUwMi0xOC4wMDItMzcuMDA0LTQ1LjcwNi0zNy4wMDRjLTI1LjcwMyAwLTQ0LjcwNSAxNC43MDItNDUuNDA1IDM0LjkwNGgyMS44MDNjMS44LTkuNjAxIDEwLjctMTUuOTAyIDIyLjkwMi0xNS45MDJjMTQuODAyIDAgMjMuMTAzIDYuOTAxIDIzLjEwMyAxOS42MDN2OC42bC0zMC4yMDQgMS44Yy0yOC4xMDMgMS43LTQzLjMwNCAxMy4yMDItNDMuMzA0IDMzLjIwNWMwIDIwLjIwMiAxNS43MDEgMzMuNjAzIDM4LjIwNCAzMy42MDNtNi41LTE4LjUwMmMtMTIuOSAwLTIxLjEwMi02LjItMjEuMTAyLTE1LjcwMmMwLTkuOCA3LjkwMS0xNS41MDEgMjMuMDAzLTE2LjQwMWwyNi45MDMtMS43djguOGMwIDE0LjYwMi0xMi40MDEgMjUuMDAzLTI4LjgwMyAyNS4wMDNtODIuMDEgNTkuNzA3YzIzLjYwMyAwIDM0LjcwNC05IDQ0LjQwNS0zNi4zMDRMNTEyIDU0LjcwNmgtMjQuNjAzbC0yOC41MDMgOTIuMTFoLS41bC0yOC41MDMtOTIuMTFoLTI1LjMwM2w0MS4wMDQgMTEzLjUxM2wtMi4yIDYuOTAxYy0zLjcgMTEuNzAxLTkuNzAxIDE2LjIwMi0yMC40MDIgMTYuMjAyYy0xLjkgMC01LjYtLjItNy4xMDEtLjR2MTguNzAyYzEuNC40IDcuNC42IDkuMjAxLjYiLz48L3N2Zz4="); background-size: 70px auto; filter: none; } .footer-payment-mark--google-pay { display: inline-grid; width: 112px; background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyLjUxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgNTEyIDIwNCI+PHBhdGggZmlsbD0iI2Y1ZjdmOCIgZD0iTTM2Mi45MjcgNTUuMDU3YzE0LjA3NSAwIDI0Ljk1MiAzLjgzOSAzMy4yNyAxMS41MTdjOC4zMTcgNy42NzcgMTIuMTU1IDE3LjkxNCAxMi4xNTUgMzAuNzF2NjEuNDJoLTE3LjkxNFYxNDQuNjNoLS42NGMtNy42NzcgMTEuNTE3LTE4LjU1NCAxNy4yNzUtMzEuMzUgMTcuMjc1Yy0xMC44NzcgMC0yMC40NzQtMy4yLTI4LjE1MS05LjU5N2MtNy4wMzgtNi4zOTgtMTEuNTE3LTE1LjM1NS0xMS41MTctMjQuOTUycTAtMTUuMzU2IDExLjUxNy0yNC45NTNjNy42NzctNi4zOTggMTguNTU0LTguOTU3IDMxLjM1LTguOTU3YzExLjUxNiAwIDIwLjQ3NCAxLjkyIDI3LjUxMSA2LjM5OHYtNC40NzhjMC01Ljk3Mi0yLjIyOS0xMS45NDMtNi42ODgtMTUuODM0bC0uOTktLjgwMWMtNS4xMTgtNC40NzktMTEuNTE2LTcuMDM4LTE4LjU1My03LjAzOHEtMTYuMzE1IDAtMjQuOTUzIDEzLjQzNkwzMjEuMzQgNzQuODljMTAuMjM2LTEzLjQzNiAyMy42NzItMTkuODM0IDQxLjU4Ny0xOS44MzRNMjcyLjcxNSAxMS41NWMxMS40OCAwIDIyLjM5IDMuOTk1IDMxLjExMyAxMS40NDVsMS41MTcgMS4zNWM4Ljk1NyA3LjY3OCAxMy40MzUgMTkuMTk1IDEzLjQzNSAzMS4zNTFzLTQuNDc4IDIzLjAzMy0xMy40MzUgMzEuMzVzLTE5LjgzNCAxMi43OTYtMzIuNjMgMTIuNzk2bC0zMC43MS0uNjR2NTkuNTAySDIyMi44MVYxMS41NXptOTIuNzcgOTcuMjVxLTExLjUxNiAwLTE5LjE5MyA1Ljc1OHEtNy42NzggNC43OTgtNy42NzggMTMuNDM1YzAgNS4xMTkgMi41NiA5LjU5NyA2LjM5OCAxMi4xNTdjNC40NzkgMy4xOTkgOS41OTcgNS4xMTggMTQuNzE2IDUuMTE4YzcuMTY1IDAgMTQuMzMxLTIuNzg3IDE5LjkzNi03Ljg0bDEuMTc3LTEuMTE3YzYuMzk4LTUuNzU4IDkuNTk3LTEyLjc5NiA5LjU5Ny0yMC40NzRjLTUuNzU4LTQuNDc4LTE0LjA3Ni03LjAzOC0yNC45NTItNy4wMzhtLTkxLjQ5LTc5LjMzNmgtMzEuOTlWODAuNjVoMzEuOTljNy4wMzcgMCAxNC4wNzUtMi41NTkgMTguNTU0LTcuNjc3YzEwLjIzNi05LjU5NyAxMC4yMzYtMjUuNTkyLjY0LTM1LjE5bC0uNjQtLjY0Yy01LjExOS01LjExOC0xMS41MTctOC4zMTctMTguNTU1LTcuNjc3TTUxMiA1OC4yNTZsLTYzLjM0IDE0NS4yMzVoLTE5LjE5NGwyMy42NzItNTAuNTQ0bC00MS41ODctOTQuMDUxaDIwLjQ3NGwzMC4wNyA3Mi4yOTdoLjY0bDI5LjQzMS03Mi4yOTdINTEyeiIvPjxwYXRoIGZpbGw9IiM0Mjg1ZjQiIGQ9Ik0xNjUuODY4IDg2LjQwN2MwLTUuNzU4LS42NC0xMS41MTYtMS4yOC0xNy4yNzRIODQuNjE1djMyLjYzaDQ1LjQyNWMtMS45MTkgMTAuMjM2LTcuNjc3IDE5LjgzMy0xNi42MzQgMjUuNTkydjIxLjExM2gyNy41MTFjMTUuOTk1LTE0LjcxNSAyNC45NTItMzYuNDY5IDI0Ljk1Mi02Mi4wNiIvPjxwYXRoIGZpbGw9IiMzNGE4NTMiIGQ9Ik04NC42MTQgMTY4Ljk0MmMyMy4wMzIgMCA0Mi4yMjYtNy42NzggNTYuMzAyLTIwLjQ3NGwtMjcuNTExLTIxLjExM2MtNy42NzggNS4xMTgtMTcuMjc1IDguMzE3LTI4Ljc5MSA4LjMxN2MtMjEuNzU0IDAtNDAuOTQ4LTE0LjcxNS00Ny4zNDYtMzUuMTg5SDkuMTE4djIxLjc1M2MxNC43MTUgMjguNzkxIDQzLjUwNiA0Ni43MDYgNzUuNDk2IDQ2LjcwNiIvPjxwYXRoIGZpbGw9IiNmYmJjMDQiIGQ9Ik0zNy4yNjggMTAwLjQ4M2MtMy44MzgtMTAuMjM3LTMuODM4LTIxLjc1MyAwLTMyLjYzVjQ2LjFIOS4xMThjLTEyLjE1NyAyMy42NzMtMTIuMTU3IDUxLjgyNCAwIDc2LjEzNnoiLz48cGF0aCBmaWxsPSIjZWE0MzM1IiBkPSJNODQuNjE0IDMzLjMwNGMxMi4xNTYgMCAyMy42NzIgNC40NzkgMzIuNjMgMTIuNzk2bDI0LjMxMi0yNC4zMTJDMTI2LjIgNy43MTIgMTA1LjcyNy0uNjA1IDg1LjI1My4wMzRjLTMxLjk5IDAtNjEuNDIgMTcuOTE1LTc1LjQ5NiA0Ni43MDZsMjguMTUxIDIxLjc1M2M1Ljc1OC0yMC40NzQgMjQuOTUyLTM1LjE4OSA0Ni43MDYtMzUuMTg5Ii8+PC9zdmc+"); background-size: 72px auto; } .footer-payment-mark--link { display: inline-grid; width: 112px; background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjQiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA3MiAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTM2LjEyIDMuNjc2ODNDMzYuMTIgMi41NDg4MiAzNy4wNzA0IDEuNjMyMDIgMzguMTg4OCAxLjYzMjAyQzM5LjMwNzIgMS42MzIwMiA0MC4yNTc2IDIuNTUzNjIgNDAuMjU3NiAzLjY3NjgzQzQwLjI1NzYgNC44MDAwMyAzOS4zNDA4IDUuNzQ1NjMgMzguMTg4OCA1Ljc0NTYzQzM3LjAzNjggNS43NDU2MyAzNi4xMiA0LjgyODgzIDM2LjEyIDMuNjc2ODNaIiBmaWxsPSIjRkZGRkZGIi8+CjxwYXRoIGQ9Ik0yOS45ODA4IDEuOTIwMDFIMzMuNTgwOFYyMi4wOEgyOS45ODA4VjEuOTIwMDFaIiBmaWxsPSIjRkZGRkZGIi8+CjxwYXRoIGQ9Ik00MC4wMDggNy42ODAwMUgzNi4zNzkyVjIyLjA4SDQwLjAwOFY3LjY4MDAxWiIgZmlsbD0iI0ZGRkZGRiIvPgo8cGF0aCBkPSJNNjYuMDk2IDE0LjM5MDRDNjguODI3MiAxMi43MTA0IDcwLjY4NDggMTAuMjA5NiA3MS40MTkyIDcuNjc1MjRINjcuNzkwNEM2Ni44NDQ4IDEwLjA5NDQgNjQuNjc1MiAxMS45MTM2IDYyLjI4OTYgMTIuNjg2NFYxLjkxNTIzSDU4LjY2MDhWMjIuMDc1Mkg2Mi4yODk2VjE2LjA4QzY1LjA1OTIgMTYuNzcxMiA2Ny4yNDggMTkuMTY2NCA2Ny45OTY4IDIyLjA3NTJINzEuNjQ5NkM3MS4wOTI4IDE5LjAyMjQgNjkuMDA0OCAxNi4xNjY0IDY2LjA5NiAxNC4zOTA0WiIgZmlsbD0iI0ZGRkZGRiIvPgo8cGF0aCBkPSJNNDYuNDQgOS4yOTI4M0M0Ny4zOTA0IDguMDMwNDMgNDkuMjQzMiA3LjI5NjAyIDUwLjc0NTYgNy4yOTYwMkM1My41NDg4IDcuMjk2MDIgNTUuODY3MiA5LjM0NTYzIDU1Ljg3MiAxMi40NDE2VjIyLjA3NTJINTIuMjQzMlYxMy4yNDMyQzUyLjI0MzIgMTEuOTcxMiA1MS42NzY4IDEwLjUwMjQgNDkuODM4NCAxMC41MDI0QzQ3LjY3ODQgMTAuNTAyNCA0Ni40MzUyIDEyLjQxNzYgNDYuNDM1MiAxNC42NTkyVjIyLjA4NDhINDIuODA2NFY3LjY4OTYySDQ2LjQ0VjkuMjkyODNaIiBmaWxsPSIjRkZGRkZGIi8+CjxwYXRoIGQ9Ik0xMiAyNEMxOC42Mjc0IDI0IDI0IDE4LjYyNzQgMjQgMTJDMjQgNS4zNzI1NyAxOC42Mjc0IDAgMTIgMEM1LjM3MjU5IDAgMCA1LjM3MjU3IDAgMTJDMCAxOC42Mjc0IDUuMzcyNTkgMjQgMTIgMjRaIiBmaWxsPSIjMDBENjZGIi8+CjxwYXRoIGQ9Ik0xMS40NDc5IDQuODAwMDVINy43NDcwN0M4LjQ2NzA3IDcuODA5NjUgMTAuNTY5NSAxMC4zODI0IDEzLjE5OTkgMTJDMTAuNTY0NyAxMy42MTc2IDguNDY3MDcgMTYuMTkwNCA3Ljc0NzA3IDE5LjJIMTEuNDQ3OUMxMi4zNjQ3IDE2LjQxNiAxNC45MDM5IDEzLjk5NjggMTguMDIzOSAxMy41MDI0VjEwLjQ5MjlDMTQuODk5MSAxMC4wMDMzIDEyLjM1OTkgNy41ODQwNSAxMS40NDc5IDQuODAwMDVaIiBmaWxsPSIjRkZGRkZGIi8+Cjwvc3ZnPgoK"); background-size: 72px auto; } .footer-payment-mark--bank { width: 172px; min-width: 172px; } .footer-payment-mark--bank svg { display: block; width: 148px; height: 30px; filter: brightness(0) saturate(100%) invert(61%) sepia(15%) saturate(568%) hue-rotate(162deg) brightness(92%) contrast(88%); } @media (max-width: 920px) { .footer-payments { align-items: flex-start; flex-direction: column; gap: 12px; } .footer-payments__copy { flex: 0 0 auto; } .footer-payment-marks { width: 100%; padding-bottom: 4px; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; } .footer-payment-mark { flex: 0 0 auto; } } @media (max-width: 760px) { .footer-payment-marks { gap: 8px; } .footer-payment-mark { width: 74px; min-width: 74px; height: 40px; padding: 7px 12px; } .footer-payment-mark--visa, .footer-payment-mark--mastercard, .footer-payment-mark--stripe, .footer-payment-mark--apple-pay, .footer-payment-mark--google-pay, .footer-payment-mark--link { width: 74px; } .footer-payment-mark--bank { width: 128px; min-width: 128px; } } /* Mobile footer payments: two rows, no horizontal scrolling. */ @media (max-width: 760px) { .footer-payment-marks { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); width: 100%; gap: 8px; padding-bottom: 0; overflow: visible; } .footer-payment-mark, .footer-payment-mark--visa, .footer-payment-mark--mastercard, .footer-payment-mark--stripe, .footer-payment-mark--apple-pay, .footer-payment-mark--google-pay, .footer-payment-mark--link { width: 100%; min-width: 0; } .footer-payment-mark--bank { grid-column: span 2; width: 100%; min-width: 0; } }