/* geo-blocks.css · 2026-10-15
   Buyer-facing specification, comparison, FAQ and CTA blocks for category hubs.
   Uses the same tokens as b2b-products.css (navy #002f6c, paper #faf8f3, rule #dcd9d1,
   kicker green #527043, square buttons). All text is visible to buyers and crawlers. */

.ys-block{padding:56px 0 8px}
.ys-block.ys-faq{padding-bottom:56px}
.ys-block h2{font:500 clamp(26px,3vw,36px)/1.2 var(--ff-display,Georgia,serif);letter-spacing:-.01em;margin:0 0 10px;color:#12263b}
.ys-lede{font-size:15px;line-height:1.75;color:#515d6d;max-width:760px;margin:0 0 26px}
.ys-eyebrow{font:11px var(--ff-mono,ui-monospace,monospace);letter-spacing:.16em;text-transform:uppercase;color:#527043;margin:0 0 14px}

/* Key-terms strip */
.ys-terms{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:2px solid #002f6c;border-bottom:1px solid #dcd9d1;margin:0 0 8px}
.ys-terms>div{padding:20px 22px 18px 0;border-right:1px solid #dcd9d1}
.ys-terms>div+div{padding-left:22px}
.ys-terms>div:last-child{border-right:0}
.ys-terms b{display:block;font:500 clamp(24px,2.6vw,32px)/1.1 var(--ff-display,Georgia,serif);color:#002f6c;letter-spacing:-.01em}
.ys-terms span{display:block;font-size:12.5px;line-height:1.55;color:#576070;margin-top:8px}

/* Tables */
.ys-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-top:1px solid #dcd9d1;margin:0}
.ys-table-wrap table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.65;min-width:560px;background:transparent}
.ys-table-wrap thead th{font:600 11px var(--ff-mono,ui-monospace,monospace);letter-spacing:.12em;text-transform:uppercase;color:#527043;text-align:left;padding:14px 16px;background:#eeebe3;border-bottom:1px solid #dcd9d1}
.ys-table-wrap tbody th,.ys-table-wrap tbody td{padding:15px 16px;border-bottom:1px solid #dcd9d1;vertical-align:top;text-align:left}
.ys-table-wrap tbody th{font-weight:600;color:#002f6c;width:26%;background:#faf8f3}
.ys-table-wrap tbody td{color:#3a4656}
.ys-compare .ys-table-wrap tbody td:nth-child(2){background:#f7faf5}
.ys-note{font-size:12px!important;line-height:1.7!important;color:#576070;margin:12px 0 0}

/* FAQ (merged into existing .b2b-faq sections, or standalone) */
.ys-faq-item{border-top:1px solid #dcd9d1;padding:18px 0}
.ys-faq-item:last-of-type{border-bottom:1px solid #dcd9d1}
.ys-faq-item summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:24px;font-weight:600;font-size:15px;line-height:1.5;color:#002f6c}
.ys-faq-item summary::-webkit-details-marker{display:none}
.ys-faq-item summary::after{content:"+";font:400 22px/1 var(--ff-mono,ui-monospace,monospace);color:#527043;flex:none}
.ys-faq-item[open] summary::after{content:"\2212"}
.ys-faq-item p{padding-top:12px;font-size:14px;line-height:1.8;color:#3a4656;max-width:820px}

/* Conversion band */
.ys-cta{display:grid;grid-template-columns:1.2fr auto;gap:28px;align-items:center;margin:48px 0 8px;padding:30px 32px;background:#002f6c;color:#f4f1ea}
.ys-cta h2{font:500 clamp(22px,2.4vw,28px)/1.25 var(--ff-display,Georgia,serif);color:#fff;margin:0 0 8px}
.ys-cta p{font-size:14px;line-height:1.7;margin:0;color:#d9dee8}
.ys-cta .ys-cta-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}
.ys-btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 22px;font:600 14px/1.5 var(--ff-body,inherit);text-decoration:none;border:1px solid #faf8f3;background:#faf8f3;color:#002f6c;cursor:pointer}
.ys-btn:hover{background:#fff}
.ys-btn.ys-ghost{background:transparent;color:#faf8f3;border-color:#8ea0bd}
.ys-btn.ys-ghost:hover{border-color:#faf8f3}
.ys-btn:focus-visible{outline:2px solid #faf8f3;outline-offset:3px}

/* Hub grid (product index) */
.ys-hub-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:2px solid #002f6c}
.ys-hub-grid a{display:block;padding:22px 22px 24px 0;border-bottom:1px solid #dcd9d1;text-decoration:none;color:inherit}
.ys-hub-grid a:not(:nth-child(3n+1)){padding-left:22px;border-left:1px solid #dcd9d1}
.ys-hub-grid strong{display:block;font:500 20px/1.25 var(--ff-display,Georgia,serif);color:#002f6c;margin-bottom:8px}
.ys-hub-grid span{display:block;font-size:13px;line-height:1.65;color:#576070}
.ys-hub-grid em{display:block;font:11px var(--ff-mono,ui-monospace,monospace);font-style:normal;letter-spacing:.12em;text-transform:uppercase;color:#527043;margin-top:12px}
.ys-hub-grid a:hover strong{text-decoration:underline;text-underline-offset:4px}

@media(max-width:800px){
  .ys-block{padding:40px 0 4px}
  .ys-terms{grid-template-columns:1fr 1fr}
  .ys-terms>div{padding:16px 14px 14px 0}
  .ys-terms>div+div{padding-left:14px}
  .ys-terms>div:nth-child(2){border-right:0}
  .ys-terms>div:nth-child(3){padding-left:0;border-top:1px solid #dcd9d1}
  .ys-terms>div:nth-child(4){border-top:1px solid #dcd9d1}
  .ys-table-wrap tbody th{position:sticky;left:0;z-index:1;box-shadow:1px 0 0 #dcd9d1}
  .ys-cta{grid-template-columns:1fr;padding:24px 22px}
  .ys-cta .ys-cta-actions{justify-content:flex-start}
  .ys-cta .ys-cta-actions .ys-btn{width:100%}
  .ys-hub-grid{grid-template-columns:1fr}
  .ys-hub-grid a,.ys-hub-grid a:not(:nth-child(3n+1)){padding:18px 0;border-left:0}
}