/* ponte.css — riquadro «Come si usa: guide» nelle pagine prodotto (Centro assistenza, 21/10/2026).
   Autonomo: non dipende dai CSS della pagina; scuro con ciano come le pagine nuove. */
.gp-band { padding: clamp(36px, 5vw, 64px) 0; }
.gp-wrap { max-width: 1180px; margin: 0 auto; padding: 0 clamp(16px, 4vw, 40px); }
.gp-card { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: clamp(20px, 3.4vw, 44px); align-items: start; padding: clamp(24px, 3.4vw, 40px); border-radius: 24px; background: radial-gradient(70% 140% at 0% 0%, rgba(0, 229, 255, .14), transparent 62%), #0A0F1C; border: 1px solid rgba(168, 186, 224, .2); color: #F3F6FC; font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif; overflow: hidden; }
.gp-k { display: block; margin-bottom: 10px; font: 600 12px/1.3 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .14em; text-transform: uppercase; color: #7FE9FF; }
.gp-t { margin: 0; font-size: clamp(24px, 2.6vw, 32px); line-height: 1.12; font-weight: 800; letter-spacing: -.03em; color: #fff; }
.gp-p { margin: 12px 0 0; font-size: 15.5px; line-height: 1.6; color: #C9D0DE; max-width: 46ch; }
.gp-all { margin-right: 8px; display: inline-flex; align-items: center; gap: 8px; margin-top: 20px; min-height: 44px; padding: 0 20px; border-radius: 999px; background: #F3F6FC; color: #04060D !important; font-weight: 700; font-size: 14.5px; text-decoration: none !important; }
.gp-all:hover { background: #fff; }
.gp-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.gp-list a { display: grid; grid-template-columns: 1fr auto; gap: 4px 16px; align-items: center; padding: 15px 18px; border-radius: 14px; border: 1px solid rgba(168, 186, 224, .16); background: rgba(4, 6, 13, .55); color: #F3F6FC !important; text-decoration: none !important; transition: border-color .2s, transform .3s cubic-bezier(.2, .8, .2, 1); }
.gp-list a:hover { border-color: rgba(0, 229, 255, .5); transform: translateY(-2px); }
.gp-list strong { font-size: 15.5px; line-height: 1.35; font-weight: 650; color: #F3F6FC; }
.gp-list span { grid-column: 1; font-size: 13.5px; line-height: 1.5; color: #97A1B6; }
.gp-list small { grid-column: 2; grid-row: 1 / span 2; font: 600 11.5px/1 'JetBrains Mono', ui-monospace, Menlo, monospace; color: #7FE9FF; white-space: nowrap; }
@media (max-width: 820px) { .gp-card { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .gp-list a { grid-template-columns: 1fr; } .gp-list small { grid-column: 1; grid-row: auto; } }
@media (prefers-reduced-motion: reduce) { .gp-list a { transition: none; } }