:root {
  --bg: #fafaf9;
  --paper: #ffffff;
  --ink: #1a1a1c;
  --ink-soft: #7a7a7c;
  --rule: #e6e6e2;
  --primary: #545758;
  --accent: #8a8378;
  --silver-light: #d4d4d2;
  --silver-shine: linear-gradient(135deg, #d4d4d0 0%, #ffffff 30%, #b8b8b5 50%, #f0f0ec 70%, #c8c8c4 100%);
  --serif: 'Iowan Old Style', 'Hoefler Text', Georgia, serif;
  --sans: -apple-system, BlinkMacSystemFont, 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: var(--sans); background: var(--bg); color: var(--ink); line-height: 1.65; -webkit-font-smoothing: antialiased; font-weight: 300; }
.container { max-width: 1140px; margin: 0 auto; padding: 0 32px; }
.container-tight { max-width: 760px; margin: 0 auto; padding: 0 32px; }
a { color: var(--ink); text-decoration: none; }
a:hover { color: var(--accent); }

/* Header — restrained, no underlines */
header.silver { padding: 32px 0; background: var(--bg); }
header.silver .container { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; }
.brand { font-family: var(--serif); font-style: italic; font-size: 26px; font-weight: 400; color: var(--ink); text-decoration: none; letter-spacing: 0.04em; display: inline-flex; align-items: center; gap: 8px; }
.brand-icon { width: 24px; height: 24px; flex-shrink: 0; vertical-align: middle; margin-right: 6px; }
header.silver nav a { color: var(--ink-soft); text-decoration: none; margin-left: 32px; font-size: 11px; letter-spacing: 0.26em; text-transform: uppercase; font-weight: 400; }
header.silver nav a:hover { color: var(--ink); }

/* Hero — wide silver gradient strip with single sentence */
.silver-hero { padding: 80px 0 56px; text-align: center; position: relative; }
.silver-hero h1 { font-family: var(--serif); font-style: italic; font-size: 56px; line-height: 1.15; font-weight: 400; color: var(--ink); max-width: 18ch; margin: 0 auto 32px; letter-spacing: -0.005em; }
.silver-hero .strip { height: 6px; max-width: 80px; margin: 0 auto 32px; background: var(--silver-shine); }
.silver-hero .lede { font-size: 17px; color: var(--ink-soft); max-width: 56ch; margin: 0 auto; line-height: 1.8; }

/* Featured piece — single hero product */
.featured-piece { padding: 80px 0; background: var(--paper); }
.featured-piece .container { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.piece-image { aspect-ratio: 4/5; background: var(--silver-shine); position: relative; overflow: hidden; }
.piece-image img { width: 100%; height: 100%; object-fit: cover; position: relative; z-index: 1; }
.piece-image::after { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 50%; aspect-ratio: 1; border: 2px solid rgba(255,255,255,0.4); border-radius: 50%; }
.piece-image::before { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 22%; aspect-ratio: 1; border: 1px solid rgba(0,0,0,0.15); border-radius: 50%; }
.piece-content .eyebrow { font-size: 11px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--accent); margin-bottom: 14px; }
.piece-content h2 { font-family: var(--serif); font-style: italic; font-size: 36px; font-weight: 400; color: var(--ink); margin-bottom: 18px; line-height: 1.2; }
.piece-content p { color: var(--ink-soft); font-size: 16px; line-height: 1.8; margin-bottom: 16px; max-width: 50ch; }
.piece-meta { padding-top: 24px; margin-top: 24px; border-top: 1px solid var(--rule); }
.piece-meta dl { display: grid; grid-template-columns: 90px 1fr; gap: 10px 24px; }
.piece-meta dt { font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink-soft); }
.piece-meta dd { font-family: var(--serif); font-style: italic; color: var(--ink); font-size: 15px; }
.piece-cta { margin-top: 32px; display: inline-block; padding: 14px 28px; background: var(--ink); color: var(--paper); text-decoration: none; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; }
.piece-cta:hover { background: var(--accent); color: var(--paper); }

/* Collection grid — minimal cards */
.collection { padding: 80px 0; }
.section-eyebrow { text-align: center; font-size: 11px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--accent); margin-bottom: 14px; }
.section-title { font-family: var(--serif); font-style: italic; font-size: 32px; font-weight: 400; color: var(--ink); text-align: center; margin-bottom: 48px; }
.col-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; }
.col-piece { text-decoration: none; color: var(--ink); }
.col-image { aspect-ratio: 1; background: var(--silver-shine); position: relative; margin-bottom: 16px; overflow: hidden; }
.col-image img { width: 100%; height: 100%; object-fit: cover; position: relative; z-index: 1; }
.col-image.necklace::after, .col-image.ring::after, .col-image.bracelet::after, .col-image.earring::after { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.col-image.necklace::after { width: 30%; aspect-ratio: 1; border: 1.5px solid rgba(255,255,255,0.6); border-radius: 50%; }
.col-image.ring::after { width: 40%; aspect-ratio: 1; border: 3px solid rgba(255,255,255,0.6); border-radius: 50%; }
.col-image.bracelet::after { width: 60%; aspect-ratio: 1/2; border: 1.5px solid rgba(255,255,255,0.6); border-radius: 50%; }
.col-image.earring::after { width: 14%; aspect-ratio: 1; border: 1.5px solid rgba(255,255,255,0.6); border-radius: 50%; box-shadow: 0 50px 0 -8px rgba(255,255,255,0.6); }
.col-piece h3 { font-family: var(--serif); font-style: italic; font-size: 16px; font-weight: 400; color: var(--ink); margin-bottom: 4px; }
.col-piece .meta { font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-soft); }

/* Bespoke band */
.bespoke-band { padding: 96px 0; background: var(--paper); text-align: center; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.bespoke-band h2 { font-family: var(--serif); font-style: italic; font-size: 36px; font-weight: 400; color: var(--ink); margin-bottom: 24px; max-width: 24ch; margin-left: auto; margin-right: auto; line-height: 1.2; }
.bespoke-band p { color: var(--ink-soft); max-width: 560px; margin: 0 auto 16px; font-size: 16px; line-height: 1.8; }

/* Contact */
.contact-silver { padding: 96px 0; text-align: center; }
.contact-silver h2 { font-family: var(--serif); font-style: italic; font-size: 32px; font-weight: 400; color: var(--ink); margin-bottom: 16px; }
.contact-silver p { color: var(--ink-soft); max-width: 460px; margin: 0 auto 28px; }
.contact-silver a.email { font-family: var(--serif); font-style: italic; font-size: 20px; color: var(--ink); border-bottom: 1px solid var(--accent); padding-bottom: 4px; text-decoration: none; }

/* Article pages */
article.page { padding: 64px 0; max-width: 1140px; margin: 0 auto; padding-left: 32px; padding-right: 32px; }
article.page .breadcrumb { font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink-soft); margin-bottom: 16px; }
article.page .breadcrumb a { color: var(--ink-soft); }
article.page h1 { font-family: var(--serif); font-style: italic; font-size: 44px; font-weight: 400; color: var(--ink); margin-bottom: 28px; line-height: 1.2; }
article.page h2 { font-family: var(--serif); font-style: italic; font-size: 22px; font-weight: 400; color: var(--ink); margin-top: 40px; margin-bottom: 12px; }
article.page p { margin-bottom: 16px; font-size: 16px; line-height: 1.8; color: var(--ink-soft); }
article.page strong { color: var(--ink); }
article.page ul, article.page ol { margin-bottom: 18px; padding-left: 24px; color: var(--ink-soft); }
article.page li { margin-bottom: 8px; }

/* Fallback for inner pages */
body > header:not([class]) { padding: 28px 0; border-bottom: 1px solid var(--rule); background: var(--bg); }
body > header:not([class]) .container { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; }
body > header:not([class]) .brand { display: inline-flex; align-items: center; gap: 10px; font-family: var(--serif); font-style: italic; font-size: 26px; font-weight: 400; color: var(--ink); text-decoration: none; }
body > header:not([class]) .brand-icon { width: 26px; height: 26px; flex-shrink: 0; color: var(--ink-soft); }
body > header:not([class]) nav { display: flex; gap: 28px; flex-wrap: wrap; }
body > header:not([class]) nav a { font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ink-soft); text-decoration: none; }

/* Footer */
footer { padding: 48px 0 32px; border-top: 1px solid var(--rule); background: var(--bg); text-align: center; }
footer p { font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink-soft); margin-bottom: 8px; }
footer a { color: var(--ink); text-decoration: none; }

.content-img { width: 100%; max-height: 420px; object-fit: cover; display: block; margin: 24px auto; border-radius: 4px; }

@media (max-width: 800px) {
  .silver-hero h1 { font-size: 36px; }
  .featured-piece .container { grid-template-columns: 1fr; gap: 32px; }
  .col-grid { grid-template-columns: 1fr 1fr; gap: 20px; }
  header.silver nav a { margin-left: 14px; }
  article.page h1 { font-size: 32px; }
}
