.accessories-hero { padding: var(--space-64) 0 var(--space-48); background: radial-gradient(circle at top left, rgba(227, 27, 35, 0.22), transparent 55%), radial-gradient(circle at bottom right, rgba(33, 75, 143, 0.22), transparent 55%); }
.accessories-hero__inner { display: grid; gap: var(--space-32); align-items: stretch; }
@media (min-width: 960px) { .accessories-hero__inner { grid-template-columns: 3fr 2fr; } }
.accessories-hero__content { max-width: 640px; }
.accessories-hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-16); margin-top: var(--space-24); margin-bottom: var(--space-16); }
.accessories-hero__meta { display: grid; gap: var(--space-16); margin-top: var(--space-16); font-size: var(--font-size-sm); }
@media (min-width: 720px) { .accessories-hero__meta { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.accessories-hero__meta-text { margin-bottom: 0; color: var(--color-text-muted); }
.accessories-hero__panel { background-color: var(--color-surface); border-radius: var(--radius-xl); border: 1px solid var(--color-border-strong); padding: var(--space-24); box-shadow: var(--shadow-medium); align-self: center; }
.accessories-hero__panel-title { font-size: var(--font-size-xl); margin-bottom: var(--space-16); }
.accessories-hero__form { display: flex; flex-direction: column; gap: var(--space-16); }
.accessories-hero__form-row { display: grid; gap: var(--space-16); }
@media (min-width: 720px) { .accessories-hero__form-row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.accessories-hero__field { display: flex; flex-direction: column; gap: var(--space-4); }
.accessories-hero__submit { width: 100%; }
.accessories-hero__hint { font-size: var(--font-size-xs); color: var(--gray-400); margin-bottom: 0; }

.accessories-breadcrumbs { border-top: 1px solid var(--color-border-subtle); border-bottom: 1px solid var(--color-border-subtle); background-color: rgba(15, 17, 21, 0.96); }
.accessories-breadcrumbs__list { display: flex; flex-wrap: wrap; gap: var(--space-8); padding: var(--space-12) 0; list-style: none; font-size: var(--font-size-sm); color: var(--gray-400); }
.accessories-breadcrumbs__item::after { content: "/"; margin-left: var(--space-8); opacity: 0.6; }
.accessories-breadcrumbs__item:last-child::after { content: none; }
.accessories-breadcrumbs__item--current { color: var(--gray-200); }

.accessories-grid { padding: var(--space-48) 0 var(--space-56); }
.accessories-grid__header {  margin-bottom: var(--space-32); }
.accessories-grid__layout { display: grid; gap: var(--space-24); }
@media (min-width: 960px) { .accessories-grid__layout { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .accessories-grid__layout > .accessories-card:nth-child(1) { grid-column: span 2; }
  .accessories-grid__layout > .accessories-card:nth-child(4) { grid-column: span 2; } }
.accessories-card { display: flex; flex-direction: column; gap: var(--space-16); height: 100%; background: linear-gradient(145deg, var(--color-surface), var(--color-surface-alt)); }
.accessories-card__media-wrapper { border-radius: var(--radius-md); overflow: hidden; border: 1px solid var(--color-border-subtle); }
.accessories-card__image { width: 100%; height: 100%; object-fit: cover; }
.accessories-card__body { display: flex; flex-direction: column; flex: 1; gap: var(--space-12); }
.accessories-card__footer { margin-top: auto; display: flex; flex-wrap: wrap; gap: var(--space-12); }
.accessories-card__footer--inline { justify-content: flex-start; }
.accessories-card__icon-group { display: flex; justify-content: flex-start; }
.accessories-card__highlights { display: flex; flex-wrap: wrap; gap: var(--space-8); margin-top: var(--space-8); }
.accessories-card__chip { padding: 2px 10px; border-radius: var(--radius-full); border: 1px solid var(--color-border-subtle); font-size: var(--font-size-xs); text-transform: uppercase; letter-spacing: var(--letter-spacing-wide); color: var(--gray-300); background-color: rgba(15, 17, 21, 0.9); }

.accessories-testimonials { padding: var(--space-56) 0; background: radial-gradient(circle at center, rgba(33, 75, 143, 0.18), transparent 60%); }
.accessories-testimonials__inner { display: grid; gap: var(--space-32); align-items: center; }
@media (min-width: 960px) { .accessories-testimonials__inner { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.4fr); } }
.accessories-testimonials__media { border-radius: var(--radius-xl); overflow: hidden; border: 1px solid var(--color-border-subtle); box-shadow: var(--shadow-soft); }
.accessories-testimonials__image { width: 100%; height: 100%; object-fit: cover; }
.accessories-testimonials__content { max-width: 640px; }
.accessories-testimonials__list { display: grid; gap: var(--space-16); margin-top: var(--space-16); }
@media (min-width: 720px) { .accessories-testimonials__list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.accessories-testimonial__text { font-size: var(--font-size-sm); color: var(--color-text-muted); }
.accessories-testimonial__meta { font-size: var(--font-size-xs); color: var(--gray-400); }
.accessories-testimonials__cta { display: flex; flex-wrap: wrap; gap: var(--space-12); margin-top: var(--space-24); }

.accessories-recommended { padding: var(--space-56) 0; }
.accessories-recommended__header {  margin: 0 auto var(--space-32); text-align: left; }
.accessories-recommended__grid { display: grid; gap: var(--space-24); }
@media (min-width: 960px) { .accessories-recommended__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.accessories-recommended__card h3 { margin-bottom: var(--space-12); }
.accessories-recommended__list { margin: 0; padding-left: 1.2rem; font-size: var(--font-size-sm); color: var(--color-text-muted); }
.accessories-recommended__list li { margin-bottom: var(--space-8); }
.accessories-recommended__footer { margin-top: var(--space-24); display: flex; flex-direction: column; gap: var(--space-12); align-items: flex-start; }
.accessories-recommended__note { margin-bottom: 0; font-size: var(--font-size-sm); color: var(--gray-400); }
.accessories-recommended__actions { display: flex; flex-wrap: wrap; gap: var(--space-12); }

.accessories-faq { padding: var(--space-56) 0; border-top: 1px solid var(--color-border-subtle); border-bottom: 1px solid var(--color-border-subtle); background-color: rgba(15, 17, 21, 0.98); }
.accessories-faq__inner { display: flex; flex-direction: column; gap: var(--space-24); }

.accessories-faq__grid { display: grid; gap: var(--space-16); }
@media (min-width: 960px) { .accessories-faq__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.accessories-faq__item { padding: var(--space-16) var(--space-20); }
.accessories-faq__question { width: 100%; text-align: left; display: flex; justify-content: space-between; align-items: center; gap: var(--space-16); font-size: var(--font-size-md); color: var(--gray-50); padding: 0; cursor: pointer; background: none; border: none; }
.accessories-faq__question::after { content: "+"; font-size: var(--font-size-xl); color: var(--gray-400); transition: transform var(--transition-normal), color var(--transition-normal); }
.accessories-faq__question[aria-expanded="true"]::after { content: "–"; color: var(--color-primary); }
.accessories-faq__answer { margin-top: var(--space-8); font-size: var(--font-size-sm); color: var(--color-text-muted); }
.accessories-faq__footer { margin-top: var(--space-16); display: flex; flex-direction: column; gap: var(--space-16); }
.accessories-faq__alert { font-size: var(--font-size-sm); }
.accessories-faq__actions { display: flex; flex-wrap: wrap; gap: var(--space-12); }

.accessories-support { padding: var(--space-56) 0 var(--space-64); }
.accessories-support__inner { display: grid; gap: var(--space-24); align-items: flex-start; }
@media (min-width: 960px) { .accessories-support__inner { grid-template-columns: minmax(0, 2fr) minmax(0, 1.2fr); } }
.accessories-support__content { max-width: 720px; }
.accessories-support__actions { display: flex; flex-wrap: wrap; gap: var(--space-12); margin-top: var(--space-16); }
.accessories-support__aside { width: 100%; }
.accessories-support__card { font-size: var(--font-size-sm); }
.accessories-support__links { margin-top: var(--space-12); padding-left: 1.2rem; font-size: var(--font-size-sm); color: var(--color-text-muted); }
.accessories-support__links li { margin-bottom: var(--space-8); }

@media (max-width: 480px) { .accessories-hero { padding-top: var(--space-48); } .accessories-hero__panel { padding: var(--space-20); } .accessories-testimonials__list { grid-template-columns: minmax(0, 1fr); } .accessories-recommended__grid { grid-template-columns: minmax(0, 1fr); } }