/* Shared look for the secondary product pages (malchut.html, silver.html).
   One stylesheet so both pages read as the same store, a notch lighter than
   the homepage but with room to breathe and explain. */
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: 'Google Sans Flex', -apple-system, sans-serif; color: #1C1710; background: #FBFAF8; -webkit-font-smoothing: antialiased; line-height: 1.6; }
img { display: block; max-width: 100%; }
a { color: inherit; }

.wrap { max-width: 1120px; margin-inline: auto; padding-inline: 22px; }
.hd { display: flex; align-items: center; justify-content: space-between; padding: 20px 0; border-bottom: 1px solid rgba(28,23,16,0.1); }
.brand { font-family: 'Playfair Display', serif; font-weight: 600; font-size: 22px; letter-spacing: .14em; direction: ltr; text-decoration: none; }
.hd-r { display: flex; align-items: center; gap: 22px; }
.back { font-size: 13px; letter-spacing: .06em; color: #5A5142; text-decoration: none; }
.back:hover { color: #1C1710; }
.cart-link { position: relative; text-decoration: none; font-size: 13px; letter-spacing: .06em; color: #1C1710; }
.cart-link [data-cart-count] { display: none; margin-inline-start: 5px; background: #1C1710; color: #fff; border-radius: 9px; padding: 1px 7px; font-size: 11px; }

.pd { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; padding: 44px 0; }
.gallery-main { aspect-ratio: 4/5; overflow: hidden; background: #EDE6D8; }
.gallery-main img { width: 100%; height: 100%; object-fit: cover; }
.thumbs { display: grid; grid-template-columns: repeat(6,1fr); gap: 8px; margin-top: 8px; }
.thumbs button { padding: 0; border: 1px solid transparent; background: none; cursor: pointer; aspect-ratio: 1/1; overflow: hidden; }
.thumbs button.on { border-color: #1C1710; }
.thumbs img { width: 100%; height: 100%; object-fit: cover; }

.tag { font-size: 12px; letter-spacing: .22em; color: #B08D3E; margin-bottom: 12px; }
.pd h1 { font-family: 'Karantina','Google Sans Flex',sans-serif; font-weight: 400; font-size: clamp(40px,6vw,66px); line-height: .92; }
.lead { font-size: 16px; line-height: 1.95; color: #3A342A; margin-top: 20px; }
.kicker { font-size: 13px; color: #8A8170; margin-top: 14px; }

.pp-label { font-size: 12px; letter-spacing: .18em; color: #1C1710; margin: 26px 0 12px; }
.pp-chips { display: flex; gap: 10px; flex-wrap: wrap; }
.pp-chip { flex: 1 1 30%; padding: 13px 10px; text-align: center; font-family: inherit; font-size: 14px; line-height: 1.3; cursor: pointer; border: 1px solid rgba(28,23,16,0.28); background: transparent; color: #1C1710; transition: all .25s ease; }
.pp-chip .pp-sub { display: block; font-size: 11px; opacity: .65; margin-top: 3px; }
.pp-chip.on { background: #1C1710; color: #fff; border-color: #1C1710; }
.pp-none { flex-basis: 100% !important; }
/* four finishes read better as 2x2 than as a lone chip on a second row */
#ppOptions[data-count="4"] .pp-chip { flex: 1 1 46%; }

.price-box { margin-top: 26px; background: #F6F2E9; padding: 18px; }
.pp-lines { display: flex; flex-direction: column; gap: 8px; }
.pp-row { display: flex; justify-content: space-between; font-size: 13px; color: #3A342A; }
.pp-total { display: flex; justify-content: space-between; align-items: baseline; margin-top: 12px; padding-top: 12px; border-top: 1px solid rgba(28,23,16,0.16); }
.pp-total .n { font-size: 24px; font-weight: 500; }
.pp-add { width: 100%; margin-top: 16px; padding: 17px; border: none; cursor: pointer; font-family: inherit; font-size: 15px; letter-spacing: .12em; color: #fff; background: #1C1710; transition: background .3s ease; }
.pp-add:hover { background: #B08D3E; }
.pp-confirm { display: none; margin-top: 14px; text-align: center; font-size: 14px; color: #1C1710; }
.pp-confirm a { text-decoration: underline; white-space: nowrap; }
.pp-note { font-size: 12px; color: #8A8170; line-height: 1.7; margin-top: 14px; text-align: center; }

.story { max-width: 760px; margin-inline: auto; padding: 56px 0 8px; border-top: 1px solid rgba(28,23,16,0.1); text-align: center; }
.story h2 { font-family: 'Karantina','Google Sans Flex',sans-serif; font-weight: 400; font-size: clamp(28px,4vw,42px); margin-bottom: 18px; }
.story p { font-size: 16px; line-height: 1.95; color: #3A342A; }
.details { display: grid; grid-template-columns: repeat(4,1fr); gap: 24px; padding: 40px 0 56px; }
.details .d { border-top: 1px solid rgba(28,23,16,0.2); padding-top: 14px; }
.details .d .n { font-size: 22px; }
.details .d .l { font-size: 12.5px; color: #3A342A; margin-top: 6px; }

.ft { padding: 30px 0; border-top: 1px solid rgba(28,23,16,0.1); font-size: 12.5px; color: #8A8170; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.ft a { text-decoration: none; }

@media (max-width: 820px) {
  .pd { grid-template-columns: 1fr; gap: 28px; padding-top: 28px; }
  .details { grid-template-columns: repeat(2,1fr); }
}

/* ---- magazine / articles ---- */
.mag-head { text-align: center; padding: 44px 0 36px; }
.mag-head .tag { display: block; }
.mag-head h1 { font-family: 'Karantina','Google Sans Flex',sans-serif; font-weight: 400; font-size: clamp(40px,6vw,64px); line-height: .95; }
.mag-head p { font-size: 16px; color: #3A342A; max-width: 560px; margin: 14px auto 0; }
.mag-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 26px; padding-bottom: 30px; }
.mag-card { display: block; text-decoration: none; color: inherit; }
.mag-card .thumb { aspect-ratio: 3/2; overflow: hidden; background: #EDE6D8; }
.mag-card .thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s cubic-bezier(.22,1,.36,1); }
.mag-card:hover .thumb img { transform: scale(1.05); }
.mag-card h2 { font-size: 19px; line-height: 1.35; margin-top: 14px; }
.mag-card p { font-size: 13.5px; color: #5A5142; margin-top: 6px; line-height: 1.6; }

.article { max-width: 720px; margin-inline: auto; padding: 16px 0 30px; }
.article .eyebrow { font-size: 12px; letter-spacing: .22em; color: #B08D3E; }
.article h1 { font-family: 'Karantina','Google Sans Flex',sans-serif; font-weight: 400; font-size: clamp(34px,5vw,54px); line-height: 1; margin: 12px 0 10px; }
.article .meta { font-size: 13px; color: #8A8170; margin-bottom: 26px; }
.article .hero-img { aspect-ratio: 16/9; overflow: hidden; background: #EDE6D8; margin-bottom: 30px; }
.article .hero-img img { width: 100%; height: 100%; object-fit: cover; }
.article h2 { font-size: 22px; margin: 32px 0 12px; }
.article p { font-size: 16.5px; line-height: 1.95; color: #28241D; margin-bottom: 16px; }
.article ul { margin: 0 0 16px; padding-inline-start: 22px; }
.article li { font-size: 16.5px; line-height: 1.9; margin-bottom: 6px; color: #28241D; }
.article .cta { display: block; margin: 34px 0 10px; padding: 22px; background: #F6F2E9; text-align: center; text-decoration: none; color: #1C1710; transition: background .3s ease; }
.article .cta:hover { background: #EDE6D8; }
.article .cta strong { font-size: 18px; }
.article .cta span { display: block; font-size: 13px; color: #5A5142; margin-top: 4px; }
.article-more { border-top: 1px solid rgba(28,23,16,0.1); margin-top: 30px; padding-top: 22px; }
.article-more p { font-size: 12px; letter-spacing: .12em; color: #8A8170; margin-bottom: 12px; }
.article-more a { display: inline-block; margin-inline-end: 18px; font-size: 14px; color: #1C1710; }
@media (max-width: 820px) { .mag-grid { grid-template-columns: 1fr; } }