fix(storefront): premium UX polish for static pages

- faq-{ru,en,hy}.component.html: convert each FAQ entry from an always-
  expanded <div>/<h3> block into a native <details class="faq-item">/
  <summary> disclosure, reusing the global expander-chevron pattern
  already defined in styles.scss (no bespoke accordion component built);
  answer body wrapped in .faq-answer for spacing
- faq.component.scss: restyle .faq-item for the details/summary shape
  (summary uses tokenized font-size/weight, focus-visible ring, [open]
  state gets a stronger shadow instead of the old always-on hover-lift);
  hardcoded `all 0.3s ease` replaced with --transition-normal on the
  specific properties that change; added a reduced-motion override
- shared-legal.scss: hardcoded `transition: all 0.3s ease` (4 call sites:
  info-card, features-list feature, contact-item/contact-link,
  contact-email) normalized to --transition-normal on transform/
  box-shadow/background; paragraphs and lists get max-width: 70ch so
  long-form legal/info text keeps a readable line length within the
  wider 900px .legal-container
- static-page.component.scss (CMS-driven static-page renderer): spacing
  converted to --space-* tokens; prose now capped at 70ch; added actual
  content styling (headings, lists, links, images, blockquote, table)
  for arbitrary CMS-authored HTML rendered via [innerHTML], since the
  previous rules only styled h2/h3 margins and left every other tag
  unstyled; line-height moved to --line-height-relaxed token

Build verified green via `npm run build`.

Out of scope / skipped:
- info/contacts has no contact form (plain link list) - no app-input/
  app-form-field polish applicable
- no breadcrumbs/anchor nav exist on any page in scope - nothing to
  align focus-visible on
- legal-page/info scss files (about, delivery, guarantee, company-
  details, payment-terms, privacy-policy, public-offer, return-policy)
  already used design tokens with no hex literals and had no accordion/
  form elements - left untouched
- shared-legal.scss's border-left accent on .legal-section/.info-box/
  .highlight and the fadeIn entrance animation durations left as-is;
  pre-existing sitewide pattern, not a new introduction, changing it is
  a redesign call outside this pass's scope

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

src/styles/shared-legal.scss

@@ -64,6 +64,7 @@
     }
 
     p {
+      max-width: 70ch;
       line-height: 1.8;
       color: var(--text-secondary);
       margin-bottom: 1rem;
@@ -71,6 +72,7 @@
     }
 
     ul, ol {
+      max-width: 70ch;
       line-height: 1.8;
       color: var(--text-secondary);
       margin-bottom: 1.5rem;
@@ -243,7 +245,7 @@
     border-radius: var(--radius-lg);
     padding: 2rem;
     box-shadow: var(--shadow-sm);
-    transition: all 0.3s ease;
+    transition: transform var(--transition-normal), box-shadow var(--transition-normal), background var(--transition-normal);
     
     &:hover {
       box-shadow: var(--shadow-md);
@@ -322,7 +324,7 @@
     text-align: center;
     font-weight: 500;
     color: var(--text-primary);
-    transition: all 0.3s ease;
+    transition: transform var(--transition-normal), box-shadow var(--transition-normal), background var(--transition-normal);
     
     &:hover {
       background: var(--primary-color);
@@ -384,7 +386,7 @@
     border-radius: var(--radius-md);
     text-decoration: none;
     display: block;
-    transition: all 0.3s ease;
+    transition: transform var(--transition-normal), box-shadow var(--transition-normal), background var(--transition-normal);
     
     &:hover {
       background: var(--primary-color);
@@ -455,7 +457,7 @@
   border-radius: var(--radius-md);
   text-decoration: none;
   font-weight: 600;
-  transition: all 0.3s ease;
+  transition: transform var(--transition-normal), box-shadow var(--transition-normal), background var(--transition-normal);
   margin-top: 0.5rem;
   
   &:hover {