/* EBShow buyer-RFQ design type layer. */
:root {
  --eb-design-bg: #f7f8fa;
  --eb-design-surface: #fff;
  --eb-design-fg: #14191f;
  --eb-design-muted: #6f7780;
  --eb-design-border: #d9dfe5;
  --eb-design-accent: #1f3344;
  --eb-design-accent-secondary: #6d899c;
  --eb-design-radius: 8px;
  --eb-design-shadow: 0 16px 40px rgba(20, 25, 31, .10);
}

.ttch-shell {
  width: min(1240px, calc(100% - 48px));
  margin: 72px auto;
  color: var(--eb-design-fg);
  font-family: VideoJS, system-ui, -apple-system, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.ttch-shell h1, .ttch-shell h2, .ttch-shell h3 { text-wrap: balance; }
.ttch-shell h1 { max-width: 780px; margin: 8px 0 14px; color: var(--eb-design-fg); font-size: clamp(2.6rem, 7vw, 5.5rem); line-height: .98; letter-spacing: -.06em; }
.ttch-kicker { color: var(--eb-design-accent); font-size: .72rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.ttch-lead, .ttch-product-card p, .ttch-fineprint { text-wrap: pretty; }
.ttch-lead { max-width: 680px; margin: 0 0 36px; color: var(--eb-design-muted); font-size: clamp(1rem, 2vw, 1.18rem); line-height: 1.65; }
.ttch-product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ttch-product-card, .ttch-featured-card { overflow: hidden; border: 1px solid var(--eb-design-border); border-radius: var(--eb-design-radius); background: var(--eb-design-surface); box-shadow: none; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.ttch-product-card:hover, .ttch-featured-card:hover { border-color: var(--eb-design-accent-secondary); box-shadow: var(--eb-design-shadow); transform: translateY(-2px); }
.ttch-product-card:focus-within, .ttch-featured-card:focus-within { border-color: var(--eb-design-accent-secondary); box-shadow: 0 0 0 3px rgba(109, 137, 156, .18), var(--eb-design-shadow); }
.ttch-product-card img, .ttch-product-placeholder, .ttch-product-visual, .ttch-product-visual img { background: #edf0f3; }
.ttch-product-card img, .ttch-product-visual img { outline: 1px solid oklch(0 0 0 / .1); outline-offset: -1px; }
.ttch-product-card h2, .ttch-product-card h3 { margin: 14px 18px 8px; color: var(--eb-design-fg); font-size: 1.22rem; line-height: 1.15; letter-spacing: -.025em; }
.ttch-product-card p, .ttch-product-card span { color: var(--eb-design-muted); }
.ttch-product-card p { margin: 0 18px 18px; }
.ttch-rfq { max-width: none; margin: 72px 0 0; padding: clamp(24px, 5vw, 56px); border: 1px solid var(--eb-design-border); border-radius: var(--eb-design-radius); background: var(--eb-design-bg); }
.ttch-rfq h2 { margin: 6px 0 24px; color: var(--eb-design-fg); font-size: clamp(2.1rem, 4vw, 3.8rem); line-height: 1.05; letter-spacing: -.05em; }
.ttch-rfq .ttch-form { max-width: 900px; }
.ttch-form { gap: 20px; padding: clamp(24px, 4vw, 42px); border: 1px solid var(--eb-design-border); border-radius: var(--eb-design-radius); background: var(--eb-design-surface); box-shadow: var(--eb-design-shadow); }
.ttch-field > span { color: var(--eb-design-fg); }
.ttch-field small, .ttch-fineprint { color: var(--eb-design-muted); }
.ttch-field input, .ttch-field textarea, .ttch-field select { min-height: 44px; border-color: var(--eb-design-border); border-radius: var(--eb-design-radius); background: var(--eb-design-surface); color: var(--eb-design-fg); }
.ttch-field input:focus, .ttch-field textarea:focus, .ttch-field select:focus { outline: 0; border-color: var(--eb-design-accent-secondary); }
.ttch-field input:focus-visible, .ttch-field textarea:focus-visible, .ttch-field select:focus-visible, .ttch-button:focus-visible, .ttch-portal .ttch-more summary:focus-visible { outline: 3px solid rgba(109, 137, 156, .32); outline-offset: 2px; }
.ttch-button { min-height: 46px; border-radius: var(--eb-design-radius); background: var(--eb-design-accent); color: #fff !important; transition-property: background-color, box-shadow, transform; transition-duration: .18s; transition-timing-function: ease; }
.ttch-button:hover { background: #29445a; box-shadow: 0 8px 18px rgba(31, 51, 68, .18); }
.ttch-button:active { transform: scale(.96); }
.ttch-notice { border-left: 4px solid var(--eb-design-accent-secondary); border-radius: var(--eb-design-radius); background: #eef2f5; color: var(--eb-design-fg); }
.ttch-notice--error { border-color: #b42318; background: #fff1f0; }
.ttch-notice--success { border-color: #2e7359; background: #edf7f1; }
.ttch-portal, .ttch-status { max-width: 980px; }
.ttch-portal .ttch-form { max-width: 860px; }
.ttch-portal .ttch-more { border-color: var(--eb-design-border); color: var(--eb-design-fg); }
.ttch-portal .ttch-more summary { min-height: 44px; display: flex; align-items: center; }
.ttch-status .ttch-lead { max-width: 720px; }

@media (max-width: 900px) { .ttch-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) {
  .ttch-shell { width: min(100% - 32px, 1240px); margin: 44px auto; }
  .ttch-shell h1 { font-size: clamp(2.6rem, 15vw, 4.2rem); }
  .ttch-form { padding: 22px; box-shadow: 0 10px 26px rgba(20, 25, 31, .08); }
  .ttch-product-grid { grid-template-columns: 1fr; }
  .ttch-rfq { margin-top: 48px; padding: 24px 18px; }
  .ttch-button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .ttch-product-card, .ttch-featured-card, .ttch-button { transition-duration: .01ms; } .ttch-button:active { transform: none; } }