/* Amber & Ash: brand tokens, header and footer.
   Kept separate from site.css so the Name Sign Designer page can use the same header and footer
   without the rest of the site's styles. Every class here starts with "aa-". */

/* ---------- fonts: self-hosted copies of the Google Fonts files (see site/static/fonts/FONTS.txt).
   Each family has a Latin file and a Latin Extended file; browsers only fetch the second for
   characters such as ł or ő. The regular and bold Libre Baskerville share one variable file. */
@font-face {
  font-family: "Libre Baskerville"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("/fonts/libre-baskerville-v24-latin-ext.woff2") format("woff2");
  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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Libre Baskerville"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("/fonts/libre-baskerville-v24-latin.woff2") format("woff2");
  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: "Libre Baskerville"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("/fonts/libre-baskerville-v24-latin-ext.woff2") format("woff2");
  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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Libre Baskerville"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("/fonts/libre-baskerville-v24-latin.woff2") format("woff2");
  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: "Libre Baskerville"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("/fonts/libre-baskerville-v24-italic-latin-ext.woff2") format("woff2");
  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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Libre Baskerville"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("/fonts/libre-baskerville-v24-italic-latin.woff2") format("woff2");
  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: "Montserrat"; font-style: normal; font-weight: 400 600; font-display: swap;
  src: url("/fonts/montserrat-v31-latin-ext.woff2") format("woff2");
  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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Montserrat"; font-style: normal; font-weight: 400 600; font-display: swap;
  src: url("/fonts/montserrat-v31-latin.woff2") format("woff2");
  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;
}

:root {
  --aa-amber: #8f4414;
  --aa-amber-dark: #74360f;
  --aa-ash: #363533;
  --aa-linen: #efebe4;
  --aa-paper: #f6f3ee;
  --aa-blush: #e2c2b3;
  --aa-clay: #73584a;
  --aa-line: #e2dbd0;
  --aa-white: #ffffff;
  --aa-serif: "Libre Baskerville", Georgia, "Times New Roman", serif;
  --aa-sans: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --aa-wrap: 1200px;
  --aa-radius: 14px;
  --aa-focus: 0 0 0 3px var(--aa-paper), 0 0 0 5px var(--aa-amber);
}

.aa-wrap {
  max-width: var(--aa-wrap);
  margin-inline: auto;
  padding-inline: 16px;
}
@media (min-width: 768px) { .aa-wrap { padding-inline: 32px; } }

.aa-sr, .sr {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.aa-skip {
  position: absolute; left: 16px; top: -60px; z-index: 100;
  background: var(--aa-ash); color: var(--aa-white);
  font: 600 15px/1 var(--aa-sans); padding: 12px 16px; border-radius: 8px; text-decoration: none;
}
.aa-skip:focus { top: 12px; }

/* ---------- announcement bar */
.aa-announce {
  background: var(--aa-ash);
  color: var(--aa-linen);
  font: 500 13px/1.4 var(--aa-sans);
  letter-spacing: 0.02em;
  text-align: center;
}
.aa-announce p { margin: 0; padding: 8px 16px; }
@media (max-width: 520px) { .aa-announce-extra { display: none; } }

/* ---------- header */
.aa-header {
  background: var(--aa-paper);
  border-bottom: 1px solid var(--aa-line);
  position: relative;
  z-index: 20;
  font-family: var(--aa-sans);
}
.aa-header-inner {
  display: flex;
  align-items: center;
  gap: 24px;
  min-height: 72px;
}
.aa-logo { display: inline-flex; flex: none; border-radius: 4px; }
.aa-logo img { display: block; width: 172px; height: auto; }
@media (min-width: 1000px) { .aa-logo img { width: 214px; } }

.aa-nav { margin-left: auto; display: none; }
.aa-nav ul { display: flex; gap: 4px; list-style: none; margin: 0; padding: 0; }
.aa-nav a {
  display: block;
  padding: 10px 12px;
  color: var(--aa-ash);
  font: 500 15px/1.2 var(--aa-sans);
  text-decoration: none;
  border-radius: 8px;
}
.aa-nav a:hover { color: var(--aa-amber); }
.aa-nav a[aria-current] { color: var(--aa-amber); box-shadow: inset 0 -2px 0 var(--aa-amber); border-radius: 0; }

.aa-etsy-link {
  display: none;
  align-items: center;
  gap: 6px;
  flex: none;
  padding: 10px 16px;
  border: 1.5px solid var(--aa-ash);
  border-radius: 999px;
  color: var(--aa-ash);
  font: 600 14px/1 var(--aa-sans);
  text-decoration: none;
  white-space: nowrap;
}
.aa-etsy-link:hover { background: var(--aa-ash); color: var(--aa-white); }

@media (min-width: 960px) {
  .aa-nav { display: block; }
  .aa-etsy-link { display: inline-flex; }
  .aa-menu { display: none; }
}

/* mobile menu (no JavaScript needed) */
.aa-menu { margin-left: auto; }
.aa-menu summary {
  list-style: none;
  display: grid;
  place-items: center;
  width: 44px; height: 44px;
  border-radius: 10px;
  cursor: pointer;
}
.aa-menu summary::-webkit-details-marker { display: none; }
.aa-menu-icon, .aa-menu-icon::before, .aa-menu-icon::after {
  display: block; width: 22px; height: 2px; background: var(--aa-ash); border-radius: 2px;
  transition: transform .2s ease, opacity .2s ease;
}
.aa-menu-icon { position: relative; }
.aa-menu-icon::before, .aa-menu-icon::after { content: ""; position: absolute; left: 0; }
.aa-menu-icon::before { top: -7px; }
.aa-menu-icon::after { top: 7px; }
.aa-menu[open] .aa-menu-icon { background: transparent; }
.aa-menu[open] .aa-menu-icon::before { transform: translateY(7px) rotate(45deg); }
.aa-menu[open] .aa-menu-icon::after { transform: translateY(-7px) rotate(-45deg); }
.aa-menu-panel {
  position: absolute; left: 0; right: 0; top: 100%;
  background: var(--aa-paper);
  border-bottom: 1px solid var(--aa-line);
  box-shadow: 0 18px 30px -18px rgba(54, 53, 51, .35);
}
.aa-menu-panel ul { list-style: none; margin: 0; padding: 8px 16px 16px; }
.aa-menu-panel a {
  display: block;
  padding: 14px 4px;
  border-bottom: 1px solid var(--aa-line);
  color: var(--aa-ash);
  font: 500 17px/1.2 var(--aa-sans);
  text-decoration: none;
}
.aa-menu-panel li:last-child a { border-bottom: 0; color: var(--aa-amber); font-weight: 600; }

/* ---------- rating badge */
.aa-rating {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 10px;
  color: inherit;
  font: 400 14px/1.4 var(--aa-sans);
  text-decoration: none;
}
.aa-rating:hover span:last-child { text-decoration: underline; }
.aa-stars { color: var(--aa-amber); letter-spacing: 2px; font-size: 16px; }

/* ---------- footer */
.aa-footer {
  background: var(--aa-ash);
  color: var(--aa-linen);
  font: 400 15px/1.6 var(--aa-sans);
  margin-top: 0;
}
.aa-footer a { color: var(--aa-linen); }
.aa-footer-grid {
  display: grid;
  gap: 32px 24px;
  padding-block: 56px 32px;
  grid-template-columns: 1fr 1fr;
}
.aa-footer-brand { grid-column: 1 / -1; max-width: 360px; }
.aa-footer-brand img { display: block; width: 140px; height: auto; margin-bottom: 16px; }
.aa-footer-brand p { margin: 0 0 14px; color: var(--aa-blush); }
.aa-footer .aa-stars { color: var(--aa-blush); }
.aa-footer h2 {
  margin: 0 0 12px;
  font: 600 13px/1.3 var(--aa-sans);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--aa-blush);
}
.aa-footer ul { list-style: none; margin: 0; padding: 0; }
.aa-footer li + li { margin-top: 6px; }
.aa-footer-col a { text-decoration: none; }
.aa-footer-col a:hover { text-decoration: underline; }
.aa-footer-col p { margin: 0 0 14px; color: var(--aa-blush); }
.aa-footer-btn {
  display: inline-block;
  padding: 11px 18px;
  border: 1.5px solid var(--aa-linen);
  border-radius: 999px;
  font-weight: 600;
  font-size: 14px;
}
.aa-footer-btn:hover { background: var(--aa-linen); color: var(--aa-ash); text-decoration: none !important; }
.aa-footer-base {
  display: flex; flex-wrap: wrap; gap: 4px 24px; justify-content: space-between;
  padding-block: 20px 28px;
  border-top: 1px solid rgba(239, 235, 228, .18);
  font-size: 13px;
  color: var(--aa-blush);
}
.aa-footer-base p { margin: 0; }
@media (min-width: 900px) {
  .aa-footer-grid { grid-template-columns: 1.4fr 1fr 1fr 1.2fr; }
  .aa-footer-brand { grid-column: auto; }
}

.aa-header a:focus-visible, .aa-footer a:focus-visible, .aa-menu summary:focus-visible, .aa-rating:focus-visible {
  outline: none;
  box-shadow: var(--aa-focus);
}
.aa-footer a:focus-visible { box-shadow: 0 0 0 3px var(--aa-ash), 0 0 0 5px var(--aa-blush); }

/* Amber & Ash: page styles. Brand tokens, header and footer are in chrome.css. */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: 16px; }
body {
  margin: 0;
  background: var(--aa-paper);
  color: var(--aa-ash);
  font: 400 16px/1.65 var(--aa-sans);
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--aa-amber); text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover { color: var(--aa-amber-dark); }
:focus-visible { outline: none; box-shadow: var(--aa-focus); border-radius: 6px; }
[hidden] { display: none !important; }

h1, h2, h3 { font-family: var(--aa-serif); color: var(--aa-ash); margin: 0 0 .5em; text-wrap: balance; }
h1 { font-size: clamp(1.9rem, 1.35rem + 2.3vw, 3rem); line-height: 1.15; font-weight: 700; letter-spacing: -0.01em; }
h2 { font-size: clamp(1.45rem, 1.2rem + 1vw, 2rem); line-height: 1.25; font-weight: 700; }
h3 { font-size: 1.12rem; line-height: 1.35; font-weight: 700; }
p { margin: 0 0 1em; }
.lede { font-size: 1.1rem; line-height: 1.65; color: var(--aa-ash); max-width: 62ch; }
.eyebrow {
  margin: 0 0 .75em;
  font: 600 .78rem/1.3 var(--aa-sans);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--aa-clay);
}
.muted { color: var(--aa-clay); }
.icon { flex: none; }

/* ---------- buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  padding: 12px 24px;
  border: 1.5px solid transparent;
  border-radius: 999px;
  font: 600 15px/1.2 var(--aa-sans);
  letter-spacing: .01em;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.btn-primary { background: var(--aa-amber); color: var(--aa-white); }
.btn-primary:hover { background: var(--aa-amber-dark); color: var(--aa-white); }
.btn-secondary { border-color: var(--aa-ash); color: var(--aa-ash); background: transparent; }
.btn-secondary:hover { background: var(--aa-ash); color: var(--aa-white); }
.btn-small { min-height: 42px; padding: 9px 18px; font-size: 14px; }
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 24px 0; }

/* ---------- layout bands */
.band { padding-block: 56px; }
.band-linen { background: var(--aa-linen); }
.band-blush { background: #f1e1d8; }
@media (min-width: 900px) { .band { padding-block: 80px; } }
.section-title { margin-bottom: 24px; }
.section-title-gap { margin-top: 56px; }
.section-intro { max-width: 62ch; margin: -12px 0 28px; }
.section-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 24px; margin-bottom: 24px; }
.section-head h2 { margin: 0; }
.section-head a, .section-more a { font-weight: 600; }
.section-more { margin: 28px 0 0; }
.narrow { max-width: 820px; }
.narrow-left { max-width: 680px; }

.two-col, .three-col, .prose-grid { display: grid; gap: 32px 56px; grid-template-columns: minmax(0, 1fr); }
/* Grid children may not grow wider than the screen (tables and thumbnail rows scroll instead). */
.product, .split, .hero-inner, .collection-head-media { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) {
  .two-col { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
  .three-col { grid-template-columns: repeat(3, 1fr); }
  .prose-grid { grid-template-columns: 1fr 1fr; }
}
.prose > :last-child { margin-bottom: 0; }
.prose-grid > :only-child { grid-column: 1 / -1; max-width: 70ch; }
.product + .band:not(.band-linen) { padding-top: 8px; }
.prose h2 { font-size: clamp(1.3rem, 1.15rem + .6vw, 1.6rem); }
.prose ul { padding-left: 1.2em; margin: 0 0 1em; }
.prose ul.woods { padding-left: 0; }
.prose li + li { margin-top: .45em; }
.prose table { margin: 8px 0 16px; width: 100%; border-collapse: collapse; background: var(--aa-white); border-radius: var(--aa-radius); overflow: hidden; font-size: .95rem; }
.prose table th, .prose table td { padding: 11px 16px; text-align: left; border-bottom: 1px solid var(--aa-line); }
.prose table thead th { background: var(--aa-ash); color: var(--aa-linen); font-weight: 600; font-size: .88rem; }
.prose table tbody tr:last-child td { border-bottom: 0; }

/* ---------- breadcrumbs */
.breadcrumbs { padding-block: 16px 0; font-size: 14px; }
.breadcrumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: 4px; margin: 0; padding: 0; }
.breadcrumbs li { display: inline-flex; align-items: center; gap: 4px; color: var(--aa-clay); }
.breadcrumbs li + li::before { content: "/"; color: #b9ab9c; margin-right: 2px; }
.breadcrumbs a { color: var(--aa-clay); text-decoration: none; }
.breadcrumbs a:hover { color: var(--aa-amber); text-decoration: underline; }
.breadcrumbs [aria-current] { color: var(--aa-ash); }

/* ---------- home hero */
.hero { padding-block: 32px 16px; }
.hero-inner { display: grid; gap: 32px; align-items: center; }
.hero-copy .actions { margin-top: 28px; }
.hero-media img { width: 100%; border-radius: var(--aa-radius); aspect-ratio: 1 / 1; object-fit: cover; }
@media (min-width: 900px) {
  .hero { padding-block: 56px 24px; }
  .hero-inner { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 64px; }
}

/* ---------- collections (home) */
.collections { list-style: none; margin: 0; padding: 0; display: grid; gap: 24px; }
@media (min-width: 700px) { .collections { grid-template-columns: repeat(3, 1fr); } }
.collections a { display: block; color: inherit; text-decoration: none; }
.collection-media { border-radius: var(--aa-radius); overflow: hidden; background: var(--aa-linen); aspect-ratio: 16 / 10; }
@media (min-width: 700px) { .collection-media { aspect-ratio: 4 / 3; } }
.collection-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.collections a:hover img { transform: scale(1.03); }
.collections h3 { margin: 16px 0 4px; font-size: 1.3rem; }
.collections p { margin: 0; color: var(--aa-clay); }
.collections a:hover h3 { color: var(--aa-amber); }

/* ---------- split sections */
.split { display: grid; gap: 32px; align-items: center; }
.split-media img { width: 100%; border-radius: var(--aa-radius); }
@media (min-width: 900px) {
  .split { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; }
  .split-reverse .split-media { order: 2; }
}

/* ---------- product cards */
.grid {
  list-style: none; margin: 0; padding: 0;
  display: grid;
  gap: 28px 16px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (min-width: 700px) { .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; } }
@media (min-width: 1100px) { .grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.card a { display: block; color: inherit; text-decoration: none; border-radius: var(--aa-radius); }
.card-media { aspect-ratio: 4 / 3; border-radius: var(--aa-radius); overflow: hidden; background: var(--aa-linen); }
.card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.card a:hover .card-media img { transform: scale(1.04); }
.card-body { padding-top: 12px; }
.card-eyebrow { margin: 0 0 2px; font: 600 .72rem/1.3 var(--aa-sans); letter-spacing: .12em; text-transform: uppercase; color: var(--aa-clay); }
.card-title { margin: 0 0 2px; font-size: 1.02rem; }
.card a:hover .card-title { color: var(--aa-amber); }
.card-price { margin: 0; font-size: .93rem; color: var(--aa-clay); }

/* ---------- collection pages */
.collection-head { padding-block: 24px 8px; }
.collection-head .lede { margin-bottom: 0; }
.collection-head-media { display: grid; gap: 28px; align-items: center; padding-bottom: 24px; }
.collection-hero img { width: 100%; border-radius: var(--aa-radius); aspect-ratio: 4 / 3; object-fit: cover; }
@media (min-width: 900px) {
  .collection-head { padding-block: 40px 16px; }
  .collection-head-media { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 56px; padding-bottom: 40px; }
}
.chips { list-style: none; display: flex; flex-wrap: wrap; gap: 10px; margin: 24px 0 0; padding: 0; }
.chips a {
  display: inline-block;
  padding: 9px 16px;
  border: 1.5px solid var(--aa-line);
  border-radius: 999px;
  background: var(--aa-white);
  color: var(--aa-ash);
  font-weight: 500; font-size: 15px;
  text-decoration: none;
}
.chips a:hover { border-color: var(--aa-amber); color: var(--aa-amber); }

/* ---------- product pages */
.product { display: grid; gap: 28px; padding-block: 20px 56px; }
@media (min-width: 900px) {
  .product { grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: 56px; padding-block: 28px 80px; align-items: start; }
  .gallery { position: sticky; top: 24px; }
}
.gallery-main {
  background: var(--aa-linen);
  border-radius: var(--aa-radius);
  overflow: hidden;
  display: grid;
}
.gallery-main img { width: 100%; height: 100%; object-fit: contain; }
.thumbs { list-style: none; display: flex; gap: 10px; margin: 12px 0 0; padding: 2px 2px 6px; overflow-x: auto; scrollbar-width: thin; }
.thumb { display: block; width: 76px; flex: none; border-radius: 10px; overflow: hidden; border: 2px solid transparent; background: var(--aa-linen); }
.thumb img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.thumb.is-current { border-color: var(--aa-amber); }
@media (min-width: 900px) { .thumbs { flex-wrap: wrap; overflow: visible; } }
.thumb:hover { border-color: var(--aa-clay); }

.buybox h1 { font-size: clamp(1.8rem, 1.3rem + 1.8vw, 2.6rem); }
.price { margin: 0 0 16px; font-size: 1.05rem; }
.price strong { font: 700 1.5rem/1 var(--aa-serif); color: var(--aa-ash); }
.price span { display: block; margin-top: 4px; font-size: .92rem; color: var(--aa-clay); }
.facts { list-style: none; margin: 20px 0 0; padding: 0; border-top: 1px solid var(--aa-line); }
.facts li { display: grid; grid-template-columns: 7.5em 1fr; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--aa-line); font-size: .95rem; }
.facts span { font-weight: 600; color: var(--aa-clay); }
.buy-note { font-size: .9rem; color: var(--aa-clay); margin: 0; max-width: 52ch; }

.table-wrap { overflow-x: auto; }
.table { width: 100%; border-collapse: collapse; background: var(--aa-white); border-radius: var(--aa-radius); overflow: hidden; font-size: .95rem; }
.table caption { text-align: left; font-weight: 600; padding: 0 0 10px; color: var(--aa-clay); font-size: .9rem; }
.table th, .table td { padding: 12px 16px; text-align: left; border-bottom: 1px solid var(--aa-line); vertical-align: top; }
.table thead th { background: var(--aa-ash); color: var(--aa-linen); font-weight: 600; font-size: .88rem; letter-spacing: .02em; }
.table tbody tr:last-child th, .table tbody tr:last-child td { border-bottom: 0; }
.table tbody th { font-weight: 600; white-space: nowrap; }
.table-wide { min-width: 640px; }

.woods { list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 12px; }
.woods li { display: flex; gap: 14px; align-items: flex-start; }
.swatch { flex: none; width: 34px; height: 34px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); }
.swatch-oak { background: linear-gradient(135deg, #d9b680, #c39a5f 55%, #d4ae74); }
.swatch-maple { background: linear-gradient(135deg, #f0dcbc, #e2c9a2 55%, #ecd6b2); }
.swatch-cherry { background: linear-gradient(135deg, #c98a68, #b0704f 55%, #c4805e); }
.swatch-walnut { background: linear-gradient(135deg, #6e4c37, #573a29 55%, #684633); }
.swatch-mdf { background: linear-gradient(135deg, #c9a67f, #b8946d 55%, #c4a079); }

.fontmaps { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 16px; }
.fontmaps figure { margin: 0; }
.fontmaps img { border-radius: 10px; }
.fontmaps figcaption { margin-top: 6px; font-size: .9rem; color: var(--aa-clay); }

/* FAQ */
.faq details { border-bottom: 1px solid var(--aa-line); }
.faq summary { list-style: none; cursor: pointer; padding: 18px 40px 18px 0; position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary h3 { margin: 0; font-size: 1.05rem; }
.faq summary::after {
  content: ""; position: absolute; right: 8px; top: 50%; width: 10px; height: 10px; margin-top: -7px;
  border-right: 2px solid var(--aa-amber); border-bottom: 2px solid var(--aa-amber); transform: rotate(45deg);
  transition: transform .2s ease;
}
.faq details[open] summary::after { transform: rotate(-135deg); margin-top: -2px; }
.faq-answer { padding: 0 0 18px; max-width: 70ch; }
.faq-answer p:last-child { margin-bottom: 0; }

/* sticky buy bar on phones */
.buybar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 30;
  background: var(--aa-paper);
  border-top: 1px solid var(--aa-line);
  box-shadow: 0 -10px 24px -16px rgba(54, 53, 51, .4);
  padding-bottom: env(safe-area-inset-bottom, 0px);
  transform: translateY(110%);
  transition: transform .25s ease;
}
.buybar.is-shown { transform: none; }
.buybar-inner { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-block: 10px; }
.buybar p { margin: 0; font-size: .92rem; line-height: 1.3; }
.buybar p span { display: block; color: var(--aa-clay); }
@media (min-width: 900px) { .buybar { display: none; } }

/* ---------- promises (home) */
.promises { list-style: none; margin: 0; padding: 0; display: grid; gap: 28px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
.promises svg { width: 36px; height: 36px; fill: none; stroke: var(--aa-amber); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; margin-bottom: 12px; }
.promises h3 { margin-bottom: 6px; }
.promises p { margin: 0; color: var(--aa-clay); }

/* ---------- reviews band */
.band-reviews { text-align: center; }
.reviews-inner { max-width: 720px; }
.band-reviews .aa-rating { justify-content: center; font-size: 15px; margin-top: 4px; }

/* ---------- articles and text pages */
.article { max-width: 800px; padding-block: 24px 72px; }
.article-head { margin-bottom: 32px; }
.article .prose h2 { margin-top: 1.6em; }
.article .prose h2:first-child { margin-top: 0; }
.figure { margin: 24px 0; }
.figure img { border-radius: var(--aa-radius); }
.cta-box { margin-top: 48px; padding: 28px; background: var(--aa-linen); border-radius: var(--aa-radius); }
.cta-box h2 { font-size: 1.4rem; }
.cta-box .actions { margin-bottom: 0; }
.notfound { text-align: left; padding-block: 56px 96px; }
.notfound .chips { margin-bottom: 32px; }
