/* SERPIFAI A55 ecommerce competitor-set article product v1.1.0 */
.a55-article-product .a55-answer-first{margin-block-start:0}
.a55-article-product .a55-human-story,
.a55-article-product .a55-fast-action,
.a55-article-product .a55-product-bridge{scroll-margin-top:7rem}
.a55-article-product .a55-human-story{position:relative;padding:clamp(1.15rem,2.4vw,1.8rem);border:1px solid rgba(103,232,249,.2);border-radius:1.15rem;background:linear-gradient(145deg,rgba(8,29,48,.84),rgba(4,16,29,.94));box-shadow:0 18px 50px rgba(0,0,0,.16)}
.a55-article-product .a55-human-story::before{content:"SHOPPER VIEW";display:inline-flex;margin-bottom:.7rem;padding:.25rem .55rem;border:1px solid rgba(103,232,249,.34);border-radius:999px;color:#a5f3fc;font:700 .72rem/1.2 system-ui,sans-serif;letter-spacing:.08em}
.a55-fast-action{margin-block:clamp(2rem,5vw,3.75rem);padding:clamp(1rem,2.6vw,1.7rem);border:1px solid rgba(103,232,249,.24);border-radius:1.2rem;background:linear-gradient(180deg,rgba(8,31,52,.96),rgba(5,20,34,.96));box-shadow:0 20px 60px rgba(0,0,0,.2)}
.a55-fast-action h2{margin-top:.25rem}
.a55-diagnostic{margin-top:1rem}
.a55-diag-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.85rem}
.a55-diag-grid label{display:flex;flex-direction:column;gap:.4rem;padding:.72rem;border:1px solid rgba(148,163,184,.18);border-radius:.85rem;background:rgba(3,14,25,.54)}
.a55-diag-grid label>span{font-weight:700;color:#e6f7ff;font-size:.9rem}
.a55-diag-grid select{width:100%;min-height:2.75rem;border:1px solid rgba(103,232,249,.34);border-radius:.62rem;background:#071a2c;color:#f8fdff;padding:.62rem .7rem;font:600 .9rem/1.2 system-ui,sans-serif}
.a55-diag-grid select:focus-visible,.a55-diagnostic button:focus-visible,.a55-download-card:focus-visible{outline:3px solid #67e8f9;outline-offset:3px}
.a55-diag-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1rem}
.a55-diag-actions .ri-button--primary{background:#123e63!important;color:#fff!important;border:1px solid #67e8f9!important}
.a55-diag-actions .ri-button--primary:hover{background:#164f77!important}
.a55-secondary{background:#071a2c!important;color:#fff!important;border:1px solid rgba(103,232,249,.38)!important}
.a55-secondary[disabled]{opacity:.45;cursor:not-allowed}
.a55-diag-result{margin-top:1rem;padding:1rem 1.05rem;border-left:4px solid #67e8f9;border-radius:.7rem;background:rgba(6,24,40,.82)}
.a55-diag-result[data-state="ready"]{border-left-color:#86efac}
.a55-diag-result[data-state="warn"]{border-left-color:#f9c74f}
.a55-diag-result[data-state="stop"]{border-left-color:#fda4af}
.a55-result-state{margin:0 0 .55rem;font-weight:800;color:#fff;font-size:1.03rem}
.a55-result-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;margin-top:.75rem}
.a55-result-grid>div{padding:.72rem;border:1px solid rgba(148,163,184,.16);border-radius:.68rem;background:rgba(4,16,29,.72)}
.a55-result-grid b{display:block;margin-bottom:.25rem;color:#a5f3fc;font-size:.79rem;text-transform:uppercase;letter-spacing:.045em}
.a55-role-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.a55-entity-chain{padding:1rem;border:1px solid rgba(103,232,249,.22);border-radius:.9rem;background:rgba(8,31,52,.64);line-height:1.8}
.a55-download-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin:1.1rem 0}
.a55-download-card{display:flex;flex-direction:column;gap:.4rem;min-height:10rem;padding:1rem 1.05rem;border:1px solid rgba(103,232,249,.28);border-radius:1rem;background:linear-gradient(145deg,rgba(9,35,57,.92),rgba(5,20,34,.96));text-decoration:none!important;box-shadow:0 14px 38px rgba(0,0,0,.15)}
.a55-download-card:hover{border-color:rgba(103,232,249,.62);transform:translateY(-1px)}
.a55-download-card span{font-weight:800;color:#67e8f9;text-transform:uppercase;letter-spacing:.06em;font-size:.74rem}
.a55-download-card strong{color:#fff;font-size:1.05rem}
.a55-download-card small{color:#cbd9e5;line-height:1.55}
.a55-handoff-grid a{min-height:7.5rem}
.a55-article-product .ri-table th,.a55-article-product .ri-table td{vertical-align:top}
.a55-article-product .ri-table td strong{color:#eefcff}
@media (max-width:980px){.a55-diag-grid,.a55-result-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.a55-diag-grid,.a55-result-grid,.a55-role-grid,.a55-download-grid{grid-template-columns:1fr}.a55-fast-action{padding:.9rem}.a55-diag-actions .ri-button{width:100%;justify-content:center}.a55-download-card{min-height:auto}}
@media (prefers-reduced-motion:reduce){.a55-download-card{transition:none!important}.a55-download-card:hover{transform:none}}

/* Universal article-end Decision Scope Review CTA — contrast and component parity.
   Route-scoped by article body class + DECISION_SCOPE_REVIEW ownership.
   This intentionally outranks the full-site visual system's white-text !important rule. */
body.ri5-article-worked-example-ecommerce-competitor-set .ri-cta[data-commercial-bridge="DECISION_SCOPE_REVIEW"] .ri-button--primary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 13.25rem !important;
  min-height: 3.1rem !important;
  padding: .82rem 1.15rem !important;
  border: 1px solid rgba(125, 227, 245, .72) !important;
  border-radius: .78rem !important;
  background: linear-gradient(110deg, #7de3f5, #9ff0d5) !important;
  color: #03111c !important;
  -webkit-text-fill-color: #03111c !important;
  font-weight: 850 !important;
  line-height: 1.15 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .18) !important;
  white-space: normal !important;
}
body.ri5-article-worked-example-ecommerce-competitor-set .ri-cta[data-commercial-bridge="DECISION_SCOPE_REVIEW"] .ri-button--primary:hover {
  background: linear-gradient(110deg, #91e9f7, #b1f4de) !important;
  color: #03111c !important;
  -webkit-text-fill-color: #03111c !important;
  border-color: #a5f3fc !important;
}
body.ri5-article-worked-example-ecommerce-competitor-set .ri-cta[data-commercial-bridge="DECISION_SCOPE_REVIEW"] .ri-button--primary:focus-visible {
  outline: 3px solid #7de3f5 !important;
  outline-offset: 4px !important;
  color: #03111c !important;
  -webkit-text-fill-color: #03111c !important;
}
@media (max-width: 720px) {
  body.ri5-article-worked-example-ecommerce-competitor-set .ri-cta[data-commercial-bridge="DECISION_SCOPE_REVIEW"] .ri-button--primary {
    width: 100% !important;
    min-width: 0 !important;
  }
}
