/* ========================================================================== PAESE — storefront styles Tokens follow Paese Brand Book 2025 (Ink PANTONE 432C, Sand PANTONE 4675C). ========================================================================== */ /* Fonts (OFL, self-hosted). Replace with GT Sectra Fine / Founders Grotesk if web licences are bought. */ @font-face { font-family: "Newsreader"; font-style: normal; font-weight: 200 800; font-display: swap; src: url(../fonts/newsreader-latin-wght-normal.woff2) format("woff2-variations"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: "Newsreader"; font-style: normal; font-weight: 200 800; font-display: swap; src: url(../fonts/newsreader-latin-ext-wght-normal.woff2) format("woff2-variations"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "Hanken Grotesk"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/hanken-grotesk-latin-wght-normal.woff2) format("woff2-variations"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: "Hanken Grotesk"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/hanken-grotesk-latin-ext-wght-normal.woff2) format("woff2-variations"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } :root { /* colour */ --ink: #333F48; --ink-70: #5A646C; --ink-60: #4A545C; --sand: #DFC0A4; --sand-100: #F3E8DE; --sand-50: #FBF7F3; --rose-100: #F2DCD8; --line: #E6DED6; --line-soft: #F0EAE4; --field: #C9BEB3; --sale: #A3443E; --ok: #3E6B50; --warn: #8A5A1E; --white: #FFFFFF; /* type */ --serif: "Newsreader", Georgia, serif; --sans: "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif; --fs-display: clamp(36px, 4.2vw, 56px); --fs-h1: clamp(32px, 3.2vw, 44px); --fs-h2: clamp(26px, 2.4vw, 34px); --fs-h3: 22px; --fs-body: 16px; --fs-small: 14px; --fs-label: 12px; /* space & shape */ --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px; --s8: 64px; --s9: 96px; --gutter: 16px; --container: 1320px; --r-xs: 2px; --r-s: 4px; --r-m: 8px; --grid-gap-x: 12px; --grid-gap-y: 24px; --header-h: 56px; } @media (min-width: 768px) { :root { --gutter: 24px; --grid-gap-x: 24px; --grid-gap-y: 36px; } } @media (min-width: 1200px) { :root { --gutter: 60px; --header-h: 84px; } } /* ---------- base ---------- */ *, *::before, *::after { box-sizing: border-box; } html { -webkit-text-size-adjust: 100%; } body { margin: 0; background: var(--white); color: var(--ink); font: 400 var(--fs-body)/1.55 var(--sans); -webkit-font-smoothing: antialiased; } img, svg, video { display: block; max-width: 100%; height: auto; } a { color: inherit; text-decoration: none; } a:hover { text-decoration: underline; text-underline-offset: 4px; } h1, h2, h3, h4 { font-family: var(--serif); font-weight: 400; line-height: 1.1; margin: 0 0 var(--s4); } p { margin: 0 0 var(--s4); } button, input, select, textarea { font: inherit; color: inherit; } :focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; } .screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; } .skip-link:focus { position: fixed !important; top: 8px; left: 8px; width: auto; height: auto; clip: auto; z-index: 1000; padding: 12px 16px; background: var(--white); } .container { width: 100%; max-width: calc(var(--container) + 2 * var(--gutter)); margin-inline: auto; padding-inline: var(--gutter); } .container--narrow { max-width: calc(880px + 2 * var(--gutter)); } .label { font-size: var(--fs-label); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; } .only-mobile { display: inline-flex; } @media (min-width: 1200px) { .only-mobile { display: none !important; } } @media (max-width: 767px) { .hide-mobile { display: none !important; } } /* ---------- buttons ---------- */ .btn, .button, .wp-element-button, button.button, a.button, input[type="submit"] { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 28px; border: 1px solid var(--ink); border-radius: var(--r-s); background: var(--ink); color: var(--white); font-weight: 600; font-size: 15px; line-height: 1.2; cursor: pointer; text-decoration: none; transition: background-color .15s, color .15s; } .btn:hover, .button:hover, a.button:hover { background: #1E262C; color: var(--white); text-decoration: none; } .btn--outline { background: var(--white); color: var(--ink); } .btn--outline:hover { background: var(--sand-50); color: var(--ink); } .btn--sand { background: var(--sand); border-color: var(--sand); color: var(--ink); } .btn--sand:hover { background: #D4B191; color: var(--ink); } .button:disabled, .button.disabled { background: var(--line); border-color: var(--line); color: #6E767C; cursor: not-allowed; } .link-arrow { font-size: 14px; font-weight: 600; text-decoration: underline; text-underline-offset: 4px; } .icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 0; background: transparent; color: var(--ink); cursor: pointer; position: relative; border-radius: var(--r-s); } .icon-btn:hover { background: var(--sand-50); text-decoration: none; } /* Logged-in customer: filled icon (+ first name from tablet up). */ .account-link.is-user .icon-user { fill: currentColor; } .account-link.is-user .icon-user path { stroke-width: 1.8; } .account-link__name { display: none; } @media (min-width: 768px) { .account-link:has(.account-link__name) { width: auto; gap: 8px; padding: 0 12px 0 10px; } .account-link__name { display: inline; font-size: 14px; font-weight: 600; white-space: nowrap; } } /* ---------- announcement ---------- */ .announce { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 4px 10px; min-height: 32px; padding: 6px var(--gutter); background: var(--sand); color: var(--ink); font-size: 12px; font-weight: 500; text-align: center; } .announce a { text-decoration: underline; text-underline-offset: 3px; } @media (max-width: 767px) { .announce a { display: none; } } @media (min-width: 768px) { .announce { min-height: 40px; font-size: 13px; } } /* ---------- header ---------- */ .site-header { position: sticky; top: 0; z-index: 50; background: var(--white); } .header-row { display: flex; align-items: center; gap: var(--s2); height: var(--header-h); border-bottom: 1px solid var(--line); } .brand { display: inline-flex; align-items: center; color: var(--ink); line-height: 0; text-decoration: none !important; } .brand__svg { height: 22px; width: auto; } .custom-logo-link img { max-height: 40px; width: auto; } .header-row .brand, .header-row .custom-logo-link { flex: 1; justify-content: center; } .header-search { display: none; } .header-actions { display: flex; align-items: center; gap: 2px; } .lang-switch { position: relative; } .lang-switch__btn { height: 44px; padding: 0 12px; display: inline-flex; align-items: center; gap: 6px; background: transparent; border: 1px solid transparent; border-radius: var(--r-s); font: 600 13px/1 var(--sans); letter-spacing: .12em; color: var(--ink); cursor: pointer; } .lang-switch__btn:hover, .lang-switch__btn[aria-expanded="true"] { background: var(--sand-50); border-color: var(--ink); } .lang-switch__btn[aria-expanded="true"] .lang-switch__chev { transform: rotate(180deg); } .lang-switch__menu { position: absolute; top: calc(100% + 8px); right: 0; z-index: 60; width: 196px; margin: 0; padding: 6px 0; list-style: none; background: var(--white); border: 1px solid var(--line); border-radius: var(--r-m); box-shadow: 0 12px 32px rgba(51, 63, 72, .14); } .lang-switch__menu a { display: flex; align-items: center; gap: 12px; padding: 11px 16px; font-size: 15px; color: var(--ink); text-decoration: none; } .lang-switch__menu a:hover { background: var(--sand-50); } .lang-switch__menu a[aria-current] { background: var(--sand-50); box-shadow: inset 3px 0 0 var(--ink); } .lang-switch__code { width: 26px; font-size: 12px; font-weight: 600; letter-spacing: .12em; color: var(--ink-70); } .lang-switch__menu a[aria-current] .lang-switch__code { color: var(--ink); } .lang-switch__tick { margin-left: auto; color: var(--ok); } .drawer-lang { margin: var(--s5) calc(-1 * var(--s4)) 0; padding: var(--s5) var(--s4); background: var(--sand-50); } .drawer-lang__title { margin: 0 0 var(--s3); font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-70); } .drawer-lang__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; } .drawer-lang__btn { height: 48px; display: flex; align-items: center; justify-content: center; background: var(--white); border: 1px solid var(--field); border-radius: var(--r-s); font-size: 14px; color: var(--ink); text-decoration: none; } .drawer-lang__btn[aria-current] { background: var(--ink); border-color: var(--ink); color: var(--white); font-weight: 600; } .cart-count { position: absolute; top: 4px; right: 2px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px; background: var(--ink); color: var(--white); font-size: 11px; font-weight: 600; line-height: 18px; text-align: center; } .cart-count.is-empty { display: none; } @media (min-width: 1200px) { .header-row { gap: 40px; } .brand__svg { height: 30px; } .header-row .brand, .header-row .custom-logo-link { flex: 0 0 auto; justify-content: flex-start; } .header-search { display: flex; flex: 1; max-width: 680px; align-items: center; gap: 10px; height: 46px; padding: 0 16px; border: 1px solid var(--line); border-radius: var(--r-s); background: var(--sand-50); color: var(--ink-70); } .header-search input[type="search"] { flex: 1; min-width: 0; border: 0; background: transparent; color: var(--ink); font-size: 15px; outline: none; } .header-search:focus-within { border-color: var(--ink); } .header-actions { margin-left: auto; gap: 14px; } .lang-switch { margin-left: auto; margin-right: -24px; } /* next to the icons: 40px row gap − 24px = 16px */ .lang-switch + .header-actions { margin-left: 0; } } /* ---------- primary nav + mega menu ---------- */ .main-nav { display: none; } @media (min-width: 1200px) { .main-nav { display: block; border-bottom: 1px solid var(--line); position: relative; } .nav { display: flex; gap: 6px; margin: 0 auto; list-style: none; } .nav-item { display: flex; align-items: center; } .nav-link { display: flex; align-items: center; height: 52px; padding: 0 10px 0 14px; font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; text-decoration: none !important; box-shadow: inset 0 -2px 0 transparent; } .nav-link { white-space: nowrap; } /* RU / EN labels are longer than Latvian: tighter spacing keeps the menu on one line. */ html:not([lang|="lv"]) .nav { justify-content: space-between; gap: 0; } html:not([lang|="lv"]) .nav-link { padding: 0 6px 0 8px; font-size: 12px; letter-spacing: .04em; } html:not([lang|="lv"]) .mega-toggle { width: 16px; } .nav-item.is-sale > .nav-link { color: var(--sale); } .nav-item.is-open > .nav-link, .nav-link[aria-current] { box-shadow: inset 0 -2px 0 var(--ink); } .mega-toggle { width: 22px; height: 32px; border: 0; padding: 0; background: transparent; color: var(--ink-70); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transform: rotate(90deg); } .mega { position: absolute; left: 0; right: 0; top: 100%; background: var(--white); border-bottom: 1px solid var(--line); z-index: 60; } .mega__inner { padding-block: 36px 44px; } .mega__links { list-style: none; margin: 0; padding: 0; columns: 3 240px; column-gap: 56px; } .mega__item { break-inside: avoid; } .mega__item > a { display: flex; justify-content: space-between; gap: 24px; padding: 7px 0; font-size: 16px; } .mega__item.depth-1 > a { font-weight: 500; } .mega__count { color: var(--ink-70); font-size: 13px; } .mega__sub { list-style: none; margin: 0 0 8px; padding: 0 0 0 12px; } .mega__sub a { font-size: 15px; color: var(--ink-60); padding: 5px 0; } .mega-backdrop { position: fixed; inset: 0; top: var(--mega-top, 177px); background: rgba(51, 63, 72, .35); z-index: 40; } } /* ---------- mobile drawer ---------- */ .drawer { position: fixed; inset: 0; z-index: 100; background: rgba(51, 63, 72, .4); } .drawer__panel { width: min(88vw, 380px); height: 100%; overflow-y: auto; background: var(--white); padding: 0 var(--s4) var(--s6); } .drawer__head { display: flex; align-items: center; justify-content: space-between; height: 64px; border-bottom: 1px solid var(--line); margin-bottom: var(--s3); } .drawer__nav, .drawer__nav ul { list-style: none; margin: 0; padding: 0; } .drawer__nav > li > a { display: block; padding: 14px 0; font-size: 14px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; border-bottom: 1px solid var(--line); } .drawer__nav .sub-menu { display: none; padding: 4px 0 10px 12px; } .drawer__nav li.is-open > .sub-menu { display: block; } .drawer__nav .sub-menu a { display: block; padding: 9px 0; font-size: 15px; } body.drawer-open { overflow: hidden; } /* ---------- section headings ---------- */ .section { padding-block: 56px 24px; } .section__head { display: flex; align-items: center; gap: var(--s4); margin-bottom: 28px; } .section__title { margin: 0; font-size: var(--fs-h2); } .section__head .link-arrow { margin-left: auto; } /* ---------- product grid & card ---------- */ ul.products { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--card-gap); } @media (min-width: 768px) { ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (min-width: 1200px) { ul.products { grid-template-columns: repeat(4, minmax(0, 1fr)); } } /* Card design 09.11.2026: white rounded card, stock icon next to the category, price pinned to the bottom. */ :root { --card-gap: 12px; --card-pad: 10px; --card-ink: #1F2937; --card-muted: #667085; } @media (min-width: 768px) { :root { --card-gap: 20px; --card-pad: 14px; } } @media (min-width: 1200px) { :root { --card-gap: 24px; } } .card { position: relative; display: flex; flex-direction: column; gap: 12px; min-width: 0; height: 100%; box-sizing: border-box; padding: var(--card-pad); background: var(--white); border: 1px solid #EEEEEE; border-radius: 16px; box-shadow: 0 3px 14px rgba(0, 0, 0, .04); } .card__media { position: relative; display: block; aspect-ratio: 1 / 1; border-radius: 12px; overflow: hidden; background: #F5F3F1; } .card__img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; } .card__img.is-muted { opacity: .55; } @media (hover: hover) and (pointer: fine) { .card:hover .card__img { transform: scale(1.03); } } .badge { position: absolute; top: 10px; left: 10px; padding: 5px 9px; border-radius: 6px; background: var(--ink); color: var(--white); font-size: 10px; font-weight: 600; letter-spacing: .1em; line-height: 1.2; } .badge--bestseller { background: #F1E2D3; color: var(--ink); } .badge--sale { background: var(--sale); } .badge--vegan { background: var(--white); color: var(--ok); box-shadow: inset 0 0 0 1px var(--ok); } .card__body { display: flex; flex-direction: column; gap: 8px; flex: 1; min-width: 0; padding: 2px 2px 0; } .card__top { display: flex; align-items: center; gap: 8px; min-height: 18px; } .card__type { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #4B5563; line-height: 1.4; } .card__avail { flex: none; width: 18px; height: 18px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: var(--white); background: #21813A; } .card__avail svg { width: 12px; height: 12px; } .card__avail.is-out { background: #9AA0A6; } .card__avail.is-preorder { background: #8A5A1E; } .card__title { margin: 0; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font: 600 15px/1.35 var(--sans); color: var(--card-ink); } .card__title a { color: inherit; text-decoration: none; } .card__title a:hover { text-decoration: underline; text-underline-offset: 3px; } .card__rating { display: flex; align-items: center; gap: 6px; width: fit-content; max-width: 100%; font: 400 12px/1.4 var(--sans); color: var(--card-muted); text-decoration: none; font-variant-numeric: tabular-nums; } .card__rating-score { display: inline-flex; align-items: center; gap: 5px; flex: none; font-size: 13px; font-weight: 500; color: var(--card-ink); } .card__rating-star { display: inline-block; width: 15px; height: 15px; flex: none; background: #D2A27D; clip-path: polygon(50% 0,61.8% 35.1%,98% 34.5%,68.2% 56%,79.4% 90.5%,50% 69%,20.6% 90.5%,31.8% 56%,2% 34.5%,38.2% 35.1%); } .card__rating-count { white-space: nowrap; } .card__rating:hover .card__rating-count { text-decoration: underline; text-underline-offset: 3px; } .card__rating:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; border-radius: var(--r-xs); } .card__meta { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #4B5563; } .dot { width: 18px; height: 18px; border-radius: 50%; background: var(--c); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08); flex: none; } .card__foot { margin-top: auto; padding-top: 6px; display: flex; flex-direction: column; gap: 2px; } .card__price-label { font-size: 12px; color: var(--card-muted); } .card__price-row { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; min-height: 32px; } .card .price { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; font-size: 20px; font-weight: 700; color: #172033; font-variant-numeric: tabular-nums; letter-spacing: -.01em; } .card .price ins { color: inherit; text-decoration: none; } .card .price .woocommerce-price-suffix { display: none; } /* the label above the price already says "bez PVN / ar PVN" */ .card .price del { order: 2; font-size: 13px; font-weight: 400; color: #80858D; letter-spacing: 0; } .card__discount { margin-left: auto; padding: 4px 9px; border-radius: 999px; background: #E3F0E5; color: #17652C; font-size: 13px; font-weight: 600; line-height: 1.3; white-space: nowrap; } @media (min-width: 768px) { .card__title { font-size: 16px; } .card .price { font-size: 23px; } .card .price del { font-size: 14px; } } .card .added_to_cart { display: none; } /* Image area: heart (wishlist) top right, add-to-cart button over the image on hover. */ .card__visual { position: relative; } .card__fav { position: absolute; top: 8px; right: 8px; z-index: 2; width: 40px; height: 40px; border: 0; border-radius: 50%; background: var(--white); box-shadow: 0 1px 4px rgba(0, 0, 0, .08); color: var(--ink); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: background-color .15s, transform .15s; } .card__fav:hover { background: var(--white); } .card__fav:focus-visible { outline: 2px solid var(--ink); outline-offset: 0; } .card__fav.is-on { color: var(--sale); } .card__fav.is-on .icon-heart { fill: currentColor; } .card__fav.pop { animation: fav-pop .35s ease; } @keyframes fav-pop { 40% { transform: scale(1.25); } } .card__cta { position: absolute; z-index: 2; left: 10px; right: 10px; bottom: 10px; min-height: 44px; padding: 0 16px; border-radius: 10px; background: var(--ink); color: var(--white); display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-size: 14px; font-weight: 600; text-decoration: none !important; opacity: 0; transform: translateY(8px); transition: opacity .2s ease, transform .2s ease, background-color .15s; } .card__cta .icon-bag { display: none; } .card__cta:hover { background: #1E262C; color: var(--white); } .card__cta.loading { opacity: .6 !important; pointer-events: none; } .card__cta.added::after { content: "✓"; margin-left: 2px; } @media (hover: hover) and (pointer: fine) { .card:hover .card__cta, .card__cta:focus-visible { opacity: 1; transform: none; } } /* Touch screens: no hover — a small bag button in the image corner. */ @media (hover: none), (pointer: coarse) { .card__cta { opacity: 1; transform: none; left: auto; right: 8px; bottom: 8px; width: 40px; min-height: 40px; height: 40px; padding: 0; border-radius: 50%; } .card__cta .icon-bag { display: block; } .card__cta-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } .card__cta.added::after { content: none; } } @media (prefers-reduced-motion: reduce) { .card__cta, .card__fav { transition: none; } .card__fav.pop { animation: none; } } .fav-count { background: var(--sale); } @media (max-width: 767px) { .fav-link.has-items { display: inline-flex !important; } } /* Wishlist page */ .wishlist { max-width: calc(var(--container) + 2 * var(--gutter)); margin: 0 auto var(--s8); padding-inline: var(--gutter); } .wishlist [hidden] { display: none !important; } .wishlist__loading { color: var(--ink-70); } .wishlist__empty { max-width: 420px; margin: 24px auto 0; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 8px; } .wishlist__empty h2 { margin: 8px 0 0; font-family: var(--serif); font-weight: 400; font-size: 28px; } .wishlist__empty p { margin: 0 0 12px; color: var(--ink-70); } .wishlist__icon { width: 64px; height: 64px; border-radius: 50%; background: var(--sand-50); display: inline-flex; align-items: center; justify-content: center; color: var(--sale); } .wishlist__note { margin: 32px 0 0; font-size: 14px; color: var(--ink-70); } .price { font-size: 17px; font-weight: 600; display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; } .price del { order: 2; font-size: 13px; font-weight: 400; color: var(--ink-70); } .price ins { text-decoration: none; color: var(--sale); } .price .screen-reader-text { position: absolute; } /* ---------- archive ---------- */ .crumbs { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 24px; font-size: 13px; color: var(--ink-70); } .crumbs a { color: var(--ink-70); } .archive-head { display: flex; flex-direction: column; gap: var(--s5); padding: var(--s5) 0 var(--s6); } .archive-head__title { margin: 0; font-size: var(--fs-h1); } .archive-head__desc { max-width: 640px; color: var(--ink-70); font-size: 15px; } .archive-head__desc p:last-child { margin: 0; } .chips { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; } .chip { flex: none; display: inline-flex; align-items: center; height: 36px; padding: 0 14px; border: 1px solid var(--line); border-radius: 999px; font-size: 13px; text-decoration: none !important; } .chip:hover { border-color: var(--ink); } @media (min-width: 1200px) { .archive-head { flex-direction: row; justify-content: space-between; align-items: flex-end; gap: 40px; } .chips { flex-wrap: wrap; justify-content: flex-end; max-width: 640px; } } .shop-layout { display: grid; gap: 40px; padding-bottom: var(--s8); } @media (min-width: 1200px) { .shop-layout.has-filters { grid-template-columns: 248px minmax(0, 1fr); } } .shop-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 22px; } .woocommerce-result-count { margin: 0; font-size: 14px; color: var(--ink-70); } .woocommerce-ordering { margin: 0 0 0 auto; } .woocommerce-ordering select { height: 40px; padding: 0 12px; border: 1px solid var(--field); border-radius: var(--r-s); background: var(--white); font-size: 14px; font-weight: 500; } .woocommerce-pagination ul { list-style: none; display: flex; justify-content: center; gap: 6px; padding: 0; margin: 40px 0 0; } .woocommerce-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 12px; border: 1px solid var(--line); border-radius: var(--r-s); font-size: 14px; } .woocommerce-pagination .page-numbers.current { background: var(--ink); border-color: var(--ink); color: var(--white); } /* ---------- pages & blocks ---------- */ .page-head { padding-top: 40px; } .page-title { font-size: var(--fs-h1); } .blocks > :where(p, h2, h3, h4, ul, ol, blockquote, .wp-block-image, .wp-block-table) { max-width: calc(880px + 2 * var(--gutter)); margin-inline: auto; padding-inline: var(--gutter); } .blocks > .alignwide { max-width: calc(var(--container) + 2 * var(--gutter)); margin-inline: auto; padding-inline: var(--gutter); } .woocommerce-cart .blocks, .woocommerce-checkout .blocks, .woocommerce-account .blocks { max-width: calc(var(--container) + 2 * var(--gutter)); margin-inline: auto; padding: 0 var(--gutter) var(--s8); } /* Hero (paese/hero) */ .p-hero { position: relative; background: var(--sand-100); overflow: hidden; } .p-hero__track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; } .p-hero__track::-webkit-scrollbar { display: none; } .p-hero__slide { position: relative; flex: 0 0 100%; scroll-snap-align: start; display: block; color: var(--ink); text-decoration: none !important; } .p-hero__media img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: var(--fx-m, 50%) var(--fy-m, 50%); } .p-hero__content { position: absolute; left: 0; right: 0; bottom: 0; padding: 80px var(--gutter) 24px; display: flex; flex-direction: column; gap: 10px; background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .92) 45%); } .p-hero__content.is-light { color: var(--white); background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .45) 55%); } .p-hero__kicker { font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; } .p-hero__title { margin: 0; font-size: 36px; line-height: 1.02; } .p-hero__text { margin: 0; font-size: 15px; line-height: 1.5; } .p-hero__content .btn { align-self: flex-start; } .p-hero__nav { position: absolute; right: var(--gutter); bottom: 16px; display: flex; gap: 8px; z-index: 2; } .p-hero__nav button { width: 44px; height: 44px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .9); color: var(--ink); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; } .p-hero__nav svg { fill: currentColor; } .p-hero__nav .p-hero__icon-play, .p-hero__nav .is-paused .p-hero__icon-pause { display: none; } .p-hero__nav .is-paused .p-hero__icon-play { display: block; } .p-hero__content { pointer-events: none; } a.p-hero__slide:focus-visible { outline: 3px solid var(--ink); outline-offset: -3px; } @media (min-width: 768px) { .p-hero__media img { aspect-ratio: 22 / 7; object-position: var(--fx-d, 50%) var(--fy-d, 50%); } .p-hero__content { top: 0; bottom: 0; left: auto; right: max(var(--gutter), 8vw); width: min(460px, 40%); padding: 0; justify-content: center; gap: 16px; background: none; } .p-hero__content.is-left { right: auto; left: max(var(--gutter), 8vw); } .p-hero__content.is-center { left: 50%; right: auto; transform: translateX(-50%); text-align: center; align-items: center; } .p-hero__content.is-center .btn { align-self: center; } .p-hero__content.is-light { background: none; } .p-hero__kicker { font-size: 12px; } .p-hero__title { font-size: var(--fs-display); } .p-hero__text { font-size: 16px; } } /* Category tiles (paese/category-tiles) */ .p-cats__grid { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x proximity; padding-bottom: 6px; scrollbar-width: none; margin-inline: calc(-1 * var(--gutter)); padding-inline: var(--gutter); } .p-cats__item { flex: 0 0 104px; scroll-snap-align: start; display: flex; flex-direction: column; align-items: center; gap: 8px; text-decoration: none !important; } .p-cats__img { width: 104px; height: 104px; border-radius: 50%; overflow: hidden; background: var(--sand-50); display: flex; align-items: center; justify-content: center; } .p-cats__img img { width: 100%; height: 100%; object-fit: cover; } .p-cats__label { font-size: 13px; font-weight: 600; text-align: center; } @media (min-width: 1200px) { .p-cats__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px; overflow: visible; margin: 0; padding: 0; } .p-cats__item { gap: 12px; } .p-cats__img { width: 100%; height: auto; aspect-ratio: 1 / 1; border-radius: var(--r-m); } .p-cats__label { font-size: 15px; letter-spacing: .04em; } } /* Product collection carousel variant */ .p-collection.is-carousel ul.products { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; gap: var(--card-gap); padding-block: 4px 18px; margin-block: -4px -18px; } .p-collection.is-carousel ul.products > li { flex: 0 0 calc((100% - var(--card-gap)) / 2); scroll-snap-align: start; height: auto; } @media (min-width: 768px) { .p-collection.is-carousel ul.products > li { flex-basis: calc((100% - 2 * var(--card-gap)) / 3); } } @media (min-width: 1200px) { .p-collection.is-carousel ul.products > li { flex-basis: calc((100% - 3 * var(--card-gap)) / 4); } } .p-collection__arrows { display: none; gap: 8px; } @media (min-width: 1200px) { .p-collection.is-carousel .p-collection__arrows { display: flex; } } .round-btn { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--field); background: var(--white); color: var(--ink); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; } .round-btn:hover { border-color: var(--ink); } /* Promo banners (paese/promo) */ .p-promo__grid { display: grid; gap: var(--grid-gap-x); } @media (min-width: 768px) { .p-promo__grid.has-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } } .p-promo__item { position: relative; display: flex; flex-direction: column; border-radius: var(--r-m); overflow: hidden; background: var(--bg, var(--sand-100)); color: var(--ink); text-decoration: none !important; min-height: 100%; } .p-promo__item.is-image-only img { width: 100%; height: 100%; object-fit: cover; } .p-promo__media { order: -1; display: flex; justify-content: center; } .p-promo__media img { width: 100%; max-height: 260px; object-fit: contain; mix-blend-mode: multiply; } .p-promo__body { padding: 0 20px 24px; display: flex; flex-direction: column; gap: 10px; } .p-promo__title { margin: 0; font-size: 30px; } .p-promo__text { margin: 0; font-size: 15px; color: var(--ink-60); max-width: 300px; } .p-promo__item.is-ink { --bg: var(--ink); color: var(--white); } .p-promo__item.is-ink .p-promo__text { color: #D9DDE0; } .p-promo__item.is-photo .p-promo__media { display: block; } .p-promo__item.is-photo .p-promo__media img { width: 100%; height: auto; aspect-ratio: 4 / 3; max-height: none; object-fit: cover; object-position: 50% 25%; mix-blend-mode: normal; } .p-promo__item.is-photo .p-promo__body { padding-top: 20px; } @media (min-width: 1200px) { .p-promo__item:not(.is-image-only) { flex-direction: row; align-items: center; min-height: 380px; padding-left: 44px; } .p-promo__media { order: 2; flex: 0 0 auto; } .p-promo__media img { width: 340px; height: 340px; max-height: none; } .p-promo__body { flex: 1; padding: 0; gap: 14px; } .p-promo__item.is-photo { align-items: stretch; } .p-promo__item.is-photo .p-promo__body { justify-content: center; padding: 44px 44px 44px 0; } .p-promo__item.is-photo .p-promo__media { flex: 0 0 46%; position: relative; } .p-promo__item.is-photo .p-promo__media img { position: absolute; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; } .p-promo__title { font-size: 40px; } } /* Benefits (paese/benefits) */ .p-benefits__list { list-style: none; margin: 0; padding: 20px 0; border-block: 1px solid var(--line); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 12px; } .p-benefits__item { display: flex; flex-direction: column; gap: 3px; } .p-benefits__title { font-size: 14px; font-weight: 600; } .p-benefits__text { font-size: 12px; color: var(--ink-70); } @media (min-width: 1200px) { .p-benefits__list { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; padding: 32px 0; } .p-benefits__title { font-size: 15px; } .p-benefits__text { font-size: 13px; } } /* ---------- WooCommerce: notices, forms, single (single product: see Phase 4 block) ---------- */ .woocommerce-notices-wrapper:empty { display: none; } .woocommerce-message, .woocommerce-info, .woocommerce-error { list-style: none; margin: 16px 0; padding: 14px 16px; border-radius: var(--r-m); background: var(--sand-50); border: 1px solid var(--line); display: flex; flex-wrap: wrap; align-items: center; gap: 12px; } .woocommerce-error { border-color: var(--sale); } .woocommerce-message .button { margin-left: auto; min-height: 40px; padding: 0 18px; } .input-text, select, textarea, input[type="text"], input[type="email"], input[type="tel"], input[type="password"], input[type="number"] { min-height: 48px; padding: 0 14px; border: 1px solid var(--field); border-radius: var(--r-s); background: var(--white); font-size: 15px; } textarea { padding: 12px 14px; } .stock.in-stock { color: var(--ok); } .stock.out-of-stock { color: var(--sale); } /* ---------- footer ---------- */ .site-footer { margin-top: var(--s8); background: var(--sand-50); border-top: 1px solid var(--line); font-size: 14px; } .footer-top { display: grid; gap: 36px; padding-block: 48px 36px; border-bottom: 1px solid var(--line); } .footer-brand { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; } .footer-official { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border: 1px solid var(--ink); border-radius: 999px; font-size: 13px; font-weight: 600; letter-spacing: .02em; } .footer-about { margin: 0; max-width: 380px; font-size: 15px; line-height: 1.6; color: var(--ink-60); } .footer-ig { display: inline-flex; align-items: center; gap: 12px; padding: 10px 16px 10px 10px; border: 1px solid var(--line); border-radius: 12px; background: var(--white); color: var(--ink); text-decoration: none !important; } .footer-ig:hover { border-color: var(--ink); } .footer-ig__icon { width: 40px; height: 40px; border-radius: 10px; background: var(--ink); color: var(--white); display: inline-flex; align-items: center; justify-content: center; flex: none; } .footer-ig__text { display: flex; flex-direction: column; gap: 2px; } .footer-ig__handle { display: inline-flex; align-items: center; gap: 6px; font-size: 15px; font-weight: 600; } .footer-ig__verified { flex: none; } .footer-ig__note { font-size: 13px; color: var(--ink-70); } .footer-social { list-style: none; display: flex; gap: 16px; margin: 0; padding: 0; font-weight: 600; } .footer-block { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; } .footer-line { margin: 0; display: flex; gap: 12px; align-items: flex-start; font-size: 15px; line-height: 1.5; } .footer-line svg { flex: none; margin-top: 2px; } .footer-line span { display: flex; flex-direction: column; gap: 2px; } .footer-line a { color: var(--ink); } .footer-note { margin: 0; font-size: 14px; line-height: 1.55; color: var(--ink-60); } .footer-cta { min-height: 46px; } .footer-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; padding-block: 36px 32px; } .brand--footer { display: block; } .brand--footer .brand__svg { height: 30px; } .footer-col__title { margin: 0 0 14px; font: 600 12px/1.4 var(--sans); letter-spacing: .12em; text-transform: uppercase; } .footer-block .footer-col__title { margin: 0; } .footer-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; } .footer-col a { color: var(--ink-60); } .footer-col .footer-note + .footer-note { margin-top: 8px; } .footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; padding-block: 16px 24px; border-top: 1px solid var(--line); color: var(--ink-70); font-size: 13px; } @media (min-width: 900px) { .footer-top { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1fr); gap: 48px; padding-block: 56px 40px; } .footer-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px; padding-block: 40px; } } /* ---------- Phase 3: category page & filters ---------- */ .cat-banner { position: relative; margin-top: var(--s4); border-radius: var(--r-m); overflow: hidden; background: var(--sand-100); } .cat-banner__media img { width: 100%; aspect-ratio: 1080 / 560; object-fit: cover; } .cat-banner__text { padding: var(--s5) 0 var(--s2); display: flex; flex-direction: column; gap: 10px; } .cat-banner .archive-head__title { margin: 0; } .cat-banner__play { position: absolute; top: 12px; right: 12px; padding: 8px 14px; border-radius: 999px; background: rgba(255,255,255,.92); font-size: 13px; font-weight: 600; } .cat-banner { background: transparent; } @media (min-width: 768px) { .cat-banner { background: var(--sand-100); } .cat-banner__media img { aspect-ratio: 2640 / 600; min-height: 260px; } .cat-banner:not(.is-image-only) .cat-banner__media img { width: 62%; margin-left: auto; } .cat-banner__text:not(.screen-reader-text) { position: absolute; inset: 0 auto 0 0; width: 52%; padding: 0 48px; justify-content: center; background: linear-gradient(90deg, var(--sand-100) 70%, rgba(243, 232, 222, 0) 100%); } } .chips--subcats { margin: var(--s5) 0 0; justify-content: flex-start; max-width: none; } @media (min-width: 1200px) { .chips--subcats { flex-wrap: wrap; } } .chip__count { color: var(--ink-70); margin-left: 4px; } .cat-blocks { margin-top: var(--s6); } .cat-seo { max-width: 880px; padding: var(--s7) 0 0; color: var(--ink-70); font-size: 14px; line-height: 1.65; } .shop-layout { margin-top: var(--s6); } .shop-layout[aria-busy="true"] .shop-results { opacity: .5; transition: opacity .15s; pointer-events: none; } @media (min-width: 1200px) { .shop-layout.has-filters ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* toolbar */ .shop-toolbar { position: sticky; top: var(--header-h); z-index: 20; background: var(--white); padding: 10px 0; margin-bottom: 14px; } .shop-toolbar__chips { display: contents; } .chip--active { background: var(--ink); border-color: var(--ink); color: var(--white); gap: 8px; height: 34px; } .chip--active:hover { background: #1E262C; color: var(--white); } .link-clear { font-size: 13px; text-decoration: underline; text-underline-offset: 3px; } .filters-toggle { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px; border: 1px solid var(--field); border-radius: var(--r-s); background: var(--white); font-weight: 600; font-size: 14px; color: var(--ink); cursor: pointer; } @media (min-width: 1200px) { .filters-toggle { display: none; } .shop-toolbar { position: static; } } @media (max-width: 1199px) { .shop-toolbar { flex-wrap: nowrap; gap: 8px; } .filters-toggle { flex: 1; justify-content: center; } .woocommerce-ordering { flex: 1; margin: 0; } .woocommerce-ordering select { width: 100%; } .shop-toolbar__chips { display: none; } } @media (max-width: 767px) { .woocommerce-result-count { display: none; } } /* filter panel */ .filters__head, .filters__foot { display: none; } .filters__group { border: 0; margin: 0 0 20px; padding: 0 0 20px; border-bottom: 1px solid var(--line); display: flex; flex-direction: column; gap: 6px; } .filters__legend { padding: 0 0 10px; font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; } .filters__opt { display: flex; align-items: center; gap: 10px; min-height: 32px; font-size: 14px; cursor: pointer; } .filters__opt input { width: 18px; height: 18px; margin: 0; accent-color: var(--ink); flex: none; } .filters__label { flex: 1; } .filters__count { font-size: 13px; color: var(--ink-70); } .filters__opt.is-off { opacity: .45; cursor: default; } .filters-backdrop { display: none; } @media (max-width: 1199px) { .shop-filters { position: fixed; left: 0; right: 0; bottom: 0; top: 12vh; z-index: 110; background: var(--white); border-radius: 12px 12px 0 0; transform: translateY(105%); transition: transform .25s ease; display: flex; flex-direction: column; } body.filters-open { overflow: hidden; } body.filters-open .shop-filters { transform: none; } body.filters-open .filters-backdrop { display: block; position: fixed; inset: 0; z-index: 105; background: rgba(51, 63, 72, .4); } .filters { display: flex; flex-direction: column; height: 100%; } .filters__head { display: flex; align-items: center; justify-content: space-between; height: 60px; padding: 0 8px 0 16px; border-bottom: 1px solid var(--line); flex: none; } .filters__title { font-family: var(--serif); font-size: 24px; } .filters__close { font-size: 24px; } .filters__body { flex: 1; overflow-y: auto; padding: 16px; } .filters__foot { display: flex; gap: 10px; padding: 12px 16px calc(16px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); flex: none; } .filters__apply { flex: 1; } } @media (min-width: 1200px) { .filters__apply { display: none; } } /* inline promo card */ .card--promo { display: block; } .promo-card { position: relative; display: flex; flex-direction: column; justify-content: flex-end; height: 100%; min-height: 360px; border-radius: var(--r-m); overflow: hidden; background: var(--ink); color: var(--white); text-decoration: none !important; } .promo-card__img { position: absolute; inset: 0; width: 100%; height: 62%; object-fit: cover; } .promo-card__body { position: relative; padding: 20px; display: flex; flex-direction: column; gap: 8px; } .promo-card__kicker { font-size: 11px; font-weight: 600; letter-spacing: .14em; color: var(--sand); } .promo-card__title { font-family: var(--serif); font-size: 24px; line-height: 1.1; } /* empty state */ .shop-empty { padding: 48px 24px; border: 1px dashed var(--field); border-radius: var(--r-m); text-align: center; display: flex; flex-direction: column; align-items: center; gap: 8px; } .shop-empty__title { font-family: var(--serif); font-size: 24px; margin: 0; } @media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } } /* ================= Phase 4: product page, mini cart, search, cart/checkout ================= */ /* ---------- product page ---------- */ .pdp { padding-bottom: var(--s8); } .pdp__main { display: grid; gap: var(--s5); margin-top: var(--s4); } @media (min-width: 900px) { .pdp__main { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--s7); align-items: start; } } .pdp__gallery { min-width: 0; } @media (min-width: 900px) { .pdp__gallery { position: sticky; top: calc(var(--header-h) + 64px); } } .pdp__stage { position: relative; aspect-ratio: 1; background: var(--sand-50); overflow: hidden; } .pdp__stage img { width: 100%; height: 100%; object-fit: contain; } .pdp__zoom { display: block; height: 100%; cursor: zoom-in; } .pdp__stage .badge { top: 16px; left: 16px; font-size: 11px; } .pdp__thumbs { list-style: none; margin: var(--s3) 0 0; padding: 0; display: flex; gap: var(--s2); overflow-x: auto; scrollbar-width: none; } .pdp__thumb { flex: none; width: 72px; height: 72px; padding: 0; border: 1px solid var(--line); border-radius: var(--r-xs); background: var(--sand-50); cursor: pointer; overflow: hidden; } .pdp__thumb img { width: 100%; height: 100%; object-fit: contain; } .pdp__thumb.is-active { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); } .pdp__type { display: block; margin-bottom: var(--s2); font-size: var(--fs-label); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-70); } .pdp__title { font-size: var(--fs-h1); margin-bottom: var(--s3); } .pdp__price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; font-size: 22px; font-weight: 600; margin-bottom: var(--s4); } .pdp__price del { color: var(--ink-70); font-weight: 400; font-size: 17px; } .pdp__price ins { text-decoration: none; color: var(--sale); } .pdp__vat { font-size: 13px; font-weight: 400; color: var(--ink-70); } .pdp__short { color: var(--ink-60); margin-bottom: var(--s5); } .pdp__short p:last-child { margin: 0; } .shades { padding: var(--s4) 0; border-top: 1px solid var(--line); } .shades__head { display: flex; justify-content: space-between; gap: var(--s3); margin-bottom: var(--s3); font-size: 14px; } .shades__label { font-weight: 600; } .shades__label [data-shade-name] { font-weight: 400; } .shades__count { color: var(--ink-70); } .shades__list { display: flex; flex-wrap: wrap; gap: 6px; } .shade { position: relative; display: inline-flex; flex-direction: column; align-items: center; gap: 4px; width: 56px; padding: 4px 2px 6px; border: 1px solid transparent; border-radius: var(--r-s); background: none; cursor: pointer; } .shade:hover { border-color: var(--line); } .shade[aria-checked="true"] { border-color: var(--ink); } .shade__dot { display: inline-block; width: 36px; height: 36px; border-radius: 50%; background: var(--c, var(--sand)); box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); } .shade__code { font-size: 11px; line-height: 1.2; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .shade.is-out .shade__dot { opacity: .45; background-image: linear-gradient(135deg, transparent 47%, var(--ink-70) 48%, var(--ink-70) 52%, transparent 53%); } .shade.is-out .shade__code { color: var(--ink-70); } .shade.is-text { width: auto; padding: 0; } .shade__pill { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; border: 1px solid var(--line); border-radius: var(--r-s); font-size: 14px; } .shade.is-text[aria-checked="true"] { border-color: transparent; } .shade.is-text[aria-checked="true"] .shade__pill { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); } .shades__meta { display: flex; flex-wrap: wrap; gap: 4px 16px; min-height: 20px; margin-top: var(--s3); font-size: 13px; color: var(--ink-70); } .shades__meta .is-in { color: var(--ok); } .shades__meta .is-out { color: var(--sale); } .shades__help { display: inline-block; margin-top: var(--s2); font-size: 13px; text-decoration: underline; text-underline-offset: 3px; } .pdp__buy { padding: var(--s4) 0; border-top: 1px solid var(--line); } .pdp__buy.has-swatches table.variations, .pdp__buy .reset_variations, .pdp__buy .woocommerce-variation-availability, .pdp__buy .woocommerce-variation-description { display: none !important; } .pdp__buy table.variations { width: 100%; border-collapse: collapse; margin-bottom: var(--s3); } .pdp__buy table.variations th, .pdp__buy table.variations td { display: block; padding: 0 0 var(--s2); text-align: left; } .pdp__buy select { width: 100%; height: 48px; padding: 0 12px; border: 1px solid var(--field); border-radius: var(--r-s); background: var(--white); } .pdp__buy .woocommerce-variation-price { margin-bottom: var(--s3); font-weight: 600; } .pdp__buy .woocommerce-variation-price .price { font-size: 18px; } .pdp__buy form.cart, .pdp__buy .woocommerce-variation-add-to-cart { display: flex; gap: var(--s2); align-items: stretch; flex-wrap: wrap; } .pdp__buy form.variations_form { display: block; } .pdp__buy .quantity input { width: 72px; height: 52px; border: 1px solid var(--field); border-radius: var(--r-s); text-align: center; } .pdp__buy .added_to_cart { display: none !important; } .pdp__buy .single_add_to_cart_button { flex: 1; white-space: nowrap; min-height: 52px; font-size: 16px; } .pdp__buy .single_add_to_cart_button.disabled { background: var(--ink); border-color: var(--ink); color: var(--white); opacity: .55; } .pdp__buy .single_add_to_cart_button.loading { opacity: .7; cursor: progress; } .pdp__buy .stock.out-of-stock { color: var(--sale); font-weight: 600; } .pdp__added { margin-top: var(--s3); font-size: 14px; color: var(--ok); } .pdp__delivery { display: flex; align-items: center; gap: 10px; padding: var(--s3) var(--s4); background: var(--sand-50); border-radius: var(--r-s); font-size: 14px; } .pdp__delivery svg { flex: none; } .pdp__sku { margin-top: var(--s4); font-size: 13px; color: var(--ink-70); } .accordion { margin-top: var(--s5); border-top: 1px solid var(--line); } .accordion__item { border-bottom: 1px solid var(--line); } .accordion__title { display: flex; justify-content: space-between; align-items: center; padding: 16px 0; font-size: 14px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; list-style: none; } .accordion__title::-webkit-details-marker { display: none; } .accordion__title::after { content: ""; width: 10px; height: 10px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translateY(-3px); transition: transform .15s; } .accordion__item[open] .accordion__title::after { transform: rotate(-135deg) translateY(-2px); } .accordion__body { padding-bottom: var(--s4); font-size: 14px; color: var(--ink-60); overflow-wrap: anywhere; } .pdp__desc { display: grid; gap: var(--s5); margin-top: var(--s8); padding-top: var(--s7); border-top: 1px solid var(--line); } @media (min-width: 900px) { .pdp__desc { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--s7); } } .pdp__desc-title { font-size: var(--fs-h2); margin-top: var(--s2); } .pdp__desc-img { width: 100%; aspect-ratio: 1; object-fit: contain; background: var(--sand-50); margin-top: var(--s4); } .pdp__desc-body { max-width: 68ch; color: var(--ink-60); } .pdp__desc-body img { margin: var(--s4) 0; } .pdp__related { margin-top: var(--s8); } .pdp__reviews { margin-top: var(--s8); } .pdp__reviews .commentlist { list-style: none; padding: 0; } .pdp__reviews input:not([type=checkbox]):not([type=submit]), .pdp__reviews textarea { width: 100%; padding: 10px 12px; border: 1px solid var(--field); border-radius: var(--r-s); } .buybar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: flex; align-items: center; gap: var(--s3); padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom)); background: var(--white); border-top: 1px solid var(--line); transform: translateY(110%); transition: transform .2s; } .buybar.is-visible { transform: none; } .buybar__dot { flex: none; width: 32px; height: 32px; border-radius: 50%; background: var(--c, transparent); } .buybar__dot:not([style]) { display: none; } .buybar__btn { flex: 1; } @media (min-width: 900px) { .buybar { display: none; } } /* ---------- free shipping progress ---------- */ .free-ship { display: grid; gap: 6px; padding: var(--s3) var(--s4); background: var(--sand-50); font-size: 13px; } .free-ship__bar { height: 4px; border-radius: 2px; background: var(--line); overflow: hidden; } .free-ship__bar span { display: block; height: 100%; background: var(--ink); } /* ---------- mini cart drawer ---------- */ .minicart { position: fixed; inset: 0; z-index: 110; background: rgba(51, 63, 72, .4); } .minicart__panel { position: absolute; top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; width: min(100vw, 420px); background: var(--white); transform: translateX(100%); transition: transform .22s ease; } .minicart.is-open .minicart__panel { transform: none; } .minicart__head { display: flex; align-items: center; justify-content: space-between; height: 64px; padding: 0 var(--s4) 0 var(--s5); border-bottom: 1px solid var(--line); } .minicart__title { margin: 0; font-size: 22px; display: flex; align-items: center; gap: 8px; } .minicart__title .cart-count { position: static; } .minicart .widget_shopping_cart_content { display: flex; flex-direction: column; flex: 1; min-height: 0; } .mini-cart__list { list-style: none; margin: 0; padding: 0 var(--s5); flex: 1; overflow-y: auto; } .mini-cart__item { display: grid; grid-template-columns: 72px minmax(0, 1fr) 32px; gap: var(--s3); padding: var(--s4) 0; border-bottom: 1px solid var(--line-soft); transition: opacity .15s; } .mini-cart__item.is-removing { opacity: .4; pointer-events: none; } .mini-cart__img img { width: 72px; height: 72px; object-fit: contain; background: var(--sand-50); } .mini-cart__info { display: flex; flex-direction: column; gap: 2px; font-size: 14px; } .mini-cart__type { font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-70); } .mini-cart__name { font-weight: 600; } .mini-cart__shade { display: inline-flex; align-items: center; gap: 6px; color: var(--ink-70); font-size: 13px; } .mini-cart__shade .shade__dot { width: 14px; height: 14px; } .mini-cart__qty { margin-top: 2px; } .mini-cart__remove { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; color: var(--ink-70); border-radius: var(--r-s); } .mini-cart__remove:hover { background: var(--sand-50); color: var(--ink); } .mini-cart__foot { padding: var(--s4) var(--s5) calc(var(--s4) + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); } .mini-cart__total { display: flex; justify-content: space-between; margin: 0 0 4px; font-size: 16px; } .mini-cart__note { font-size: 13px; color: var(--ink-70); } .mini-cart__buttons { display: grid; gap: var(--s2); } .btn--block { width: 100%; } .mini-cart__empty { padding: var(--s7) var(--s5); text-align: center; } .minicart .free-ship { margin: 0; } /* ---------- search suggestions ---------- */ .header-search { position: relative; } .search-pop { position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 60; min-width: min(92vw, 420px); max-height: min(70vh, 560px); overflow-y: auto; padding: var(--s3) 0; background: var(--white); border: 1px solid var(--line); border-radius: var(--r-m); box-shadow: 0 12px 32px rgba(51, 63, 72, .14); } .search-pop__label { margin: var(--s2) var(--s4) 4px; font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-70); } .search-pop__list { list-style: none; margin: 0; padding: 0; } .search-pop__item { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: var(--s3); align-items: center; padding: 8px var(--s4); text-decoration: none !important; } .search-pop__item:hover, .search-pop__item.is-active, .search-pop__item:focus { background: var(--sand-50); outline: none; } .search-pop__item img, .search-pop__ph { width: 48px; height: 48px; object-fit: contain; background: var(--sand-50); } .search-pop__txt { display: flex; flex-direction: column; min-width: 0; font-size: 14px; } .search-pop__type { font-size: 10px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-70); } .search-pop__name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .search-pop__meta { font-size: 12px; color: var(--ink-70); } .search-pop__price { font-size: 14px; font-weight: 600; white-space: nowrap; } .search-pop__cats { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 var(--s4); } .search-pop__cats .chip span { margin-left: 4px; color: var(--ink-70); } .search-pop__all { display: block; margin: var(--s3) var(--s4) 0; padding-top: var(--s3); border-top: 1px solid var(--line); font-size: 14px; font-weight: 600; text-decoration: underline; text-underline-offset: 4px; } .search-pop__empty { margin: var(--s2) var(--s4); font-size: 14px; color: var(--ink-70); } /* ---------- cart & checkout (WooCommerce blocks) ---------- */ .woocommerce-cart .site-main, .woocommerce-checkout .site-main { padding-bottom: var(--s8); } .wc-block-cart, .wc-block-checkout { font-size: 15px; } .wc-block-components-button:not(.is-link) { min-height: 52px; border-radius: var(--r-s) !important; background: var(--ink) !important; color: var(--white) !important; font-weight: 600 !important; } .wc-block-components-text-input input, .wc-block-components-combobox .components-combobox-control__input, .wc-block-components-select select, .wc-blocks-components-select__select { border-color: var(--field) !important; border-radius: var(--r-s) !important; } .wc-block-components-radio-control__option-checked, .wc-block-components-radio-control-accordion-option--checked-option-highlighted { box-shadow: inset 0 0 0 1.5px var(--ink) !important; } .wc-block-components-totals-item__label, .wc-block-components-title { font-family: var(--sans); } .wc-block-cart__totals-title, .wc-block-components-checkout-step__title { font-family: var(--serif) !important; font-weight: 400 !important; text-transform: none !important; font-size: 22px !important; } .wc-block-components-product-name { font-weight: 600; color: var(--ink); } .wc-block-cart .free-ship, .wc-block-checkout .free-ship { margin-bottom: var(--s4); } /* ---------- my account ---------- */ .woocommerce-account .site-main { padding-bottom: var(--s8); } .woocommerce-account .woocommerce { display: grid; gap: var(--s5); margin-top: var(--s5); } @media (min-width: 900px) { .woocommerce-account.logged-in .woocommerce { grid-template-columns: 240px minmax(0, 1fr); gap: var(--s7); } } .woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); } .woocommerce-MyAccount-navigation li a { display: block; padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 14px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; } .woocommerce-MyAccount-navigation li.is-active a { color: var(--ink); box-shadow: inset 3px 0 0 var(--ink); padding-left: 12px; } .woocommerce-MyAccount-content table, .woocommerce-orders-table { width: 100%; border-collapse: collapse; font-size: 14px; } .woocommerce-MyAccount-content th, .woocommerce-MyAccount-content td { padding: 12px 8px; border-bottom: 1px solid var(--line); text-align: left; } .woocommerce-account .u-columns { display: grid; gap: var(--s6); } @media (min-width: 900px) { .woocommerce-account .u-columns { grid-template-columns: 1fr 1fr; } } .woocommerce-account form .form-row { display: flex; flex-direction: column; gap: 6px; margin: 0 0 var(--s4); } .woocommerce-account form .form-row label { font-size: 14px; font-weight: 600; } .woocommerce-account form .input-text { width: 100%; } .woocommerce-account .woocommerce-Addresses { display: grid; gap: var(--s5); } @media (min-width: 900px) { .woocommerce-account .woocommerce-Addresses { grid-template-columns: 1fr 1fr; } } /* ---------- checkout: parcel locker search ---------- */ .locker-search { position: relative; margin: 0 0 12px; } .locker-search__label { display: block; margin-bottom: 6px; font-size: 14px; font-weight: 600; } .locker-search__field { display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 12px; border: 1px solid var(--field); border-radius: var(--r-s); background: var(--white); } .locker-search__field:focus-within { border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink); } .locker-search__field svg { flex: none; color: var(--ink-70); } .locker-search__field input { flex: 1; min-width: 0; min-height: 46px; border: 0; padding: 0; outline: none; background: none; font-size: 15px; } .locker-search__list { position: absolute; z-index: 20; left: 0; right: 0; top: 100%; max-height: 320px; overflow-y: auto; margin: 4px 0 0; padding: 4px 0; list-style: none; background: var(--white); border: 1px solid var(--line); border-radius: var(--r-m); box-shadow: 0 12px 32px rgba(51, 63, 72, .14); } .locker-search__list li[data-i] { display: flex; flex-direction: column; gap: 2px; padding: 10px 14px; cursor: pointer; font-size: 14px; } .locker-search__list li[data-i] strong { font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-70); } .locker-search__list li[data-i]:hover, .locker-search__list li.is-active { background: var(--sand-50); } .locker-search__list li[aria-selected="true"] { box-shadow: inset 3px 0 0 var(--ink); } .locker-search__more, .locker-search__empty { padding: 10px 14px; font-size: 13px; color: var(--ink-70); } /* ================= Content pages (tpl-content.php, core blocks with c-* classes) ================= */ .c-page { padding-bottom: var(--s8); } .c-page .crumbs { padding-top: 24px; } .c-blocks > * { max-width: calc(var(--container) + 2 * var(--gutter)); margin-inline: auto; padding-inline: var(--gutter); } .c-blocks > * + * { margin-top: var(--s8); } .c-blocks .wp-block-columns { display: grid; gap: var(--s5); margin: 0; } .c-blocks .wp-block-column { min-width: 0; } @media (min-width: 900px) { .c-blocks .wp-block-columns { grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: var(--s7); align-items: center; } .c-cards .wp-block-columns, .c-facts .wp-block-columns { gap: var(--s5); align-items: stretch; } } .c-label { margin: 0 0 var(--s3); font-size: var(--fs-label); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-70); } .c-blocks h1 { font-size: var(--fs-display); line-height: 1.05; margin: 0 0 var(--s4); } .c-blocks h2 { font-size: var(--fs-h2); margin: 0 0 var(--s4); } .c-blocks h3 { font-size: 26px; margin: 0 0 var(--s2); } .c-blocks p { color: var(--ink-60); line-height: 1.65; } .c-blocks a:not(.wp-element-button) { text-decoration: underline; text-underline-offset: 3px; } .c-hero { padding-top: var(--s5); } .c-hero p.c-meta, .c-meta { font-size: 14px; color: var(--ink-70); } .c-hero .wp-block-image img, .c-media img { width: 100%; border-radius: var(--r-m); object-fit: cover; aspect-ratio: 4 / 5; } .c-panel { padding: var(--s6); border-radius: var(--r-m); background: var(--sand-50); } .c-panel > :last-child { margin-bottom: 0; } .c-cta { padding: var(--s7) var(--s6); border-radius: var(--r-m); background: var(--sand-100); } .c-cta .wp-block-columns { align-items: center; } .c-cta h2 { font-size: 30px; margin-bottom: var(--s2); } .c-cta p { margin: 0; } .c-card { height: 100%; display: flex; flex-direction: column; gap: var(--s3); padding: var(--s5) var(--s5) var(--s6); border: 1px solid var(--line); border-radius: var(--r-m); background: var(--white); } .c-card.is-featured { border-color: var(--ink); background: var(--sand-50); } .c-card h3 { margin: 0; } .c-card .c-price { margin: 0; font-family: var(--serif); font-size: 30px; color: var(--ink); } .c-card .c-sub { margin: 0; font-size: 13px; color: var(--ink-70); } .c-card .wp-block-buttons { margin-top: auto; padding-top: var(--s2); } .c-card .wp-block-button, .c-card .wp-block-button__link { width: 100%; } .c-facts { background: var(--sand-50); padding-block: var(--s7); max-width: none !important; } .c-facts > * { max-width: var(--container); margin-inline: auto; } .c-fact { padding-top: var(--s4); border-top: 1px solid var(--ink); } .c-fact .c-num { margin: 0 0 var(--s2); font-family: var(--serif); font-size: 40px; line-height: 1; color: var(--ink); } .c-fact p:last-child { margin: 0; font-size: 15px; } .c-steps { list-style: none; padding: 0; margin: var(--s4) 0; counter-reset: s; display: grid; gap: var(--s3); } .c-steps li { counter-increment: s; display: grid; grid-template-columns: 40px 1fr; gap: var(--s3); color: var(--ink-60); line-height: 1.55; } .c-steps li::before { content: counter(s); font-family: var(--serif); font-size: 26px; color: var(--ink); line-height: 1; } ul.is-style-check { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; } ul.is-style-check li { position: relative; padding-left: 28px; color: var(--ink-60); line-height: 1.5; font-size: 15px; } ul.is-style-check li::before { content: ""; position: absolute; left: 2px; top: 5px; width: 12px; height: 7px; border-left: 2px solid var(--ok); border-bottom: 2px solid var(--ok); transform: rotate(-45deg); } .wp-block-buttons { display: flex; flex-wrap: wrap; gap: var(--s3); } .wp-block-button.is-style-outline .wp-block-button__link { background: var(--white); color: var(--ink); border: 1px solid var(--ink); } .wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--sand-50); } .c-table table { width: 100%; border-collapse: collapse; font-size: 15px; } .c-table th, .c-table td { padding: 16px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; } .c-table thead th { background: var(--sand-50); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; border-bottom: 0; } .c-table tbody th, .c-table tbody td:first-child { font-weight: 600; } @media (max-width: 699px) { .c-table { overflow-x: auto; } .c-table table { min-width: 560px; } } .c-faq .wp-block-details { border-bottom: 1px solid var(--line); padding: 0; } .c-faq .wp-block-details summary { padding: 18px 28px 18px 0; font-weight: 600; cursor: pointer; list-style: none; position: relative; } .c-faq .wp-block-details summary::-webkit-details-marker { display: none; } .c-faq .wp-block-details summary::after { content: ""; position: absolute; right: 4px; top: 22px; width: 9px; height: 9px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); transition: transform .15s; } .c-faq .wp-block-details[open] summary::after { transform: rotate(-135deg); top: 26px; } .c-faq .wp-block-details > p { margin: 0 0 18px; } .c-contact p { margin: 0 0 4px; } .c-contact .c-big { font-size: 18px; color: var(--ink); } /* form */ .c-form__grid { display: grid; gap: var(--s4); } @media (min-width: 700px) { .c-form__grid { grid-template-columns: 1fr 1fr; } .c-form__grid .is-wide { grid-column: 1 / -1; } } .c-form__field { display: flex; flex-direction: column; gap: 6px; margin: 0; } .c-form__field label { font-size: 14px; font-weight: 600; color: var(--ink); } .c-form__field input, .c-form__field select, .c-form__field textarea { width: 100%; } .c-form__field textarea { padding: 12px 14px; } .c-form__consent { margin: 0; font-size: 13px; } .c-form__consent label { display: flex; gap: 10px; align-items: flex-start; } .c-form__consent input { margin-top: 2px; width: 18px; height: 18px; } .c-form__grid > p:last-child { margin: 0; } .c-form__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; } .c-form__notice { padding: 14px 16px; border-radius: var(--r-s); margin-bottom: var(--s4); } .c-form__notice.is-ok { background: #EAF2EC; color: var(--ok); } .c-form__notice.is-error { background: #F7E6E4; color: var(--sale); } /* content pages: refinements */ .c-blocks > .c-cta, .c-blocks > .c-panel { width: calc(100% - 2 * var(--gutter)); max-width: var(--container); padding: var(--s6) var(--s5); } @media (min-width: 900px) { .c-blocks > .c-cta, .c-blocks > .c-panel { padding: var(--s7) var(--s7); } } @media (min-width: 900px) { .c-section .wp-block-columns, .c-contact .wp-block-columns, .c-panel .wp-block-columns { align-items: start; } } .c-hero .wp-block-buttons { margin: var(--s5) 0 var(--s3); } .c-panel .c-price { margin: var(--s2) 0 0; font-family: var(--serif); font-size: 26px; color: var(--ink); } .c-panel h3 { margin-bottom: var(--s3); } /* legal text pages (privātuma politika, lietošanas noteikumi): one readable column */ .c-hero:has(+ .c-legal) { max-width: calc(780px + 2 * var(--gutter)); } .c-blocks > .c-legal { max-width: calc(780px + 2 * var(--gutter)); margin-top: var(--s6); } .c-legal h2 { font-size: 26px; margin: var(--s6) 0 var(--s3); } .c-legal h2:first-child { margin-top: 0; } .c-legal p, .c-legal li { font-size: 16px; line-height: 1.7; color: var(--ink-60); } .c-legal ul { margin: 0 0 var(--s4); padding-left: 1.2em; display: grid; gap: 8px; } .c-legal li::marker { color: var(--ink-70); } .c-legal strong { color: var(--ink); } .c-legal .c-table { margin: var(--s3) 0 var(--s4); } .c-legal .c-table td, .c-legal .c-table th { font-size: 14px; } .c-legal .c-table tbody td:first-child { font-weight: 400; color: var(--ink); } /* Video banner (paese/video-banner) */ .p-video { position: relative; width: 100%; height: var(--hm, 280px); overflow: hidden; background: #211D1B; max-width: none !important; padding: 0 !important; } .p-video video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; } @media (min-width: 768px) { .p-video { height: var(--h, 500px); } } .c-blocks > .p-video + * { margin-top: var(--s6); } /* Instagram profile card (paese/instagram-card) */ .p-insta { display: flex; flex-direction: column; gap: var(--s4); padding: var(--s5); border: 1px solid var(--line); border-radius: var(--r-m); background: var(--white); color: var(--ink); text-decoration: none !important; transition: border-color .15s, box-shadow .15s; } .p-insta:hover { border-color: var(--ink); box-shadow: 0 8px 24px rgba(51, 63, 72, .08); } .p-insta__head { display: flex; align-items: center; gap: var(--s3); flex-wrap: wrap; } .p-insta__avatar { flex: none; width: 56px; height: 56px; border-radius: 50%; overflow: hidden; background: var(--ink); box-shadow: 0 0 0 2px var(--white), 0 0 0 3.5px var(--sand); } .p-insta__avatar img { width: 100%; height: 100%; object-fit: cover; } .p-insta__logo { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; color: var(--white); font-family: var(--serif); font-size: 26px; } .p-insta__id { display: flex; flex-direction: column; gap: 1px; min-width: 0; } .p-insta__name { font-size: 16px; } .p-insta__handle, .p-insta__followers { font-size: 13px; color: var(--ink-70); } .p-insta__followers strong { color: var(--ink); } .p-insta__cta { margin-left: auto; font-size: 14px; font-weight: 600; white-space: nowrap; } .p-insta__text { font-size: 15px; color: var(--ink-60); } .p-insta__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; } .p-insta__img { display: block; aspect-ratio: 4 / 5; overflow: hidden; border-radius: var(--r-s); background: var(--sand-50); } .p-insta__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; } .p-insta:hover .p-insta__img img { transform: scale(1.03); } @media (max-width: 479px) { .p-insta__cta { margin-left: 0; width: 100%; } } .c-hero .wp-block-image img, .c-media img { aspect-ratio: 4 / 5; } /* ================= Service page (old /makeup layout, brand book colours) ================= */ .c-pill { display: inline-flex; align-self: flex-start; margin: 0 0 var(--s3); padding: 5px 10px; border-radius: 999px; background: var(--sand-100); color: var(--ink); font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; } .c-duo .wp-block-columns { align-items: stretch; } .c-duo .c-card { padding: var(--s6) var(--s5); gap: var(--s3); border-radius: var(--r-m); box-shadow: 0 1px 2px rgba(51, 63, 72, .04); } @media (min-width: 900px) { .c-duo .c-card { padding: var(--s6); } } .c-duo .c-card h2 { font-size: clamp(28px, 2.6vw, 36px); margin: 0; } .c-card.is-dark { background: var(--ink); border-color: var(--ink); color: var(--white); } .c-card.is-dark h2, .c-card.is-dark h3, .c-card.is-dark strong, .c-card.is-dark summary { color: var(--white); } .c-card.is-dark p, .c-card.is-dark li { color: rgba(255, 255, 255, .82); } .c-card.is-dark .c-pill { background: rgba(223, 192, 164, .18); color: var(--sand); } .c-card.is-dark ul.is-style-check li::before { border-color: var(--sand); } .c-card.is-dark .wp-block-button__link { background: var(--white); border-color: var(--white); color: var(--ink); } .c-card.is-dark .wp-block-button__link:hover { background: var(--sand-50); } .c-prices { margin: var(--s2) 0; } .c-prices table { width: 100%; border-collapse: collapse; } .c-prices td { padding: 12px 0; border-top: 1px solid var(--line); vertical-align: middle; font-size: 15px; } .c-prices tr:last-child td { border-bottom: 1px solid var(--line); } .c-prices td:last-child { text-align: right; font-family: var(--serif); font-size: 30px; white-space: nowrap; color: var(--ink); } .c-prices em { display: block; font-style: normal; font-size: 12px; color: var(--ink-70); } .c-card.is-dark .c-prices td { border-color: rgba(255, 255, 255, .16); color: var(--white); } .c-card.is-dark .c-prices td:last-child { color: var(--white); } .c-card.is-dark .c-prices em { color: rgba(255, 255, 255, .65); } .c-note { margin: var(--s2) 0 0; padding: 12px 14px; border: 1px solid rgba(223, 192, 164, .45); border-radius: var(--r-s); background: rgba(223, 192, 164, .12); font-size: 14px; } .c-note strong { font-family: var(--serif); font-size: 20px; color: var(--sand) !important; margin-right: 4px; } .c-card:not(.is-dark) .c-note strong { color: var(--ink) !important; } .c-duo + .c-meta, .c-duo .c-meta { margin-top: var(--s3); } .c-head { max-width: 760px; } .c-head h2 { font-size: var(--fs-h1); } .c-media { position: relative; margin: 0; } .c-media figcaption { position: absolute; left: 14px; bottom: 14px; margin: 0; padding: 7px 12px; border-radius: 999px; background: var(--white); color: var(--ink); font-size: 12px; font-weight: 600; } .c-choose { height: 100%; display: flex; flex-direction: column; justify-content: center; padding: var(--s6) var(--s5); border: 1px solid var(--line); border-radius: var(--r-m); background: var(--white); } @media (min-width: 900px) { .c-choose { padding: var(--s7); } } .c-choose h3 { font-family: var(--sans); font-weight: 600; font-size: 20px; } .c-band { max-width: none !important; padding-block: var(--s8); background: var(--sand-50); } .c-band > * { max-width: var(--container); margin-inline: auto; } .c-band > * + * { margin-top: var(--s5); } .c-chips { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; padding: 0; margin: var(--s2) 0; } .c-chips li { padding: 6px 12px; border: 1px solid rgba(255, 255, 255, .35); border-radius: 999px; font-size: 13px; font-weight: 600; color: var(--white) !important; } .c-card.is-dark .wp-block-details { margin-top: var(--s3); padding-top: var(--s3); border-top: 1px solid rgba(255, 255, 255, .16); } .c-card.is-dark .wp-block-details summary { cursor: pointer; font-weight: 600; } .c-card.is-dark .wp-block-details p { margin: var(--s2) 0 0; font-size: 14px; } .c-small { font-size: 13px !important; } .c-card .c-price-line { font-family: var(--serif); font-size: 26px; color: inherit; margin: var(--s2) 0 0; } /* Service picker (paese/service-picker) */ .p-picker { display: flex; flex-direction: column; gap: var(--s3); } .p-picker__set { margin: 0; padding: 0; border: 0; display: grid; gap: 10px; } .p-picker__legend { margin-bottom: 10px; padding: 0; font-size: 14px; font-weight: 600; } .p-picker__opt { position: relative; display: block; cursor: pointer; } .p-picker__opt input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; } .p-picker__body { display: flex; align-items: center; justify-content: space-between; gap: var(--s3); min-height: 64px; padding: 12px 16px; border: 1px solid var(--field); border-radius: var(--r-s); transition: border-color .15s, box-shadow .15s, background-color .15s; } .p-picker__opt input:checked + .p-picker__body { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); background: var(--sand-50); } .p-picker__opt input:focus-visible + .p-picker__body { outline: 2px solid var(--ink); outline-offset: 2px; } .p-picker__name { display: flex; flex-direction: column; font-weight: 600; font-size: 15px; } .p-picker__name small { font-weight: 400; font-size: 12px; color: var(--ink-70); } .p-picker__price { font-family: var(--serif); font-weight: 400; font-size: 26px; white-space: nowrap; } .p-picker__btn { min-height: 52px; } .p-picker__note { margin: 0; font-size: 13px; color: var(--ink-70); } .c-prices table, .c-prices td, .c-prices th { border-left: 0 !important; border-right: 0 !important; } .c-prices table { border: 0 !important; } .c-prices td { padding-inline: 0 !important; } .c-blocks a.btn, .c-blocks .p-insta, .c-blocks .p-insta * { text-decoration: none !important; } .c-band .c-card .wp-block-buttons { margin-top: var(--s3); } .c-band .c-card { justify-content: flex-start; } .c-prices td { border-bottom: 0 !important; border-top: 1px solid var(--line) !important; } .c-prices tr:last-child td { border-bottom: 1px solid var(--line) !important; } .c-card.is-dark .c-prices td { border-top-color: rgba(255, 255, 255, .16) !important; } .c-card.is-dark .c-prices tr:last-child td { border-bottom-color: rgba(255, 255, 255, .16) !important; } .c-section > .p-insta, .c-section > .wp-block-columns + * { margin-top: var(--s5); } .p-insta__avatar:has(img) { background: none; box-shadow: none; } /* ================= Checkout: minimal header + 3-step wizard ================= */ .checkout-header .header-row { justify-content: space-between; } .checkout-header__secure { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--ink-70); } .checkout-header__secure svg { color: var(--ok); } .checkout-header__secure a { text-decoration: underline; text-underline-offset: 3px; } @media (max-width: 599px) { .checkout-header__secure a, .checkout-header__secure > span { display: none; } } .wiz-bar { list-style: none; margin: 0 0 var(--s5); padding: 0; display: flex; gap: var(--s2); } .wiz-bar li { flex: 1; display: flex; align-items: center; gap: var(--s2); } .wiz-bar li:not(:last-child)::after { content: ""; flex: 1; height: 1px; background: var(--line); min-width: 12px; } .wiz-bar button { display: inline-flex; align-items: center; gap: 10px; padding: 4px 0; border: 0; background: none; font: inherit; color: var(--ink-70); cursor: pointer; text-align: left; } .wiz-bar button:disabled { cursor: default; opacity: 1; } .wiz-bar__num { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; border: 1.5px solid var(--field); background: var(--white); font-size: 14px; font-weight: 600; } .wiz-bar__label { font-size: 15px; font-weight: 500; } .wiz-bar li.is-current button, .wiz-bar li.is-done button { color: var(--ink); } .wiz-bar li.is-current .wiz-bar__label { font-weight: 600; } .wiz-bar li.is-current .wiz-bar__num, .wiz-bar li.is-done .wiz-bar__num { background: var(--ink); border-color: var(--ink); color: var(--white); } .wiz-bar li.is-done button:hover .wiz-bar__label { text-decoration: underline; text-underline-offset: 3px; } @media (max-width: 599px) { .wiz-bar__label { font-size: 12px; } .wiz-bar__num { width: 28px; height: 28px; font-size: 13px; } .wiz-bar { gap: 6px; } .wiz-bar button { flex-direction: column; gap: 4px; text-align: center; } .wiz-bar li:not(:last-child)::after { margin-bottom: 18px; } } .is-wizard[data-wiz-current="1"] [data-wiz-step]:not([data-wiz-step="1"]), .is-wizard[data-wiz-current="2"] [data-wiz-step]:not([data-wiz-step="2"]), .is-wizard[data-wiz-current="3"] [data-wiz-step]:not([data-wiz-step="3"]) { display: none !important; } .wiz-done { display: flex; justify-content: space-between; gap: var(--s4); margin-bottom: var(--s4); padding: 14px 18px; border: 1px solid var(--line); border-radius: var(--r-m); background: var(--sand-50); font-size: 14px; } .wiz-done__body { display: flex; flex-direction: column; gap: 3px; min-width: 0; } .wiz-done__title { font-size: 12px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-70); } .wiz-done__muted { color: var(--ink-70); } .wiz-done__edit { align-self: flex-start; padding: 4px; border: 0; background: none; font: 600 14px var(--sans); color: var(--ink); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; } .wiz-nav { display: flex; gap: var(--s3); margin: var(--s5) 0 var(--s4); } .wiz-nav .btn { min-height: 52px; } .wiz-nav__next { flex: 1; } .wc-block-checkout__actions_row .wiz-nav { margin: 0; } .is-wizard[data-wiz-current="3"] .wc-block-checkout__actions_row { display: flex; gap: var(--s3); align-items: stretch; } .is-wizard[data-wiz-current="3"] .wc-block-components-checkout-place-order-button { flex: 1; } .wiz-missing select { border-color: var(--sale) !important; box-shadow: 0 0 0 1px var(--sale); } /* ------------------------------------------------------------------ order page (thank-you / Mans konts → pasūtījums) */ .page-head:has(+ .blocks .ord--thankyou) { display: none; } .ord { container-type: inline-size; padding-top: var(--s6); } .ord--account { padding-top: 0; } .ord__hero { display: flex; flex-direction: column; gap: 14px; } .ord__check { flex: none; width: 56px; height: 56px; border-radius: 50%; background: #E8EFE9; color: var(--ok); display: inline-flex; align-items: center; justify-content: center; } .ord__title { margin: 0; font-family: var(--serif); font-weight: 400; font-size: 34px; line-height: 1.08; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; } .ord__meta { margin: 8px 0 0; font-size: 14px; color: var(--ink-70); overflow-wrap: anywhere; } .ord__meta b { color: var(--ink); font-weight: 600; } .ord__acc .ord__meta { margin: 4px 0 0; display: flex; align-items: center; gap: 12px; } .ord .nowrap { white-space: nowrap; } .ord__back { display: inline-block; margin-bottom: 6px; font-size: 14px; color: var(--ink-70); } .ord__pill { font-family: var(--sans); font-size: 12px; font-weight: 600; letter-spacing: .04em; padding: 5px 10px; border-radius: 999px; background: var(--sand-100); color: var(--ink); } .ord__pill--completed, .ord__pill--processing, .ord__pill--paese-shipping { background: #E8EFE9; color: var(--ok); } .ord__pill--cancelled, .ord__pill--failed, .ord__pill--refunded { background: var(--rose-100); color: var(--sale); } .ord-steps { list-style: none; margin: 24px 0 0; padding: 20px 18px 4px; border-radius: 12px; background: var(--sand-50); } .ord-steps__item { position: relative; display: flex; gap: 14px; padding-bottom: 18px; } .ord-steps__item:not(:last-child)::after { content: ""; position: absolute; left: 12px; top: 28px; bottom: 2px; width: 1.5px; background: var(--line); } .ord-steps__item.is-done:not(:last-child)::after { background: var(--ok); } .ord-steps__dot { flex: none; width: 26px; height: 26px; border-radius: 50%; box-sizing: border-box; border: 1.5px solid var(--field); background: var(--white); color: var(--white); display: inline-flex; align-items: center; justify-content: center; } .ord-steps__item.is-done .ord-steps__dot { background: var(--ok); border-color: var(--ok); } .ord-steps__item.is-current .ord-steps__dot { border-color: var(--ink); box-shadow: inset 0 0 0 5px var(--white), inset 0 0 0 12px var(--ink); } .ord-steps__text { display: flex; flex-direction: column; font-size: 13px; color: var(--ink-70); } .ord-steps__text b { font-size: 14px; font-weight: 500; color: var(--ink); } .ord-steps__item.is-done b, .ord-steps__item.is-current b { font-weight: 600; } .ord-note { margin: 24px 0 0; padding: 16px 18px; border-radius: 12px; background: var(--sand-50); display: flex; flex-wrap: wrap; align-items: center; gap: 12px; } .ord-note__spin { flex: none; width: 18px; height: 18px; border: 2px solid var(--line); border-top-color: var(--ink); border-radius: 50%; animation: ord-spin .8s linear infinite; } .ord-note:not(.ord-note--await) .ord-note__spin { display: none; } @keyframes ord-spin { to { transform: rotate(360deg); } } @media (prefers-reduced-motion: reduce) { .ord-note__spin { animation-duration: 2.4s; } } .ord__grid { display: flex; flex-direction: column; gap: 14px; margin-top: 24px; } .ord__aside { display: contents; } .ord-card--pay { order: 1; } .ord-card--ship { order: 2; } .ord__items { order: 3; margin-top: 16px; } .ord-card--buyer { order: 4; } .ord__actions { order: 5; } .ord__head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding-bottom: 6px; } .ord__head h2 { margin: 0; font-family: var(--serif); font-weight: 400; font-size: 26px; } .ord__head span { font-size: 13px; color: var(--ink-70); } .ord-items { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid var(--line); } .ord-item { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 4px 14px; padding: 18px 0; border-top: 1px solid var(--line); } .ord-item__img { grid-row: span 2; width: 72px; height: 72px; border-radius: 10px; overflow: hidden; background: #F4EEE8; display: block; } .ord-item__img img { width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; } .ord-item__body { display: flex; flex-direction: column; gap: 4px; min-width: 0; } .ord-item__type { font-size: 10px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-70); } .ord-item__name { font-size: 15px; font-weight: 500; color: var(--ink); text-decoration: none; } a.ord-item__name:hover { text-decoration: underline; text-underline-offset: 3px; } .ord-item__meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 13px; color: var(--ink-70); } .ord-item__shade { display: inline-flex; align-items: center; gap: 6px; } .ord-item__shade i { width: 12px; height: 12px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08); } .ord-item__side { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 6px; } .ord-item__total { font-size: 15px; font-weight: 600; } .btn--review { min-height: 40px; padding: 0 16px; font-size: 13px; gap: 7px; } .btn--review svg { color: var(--sand); } .ord-item__reviewed { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--ok); } .ord__hint { margin: 14px 0 0; font-size: 13px; color: var(--ink-70); } .ord__head { flex-wrap: wrap; } .ord__reorder-all { margin-left: auto; } .ord-item__side form { margin: 0; } .btn--reorder { min-height: 40px; padding: 0 16px; font-size: 13px; gap: 7px; white-space: nowrap; } .ord-item__side:has(.ord-item__reorder) { flex-wrap: wrap; } .ord-item__gone { font-size: 13px; color: var(--ink-70); } @container (min-width: 560px) { .ord-item__side { gap: 8px; } } .ord-card { border: 1px solid var(--line); border-radius: 12px; padding: 20px; } .ord-card--pay { background: var(--sand-50); border-color: var(--line-soft); } .ord-card__label { margin: 0 0 14px; font-family: var(--sans); font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-70); } .ord-card__note { margin: 14px 0 0; padding-top: 14px; border-top: 1px solid var(--line); font-size: 13px; color: var(--ink-70); } .ord-sum { margin: 0; display: flex; flex-direction: column; gap: 10px; font-size: 14px; } .ord-sum > div { display: flex; justify-content: space-between; gap: 16px; } .ord-sum dt { color: var(--ink-70); } .ord-sum dd { margin: 0; text-align: right; } .ord-sum dd.is-free { color: var(--ok); font-weight: 600; } .ord-sum__total { padding-top: 12px; border-top: 1px solid var(--line); align-items: baseline; } .ord-sum__total dt { color: var(--ink); font-size: 16px; font-weight: 600; } .ord-sum__total dd { font-family: var(--serif); font-size: 28px; } .ord-sum__tax { margin: 2px 0 0; text-align: right; font-size: 12px; color: var(--ink-70); } .ord-pay { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); font-size: 14px; } .ord-pay__brand { height: 26px; padding: 0 8px; border-radius: 5px; border: 1px solid var(--line); background: var(--white); display: inline-flex; align-items: center; font-size: 11px; font-weight: 700; letter-spacing: .04em; color: #1A1F71; } .ord-pay__status { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--ok); } .ord-pay__status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; } .ord-pay__status.is-wait { color: var(--warn); } .ord-pay__status.is-muted { color: var(--ink-70); } .ord-ship { display: flex; gap: 12px; font-size: 14px; } .ord-ship > div, .ord-buyer { display: flex; flex-direction: column; gap: 3px; font-size: 14px; overflow-wrap: anywhere; } .ord-ship b, .ord-buyer b { font-weight: 600; } .ord-ship__icon { flex: none; width: 36px; height: 36px; border-radius: 8px; background: #F4EEE8; display: inline-flex; align-items: center; justify-content: center; } .ord .is-muted { color: var(--ink-70); } .ord__actions { margin-top: 10px; } .ord__buttons { display: flex; flex-direction: column; gap: 10px; } .ord__help { margin: 24px 0 0; padding-top: 20px; border-top: 1px solid var(--line); display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--ink-70); } .ord__help svg { flex: none; margin-top: 2px; } .ord-notes { margin-top: 40px; } .ord-notes h2 { font-family: var(--serif); font-weight: 400; font-size: 24px; } .ord-notes ol { list-style: none; margin: 0; padding: 0; } .ord-notes li { padding: 14px 0; border-top: 1px solid var(--line); font-size: 14px; } .ord-notes time { font-size: 12px; color: var(--ink-70); } .ord-notes p { margin: 4px 0 0; } @container (min-width: 560px) { .ord-item { grid-template-columns: 88px minmax(0, 1fr) auto; align-items: center; gap: 20px; } .ord-item__img { grid-row: auto; width: 88px; height: 88px; } .ord-item__name { font-size: 16px; } .ord-item__side { flex-direction: column; align-items: flex-end; margin: 0; } .ord__buttons { flex-direction: row; } } @container (min-width: 760px) { .ord__hero { flex-direction: row; align-items: center; gap: 24px; } .ord__title { font-size: 44px; } .ord--account .ord__title { font-size: 36px; } .ord__meta { font-size: 16px; } .ord-steps { display: flex; padding: 24px 28px; margin-top: 36px; } .ord-steps__item { flex: 1; padding: 0; gap: 12px; } .ord-steps__item:last-child { flex: 0 0 auto; } .ord-steps__item:not(:last-child)::after { position: static; flex: 1; height: 1.5px; width: auto; margin: 12px 14px 0; min-width: 16px; } .ord-steps__text { white-space: nowrap; } } @container (min-width: 980px) { .ord__grid { display: grid; grid-template-columns: minmax(0, 1fr) 400px; grid-template-areas: "items aside" "actions aside"; grid-template-rows: auto 1fr; column-gap: 56px; row-gap: 0; align-items: start; margin-top: 40px; } .ord__items { grid-area: items; margin: 0; } .ord__aside { grid-area: aside; display: flex; flex-direction: column; gap: 16px; } .ord__actions { grid-area: actions; margin-top: 32px; } .ord__head h2 { font-size: 30px; } .ord-card { padding: 22px 24px; } } /* Photo hero (.c-hero--photo): full photo background, ink gradient on the text side. Image set per page via --hero-d / --hero-m. */ .c-blocks > .c-hero--photo { position: relative; width: calc(100% - 2 * var(--gutter)); max-width: var(--container); min-height: 560px; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; padding: var(--s7) var(--s5); border-radius: var(--r-m); overflow: hidden; background: var(--ink) var(--hero-m) 50% 0 / cover no-repeat; color: var(--white); isolation: isolate; } .c-hero--photo::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(36, 44, 51, .94) 0%, rgba(36, 44, 51, .78) 42%, rgba(36, 44, 51, .1) 72%, rgba(36, 44, 51, 0) 100%); } .c-hero--photo > * { max-width: 560px; margin: 0; } .c-hero--photo .c-label { color: var(--sand); } .c-hero--photo h1 { color: var(--white); } .c-hero--photo p { color: rgba(255, 255, 255, .88); } .c-hero--photo p.c-meta { color: rgba(255, 255, 255, .72); } .c-hero--photo .wp-block-button:not(.is-style-outline) .wp-block-button__link { background: var(--sand); color: var(--ink); border-color: var(--sand); } .c-hero--photo .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover { background: var(--white); border-color: var(--white); } .c-hero--photo .wp-block-button.is-style-outline .wp-block-button__link { background: transparent; color: var(--white); border-color: rgba(255, 255, 255, .7); } .c-hero--photo .wp-block-button.is-style-outline .wp-block-button__link:hover { background: rgba(255, 255, 255, .12); } @media (max-width: 599px) { .c-hero--photo .wp-block-button, .c-hero--photo .wp-block-button__link { width: 100%; text-align: center; } } @media (min-width: 900px) { .c-blocks > .c-hero--photo { min-height: 600px; justify-content: center; padding: var(--s8) var(--s8); background-image: var(--hero-d); background-position: 100% 30%; } .c-hero--photo::before { background: linear-gradient(90deg, rgba(36, 44, 51, .92) 0%, rgba(36, 44, 51, .78) 34%, rgba(36, 44, 51, .2) 62%, rgba(36, 44, 51, 0) 82%); } } .c-hero--partners { --hero-d: url(../img/partners-hero.webp); --hero-m: url(../img/partners-hero-m.webp); } @media (max-width: 899px) { .c-blocks > .c-hero--photo { min-height: 0; padding-top: 78vw; background-size: 100% auto; } .c-hero--photo::before { background: linear-gradient(0deg, rgba(36, 44, 51, 1) 0%, rgba(36, 44, 51, .96) 55%, rgba(36, 44, 51, .2) 80%, rgba(36, 44, 51, 0) 100%); } } /* ------------------------------------------------------------------ gift card (Dāvanu karte) */ .gc__visual { min-width: 0; display: flex; flex-direction: column; gap: var(--s4); } @media (min-width: 900px) { .gc__visual { position: sticky; top: calc(var(--header-h) + 64px); } } .gc__stage { display: flex; justify-content: center; padding: clamp(28px, 6vw, 64px) clamp(16px, 4vw, 48px); border-radius: var(--r-s); background: var(--sand-50); } .gc-card { --gc-bg: #333F48; --gc-fg: #F6EFE8; --gc-accent: #DFC0A4; position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; width: 100%; max-width: 500px; aspect-ratio: 1.6 / 1; padding: clamp(18px, 4vw, 30px) clamp(20px, 4vw, 32px); border-radius: 16px; background: var(--gc-bg); color: var(--gc-fg); box-shadow: 0 24px 48px -24px rgba(51, 63, 72, .45); transition: background .2s, color .2s; } .gc-card__ring { position: absolute; right: -60px; top: -60px; width: 220px; height: 220px; border: 1px solid var(--gc-accent); border-radius: 50%; opacity: .6; } .gc-card__ring--s { right: -20px; top: -20px; width: 140px; height: 140px; } .gc-card__top, .gc-card__row { position: relative; display: flex; justify-content: space-between; align-items: flex-start; gap: var(--s4); } .gc-card__row { align-items: flex-end; } .gc-card__logo { font-family: var(--serif); font-size: clamp(20px, 3vw, 28px); letter-spacing: .2em; } .gc-card__label { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--gc-accent); } .gc-card__bottom { position: relative; display: flex; flex-direction: column; gap: 6px; } .gc-card__greeting { display: flex; flex-direction: column; gap: 2px; max-width: 75%; } .gc-card__greeting[hidden] { display: none; } .gc-card__message { font-family: var(--serif); font-style: italic; font-size: clamp(13px, 2vw, 16px); line-height: 1.35; overflow-wrap: anywhere; } .gc-card__from { font-size: 12px; opacity: .8; } .gc-card__amount { font-family: var(--serif); font-size: clamp(40px, 7vw, 64px); line-height: 1; } .gc-card__code { font-size: 12px; letter-spacing: .12em; opacity: .75; white-space: nowrap; } .gc__facts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s3); font-size: 13px; color: var(--ink-60); } .gc__facts li { padding: 14px; border: 1px solid var(--line); border-radius: var(--r-s); } .gc__facts strong { color: var(--ink); } @media (max-width: 599px) { .gc__facts { grid-template-columns: 1fr; } } .gc__price { font-size: 26px; font-weight: 500; margin-bottom: var(--s3); } .gc-form { display: flex; flex-direction: column; gap: var(--s5); } .gc-field { margin: 0; padding: 0; border: 0; min-width: 0; } /* floated legend: takes part in normal flow, so its margin works */ .gc-field__legend { float: left; width: 100%; padding: 0; margin: 0 0 var(--s3); font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; } .gc-field > :not(legend) { clear: both; } .gc-field > :not(legend) + :not(legend) { margin-top: var(--s3); } .gc-pills { display: flex; flex-wrap: wrap; gap: 10px; } .gc-pill { position: relative; } .gc-pill input, .gc-design input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; } .gc-pill span { display: inline-flex; align-items: center; justify-content: center; min-width: 72px; min-height: 48px; padding: 0 18px; border: 1px solid var(--field); border-radius: var(--r-s); background: var(--white); font-size: 15px; cursor: pointer; } .gc-pill input:checked + span { background: var(--ink); border-color: var(--ink); color: var(--white); } .gc-pill input:focus-visible + span, .gc-design input:focus-visible ~ .gc-design__swatch { outline: 2px solid var(--ink); outline-offset: 2px; } .gc-custom, .gc-input { display: flex; flex-direction: column; gap: 6px; } .gc-custom { max-width: 260px; } .gc-custom[hidden], .gc-greeting[hidden] { display: none; } .gc-custom label, .gc-input label { font-size: 14px; } .gc-input textarea { min-height: 0; padding: 12px 14px; resize: vertical; font: inherit; font-size: 15px; } .gc-error { font-size: 13px; color: var(--sale); } .gc-muted { color: var(--ink-70); } .gc-designs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s3); } .gc-design { position: relative; display: flex; flex-direction: column; gap: var(--s2); padding: var(--s2); border: 1px solid var(--line); border-radius: 6px; cursor: pointer; } .gc-design:has(input:checked) { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); } .gc-design__swatch { display: flex; align-items: center; justify-content: center; height: 76px; border-radius: 6px; font-family: var(--serif); font-size: 13px; letter-spacing: .18em; } /* fixed height: aspect-ratio inside the fieldset grid mis-measured the row */ @media (max-width: 599px) { .gc-design__swatch { height: 56px; font-size: 11px; } } .gc-design__name { font-size: 13px; text-align: center; } .gc-check { display: flex; align-items: flex-start; gap: 14px; } .gc-check input { flex: none; width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--ink); } .gc-check label { display: flex; flex-direction: column; gap: 4px; cursor: pointer; } .gc-check__title { font-size: 15px; font-weight: 500; } .gc-check__hint { font-size: 13px; line-height: 1.5; color: var(--ink-60); } .gc-check--box { padding: 16px 18px; border: 1px solid var(--line); border-radius: var(--r-s); } .gc-greeting { display: flex; flex-direction: column; gap: 14px; } .gc-submit { width: 100%; min-height: 56px; font-size: 16px; } .gc-note { margin: 0; font-size: 13px; color: var(--ink-70); text-align: center; } .gc-form .gc-submit + .gc-note { margin-top: calc(var(--s3) - var(--s5)); } .gc .pdp__buy { border-top: 0; padding-top: var(--s2); } .gc-how { margin-top: var(--s8); padding-top: var(--s7); border-top: 1px solid var(--line); } .gc-how__title { margin: 0 0 var(--s6); font-family: var(--serif); font-weight: 400; font-size: var(--fs-h2); } .gc-how__steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--s5); } .gc-how__steps li { display: flex; flex-direction: column; gap: var(--s2); font-size: 14px; line-height: 1.6; color: var(--ink-60); } .gc-how__steps strong { font-size: 16px; font-weight: 600; color: var(--ink); } .gc-how__n { font-family: var(--serif); font-size: 36px; line-height: 1; color: #8A6650; } .gc-how__link { margin: var(--s6) 0 0; font-size: 14px; } /* balance check page [paese_gift_card_balance] */ .gc-balance { display: flex; flex-direction: column; gap: var(--s2); max-width: 520px; } .gc-balance label { font-size: 14px; font-weight: 600; } .gc-balance__row { display: flex; gap: var(--s2); } .gc-balance__row input { flex: 1; min-width: 0; letter-spacing: .06em; text-transform: uppercase; } .gc-balance__msg { margin-top: var(--s3); padding: 14px 18px; border-radius: var(--r-s); background: var(--sand-50); } .gc-balance__msg p { margin: 0; } .gc-balance__msg.is-error { background: transparent; padding: 0; color: var(--sale); } .gc-balance__amount { font-size: 18px; } /* checkout / cart: second field in "Pievienot atlaides kodu", totals rows */ .paese-gc { margin-top: var(--s3); } .paese-gc__chip { display: flex; justify-content: space-between; align-items: center; gap: var(--s2); padding: 6px 6px 6px 12px; border: 1px solid var(--line); border-radius: var(--r-s); background: var(--white); } .paese-gc__chip-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; } .paese-gc__chip-label { font-size: 12px; color: var(--ink-60); } .paese-gc__left { font-size: 14px; } .paese-gc__remove { min-height: 44px; padding: 0 10px; border: 0; background: none; font: inherit; font-size: 14px; color: var(--ink); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; } .paese-gc__remove:disabled { opacity: .5; cursor: progress; } .paese-gc .wc-block-components-validation-error { margin-top: 6px; } .paese-gc-on .wc-block-components-totals-footer-item { display: none !important; } .paese-gc-on .wc-block-components-totals-wrapper:has(> .wc-block-components-totals-footer-item) { display: none !important; } .wc-block-components-order-meta .paese-gc-totals { display: flex; flex-direction: column; gap: 14px; padding: var(--s4) !important; border-top: 1px solid var(--line); } .paese-gc-totals__row { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--s4); font-size: 15px; } .paese-gc-totals__label { display: flex; flex-direction: column; gap: 6px; } .paese-gc-totals__vat { font-size: 13px; font-weight: 400; } .paese-gc-totals__row.is-total { font-size: 22px; font-weight: 500; } .paese-gc-totals__row.is-card { padding-top: 14px; border-top: 1px solid var(--line); } .paese-gc-totals__row.is-pay { font-size: 18px; font-weight: 600; } /* Customer account overview: real customer orders, configurable offers, saved wishlist. */ .woocommerce-MyAccount-content { min-width: 0; } .woocommerce-MyAccount-navigation li a { text-transform: none; letter-spacing: 0; font-weight: 500; padding: 15px 14px; } .woocommerce-MyAccount-navigation li.is-active a { background: var(--sand-50); font-weight: 600; } .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--customer-logout { margin-top: 30px; } .pa-account-dashboard { display: flex; flex-direction: column; gap: 32px; } .pa-account-greeting h2 { font-family: var(--serif); font-size: clamp(32px, 3vw, 42px); font-weight: 400; line-height: 1.15; margin: 0 0 8px; } .pa-account-greeting p, .pa-account-section-note { color: var(--ink-70); font-size: 14px; margin: 0; } .pa-account-dashboard section > h2, .pa-account-section-heading h2, .pa-account-help h2 { font: 400 28px/1.15 var(--serif); margin: 0 0 18px; } .pa-account-orders__head, .pa-account-order { display: grid; grid-template-columns: 1fr 1.1fr 1.1fr 1fr 97px; align-items: center; gap: 16px; } .pa-account-orders__head { padding: 14px 16px; border-top: 1px solid var(--line); background: var(--sand-50); color: var(--ink-70); font-size: 12px; } .pa-account-orders__list { list-style: none; padding: 0; margin: 0; } .pa-account-order { padding: 18px 16px; border-bottom: 1px solid var(--line); font-size: 14px; } .pa-account-order__number { font-weight: 600; } .pa-account-order__date { font-size: 13px; color: var(--ink-70); } .pa-account-order__total { font-variant-numeric: tabular-nums; } .pa-account-order__total small { display: block; color: var(--ink-70); font-size: 12px; margin-top: 3px; } .pa-account-status { display: inline-block; font-size: 12px; padding: 5px 9px; background: var(--sand-50); color: var(--ink); } .pa-account-status--processing, .pa-account-status--on-hold, .pa-account-status--pending { color: var(--warn); background: #f5ede1; } .pa-account-status--completed { color: var(--ok); background: #edf3ee; } .pa-account-status--shipping { color: var(--ink-70); background: #edf1f3; } .pa-account-status--cancelled, .pa-account-status--failed { color: var(--sale); background: var(--rose-100); } .pa-account-order__view.btn { min-height: 48px; min-width: 97px; padding: 12px 20px; border-radius: var(--r-xs); font-size: 14px; } .pa-account-orders__all { margin-top: 18px; } .pa-account-empty { border-top: 1px solid var(--line); padding-top: 20px; } .pa-account-empty p { margin: 0 0 16px; } .pa-account-offers .pa-account-section-note { margin-top: -9px; margin-bottom: 18px; } .pa-account-offers__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } .pa-account-offer { display: flex; flex-direction: column; padding: 22px 20px; border: 1px solid var(--line); background: var(--sand-50); min-width: 0; } .pa-account-offer--gift { background: #f6eee5; } .pa-account-offer--class { background: #f0f3ef; border-color: #dfe5dc; } .pa-account-offer__label { font-size: 12px; font-weight: 600; color: var(--ink-70); letter-spacing: .04em; margin: 0 0 24px; } .pa-account-offer h3 { font: 400 27px/1.15 var(--serif); margin: 0 0 14px; } .pa-account-offer__description { font-size: 14px; line-height: 1.6; color: var(--ink-70); margin: 0 0 24px; flex: 1; } .pa-account-offer__action { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-top: 16px; border-top: 1px solid var(--line); font-size: 12px; font-weight: 600; } .pa-account-offer__action svg { flex: none; } .pa-account-offer__action--pending { color: var(--ink-70); flex-wrap: wrap; } .pa-account-offer__action small { font-size: 12px; font-weight: 400; } .pa-account-bottom { display: grid; grid-template-columns: 1.1fr 1fr; gap: 20px; } .pa-account-wishlist, .pa-account-help { padding: 22px; border: 1px solid var(--line); min-width: 0; } .pa-account-help { background: var(--sand-50); } .pa-account-section-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; } .pa-account-section-heading h2, .pa-account-help h2 { font-size: 25px; } .pa-account-section-heading small { font: 13px var(--sans); color: var(--ink-70); } .pa-account-section-heading a { font-size: 12px; white-space: nowrap; } .pa-account-wishlist p, .pa-account-help p { font-size: 14px; line-height: 1.6; color: var(--ink-70); margin: 0; } .pa-account-wishlist__product { display: flex; align-items: center; gap: 14px; font-size: 14px; } .pa-account-wishlist__product img { width: 75px; height: 75px; object-fit: contain; } .pa-account-wishlist__product > span { display: flex; flex-direction: column; gap: 6px; } .pa-account-help > div { display: flex; flex-wrap: wrap; gap: 12px 20px; margin-top: 16px; } .pa-account-help a { font-size: 13px; text-decoration: underline; text-underline-offset: 4px; } .woocommerce-account .woocommerce-orders-table .button.view { background: var(--ink); color: var(--white); border: 1px solid var(--ink); border-radius: var(--r-xs); min-width: 97px; min-height: 48px; display: inline-flex; justify-content: center; align-items: center; padding: 12px 20px; font-size: 14px; text-decoration: none; } .woocommerce-account .woocommerce-orders-table .button.view:hover { background: var(--ink-70); } @media (min-width: 900px) and (max-width: 1199px) { .pa-account-offers__grid { grid-template-columns: 1fr; } .pa-account-bottom { grid-template-columns: 1fr; } } @media (max-width: 899px) { .woocommerce-MyAccount-navigation ul { display: flex; gap: 8px; overflow-x: auto; border: 0; padding: 0 0 6px; } .woocommerce-MyAccount-navigation li { flex: none; } .woocommerce-MyAccount-navigation li a { white-space: nowrap; border: 1px solid var(--line); padding: 10px 12px; } .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--customer-logout { margin-top: 0; } .pa-account-offers__grid, .pa-account-bottom { grid-template-columns: 1fr; } .pa-account-orders__head { display: none; } .pa-account-orders__list { border-top: 1px solid var(--line); } .pa-account-order { grid-template-columns: 1fr auto; gap: 10px 14px; padding: 18px 0; } .pa-account-order__number { grid-column: 1; grid-row: 1; } .pa-account-order__date { grid-column: 1; grid-row: 2; } .pa-account-order__status { grid-column: 2; grid-row: 1; text-align: right; } .pa-account-order__total { grid-column: 1; grid-row: 3; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; } .pa-account-order__total small { margin: 0; } .pa-account-order__view { grid-column: 2; grid-row: 3; } .woocommerce-account .woocommerce-orders-table thead { display: none; } .woocommerce-account .woocommerce-orders-table, .woocommerce-account .woocommerce-orders-table tbody { display: block; width: 100%; } .woocommerce-account .woocommerce-orders-table tr { display: grid; grid-template-columns: 1fr auto; gap: 10px; border-bottom: 1px solid var(--line); padding: 16px 0; } .woocommerce-account .woocommerce-orders-table th, .woocommerce-account .woocommerce-orders-table td { border: 0; padding: 0; min-width: 0; } .woocommerce-account .woocommerce-orders-table .order-status { text-align: right; } .woocommerce-account .woocommerce-orders-table .order-actions { grid-column: 2; text-align: right; } .woocommerce-account .woocommerce-orders-table .order-total { grid-column: 1; } } @media (max-width: 899px) { .woocommerce-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-number { grid-column: 1; grid-row: 1; } .woocommerce-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-date { grid-column: 1; grid-row: 2; } .woocommerce-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-status { grid-column: 2; grid-row: 1; text-align: right; } .woocommerce-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-total { grid-column: 1; grid-row: 3; } .woocommerce-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-actions { grid-column: 2; grid-row: 3; text-align: right; } } @media (max-width: 899px) { .woocommerce-account .woocommerce { grid-template-columns: minmax(0, 1fr); } .woocommerce-MyAccount-navigation { min-width: 0; } } /* Approved reviews and review form */ .review-star { display: inline-block; width: 1em; height: 1em; flex: none; background: var(--sand); clip-path: polygon(50% 0,61.8% 35.1%,98% 34.5%,68.2% 56%,79.4% 90.5%,50% 69%,20.6% 90.5%,31.8% 56%,2% 34.5%,38.2% 35.1%); } .review-stars { display: inline-flex; gap: 3px; font-size: 17px; line-height: 1; } .review-star.is-empty { background: var(--line); } .reviews-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 24px; } .reviews-heading h2 { margin: 6px 0 0; font: 400 var(--fs-h2)/1.1 var(--serif); } .reviews-heading .btn { flex: none; } .reviews-summary { display: grid; grid-template-columns: minmax(140px,.65fr) minmax(260px,1.5fr) minmax(180px,1fr); align-items: center; gap: 40px; padding: 32px; background: var(--sand-50); border: 1px solid var(--line-soft); border-radius: var(--r-m); } .reviews-average__score { display: flex; align-items: center; gap: 10px; } .reviews-average__score .review-star { font-size: 38px; } .reviews-average__score strong { font: 500 48px/1 var(--sans); font-variant-numeric: tabular-nums; } .reviews-average__score>span:last-child { align-self: end; color: var(--ink-70); font-size: 14px; } .reviews-average p { margin: 12px 0 0; color: var(--ink-70); font-size: 14px; } .reviews-distribution { display: grid; gap: 8px; } .reviews-distribution__row { display: grid; grid-template-columns: 98px 1fr 26px; align-items: center; gap: 12px; min-height: 24px; text-decoration: none; border-radius: var(--r-xs); } .reviews-distribution__row:hover, .reviews-distribution__row.is-active { background: var(--sand-100); } .reviews-distribution__row:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; } .reviews-distribution__row .review-stars { font-size: 16px; } .reviews-distribution__count { color: var(--ink-70); text-align: right; font-size: 13px; font-variant-numeric: tabular-nums; } .reviews-bar { height: 7px; background: var(--line-soft); overflow: hidden; border-radius: 2px; } .reviews-bar>span { display: block; height: 100%; background: var(--sand); } .reviews-summary__note { margin: 0; color: var(--ink-70); font-size: 13px; line-height: 1.6; } .reviews-filter { display: flex; align-items: center; gap: 12px; margin: 24px 0; font-size: 14px; } .reviews-filter select { width: auto; max-width: 100%; min-height: 40px; padding: 8px 32px 8px 12px; border: 1px solid var(--field); border-radius: var(--r-s); background-color: var(--white); color: var(--ink); font: inherit; } .reviews-filter .btn { min-height: 40px; padding: 8px 16px; } .reviews-list { display: grid; gap: 16px; } .review-card { display: flex; justify-content: space-between; align-items: flex-start; gap: 32px; padding: 24px; border: 1px solid var(--line); border-radius: var(--r-m); background: var(--white); } .review-card__content { min-width: 0; } .review-card__byline { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; } .review-card__byline h3 { margin: 0; font: 600 16px/1.4 var(--sans); overflow-wrap: anywhere; } .review-verified { display: inline-flex; align-items: center; gap: 5px; color: var(--ok); font-size: 12px; } .review-verified>span { display: inline-flex; justify-content: center; align-items: center; width: 15px; height: 15px; border-radius: 50%; background: var(--ok); color: var(--white); font-size: 10px; } .review-card time { display: block; margin: 6px 0 14px; color: var(--ink-70); font-size: 12px; } .review-card__text { margin-top: 12px; font-size: 15px; line-height: 1.6; overflow-wrap: anywhere; } .review-card__text p { margin: 0 0 8px; } .review-card__text p:last-child { margin-bottom: 0; } .review-photos { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; flex: none; max-width: 360px; } .review-photos a { display: block; } .review-photos img { display: block; width: 112px; height: 112px; object-fit: cover; border-radius: var(--r-s); } .reviews-empty { margin: 0; padding: 32px 0; color: var(--ink-70); } .reviews-pagination { display: flex; gap: 8px; margin: 24px 0; } .reviews-pagination .page-numbers { padding: 8px 12px; border: 1px solid var(--line); border-radius: var(--r-s); } .reviews-pagination .current { background: var(--ink); color: var(--white); } .review-form-panel { margin-top: 32px; border: 1px solid var(--line); border-radius: var(--r-m); padding: 24px; scroll-margin-top: 120px; } .review-form-panel>summary { cursor: pointer; font-size: 18px; font-weight: 600; } .review-form { max-width: 760px; display: grid; gap: 20px; margin-top: 24px; } .review-form p { margin: 0; } .review-form__notice { color: var(--ink-70); font-size: 14px; line-height: 1.6; } .review-form label { display: block; margin-bottom: 8px; font-size: 14px; font-weight: 500; } .review-form input:not([type="radio"]):not([type="hidden"]), .review-form textarea { width: 100%; min-height: 44px; box-sizing: border-box; border: 1px solid var(--field); border-radius: var(--r-s); background: var(--white); color: var(--ink); padding: 10px 12px; font: 16px/1.5 var(--sans); } .review-form textarea { resize: vertical; } .review-form__identity { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; } .review-form__rating { padding: 0; margin: 0; border: 0; } .review-form__rating legend { font-size: 14px; margin-bottom: 8px; } .review-rating-input { display: flex; gap: 6px; } .review-rating-input label { position: relative; display: grid; place-items: center; width: 44px; height: 44px; margin: 0; cursor: pointer; border: 1px solid var(--line); border-radius: var(--r-s); } .review-rating-input input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; } .review-rating-input .review-star { font-size: 25px; background: var(--field); pointer-events: none; } .review-rating-input label:has(input:checked), .review-rating-input label:has(~label input:checked) { background: var(--sand-50); border-color: var(--sand); } .review-rating-input label:has(input:checked) .review-star, .review-rating-input label:has(~label input:checked) .review-star { background: var(--sand); } .review-rating-input label:focus-within { outline: 2px solid var(--ink); outline-offset: 3px; } .review-form input:focus-visible, .review-form textarea:focus-visible, .reviews-filter select:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; } .review-form__upload>p { margin: 0 0 10px; color: var(--ink-70); font-size: 13px; } .review-photo-preview { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; } .review-photo-preview img { object-fit: cover; border-radius: var(--r-s); } .review-form .btn { justify-self: start; } #reviews { scroll-margin-top: 110px; } @media(max-width: 1000px) { .reviews-summary { grid-template-columns: 160px 1fr; gap: 24px; } .reviews-summary__note { grid-column: 1 / -1; } } @media(max-width: 600px) { .reviews-heading { gap: 12px; flex-wrap: wrap; } .reviews-summary { grid-template-columns: 1fr; padding: 20px; gap: 24px; } .reviews-summary__note { grid-column: auto; } .reviews-average__score strong { font-size: 40px; } .reviews-filter { gap: 8px; flex-wrap: wrap; } .review-card { padding: 20px; flex-direction: column; gap: 16px; } .review-photos { justify-content: flex-start; max-width: 100%; } .review-photos img { width: 76px; height: 76px; } .review-form-panel { padding: 20px; } .review-form__identity { grid-template-columns: 1fr; } .review-form-panel input[type="file"] { font-size: 12px; } } /* ---------- B2B partners (PAESE business partner) ---------- */ .b2b-badge { display: inline-block; margin-left: 2px; padding: 3px 6px; border-radius: 3px; background: var(--ink); color: var(--white); font-size: 10px; font-weight: 700; letter-spacing: .08em; line-height: 1; } @media (max-width: 767px) { .account-link:has(.b2b-badge) { width: auto; gap: 4px; padding: 0 6px; } } .vat-toggle { display: inline-flex; align-items: center; gap: 4px; padding: 3px; margin: 0; border: 1px solid var(--line); border-radius: 999px; font-size: 13px; } .vat-toggle button { min-height: 32px; padding: 0 14px; border: 0; border-radius: 999px; background: transparent; color: var(--ink); font: inherit; font-weight: 600; cursor: pointer; white-space: nowrap; } .vat-toggle button.is-on { background: var(--ink); color: var(--white); cursor: default; } .vat-toggle button:focus-visible { outline: 2px solid var(--sand); outline-offset: 2px; } .vat-toggle--dark { border-color: #6B7680; } .vat-toggle--dark button { color: var(--white); } .vat-toggle--dark button.is-on { background: var(--white); color: var(--ink); } .woocommerce-price-suffix { font-size: 12px; font-weight: 400; color: var(--ink-70); } .price-note { display: block; width: 100%; font-size: 12px; font-weight: 600; margin-top: 2px; } .price-note.is-partner { color: var(--ok); } .price-note.is-offer { color: var(--ink); } .price-note.is-sale { color: var(--sale); } .pdp__summary:has(.pdp__price-note.is-partner) .pdp__price ins, .pdp__summary:has(.pdp__price-note.is-offer) .pdp__price ins { color: var(--ink); } .pdp__price-note { margin: calc(-1 * var(--s3)) 0 var(--s4); font-size: 13px; } .b2b-plaque { display: flex; flex-wrap: wrap; gap: 32px 48px; padding: 36px 40px; border-radius: var(--r-m); background: var(--ink); color: var(--white); } .b2b-plaque__intro { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 14px; } .b2b-plaque__status { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px; border-radius: 999px; background: var(--sand); color: var(--ink); font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; } .b2b-plaque h2 { font: 400 clamp(34px, 3.4vw, 46px)/1.05 var(--serif); margin: 4px 0 0; color: var(--white); } .b2b-plaque__meta { margin: 0; font-size: 15px; color: #D9DEE2; } .b2b-plaque__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 10px; } .b2b-plaque__btn { display: inline-flex; align-items: center; min-height: 46px; padding: 0 24px; border-radius: var(--r-s); background: var(--white); color: var(--ink) !important; font-size: 15px; font-weight: 600; text-decoration: none !important; } .b2b-plaque__btn.is-ghost { background: transparent; border: 1px solid #8D979F; color: var(--white) !important; } .b2b-plaque__facts { flex: 1 1 340px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin: 0; background: #4A5862; border-radius: 6px; overflow: hidden; } .b2b-plaque__facts > div { padding: 18px 20px; background: #3A4751; min-width: 0; } .b2b-plaque__facts dt { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: #C4CBD1; } .b2b-plaque__facts dd { margin: 6px 0 0; font-size: 13px; color: #D9DEE2; } .b2b-plaque__facts .b2b-plaque__big { font: 400 40px/1 var(--serif); color: var(--white); } .b2b-plaque__manager-name { font-size: 15px !important; font-weight: 600; color: var(--white) !important; } .b2b-plaque__links { display: flex; flex-direction: column; gap: 2px; } .b2b-plaque__links a { display: inline-flex; align-items: center; gap: 6px; color: var(--white); overflow-wrap: anywhere; } .b2b-plaque__links svg { flex: none; opacity: .75; } @media (max-width: 767px) { .b2b-plaque { flex-direction: column; gap: 20px; padding: 24px 20px; } .b2b-plaque__intro { flex: none; } .b2b-plaque__facts { flex: none; } .b2b-plaque__facts .b2b-plaque__big { font-size: 32px; } .b2b-plaque__vat { display: none; } .b2b-plaque__manager { grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .b2b-plaque__manager dt, .b2b-plaque__manager dd { margin: 0; } .b2b-plaque__manager-name { margin-right: auto !important; } .b2b-plaque__links { flex-direction: row; gap: 8px; margin-left: auto !important; } .b2b-plaque__links a { justify-content: center; width: 44px; height: 44px; border: 1px solid #6B7680; border-radius: 50%; } .b2b-plaque__links a span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } .b2b-plaque__links svg { opacity: 1; } .b2b-plaque__actions { order: 5; } .b2b-plaque__actions .is-ghost { display: none; } .b2b-plaque__btn { flex: 1; justify-content: center; } } .b2b-company__form { display: grid; gap: 0 20px; max-width: 720px; } @media (min-width: 700px) { .b2b-company__form { grid-template-columns: 1fr 1fr; } .b2b-company__form .form-row-wide, .b2b-company__form > p:last-child { grid-column: 1 / -1; } } .b2b-company__intro { color: var(--ink-70); } /* Side cart note after "Pirkt vēlreiz" (account → order) */ .minicart__note { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; padding: 12px var(--s5); background: #EEF4EF; color: var(--ok); font-size: 13px; font-weight: 600; border-bottom: 1px solid var(--line); } .minicart__note.is-error { background: #FBEFEF; color: var(--sale); } .minicart__back { padding: 0; border: 0; background: none; color: var(--ink); font: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; } .btn--reorder.is-busy { opacity: .6; cursor: progress; } .btn--reorder.is-done { border-color: var(--ok); color: var(--ok); cursor: default; } /* Side cart quantity − / + */ .mini-qty { display: inline-flex; align-items: center; gap: 0; margin-top: 6px; font-size: 13px; color: var(--ink-70); } .mini-qty__btn { width: 36px; height: 36px; min-height: 0; box-sizing: border-box; display: inline-grid; place-items: center; padding: 0; border: 1px solid var(--line); background: var(--white); color: var(--ink); font-size: 16px; line-height: 1; cursor: pointer; } .mini-qty__btn:first-child { border-radius: 6px 0 0 6px; } .mini-qty__btn[data-step="1"] { border-radius: 0 6px 6px 0; } .mini-qty__btn:hover:not(:disabled) { background: var(--sand-50); } .mini-qty__btn:disabled { color: #B7BCC0; cursor: default; } .mini-qty input.mini-qty__input { width: 44px; height: 36px; min-height: 0; box-sizing: border-box; margin: 0; padding: 0; box-shadow: none; border: 1px solid var(--line); border-left: 0; border-right: 0; border-radius: 0; text-align: center; font: inherit; font-weight: 600; color: var(--ink); -moz-appearance: textfield; appearance: textfield; } .mini-qty__input::-webkit-outer-spin-button, .mini-qty__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .mini-qty__price { margin-left: 10px; } .mini-cart__item.is-updating { opacity: .55; pointer-events: none; transition: opacity .15s; } @media (pointer: coarse) { .mini-qty__btn { width: 40px; height: 40px; } .mini-qty input.mini-qty__input { height: 40px; } } /* ---------- Home page 09.11.2026 (canvas "PAESE galvenā lapa") ---------- */ /* Editorial card first in a product collection */ .card--feature { padding: 0; border: 0; background: var(--ink); box-shadow: none; } .card-feature { display: flex; flex-direction: column; justify-content: flex-end; gap: 14px; height: 100%; min-height: 320px; box-sizing: border-box; padding: 28px; border-radius: 16px; color: var(--white); text-decoration: none !important; } .card-feature__kicker { font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--sand); } .card-feature__title { font-family: var(--serif); font-size: clamp(24px, 2.2vw, 30px); line-height: 1.15; } .card-feature__text { font-size: 15px; line-height: 1.5; color: #D9DDE0; } .card-feature__link { font-size: 14px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; } a.card-feature:hover .card-feature__link { text-decoration: underline; text-underline-offset: 4px; } .p-collection.is-carousel ul.products > .card--feature { display: none; } @media (max-width: 767px) { .p-collection:not(.is-carousel) .card--feature { grid-column: 1 / -1; } .card-feature { min-height: 0; } /* Two cards per row on phones: with the editorial card first, drop a lone last product. */ .p-collection:not(.is-carousel) ul.products:has(> .card--feature) > li:last-child:nth-child(even) { display: none; } } /* Studio */ .p-studio { padding-block: 0; margin-block: 56px 24px; background: #F6EFE8; } .p-studio__inner { display: grid; gap: 32px; padding-block: 40px; } .p-studio__media img { display: block; width: 100%; height: auto; aspect-ratio: 5 / 4; object-fit: cover; border-radius: var(--r-m); } .p-studio__body { display: flex; flex-direction: column; gap: 18px; } .p-studio__kicker { color: #8A5A3A; } .p-studio__title { margin: 0; font-size: clamp(30px, 3.4vw, 44px); line-height: 1.1; } .p-studio__text { margin: 0; font-size: 17px; line-height: 1.6; } .p-studio__steps { list-style: none; counter-reset: step; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; } .p-studio__steps li { counter-increment: step; display: grid; grid-template-columns: 36px 1fr; column-gap: 14px; } .p-studio__steps li::before { content: counter(step); grid-row: span 2; width: 36px; height: 36px; border-radius: 50%; background: var(--white); display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 14px; } .p-studio__steps strong { font-weight: 600; } .p-studio__steps span { font-size: 14px; color: var(--ink-70); } .p-studio__where { margin: 0; font-size: 14px; color: var(--ink-70); } .p-studio__actions { display: flex; flex-wrap: wrap; gap: 12px; } .p-studio__remote { margin: 0; padding-top: 16px; border-top: 1px solid #DCCBB9; font-size: 14px; line-height: 1.5; } .p-studio__remote a { font-weight: 600; } @media (min-width: 900px) { .p-studio__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 56px; align-items: center; padding-block: 72px; } } /* Collections mosaic */ .p-collections__intro { display: flex; flex-direction: column; gap: 6px; } .p-collections__text { margin: 0; font-size: 15px; color: var(--ink-70); } .p-collections__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .p-collections__tile a { position: relative; display: block; height: 100%; min-height: 150px; border-radius: 16px; overflow: hidden; background: var(--sand-100); color: var(--ink); text-decoration: none !important; } .p-collections__tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; } .p-collections__tile a::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(255, 255, 255, .92) 0%, rgba(255, 255, 255, .6) 30%, rgba(255, 255, 255, 0) 55%); } .p-collections__label { position: absolute; z-index: 1; left: 16px; right: 16px; bottom: 14px; display: flex; flex-direction: column; gap: 6px; } .p-collections__name { font-family: var(--serif); font-size: 20px; line-height: 1.15; } .p-collections__more { font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; } .p-collections__tile.is-main { grid-column: 1 / -1; } .p-collections__tile.is-main a { min-height: 280px; } .p-collections__tile.is-main .p-collections__name { font-size: clamp(26px, 3vw, 36px); } @media (hover: hover) and (pointer: fine) { .p-collections__tile a:hover img { transform: scale(1.04); } } @media (min-width: 900px) { .p-collections__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 240px; gap: 16px; } .p-collections__tile.is-main { grid-column: span 2; grid-row: span 2; } .p-collections__tile a, .p-collections__tile.is-main a { min-height: 0; } .p-collections__label { left: 24px; bottom: 22px; } .p-collections__tile.is-main .p-collections__label { left: 32px; bottom: 32px; } .p-collections__grid.has-1 .p-collections__tile.is-main, .p-collections__grid.has-2 .p-collections__tile.is-main { grid-column: span 2; } } /* Reviews */ .p-reviews__score { margin: 0 0 0 auto; display: flex; align-items: center; gap: 8px; font-size: 15px; color: var(--ink-70); } .p-reviews__score strong { font-size: 22px; color: var(--ink); } .p-reviews__score .card__rating-star { width: 20px; height: 20px; } .p-reviews__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; } .p-reviews__item { display: flex; flex-direction: column; gap: 12px; padding: 24px; border: 1px solid #EEEEEE; border-radius: 16px; background: var(--white); box-shadow: 0 3px 14px rgba(0, 0, 0, .04); } .p-reviews__text { margin: 0; font-family: var(--serif); font-size: 19px; line-height: 1.45; } .p-reviews__by { margin: auto 0 0; font-size: 13px; color: var(--ink-70); } .p-reviews__photos { list-style: none; margin: 16px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; } .p-reviews__photos img { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 12px; } @media (min-width: 900px) { .p-reviews__list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; } .p-reviews__photos { grid-template-columns: repeat(6, minmax(0, 1fr)); } } @media (max-width: 767px) { .p-reviews .section__head { flex-wrap: wrap; } .p-reviews__score { margin-left: 0; } } /* PAESE PRO (guests) / partner plaque (partners) */ .p-pro { margin-block: 56px 0; background: var(--ink); color: var(--white); } .p-pro__inner { display: flex; flex-direction: column; gap: 32px; padding-block: 56px; } .p-pro__intro { display: flex; flex-direction: column; gap: 14px; max-width: 720px; } .p-pro__kicker { color: var(--sand); } .p-pro__title { margin: 0; font-size: clamp(30px, 3.4vw, 46px); line-height: 1.1; color: var(--white); } .p-pro__text { margin: 0; font-size: 17px; line-height: 1.6; color: #D9DDE0; } .p-pro__columns { display: grid; gap: 16px; } .p-pro__column { padding: 28px; border-radius: var(--r-m); background: #3E4B55; display: flex; flex-direction: column; gap: 14px; } .p-pro__column h3 { margin: 0; font: 600 20px/1.3 var(--sans); color: var(--white); } .p-pro__column ul { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 10px; font-size: 15px; line-height: 1.5; color: #E6E9EB; } .p-pro__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; padding-top: 28px; border-top: 1px solid #55626C; } .p-pro__steps { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px 32px; font-size: 14px; color: #D9DDE0; } .p-pro__steps span { font-weight: 700; color: var(--sand); } .p-pro__actions { display: flex; flex-wrap: wrap; gap: 12px; } .p-pro__ghost { background: transparent; border-color: var(--white); color: var(--white); } .p-pro__ghost:hover { background: var(--white); color: var(--ink); } .p-pro.is-partner { margin-block: 56px 0; background: none; } @media (min-width: 900px) { .p-pro__inner { padding-block: 80px; gap: 40px; } .p-pro__columns { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; } } /* WPML's own footer language list (the header has the PAESE switcher). */ .wpml-ls-statics-footer, .wpml-ls-statics-post_translations { display: none !important; }