/* Search-first shopping visual language inspired by the official LoveGoBuy site. */
:root {
  --bg: #fff;
  --paper: #fff;
  --ink: #181818;
  --muted: #686462;
  --line: #eee5e0;
  --green: #ff553f;
  --deep: #201b1a;
}

html { scroll-padding-top: 90px; }
body { background: #fff; }
.site-header { position: sticky; top: 0; z-index: 100; background: #fff; border-bottom-color: #f1e9e5; box-shadow: 0 3px 14px rgba(33, 25, 22, .045); }
.nav-inner { min-height: 78px; justify-content: flex-start; gap: 30px; }
.language-switch { position: relative; margin-left: auto; flex: none; white-space: nowrap; }
.language-switch summary { display: flex; align-items: center; gap: 7px; padding: 9px 11px; border: 1px solid #eadcd5; border-radius: 8px; color: #4f4b49; font: 800 12px var(--display); cursor: pointer; list-style: none; }
.language-switch summary::-webkit-details-marker { display: none; }
.language-switch summary:hover, .language-switch[open] summary { border-color: #ff553f; color: #c94230; }
.language-switch summary span:last-child { font-size: 15px; }
.language-options { display: none; position: absolute; top: calc(100% + 7px); right: 0; z-index: 20; min-width: 145px; padding: 6px; border: 1px solid #eadcd5; border-radius: 9px; background: #fff; box-shadow: 0 12px 24px rgba(45, 27, 19, .15); }
.language-switch[open] .language-options { display: grid; gap: 2px; }
.language-options a { display: block; padding: 9px 11px; border-radius: 5px; color: #4f4b49; font: 800 12px var(--display); }
.language-options a:hover, .language-options a[aria-current] { background: #fff0e9; color: #c94230; }
.wordmark img { display: block; width: 200px; height: 37px; object-fit: contain; }
.brand-mark, .footer-brand {
  background: #ff553f;
  color: #171313;
  border-radius: 14px;
  letter-spacing: -1.3px;
}
.brand-mark span, .footer-brand span { color: #fff; }
.brand-name { font-size: 12px; letter-spacing: .075em; }
.brand-name b { color: #d94130; }
.site-header nav { gap: 28px; overflow: visible; }
.site-header nav a { color: #4f4b49; font-size: 14px; font-weight: 800; }
.site-header nav a:hover, .site-header nav a[aria-current] { color: #d23e2e; }
.site-header nav a[aria-current]:after { background: #ff553f; }
.nav-dropdown { position: relative; }
.nav-dropdown summary { display: flex; align-items: center; gap: 5px; color: #4f4b49; font-size: 14px; font-weight: 800; white-space: nowrap; cursor: pointer; list-style: none; }
.nav-dropdown summary::-webkit-details-marker { display: none; }
.nav-dropdown summary:hover, .nav-dropdown summary.selected, .nav-dropdown[open] summary { color: #d23e2e; }
.nav-dropdown summary span { font-size: 18px; line-height: .8; transition: transform .2s; }
.nav-dropdown[open] summary span { transform: rotate(180deg); }
.nav-menu { display: none; position: absolute; top: 100%; left: -16px; z-index: 10; width: 240px; max-height: min(72vh, 560px); overflow-y: auto; grid-template-columns: 1fr; align-content: start; gap: 2px; padding: 10px; background: #fff; border: 1px solid #f0ded5; border-radius: 10px; box-shadow: 0 14px 32px rgba(45, 27, 19, .16); }
.nav-dropdown--guide .nav-menu { width: 300px; }
.nav-dropdown--blog .nav-menu { width: 260px; }
.nav-dropdown[open] .nav-menu { display: grid; }
@media (hover: hover) { .nav-dropdown:hover .nav-menu { display: grid; } }
.site-header nav .nav-menu a { display: block; padding: 9px 11px; border-radius: 6px; font-size: 13px; }
.site-header nav .nav-menu a:hover, .site-header nav .nav-menu a[aria-current] { background: #fff0e9; }
.site-header nav .nav-menu a[aria-current]:after { display: none; }
.site-header nav .nav-menu-all { color: #d23e2e; border-bottom: 1px solid #f0ded5; border-radius: 0; margin-bottom: 4px; }
.eyebrow { color: #a74635; }
.status-dot { background: #ff553f; }
.period { color: #ff553f; }

.hero-showcase {
  background: #ffbba2 url('/img/banner_bg21.png') center / cover no-repeat;
  overflow: hidden;
  position: relative;
}
.hero {
  position: relative;
  grid-template-columns: 1.04fr .96fr;
  gap: 65px;
  min-height: 590px;
  padding-top: 62px;
  padding-bottom: 64px;
}
.hero-copy { z-index: 1; }
.hero-copy .eyebrow {
  color: #9f3f30;
  margin-bottom: 23px;
  letter-spacing: .13em;
}
.hero h1 {
  font-size: clamp(48px, 5.05vw, 76px);
  line-height: 1.07;
  letter-spacing: -.068em;
}
.hero h1 em, .category-hero h1 em, .guide-page h1 em { color: #d94633; }
.hero-intro {
  font-size: 17px;
  line-height: 1.65;
  color: #5b504b;
  margin: 23px 0 27px;
  max-width: 520px;
}
.hero-search {
  width: min(100%, 610px);
  min-height: 65px;
  border: 2px solid #1e1b1a;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 12px 26px rgba(137, 62, 35, .1);
  display: flex;
  align-items: center;
  padding: 5px;
  position: relative;
}
.hero-search svg {
  flex: none;
  width: 20px;
  height: 20px;
  fill: none;
  stroke: #6b6967;
  stroke-width: 1.9;
  margin-left: 14px;
}
.hero-search input {
  min-width: 0;
  flex: 1;
  border: 0;
  outline: 0;
  background: transparent;
  color: #181818;
  padding: 0 12px;
  font-size: 15px;
}
.hero-search input::placeholder { color: #98918e; }
.hero-search button {
  align-self: stretch;
  border: 0;
  border-radius: 9px;
  background: #171717;
  color: #fff;
  padding: 0 24px;
  font-weight: 800;
  cursor: pointer;
  transition: background .2s, transform .2s;
}
.hero-search button:hover { background: #d94633; }
.hero-search button span { margin-left: 12px; font-size: 17px; }
.spreadsheet-link { display: inline-flex; align-items: center; justify-content: center; gap: 18px; border-radius: 9px; font: 800 13px/1.25 var(--display); text-align: center; transition: background .2s, border-color .2s, transform .2s; }
.spreadsheet-link:hover { transform: translateY(-2px); }
.spreadsheet-link:focus-visible { outline: 3px solid #171717; outline-offset: 3px; }
.spreadsheet-link span { font-size: 18px; line-height: 1; }
.hero-chips { display: flex; flex-wrap: nowrap; align-items: center; gap: 9px; width: max-content; max-width: calc(100vw - 72px); margin-top: 17px; }
.hero-chips>span { font-size: 12px; color: #685752; font-weight: 700; margin-right: 3px; }
.hero-chips a {
  flex: none;
  white-space: nowrap;
  border: 1px solid #d4a391;
  background: rgba(255, 255, 255, .5);
  border-radius: 999px;
  padding: 7px 14px;
  font-size: 12px;
  font-weight: 700;
  transition: background .2s, border-color .2s;
}
.hero-chips a:hover { background: #fff; border-color: #c65b41; }
.hero-chips .hero-spreadsheet-link { min-height: 35px; margin-left: 8px; padding: 7px 13px; border-color: #ce6b51; border-radius: 9px; background: rgba(255,255,255,.9); color: #a73927; }
.hero-chips .hero-spreadsheet-link:hover { background: #fff; border-color: #a73927; }

.hero-visual {
  background: transparent;
  box-shadow: none;
  padding: 18px 12px 12px;
  min-height: 460px;
}
.hero-visual-header, .hero-visual-footer { color: #914c3a; font-size: 10px; }
.hero-visual-header { padding: 0 2px 12px; }
.hero-visual-footer { padding: 16px 2px 0; }
.hero-products { min-height: 390px; gap: 14px; }
.hero-products a {
  background: #fff;
  border: 6px solid #fff;
  border-radius: 17px;
  box-shadow: 0 16px 28px rgba(127, 60, 36, .16);
  overflow: hidden;
  transition: transform .25s, box-shadow .25s;
}
.hero-products a:first-child { transform: rotate(-3deg) translateY(13px); }
.hero-products a:nth-child(2) { transform: rotate(2deg) translateY(-5px); }
.hero-products a:nth-child(3) { transform: rotate(2deg) translateY(1px); }
.hero-products a:nth-child(4) { transform: rotate(-2deg) translateY(-9px); }
.hero-products a:hover { transform: rotate(0) translateY(-5px); box-shadow: 0 22px 33px rgba(127, 60, 36, .22); }
.hero-products img { border-radius: 11px; }
.hero-products span {
  border-radius: 999px;
  background: #fff;
  color: #b63e2f;
  left: 9px;
  bottom: 9px;
  font-size: 10px;
  padding: 8px 11px;
}

.browse-band { background: #fff; border-color: #f0e7e2; padding: 50px 0 55px; }
.band-heading .eyebrow { color: #b24735; }
.band-heading h2 span { color: #ed5139; }
.category-links { gap: 10px; }
.compact .category-links { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.category-links a {
  background: #fff8f4;
  border-color: #f2d8ce;
  border-radius: 13px;
  font-size: 15px;
  min-height: 78px;
  box-shadow: 0 3px 0 rgba(222, 137, 105, .08);
}
.category-links a:hover { background: #ffe5d7; border-color: #ecad99; }
.category-links a.selected { background: #ff553f; border-color: #ff553f; color: #161211; }
.browse-band.compact { background: #fff; border: 0; padding: 24px 0 2px; }
.compact .category-links a { min-height: 56px; }

.category-showcase {
  background: #f5f6f8;
  padding: 54px 0 72px;
  scroll-margin-top: 20px;
}
.category-showcase h2 {
  margin: 0 0 38px;
  color: #202c39;
  text-align: center;
  font: 800 clamp(29px, 3vw, 40px)/1.15 var(--display);
  letter-spacing: -.045em;
}
.category-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 24px 18px;
}
.category-tile { display: block; min-width: 0; text-align: center; }
.category-collage {
  display: block;
  aspect-ratio: 1;
  overflow: hidden;
  background: #fff;
  border: 1px solid #e8e9eb;
  border-radius: 11px;
  box-shadow: 0 4px 9px rgba(25, 32, 40, .2);
  transition: transform .2s, box-shadow .2s;
}
.category-collage img { display: block; width: 100%; height: 100%; object-fit: cover; }
.category-tile:hover .category-collage { transform: translateY(-4px); box-shadow: 0 10px 19px rgba(25, 32, 40, .17); }
.category-label { display: block; margin-top: 14px; color: #5f636a; font: 700 18px/1.25 var(--display); }
.category-tile:hover .category-label { color: #d23e2e; }

.directory { padding-top: 60px; }
.directory-heading .eyebrow { color: #b24735; }
.result-count { color: #a44837; }
.featured-spreadsheet-link { min-height: 50px; padding: 13px 18px; background: #e95843; color: #fff; }
.featured-spreadsheet-link:hover { background: #cf3f2d; }
.toolbar { border-radius: 14px; border-color: #eddfd9; box-shadow: 0 7px 24px rgba(107, 59, 42, .05); }
.search-wrap input, .toolbar select { background-color: #fff8f4; border-radius: 9px; }
.search-wrap input:focus, .toolbar select:focus { box-shadow: inset 0 0 0 2px #e95843; }
.product-grid { gap: 28px 17px; }
.product-card {
  border: 1px solid #efe7e2;
  border-radius: 13px;
  overflow: hidden;
  background: #fff;
  transition: box-shadow .2s, transform .2s, border-color .2s;
}
.product-card:hover { border-color: #eabcae; box-shadow: 0 14px 30px rgba(100, 60, 44, .1); transform: translateY(-3px); }
.product-image { aspect-ratio: 1/1.06; background: #f8f4f1; }
.qc-badge { position: absolute; z-index: 1; top: 11px; left: 11px; padding: 7px 9px; border-radius: 6px; background: rgba(255,255,255,.94); color: #403832; font: 800 10px/1 var(--display); letter-spacing: .02em; box-shadow: 0 2px 9px rgba(30, 25, 20, .12); pointer-events: none; }
.qc-badge.has-qc { background: #e95843; color: #fff; }
.image-action { background: #171717; border-radius: 6px; }
.image-action span { color: #ff816d; }
.product-info { padding: 14px 15px 16px; }
.product-topline { color: #b34c3b; }
.product-topline span:last-child:not(:first-child) { color: #a44837; }
.product-info h3 { min-height: 42px; }
.price span { color: #8b807b; }
.empty-state { border-color: #efc6b9; border-radius: 13px; }
.empty-state>span { color: #e95843; }

.category-intro { padding-top: 26px; padding-bottom: 24px; }
.category-intro .breadcrumb { margin-bottom: 18px; }
.category-intro .eyebrow { margin: 0 0 9px; color: #a74735; }
.category-intro h1 { margin: 0; font: 800 clamp(34px, 4.2vw, 56px)/1.08 var(--display); letter-spacing: -.065em; }
.category-intro h1 em { color: #d94633; font-style: normal; }
.category-description { margin: 12px 0 0; color: #5e514c; font-size: 15px; line-height: 1.55; }
.category-qc-note { margin: 7px 0 0; color: #897a73; font-size: 12px; line-height: 1.45; }
.category-cta { display: inline-flex; align-items: center; justify-content: center; gap: 15px; min-height: 44px; padding: 11px 16px; border-radius: 8px; font: 800 13px/1.25 var(--display); text-align: center; transition: background .2s, border-color .2s, transform .2s; }
.category-cta:hover { transform: translateY(-2px); }
.category-cta:focus-visible { outline: 3px solid #191919; outline-offset: 3px; }
.category-cta span { font-size: 17px; line-height: 1; }
.category-cta-primary { margin-top: 17px; background: #e95843; color: #fff; }
.category-cta-primary:hover { background: #cf3f2d; }
.category-cta-secondary { border: 1px solid #e9b9a9; background: #fff7f3; color: #aa4332; }
.category-cta-secondary:hover { border-color: #c9543c; background: #fff0e9; }
.category-directory { padding-top: 0; padding-bottom: 64px; }
.category-list-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 17px; }
.category-list-bar>span { color: #aa4937; font: 800 11px/1.3 var(--display); letter-spacing: .1em; text-transform: uppercase; }
.category-editorial { max-width: 1040px; padding-bottom: 90px; }
.category-editorial>.eyebrow { margin: 0 0 11px; color: #aa4532; }
.category-editorial h2 { margin: 0 0 17px; color: #201b1a; font: 800 clamp(29px, 3.2vw, 42px)/1.15 var(--display); letter-spacing: -.055em; }
.category-editorial-lede { max-width: 900px; margin: 0 0 19px; color: #554c47; font-size: 17px; line-height: 1.76; }
.category-editorial-context { max-width: 900px; margin: 22px 0 0; color: #554c47; font-size: 16px; line-height: 1.76; }
.category-editorial-context a, .share-story p a { color: #b44634; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.category-editorial-data { max-width: 900px; margin: 0; padding: 13px 17px; border-left: 3px solid #e95843; background: #fff5f0; color: #715d53; font-size: 14px; line-height: 1.6; }
.category-editorial-section { margin-top: 44px; }
.category-editorial-section h3 { margin: 0 0 17px; color: #201b1a; font: 800 clamp(22px, 2.2vw, 28px)/1.2 var(--display); letter-spacing: -.035em; }
.category-editorial-table-wrap { overflow-x: auto; }
.category-editorial table { width: 100%; border-collapse: collapse; color: #564b45; font-size: 15px; line-height: 1.55; }
.category-editorial th, .category-editorial td { border: 1px solid #eadfd8; padding: 13px 15px; text-align: left; vertical-align: top; }
.category-editorial th { background: #fff5f0; color: #3c302b; font-weight: 800; }
.category-editorial td:first-child { color: #302823; font-weight: 700; }
.category-editorial-section ul { display: grid; gap: 11px; max-width: 900px; margin: 0; padding-left: 23px; color: #554c47; font-size: 16px; line-height: 1.7; }
.category-editorial-section li { padding-left: 5px; }
.category-editorial-faq { max-width: 900px; }
.category-editorial-faq details { border-top: 1px solid #eadfd8; }
.category-editorial-faq details:last-child { border-bottom: 1px solid #eadfd8; }
.category-editorial-faq summary { padding: 17px 0; color: #302823; font-size: 16px; font-weight: 800; cursor: pointer; }
.category-editorial-faq summary:hover { color: #b44634; }
.category-editorial-faq details p { margin: 0 0 19px; color: #60534c; font-size: 15px; line-height: 1.7; }
.category-editorial-links { display: flex; align-items: center; flex-wrap: wrap; gap: 11px; margin-top: 48px; padding-top: 25px; border-top: 1px solid #eadfd8; }
.category-editorial-links strong { margin-right: 6px; color: #302823; font: 800 13px var(--display); }
.category-editorial-links a { padding: 9px 13px; border: 1px solid #ead7ce; border-radius: 7px; color: #a74432; font-size: 13px; font-weight: 800; }
.category-editorial-links a:hover { background: #fff0e9; border-color: #e5a28e; }

.guide-teaser { background: linear-gradient(100deg, #ffded0, #fff0e6); border-radius: 18px; }
.guide-teaser .eyebrow { color: #a74735; }
.guide-teaser p:last-child { color: #62524d; }
.guide-page>.eyebrow { color: #a74735; }
.guide-lede, .guide-steps p { color: #5e514c; }
.guide-steps section>span { color: #e95843; }
.guide-steps p a { text-decoration-color: #e95843; }
.guide-callout { background: #241c1a; border-radius: 18px; }
.guide-callout p { color: #ff967e; }
.guide-callout a { border-color: #ff816d; }
.guide-longform { max-width: 1200px; }
.guide-longform .breadcrumb { margin-bottom: 30px; }
.guide-hero { padding: clamp(32px, 5vw, 66px); background: linear-gradient(118deg, #fff5ee 12%, #ffd9ca 100%); border-radius: 22px; }
.guide-hero .eyebrow { margin: 0 0 22px; color: #a74735; }
.guide-hero h1 { max-width: 920px; font-size: clamp(42px, 5.6vw, 77px); }
.guide-hero .guide-lede { max-width: 800px; margin: 27px 0 30px; font-size: clamp(16px, 1.65vw, 20px); line-height: 1.65; }
.guide-scope { max-width: 780px; padding: 18px 22px; border-left: 4px solid #e95843; background: rgba(255,255,255,.76); }
.guide-scope strong { display: block; margin-bottom: 5px; color: #32251f; font: 800 14px var(--display); }
.guide-scope p { margin: 0; color: #65534c; font-size: 14px; line-height: 1.65; }
.guide-route { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 1px; margin: 22px 0 74px; overflow: hidden; border: 1px solid #ead9d0; border-radius: 15px; background: #ead9d0; }
.guide-route>div { display: grid; gap: 6px; min-width: 0; padding: 21px 24px; background: #fffdfa; }
.guide-route span { color: #c94b38; font: 800 11px var(--display); letter-spacing: .12em; }
.guide-route strong { font: 800 19px var(--display); }
.guide-route small { color: #776860; font-size: 12px; line-height: 1.4; }
.guide-article-header { max-width: 860px; margin: 0 auto 42px; padding: 0 0 28px; border-bottom: 1px solid #e6dcd5; }
.guide-article-header .eyebrow { margin: 0 0 15px; color: #a74735; }
.guide-article-header h1 { margin: 0; color: #211d1b; font: 800 clamp(36px, 4vw, 55px)/1.08 var(--display); letter-spacing: -.055em; }
.guide-article-header .guide-lede { max-width: 820px; margin: 20px 0 15px; font-size: 18px; line-height: 1.65; }
.guide-article-scope { margin: 0; color: #796860; font-size: 14px; line-height: 1.55; }
.guide-article-scope strong { color: #443831; }
.guide-article-body { max-width: 860px; margin: 0 auto; }
.guide-content { min-width: 0; }
.guide-chapter { margin-bottom: 48px; padding-bottom: 48px; border-bottom: 1px solid #e6dcd5; scroll-margin-top: 22px; }
.guide-chapter:last-child { margin-bottom: 0; border-bottom: 0; }
.guide-kicker { margin: 0 0 12px; color: #af4a37; font: 800 11px var(--display); letter-spacing: .15em; }
.guide-chapter h2 { max-width: 800px; margin: 0 0 20px; color: #211d1b; font: 800 clamp(26px, 2.7vw, 34px)/1.2 var(--display); letter-spacing: -.04em; }
.guide-chapter>p:not(.guide-kicker) { max-width: 820px; margin: 0 0 19px; color: #5c504a; font-size: 17px; line-height: 1.78; }
.guide-chapter>p a, .guide-tip a { color: #b44634; font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
.guide-tip { display: grid; gap: 6px; max-width: 820px; margin-top: 27px; padding: 20px 23px; border-radius: 13px; background: #fff1e9; color: #5b4c45; font-size: 14px; line-height: 1.65; }
.guide-tip strong { color: #9b3d2f; font: 800 13px var(--display); }
.guide-list { max-width: 820px; margin: 6px 0 22px; padding-left: 22px; color: #5c504a; font-size: 15px; line-height: 1.75; }
.guide-list li { padding-left: 5px; margin-bottom: 9px; }
.guide-list strong { color: #2d2622; }
.guide-check-grid, .guide-category-notes { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 13px; max-width: 820px; margin: 25px 0; }
.guide-check-grid>div, .guide-category-notes>div { padding: 22px; border: 1px solid #eadbd2; border-radius: 13px; background: #fffdfa; }
.guide-check-grid strong { font: 800 17px var(--display); }
.guide-check-grid p, .guide-category-notes p { margin: 10px 0 0; color: #665952; font-size: 14px; line-height: 1.65; }
.guide-category-notes>div>a { color: #b44634; font: 800 16px var(--display); }
.guide-category-notes>div>a:hover { text-decoration: underline; text-underline-offset: 3px; }
.guide-category-notes p a { color: #b44634; text-decoration: underline; text-underline-offset: 3px; }
.guide-formula { display: flex; align-items: stretch; flex-wrap: wrap; gap: 8px; max-width: 820px; margin: 27px 0; }
.guide-formula span { display: grid; place-items: center; min-height: 53px; padding: 12px 14px; border-radius: 9px; background: #ffe4d9; color: #502f27; font: 800 12px/1.3 var(--display); text-align: center; }
.guide-formula b { align-self: center; color: #be4b38; }
.guide-checklist { display: grid; gap: 10px; max-width: 820px; margin: 28px 0 24px; padding: 0; list-style: none; }
.guide-checklist li { display: grid; grid-template-columns: 40px 1fr; gap: 14px; align-items: start; padding: 16px 18px; border: 1px solid #e8dbd4; border-radius: 11px; background: #fffdfa; }
.guide-checklist span { color: #ca4937; font: 800 12px var(--display); }
.guide-checklist p { margin: 0; color: #60534d; font-size: 14px; line-height: 1.6; }
.guide-checklist strong { color: #2d2521; }
.guide-longform>.guide-callout { margin-top: 63px; }
.guide-hub { max-width: 1200px; padding-top: 30px; padding-bottom: 100px; }
.guide-hub .breadcrumb { margin-bottom: 25px; }
.guide-hub-intro { display: grid; grid-template-columns: 1fr .85fr; column-gap: 45px; align-items: end; padding: clamp(26px, 2.8vw, 38px); border-radius: 20px; background: linear-gradient(115deg, #fff3ec, #ffddce); }
.guide-hub-intro .eyebrow { grid-column: 1; margin: 0 0 16px; color: #a74735; }
.guide-hub-intro h1 { grid-column: 1; grid-row: 2 / 4; max-width: 640px; margin: 0; font: 800 clamp(39px, 4vw, 53px)/1.07 var(--display); letter-spacing: -.065em; }
.guide-hub-intro h1 em { color: #d94633; font-style: normal; }
.guide-hub-intro>p:not(.eyebrow) { grid-column: 2; grid-row: 2; max-width: 570px; margin: 0 0 16px; color: #5e514c; font-size: 16px; line-height: 1.5; }
.guide-hub-note { grid-column: 2; grid-row: 3; max-width: 570px; color: #775f55; font-size: 13px; line-height: 1.55; }
.guide-hub-group { margin-top: 43px; }
.guide-hub-group-heading { display: grid; grid-template-columns: 155px 260px minmax(0,1fr); align-items: baseline; gap: 18px; margin-bottom: 16px; }
.guide-hub-group-heading span { color: #b34c39; font: 800 11px var(--display); letter-spacing: .1em; }
.guide-hub-group-heading h2 { margin: 0; font: 800 clamp(25px, 2.5vw, 32px) var(--display); letter-spacing: -.04em; }
.guide-hub-group-heading p { margin: 0; color: #6d5c55; font-size: 14px; line-height: 1.5; }
.guide-article-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 15px; }
.guide-article-card { display: flex; flex-direction: column; min-height: 205px; padding: 25px 27px; border: 1px solid #ead9d0; border-radius: 14px; background: #fffdfa; transition: border-color .2s, box-shadow .2s, transform .2s; }
.guide-article-card:hover, .guide-article-card:focus-visible { border-color: #e95843; box-shadow: 0 14px 28px #a7473519; transform: translateY(-2px); }
.guide-card-top { display: flex; justify-content: space-between; gap: 15px; color: #ac4533; font: 800 11px var(--display); letter-spacing: .11em; text-transform: uppercase; }
.guide-card-top>span:last-child { font-size: 20px; line-height: 12px; }
.guide-article-card h3 { margin: 23px 0 9px; color: #211d1b; font: 800 clamp(19px, 2vw, 25px)/1.15 var(--display); letter-spacing: -.04em; }
.guide-article-card p { max-width: 480px; margin: 0 0 20px; color: #695b54; font-size: 14px; line-height: 1.55; }
.guide-card-action { margin-top: auto; color: #bb4734; font: 800 12px var(--display); }
.guide-card-action span { margin-left: 7px; }
.guide-hub-bottom { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-top: 50px; padding: 26px 30px; border-radius: 13px; background: #241c1a; color: #fff; }
.guide-hub-bottom p { margin: 0; font: 800 20px var(--display); }
.guide-hub-bottom a { color: #ff9d85; font-size: 13px; font-weight: 800; }
.guide-detail .guide-chapter>p:not(.guide-kicker) a { color: #b44634; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.guide-related { margin-top: 62px; padding-top: 32px; border-top: 1px solid #e6dcd5; }
.guide-related-heading { display: flex; align-items: baseline; flex-wrap: wrap; gap: 12px 22px; margin-bottom: 19px; }
.guide-related-heading .guide-kicker { flex: 0 0 100%; margin: 0; }
.guide-related-heading h2 { margin: 0; font: 800 30px var(--display); letter-spacing: -.04em; }
.guide-related-heading>a { margin-left: auto; color: #b44634; font-size: 13px; font-weight: 800; }
.faq-section { padding: 82px 0 90px; background: #fff8f4; border-top: 1px solid #f1e4dd; }
.faq-layout { display: grid; grid-template-columns: minmax(260px, .8fr) minmax(0, 1.2fr); gap: clamp(38px, 6vw, 94px); align-items: start; }
.faq-intro .eyebrow { margin: 0 0 19px; color: #aa4937; }
.faq-intro h2 { max-width: 420px; margin: 0; font: 800 clamp(34px, 3.4vw, 50px)/1.08 var(--display); letter-spacing: -.055em; }
.faq-intro p:not(.eyebrow) { max-width: 390px; margin: 20px 0 25px; color: #655752; font-size: 15px; line-height: 1.7; }
.faq-intro>a { color: #b94835; font-size: 13px; font-weight: 800; text-decoration: underline; text-underline-offset: 5px; }
.faq-intro>a span { margin-left: 4px; }
.faq-list { border-top: 1px solid #e9d8cf; }
.faq-item { border-bottom: 1px solid #e9d8cf; }
.faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 21px 0; color: #25201e; font: 800 17px/1.4 var(--display); cursor: pointer; list-style: none; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:hover, .faq-item[open] summary { color: #ba4835; }
.faq-item summary:focus-visible { outline: 2px solid #e95843; outline-offset: 3px; }
.faq-item summary span { display: grid; place-items: center; flex: none; width: 27px; height: 27px; border-radius: 50%; background: #ffe4d8; color: #bc4b38; font: 700 20px/1 var(--display); transition: transform .2s; }
.faq-item[open] summary span { transform: rotate(45deg); }
.faq-answer { padding: 0 48px 22px 0; }
.faq-answer p { margin: 0; color: #5f534e; font-size: 14px; line-height: 1.75; }
.faq-answer a { color: #b94835; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.site-footer { background: #1e1b1a; }
.footer-grid .footer-wordmark { display: inline-flex; align-items: center; gap: 12px; max-width: 100%; padding: 11px 14px; margin-bottom: 20px; background: #fff; border-radius: 10px; }
.footer-wordmark img { display: block; width: 200px; height: 37px; object-fit: contain; flex: none; }
.footer-wordmark span { color: #d94130; font: 800 13px/1.1 var(--display); letter-spacing: .01em; }
.footer-wordmark:focus-visible { outline: 3px solid #ff816d; outline-offset: 3px; }
.footer-bottom { border-color: #4c403c; }

@media(max-width:1100px) {
  .nav-inner { flex-wrap: wrap; gap: 8px 16px; padding-top: 10px; padding-bottom: 10px; }
  .site-header nav { order: 3; width: 100%; flex-wrap: wrap; gap: 10px 18px; }
  .language-switch { order: 2; }
  .hero { gap: 35px; }
  .hero h1 { font-size: clamp(48px, 5vw, 68px); }
  .category-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .compact .category-links { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media(max-width:760px) {
  .nav-inner { display: flex; }
  .wordmark { margin-bottom: 0; }
  .site-header nav { margin-inline: 0; padding: 0 0 4px; }
  .hero-chips { flex-wrap: wrap; width: auto; max-width: 100%; }
  .hero-chips .hero-spreadsheet-link { margin-left: 0; }
  html { scroll-padding-top: 118px; }
  .guide-hub { padding-top: 20px; padding-bottom: 65px; }
  .guide-hub-intro { display: block; padding: 29px 22px; }
  .guide-hub-intro h1 { font-size: clamp(39px, 9vw, 54px); }
  .guide-hub-intro>p:not(.eyebrow) { margin: 17px 0 0; font-size: 15px; }
  .guide-hub-note { margin-top: 16px; }
  .guide-hub-group { margin-top: 34px; }
  .guide-hub-group-heading { display: block; }
  .guide-hub-group-heading h2 { margin-top: 5px; }
  .guide-hub-group-heading p { margin-top: 7px; }
  .guide-article-grid { grid-template-columns: 1fr; gap: 11px; }
  .guide-article-card { min-height: 0; padding: 21px; }
  .guide-article-card h3 { margin-top: 17px; }
  .guide-hub-bottom { display: block; padding: 24px; }
  .guide-hub-bottom a { display: inline-block; margin-top: 13px; }
  .guide-article-header { margin-bottom: 30px; padding-bottom: 24px; }
  .guide-article-header h1 { font-size: clamp(34px, 8vw, 43px); }
  .guide-article-header .guide-lede { margin-top: 17px; font-size: 16px; }
  .guide-related { margin-top: 40px; }
  .guide-longform { padding-top: 20px; }
  .guide-longform .breadcrumb { margin-bottom: 18px; }
  .guide-hero { padding: 31px 23px; border-radius: 16px; }
  .guide-hero h1 { font-size: clamp(41px, 10vw, 58px); }
  .guide-hero .guide-lede { margin: 20px 0 25px; }
  .guide-route { grid-template-columns: repeat(2, minmax(0,1fr)); margin-bottom: 44px; }
  .guide-route>div { padding: 16px; }
  .guide-chapter { margin-bottom: 42px; padding-bottom: 42px; }
  .guide-chapter>p:not(.guide-kicker) { font-size: 15px; }
  .guide-longform>.guide-callout { margin-top: 35px; }
  .faq-section { padding: 54px 0 66px; }
  .faq-layout { grid-template-columns: 1fr; gap: 30px; }
  .faq-intro h2 { font-size: 36px; }
  .faq-item summary { padding: 18px 0; font-size: 16px; }
  .faq-answer { padding-right: 8px; }
  .hero-showcase { background-position: 17% center; }
  .nav-inner { min-height: 0; }
  .site-header nav { gap: 22px; }
  .site-header nav a { font-size: 13px; }
  .nav-dropdown summary { font-size: 13px; }
  .nav-menu { left: -71px; width: min(280px, calc(100vw - 32px)); }
  .nav-dropdown--guide .nav-menu { left: -110px; width: min(300px, calc(100vw - 32px)); }
  .nav-dropdown--blog .nav-menu { left: auto; right: 0; width: min(260px, calc(100vw - 32px)); }
  .category-showcase { padding: 42px 0 52px; }
  .category-showcase h2 { margin-bottom: 27px; }
  .category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 12px; }
  .category-label { font-size: 16px; margin-top: 10px; }
  .compact .category-links { display: flex; overflow-x: auto; scrollbar-width: none; margin-inline: -16px; padding: 0 16px 8px; }
  .compact .category-links::-webkit-scrollbar { display: none; }
  .compact .category-links a { flex: 0 0 132px; min-height: 54px; }
  .hero { gap: 24px; padding-top: 42px; padding-bottom: 46px; min-height: 0; }
  .hero h1 { font-size: clamp(45px, 10.7vw, 65px); }
  .hero-intro { font-size: 15px; }
  .hero-search { min-height: 58px; }
  .hero-search button { padding: 0 16px; }
  .hero-search button span { margin-left: 4px; }
  .hero-visual { min-height: 0; padding: 13px 5px 0; }
  .hero-products { min-height: 355px; }
  .hero-products a { border-width: 4px; }
  .hero-products span { font-size: 8px; }
  .browse-band { padding: 33px 0; }
  .category-links a { min-height: 65px; }
  .directory { padding-top: 48px; }
  .featured-directory .directory-heading { flex-wrap: wrap; }
  .featured-spreadsheet-link { width: 100%; }
  .product-grid { gap: 13px 9px; }
  .product-info { padding: 10px; }
  .category-intro { padding-top: 18px; padding-bottom: 21px; }
  .category-intro .breadcrumb { margin-bottom: 14px; }
  .category-intro h1 { font-size: clamp(31px, 8.7vw, 44px); }
  .category-description { margin-top: 9px; font-size: 13px; }
  .category-qc-note { font-size: 11px; }
  .category-directory { padding-top: 0; }
  .category-list-bar { flex-wrap: wrap; }
  .category-list-bar .category-cta { width: 100%; }
  .category-editorial { padding-bottom: 64px; }
  .category-editorial-lede { font-size: 16px; }
  .category-editorial-section { margin-top: 36px; }
  .category-editorial table, .category-editorial tbody, .category-editorial tr, .category-editorial td { display: block; width: 100%; }
  .category-editorial thead { display: none; }
  .category-editorial tr { margin-bottom: 10px; border: 1px solid #eadfd8; border-radius: 9px; overflow: hidden; }
  .category-editorial td { display: grid; grid-template-columns: minmax(92px, 34%) 1fr; gap: 10px; border: 0; border-bottom: 1px solid #eee4de; padding: 11px 13px; font-size: 14px; }
  .category-editorial td:last-child { border-bottom: 0; }
  .category-editorial td::before { content: attr(data-label); color: #a74432; font-weight: 800; }
  .category-editorial-section ul { font-size: 15px; }
  .category-editorial-links { margin-top: 35px; }
  .category-editorial-links strong { flex: 0 0 100%; }
  .guide-teaser { border-radius: 15px; }
}
@media(max-width:430px) {
  .wordmark img { width: 160px; height: auto; }
  .site-header nav { flex-wrap: wrap; column-gap: 14px; row-gap: 8px; }
  .site-header nav a, .nav-dropdown summary { font-size: 12px; }
  .qc-badge { top: 8px; left: 8px; padding: 6px 7px; font-size: 9px; }
  .guide-check-grid, .guide-category-notes { grid-template-columns: 1fr; }
  .guide-formula { display: grid; grid-template-columns: 1fr; gap: 3px; }
  .guide-formula span { min-height: 45px; }
  .guide-formula b { text-align: center; }
  .hero-search input { font-size: 13px; padding: 0 7px; }
  .hero-search svg { margin-left: 10px; width: 17px; }
  .hero-search button { font-size: 12px; padding: 0 12px; }
  .hero-search button span { display: none; }
  .hero-products { min-height: 275px; }
  .hero-visual-header, .hero-visual-footer { font-size: 8px; }
  .product-info h3 { font-size: 11px; }
}
@media(max-width:360px) {
  .footer-grid .footer-wordmark { flex-direction: column; align-items: flex-start; gap: 5px; }
}

/* Editorial blog: simple article list and readable long-form pages. */
.blog-page { background: #faf8f6; padding: 34px 0 100px; }
.blog-shell { max-width: 1050px; }
.blog-shell>.breadcrumb { margin-bottom: 35px; }
.blog-index-head { max-width: 790px; margin: 0 0 43px; }
.blog-index-head h1 { font: 800 clamp(42px, 5.2vw, 66px)/1.08 var(--display); letter-spacing: -.055em; margin: 14px 0 19px; }
.blog-index-head h1 em { color: #d94633; font-style: normal; }
.blog-index-head>p:last-child { max-width: 720px; margin: 0; color: #5d5551; font-size: 17px; line-height: 1.72; }
.blog-index-head a, .blog-content-section a { color: #bf3c2c; text-decoration: underline; text-underline-offset: 3px; }
.blog-index-list { display: grid; gap: 14px; }
.blog-list-card { display: grid; grid-template-columns: 62px 1fr; gap: 20px; padding: 28px 31px; background: #fff; border: 1px solid #ecded6; border-radius: 13px; transition: border-color .2s, box-shadow .2s; }
.blog-list-card:hover { border-color: #e59b86; box-shadow: 0 12px 32px rgba(86, 51, 34, .07); }
.blog-list-number { color: #ed8d77; font: 800 30px/1 var(--display); letter-spacing: -.06em; }
.blog-meta { display: flex; flex-wrap: wrap; gap: 8px 17px; color: #9c4a38; font: 800 11px var(--display); letter-spacing: .055em; text-transform: uppercase; }
.blog-meta span+span::before { content: '•'; margin-right: 17px; color: #cdb9ae; }
.blog-list-card h2 { margin: 12px 0 9px; font: 800 clamp(22px, 2.8vw, 30px)/1.2 var(--display); letter-spacing: -.035em; }
.blog-list-card h2 a:hover { color: #d94633; }
.blog-list-card p { max-width: 760px; margin: 0 0 16px; color: #665d57; font-size: 15px; line-height: 1.65; }
.blog-read { color: #c7402d; font: 800 12px var(--display); }
.blog-read span { margin-left: 5px; }
.blog-article { width: min(100%, 800px); margin: 0 auto; }
.blog-article-head { padding: 9px 0 28px; }
.blog-article-head h1 { margin: 16px 0 20px; font: 800 clamp(36px, 4.8vw, 58px)/1.1 var(--display); letter-spacing: -.055em; }
.blog-lead { margin: 0; color: #5b514d; font-size: 19px; line-height: 1.7; }
.blog-head-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 25px; }
.blog-head-actions a, .blog-end-cta a { display: inline-flex; align-items: center; justify-content: space-between; gap: 15px; padding: 12px 17px; border: 1px solid #e4c4b7; border-radius: 8px; background: #fff; color: #ab3929; font: 800 12px var(--display); }
.blog-head-actions a:first-child { background: #ef553f; border-color: #ef553f; color: #fff; }
.blog-head-actions a:hover, .blog-end-cta a:hover { transform: translateY(-2px); }
.blog-article-body { color: #3f3936; }
.blog-snapshot-note { margin: 0 0 39px; padding: 19px 21px; background: #fff0e9; border-left: 3px solid #f15a44; border-radius: 0 9px 9px 0; }
.blog-snapshot-note strong { font: 800 13px var(--display); color: #983926; }
.blog-snapshot-note p { margin: 7px 0 0; font-size: 14px; line-height: 1.65; }
.blog-content-section { margin: 0 0 43px; }
.blog-content-section h2 { font: 800 clamp(25px, 3vw, 31px)/1.22 var(--display); letter-spacing: -.04em; color: #1d1b1a; margin: 0 0 17px; }
.blog-content-section p { margin: 0 0 16px; font-size: 16px; line-height: 1.82; }
.blog-content-section p:last-child { margin-bottom: 0; }
.blog-references { margin-top: 24px; border: 1px solid #eaded6; border-radius: 10px; background: #fff; overflow: hidden; }
.blog-references summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 21px; color: #2b211d; font: 800 16px var(--display); cursor: pointer; list-style: none; }
.blog-references summary::-webkit-details-marker { display: none; }
.blog-references summary:focus-visible { outline: 3px solid #d94633; outline-offset: -3px; }
.blog-references summary span { color: #c24431; font-size: 23px; line-height: 1; transition: transform .2s; }
.blog-references[open] summary span { transform: rotate(180deg); }
.blog-reference-content { padding: 0 21px 20px; border-top: 1px solid #f0e4de; }
.blog-reference-content p { font-size: 13px; line-height: 1.6; color: #71655f; margin: 16px 0 10px; }
.blog-reference-content ol { margin: 0; padding-left: 22px; }
.blog-reference-content li { margin: 12px 0; padding-left: 5px; font-size: 14px; line-height: 1.6; }
.blog-reference-content li>span { display: block; margin-top: 3px; color: #71655f; font-size: 12px; }
.blog-reference-content a { color: #b73d2b; text-decoration: underline; text-underline-offset: 2px; }
.blog-end-cta { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 42px; padding: 22px; background: #ffece3; border-radius: 10px; }
.blog-end-cta p { margin: 0; font: 800 17px var(--display); }
.blog-related { margin: 70px auto 0; width: min(100%, 800px); border-top: 1px solid #e8d8cf; padding-top: 27px; }
.blog-related-head, .home-blog-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; }
.blog-related-head h2 { margin: 0; font: 800 25px var(--display); }
.blog-related-head>a, .home-blog-heading>a { color: #bc3e2c; font: 800 12px var(--display); }
.blog-related>div:last-child, .home-blog-links { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; margin-top: 18px; }
.blog-related>div:last-child>a, .home-blog-links>a { min-height: 140px; display: flex; flex-direction: column; align-items: flex-start; gap: 9px; padding: 18px; background: #fff; border: 1px solid #eaded6; border-radius: 9px; }
.blog-related>div:last-child>a:hover, .home-blog-links>a:hover { border-color: #e99a87; }
.blog-related>div:last-child>a span:first-child, .home-blog-links>a span:first-child { color: #b44331; font: 800 10px var(--display); text-transform: uppercase; }
.blog-related>div:last-child>a strong, .home-blog-links>a strong { color: #211d1b; font: 800 15px/1.4 var(--display); }
.blog-related>div:last-child>a span:last-child, .home-blog-links>a span:last-child { color: #c54835; margin-top: auto; }
.home-blog { padding-top: 34px; padding-bottom: 85px; }
.home-blog-heading h2 { margin: 5px 0 0; font: 800 clamp(28px, 3vw, 39px) var(--display); letter-spacing: -.04em; }
.home-blog-links>a { background: #fffaf7; }
@media(max-width:760px) {
  .blog-page { padding: 21px 0 65px; }
  .blog-shell>.breadcrumb { margin-bottom: 24px; }
  .blog-index-head { margin-bottom: 26px; }
  .blog-index-head>p:last-child { font-size: 15px; }
  .blog-list-card { grid-template-columns: 1fr; gap: 7px; padding: 21px; }
  .blog-list-number { font-size: 21px; }
  .blog-list-card h2 { font-size: 23px; }
  .blog-meta { font-size: 10px; gap: 5px 9px; }
  .blog-meta span+span::before { margin-right: 9px; }
  .blog-article-head h1 { font-size: clamp(34px, 8vw, 47px); }
  .blog-lead { font-size: 16px; }
  .blog-content-section p { font-size: 15px; }
  .blog-related>div:last-child, .home-blog-links { grid-template-columns: 1fr; }
  .blog-related>div:last-child>a, .home-blog-links>a { min-height: 90px; }
  .blog-end-cta, .home-blog-heading { align-items: flex-start; flex-direction: column; }
  .home-blog { padding-bottom: 58px; }
}

/* Community buyer shares: horizontal photo cards and a narrow reading layout. */
.shares-page { padding: 36px 0 94px; background: #f7f8fa; }
.shares-shell { max-width: 1120px; }
.shares-back { display: inline-block; margin-bottom: 32px; color: #dd513d; font-size: 13px; font-weight: 800; }
.shares-back:hover, .share-source-link:hover, .share-read:hover { text-decoration: underline; text-underline-offset: 4px; }
.shares-intro { max-width: 760px; margin-bottom: 27px; }
.shares-intro .eyebrow { margin: 0 0 12px; font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.shares-intro h1 { max-width: 670px; margin: 0 0 17px; font: 800 clamp(34px, 4vw, 47px)/1.12 var(--display); letter-spacing: -.045em; }
.shares-intro h1 em { font-style: normal; color: #dc4d39; }
.shares-intro>p:last-child { max-width: 640px; margin: 0; color: #5d626a; font-size: 16px; line-height: 1.65; }
.shares-filters { display: flex; flex-wrap: wrap; gap: 9px; margin: 0 0 25px; }
.shares-filters button { border: 1px solid #e4e5e8; border-radius: 999px; padding: 9px 15px; background: #fff; color: #4d5157; cursor: pointer; font: 800 12px var(--display); }
.shares-filters button:hover, .shares-filters button[aria-pressed="true"] { border-color: #e75a43; background: #e9553e; color: #fff; }
.shares-list { display: grid; gap: 17px; }
.share-card { display: grid; grid-template-columns: minmax(275px, 34%) 1fr; min-height: 325px; overflow: hidden; border: 1px solid #e3e5e8; border-radius: 15px; background: #fff; box-shadow: 0 10px 26px rgba(34, 40, 50, .035); }
.share-card[hidden] { display: none; }
.share-card-image { position: relative; display: block; min-height: 100%; overflow: hidden; background: #edece9; }
.share-card-image img { display: block; width: 100%; height: 100%; min-height: 325px; object-fit: cover; transition: transform .25s; }
.share-card:hover .share-card-image img { transform: scale(1.035); }
.share-card-image>span { position: absolute; left: 17px; bottom: 17px; padding: 7px 10px; border-radius: 7px; background: rgba(20,20,20,.83); color: #fff; font-size: 11px; font-weight: 800; }
.share-card-copy { display: flex; flex-direction: column; padding: clamp(23px, 3vw, 35px); }
.share-card-kicker, .share-article-meta { margin: 0; color: #bd4d39; font: 800 11px var(--display); letter-spacing: .07em; text-transform: uppercase; }
.share-card-kicker span { margin: 0 8px; color: #bbb; }
.share-card h2 { margin: 15px 0 10px; font: 800 clamp(23px, 2.65vw, 31px)/1.2 var(--display); letter-spacing: -.035em; }
.share-card h2 a:hover { color: #d84b37; }
.share-card-copy>p:not(.share-card-kicker) { max-width: 650px; margin: 0 0 18px; color: #62666d; font-size: 14px; line-height: 1.65; }
.share-facts, .share-tags { display: flex; flex-wrap: wrap; gap: 7px; }
.share-facts>span { padding: 8px 11px; border: 1px solid #e1e4e8; border-radius: 7px; background: #fff; color: #373c44; font-size: 11px; font-weight: 800; }
.share-tags { margin-top: 13px; }
.share-tags>span { padding: 6px 9px; border-radius: 999px; background: #fff0e9; color: #b9503a; font-size: 10px; font-weight: 800; }
.share-read { align-self: flex-start; margin-top: auto; padding-top: 24px; color: #d84b37; font-size: 12px; font-weight: 800; }
.shares-bottom { display: flex; align-items: center; justify-content: space-between; gap: 28px; margin-top: 38px; padding: 30px; border-radius: 15px; background: #fff0e9; }
.shares-bottom .eyebrow { margin: 0 0 6px; font-size: 10px; font-weight: 800; }
.shares-bottom h2 { margin: 0 0 7px; font: 800 26px var(--display); }
.shares-bottom p:last-child { margin: 0; color: #6b5c55; font-size: 13px; }
.shares-bottom>a { flex: none; padding: 12px 16px; border-radius: 7px; background: #e9553e; color: #fff; font-size: 12px; font-weight: 800; }
.shares-article-shell { max-width: 900px; }
.share-article>header { padding-bottom: 29px; }
.share-article h1 { margin: 16px 0 17px; font: 800 clamp(31px, 4vw, 43px)/1.16 var(--display); letter-spacing: -.045em; }
.share-article-lead { margin: 0 0 20px; color: #5d626a; font-size: 17px; line-height: 1.7; }
.share-article .share-facts { align-items: center; }
.share-source-link { display: inline-flex; align-items: center; gap: 4px; padding: 8px 11px; border: 1px solid #e9553e; border-radius: 7px; background: #fff; color: #d34d38; font-size: 11px; font-weight: 800; white-space: nowrap; }
.share-article .share-tags { margin-top: 17px; }
.share-gallery { margin: 0 0 34px; }
.share-gallery-stage { display: grid; grid-template-columns: 2fr 1fr; gap: 10px; height: clamp(330px, 48vw, 520px); overflow: hidden; border-radius: 12px; background: #e6e8ea; }
.share-gallery-stage:has(.share-gallery-next[hidden]) { grid-template-columns: 1fr; }
.share-gallery-stage>img, .share-gallery-next img { display: block; width: 100%; height: 100%; object-fit: contain; background: #e8e8e8; }
.share-gallery-next { min-width: 0; overflow: hidden; }
.share-gallery-next img { object-fit: cover; }
.share-gallery-next[hidden] { display: none; }
.share-gallery-controls { display: flex; align-items: center; justify-content: center; gap: 20px; margin: 13px 0 7px; color: #61666d; font-size: 12px; font-weight: 800; }
.share-gallery-controls button { width: 34px; height: 34px; border: 1px solid #d8dce0; border-radius: 50%; background: #fff; color: #353b42; cursor: pointer; }
.share-gallery-controls button:hover:not(:disabled) { border-color: #e9553e; color: #d64b36; }
.share-gallery-controls button:disabled { opacity: .4; cursor: default; }
.share-gallery figcaption { color: #85898f; font-size: 11px; text-align: center; }
.share-story { color: #353b42; }
.share-summary { margin: 0 0 36px; padding: 18px 21px; border-left: 3px solid #ec5a42; border-radius: 0 9px 9px 0; background: #fff0e9; }
.share-summary strong { color: #a64533; font: 800 13px var(--display); }
.share-summary p { margin: 7px 0 0; font-size: 14px; line-height: 1.7; }
.share-table-scroll { overflow-x: auto; border: 1px solid #dde1e5; border-radius: 10px; background: #fff; }
.share-comparison table { width: 100%; min-width: 640px; border-collapse: collapse; font-size: 13px; line-height: 1.5; }
.share-comparison thead { background: #fff0e9; }
.share-comparison th, .share-comparison td { padding: 12px 14px; text-align: left; vertical-align: top; border-bottom: 1px solid #e6e8ea; }
.share-comparison thead th { color: #a64533; font-weight: 800; }
.share-comparison tbody th { width: 24%; color: #292d33; font-weight: 800; }
.share-comparison tbody tr:nth-child(even) { background: #fbfaf9; }
.share-comparison tbody tr:last-child th, .share-comparison tbody tr:last-child td { border-bottom: 0; }
.share-story>section { margin-bottom: 34px; }
.share-story h2 { margin: 0 0 13px; color: #202328; font: 800 clamp(24px, 2.6vw, 29px)/1.25 var(--display); letter-spacing: -.035em; }
.share-story>section p { margin: 0 0 15px; font-size: 16px; line-height: 1.84; }
.share-related { margin: 60px 0 26px; padding-top: 27px; border-top: 1px solid #dde0e4; }
.share-related h2 { margin: 0 0 15px; font: 800 25px var(--display); }
.share-related>div { display: grid; grid-template-columns: repeat(2, 1fr); gap: 13px; }
.share-related a { display: flex; flex-direction: column; gap: 10px; min-height: 140px; padding: 18px; border: 1px solid #e1e3e5; border-radius: 10px; background: #fff; }
.share-related a:hover { border-color: #e9553e; }
.share-related a span { color: #bf4d38; font-size: 11px; font-weight: 800; }
.share-related a strong { font: 800 16px/1.4 var(--display); }
.share-related a span:last-child { margin-top: auto; }
.share-all-link { display: inline-block; color: #d54d39; font-size: 13px; font-weight: 800; }
@media (max-width: 760px) {
  .shares-page { padding: 22px 0 64px; }
  .shares-back { margin-bottom: 22px; }
  .share-card { display: block; }
  .share-card-image { height: 230px; min-height: 0; }
  .share-card-image img { min-height: 0; height: 230px; }
  .share-card-copy { padding: 21px; }
  .share-card h2 { font-size: 23px; }
  .shares-bottom { display: block; padding: 23px; }
  .shares-bottom>a { display: inline-block; margin-top: 16px; }
  .share-gallery-stage { height: 360px; grid-template-columns: 1fr; }
  .share-gallery-next { display: none; }
  .share-story>section p { font-size: 15px; }
  .share-related>div { grid-template-columns: 1fr; }
}

/* Polish text keeps long headings and browsing links within the content column. */
html[lang="pl"] :is(h1,h2,h3) { letter-spacing: -.025em; }
html[lang="pl"] .hero { grid-template-columns: minmax(0,1.04fr) minmax(0,.96fr); }
html[lang="pl"] .hero-copy { min-width: 0; }
html[lang="pl"] .hero-chips { flex-wrap: wrap; width: auto; max-width: 100%; }
html[lang="pl"] .hero h1 { font-size: clamp(40px,4.2vw,64px); }
html[lang="pl"] .hero h1 em { display: inline-block; max-width: 100%; }
@media(max-width:760px) { html[lang="pl"] .hero h1 { font-size: clamp(36px,8.8vw,54px); } }

/* Dutch text keeps long headings and browsing links within the content column. */
html[lang="nl"] :is(h1,h2,h3) { letter-spacing: -.025em; overflow-wrap: anywhere; hyphens: auto; }
html[lang="nl"] .hero { grid-template-columns: minmax(0,1.04fr) minmax(0,.96fr); }
html[lang="nl"] .hero-copy { min-width: 0; }
html[lang="nl"] .hero-chips { flex-wrap: wrap; width: auto; max-width: 100%; }
html[lang="nl"] .hero h1 { font-size: clamp(40px,4.2vw,64px); }
html[lang="nl"] .hero h1 em { display: inline-block; max-width: 100%; }
@media(max-width:760px) { html[lang="nl"] .hero h1 { font-size: clamp(36px,8.8vw,54px); } }

/* Swedish text keeps long headings and browsing links within the content column. */
html[lang="sv"] :is(h1,h2,h3) { letter-spacing: -.025em; overflow-wrap: anywhere; hyphens: auto; }
html[lang="sv"] .hero { grid-template-columns: minmax(0,1.04fr) minmax(0,.96fr); }
html[lang="sv"] .hero-copy { min-width: 0; }
html[lang="sv"] .hero-chips { flex-wrap: wrap; width: auto; max-width: 100%; }
html[lang="sv"] .hero h1 { font-size: clamp(40px,4.2vw,64px); }
html[lang="sv"] .hero h1 em { display: inline-block; max-width: 100%; }
@media(max-width:760px) { html[lang="sv"] .hero h1 { font-size: clamp(36px,8.8vw,54px); } }

/* Czech text keeps long headings and browsing links within the content column. */
html[lang="cs"] :is(h1,h2,h3) { letter-spacing: -.025em; overflow-wrap: anywhere; hyphens: auto; }
html[lang="cs"] .hero { grid-template-columns: minmax(0,1.04fr) minmax(0,.96fr); }
html[lang="cs"] .hero-copy { min-width: 0; }
html[lang="cs"] .hero-chips { flex-wrap: wrap; width: auto; max-width: 100%; }
html[lang="cs"] .hero h1 { font-size: clamp(40px,4.2vw,64px); }
html[lang="cs"] .hero h1 em { display: inline-block; max-width: 100%; }
@media(max-width:760px) { html[lang="cs"] .hero h1 { font-size: clamp(36px,8.8vw,54px); } }

/* Localized catalog headings need room for longer words and phrases. */
html:is([lang="es"], [lang="pt-PT"], [lang="fr"], [lang="de"], [lang="it"]) .hero-copy { min-width: 0; }
html:is([lang="es"], [lang="pt-PT"], [lang="fr"], [lang="de"], [lang="it"]) .hero h1 { font-size: clamp(40px,4.2vw,64px); }
html:is([lang="es"], [lang="pt-PT"], [lang="fr"], [lang="de"], [lang="it"]) .hero h1 em { display: inline-block; max-width: 100%; overflow-wrap: anywhere; }
@media(max-width:760px) {
  html:is([lang="es"], [lang="pt-PT"], [lang="fr"], [lang="de"], [lang="it"]) .hero h1 { font-size: clamp(36px,8.8vw,54px); }
}
