/* ==========================================================================
   PowerSpell.Web — styles
   Mobile-first overrides on top of MudBlazor. Breakpoints:
   ≥1200 desktop · 960–1199 tablet · 600–959 large phone · <600 phone
   ========================================================================== */

:root {
  --ps-ink: #0f2547;
  --ps-muted: #587099;
  --ps-blue: #1f5fd8;
  --ps-blue-dark: #1747a8;
  --ps-navy: #0b2a5e;
  --ps-navy-2: #123a7c;
  --ps-green: #1e9b57;
  --ps-bg: #f4f8fe;
  --ps-line: #dce6f5;
  --ps-radius: 18px;
  --ps-shadow: 0 12px 32px rgba(16, 38, 80, .10);
  --ps-appbar-h: 68px;
}

html { scroll-behavior: smooth; scroll-padding-top: calc(var(--ps-appbar-h) + 8px); }
body { margin: 0; color: var(--ps-ink); background: #fff; -webkit-text-size-adjust: 100%; }
h1, h2, h3, h4, p, ul { margin: 0; padding: 0; }
ul { list-style: none; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
.ps-main { overflow-x: clip; padding-top: var(--ps-appbar-h) !important; }

/* MudBlazor overrides --------------------------------------------------- */
.mud-button-root { text-transform: none !important; letter-spacing: 0 !important; font-family: inherit; }
.ps-btn { font-weight: 700 !important; border-radius: 12px !important; min-height: 44px; padding: 8px 20px !important; box-shadow: none !important; }
.ps-btn--lg { min-height: 52px; padding: 10px 26px !important; font-size: 1rem !important; }
.ps-btn.mud-button-filled-success { box-shadow: 0 8px 20px rgba(30, 155, 87, .28) !important; }
.ps-btn--light { background: #fff !important; border-color: var(--ps-line) !important; color: var(--ps-blue-dark) !important; }
.ps-btn--white { background: #fff !important; color: var(--ps-navy) !important; }
.ps-btn--link { padding-left: 4px !important; padding-right: 4px !important; }
.ps-btn strong { font-weight: 800; }

/* Typography ------------------------------------------------------------ */
.ps-h1 { font-size: clamp(2rem, 4.6vw, 3.4rem); line-height: 1.12; font-weight: 800; color: var(--ps-navy); letter-spacing: -.01em; }
.ps-h1--md { font-size: clamp(1.8rem, 3.8vw, 2.8rem); }
.ps-h1__accent { display: block; color: var(--ps-blue); }
.ps-h1__green { color: var(--ps-green); }
.ps-h2 { font-size: clamp(1.5rem, 2.6vw, 2.1rem); line-height: 1.2; font-weight: 800; color: var(--ps-navy); }
.ps-h2--white { color: #fff; }
.ps-lead { margin-top: 16px; max-width: 34em; font-size: clamp(1rem, 1.5vw, 1.12rem); line-height: 1.65; color: #34507e; }
.ps-sub { margin-top: 6px; color: var(--ps-muted); font-size: .98rem; line-height: 1.5; }
.ps-section { padding: 56px 0; }
.ps-section__head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 8px 24px; margin-bottom: 28px; }

/* App bar ----------------------------------------------------------------- */
.ps-appbar { background: rgba(255, 255, 255, .92) !important; backdrop-filter: blur(10px); border-bottom: 1px solid var(--ps-line); height: var(--ps-appbar-h); }
.ps-appbar .mud-toolbar { height: 100%; min-height: var(--ps-appbar-h); padding: 0; }
.ps-appbar__inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; height: 100%; }
.ps-logo { display: inline-flex; align-items: center; gap: 10px; flex: none; }
.ps-logo__mark { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: var(--ps-blue); color: #fff; font-family: 'Noto Sans', sans-serif; font-weight: 800; font-size: 1rem; }
.ps-logo__text { display: flex; flex-direction: column; line-height: 1.15; }
.ps-logo__text strong { font-family: 'Noto Sans', sans-serif; font-size: 1.1rem; font-weight: 800; color: var(--ps-navy); }
.ps-logo__text small { font-size: .62rem; color: var(--ps-muted); }
.ps-nav { display: none; align-items: center; gap: clamp(12px, 1.6vw, 24px); font-size: .86rem; font-weight: 600; color: #264574; }
.ps-nav a { padding: 6px 2px; white-space: nowrap; border-bottom: 2px solid transparent; }
.ps-nav a:hover { color: var(--ps-blue); border-color: var(--ps-blue); }
.ps-appbar__actions { display: flex; align-items: center; gap: 8px; flex: none; }
.ps-btn--header { min-height: 40px; padding: 6px 18px !important; font-size: .9rem !important; }
.ps-search { display: none !important; }
@media (min-width: 1180px) { .ps-nav { display: flex; } .ps-burger { display: none !important; } .ps-search { display: inline-flex !important; } }
@media (max-width: 599px) { .ps-btn--header { display: none; } .ps-logo__text small { display: none; } }

/* Drawer (mobile menu) ---------------------------------------------------- */
.ps-drawer { width: min(86vw, 340px) !important; }
.ps-drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid var(--ps-line); }
.ps-drawer__nav { display: flex; flex-direction: column; padding: 8px 8px; }
.ps-drawer__nav a { padding: 15px 14px; font-weight: 700; border-radius: 12px; color: var(--ps-navy); }
.ps-drawer__nav a:active, .ps-drawer__nav a:hover { background: var(--ps-bg); }
.ps-drawer__cta { padding: 16px; margin-top: auto; }

/* Hero carousel: photo as a full-height background on the right, text on top ---------------- */
.ps-hero { position: relative; }
.ps-hero__slides { position: relative; display: block; }
.ps-slide { position: absolute; top: 0; left: 0; right: 0; isolation: isolate; overflow: hidden; opacity: 0; visibility: hidden; transition: opacity .55s ease, visibility .55s; }
.ps-slide.is-active { position: relative; opacity: 1; visibility: visible; }   /* in the flow: block height = height of this slide */

/* Photo layer. NOTE: url() inside a CSS variable is resolved relative to THIS css file, so use root paths (/images/x.jpg).
   Image is set per slide in the Razor file:  style="--ps-bg: url('images/x.jpg')"
   Optional per slide: --ps-bg-pos (default "center"), --ps-bg-m (separate image for phones).
   It always covers the right ~55% of the block and dissolves into the slide colour on its left edge. */
.ps-slide__bg { position: absolute; z-index: -1; top: 0; bottom: 0;
                /* container content box: MudContainer Large = 1280px wide with 24px gutters */
                left: max(24px, calc(50% - 616px)); right: max(24px, calc(50% - 616px));
                background-image: var(--ps-bg); background-repeat: no-repeat; background-size: auto 100%; background-position: right center;
                -webkit-mask-image: linear-gradient(90deg, transparent 18%, #000 58%); mask-image: linear-gradient(90deg, transparent 18%, #000 58%); }

.ps-slide__inner { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: center; gap: 32px; min-height: clamp(420px, 40vw, 540px); padding-top: 48px; padding-bottom: 72px; }
.ps-slide__text { position: relative; }

.ps-slide--intro    { background: linear-gradient(180deg, #f1f7ff 0%, #ffffff 100%); }
.ps-slide--office   { background: linear-gradient(180deg, #f3f8ff 0%, #ffffff 100%); }
.ps-slide--heritage { background: linear-gradient(135deg, var(--ps-navy) 0%, var(--ps-navy-2) 100%); }
.ps-slide--start    { background: linear-gradient(180deg, #f4fbf7 0%, #ffffff 100%); }
.ps-slide--heritage .ps-h1, .ps-slide--heritage .ps-lead { color: #fff; }
.ps-slide--heritage .ps-lead { color: #d3e1fb; }

.ps-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 26px; }
.ps-checks { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 22px; font-size: .86rem; color: #34507e; }
.ps-checks li { display: inline-flex; align-items: center; gap: 6px; }
.ps-checks .mud-icon-root { color: var(--ps-green); }
.ps-checks--stack { flex-direction: column; gap: 10px; font-size: 1rem; }

/* floating feature cards (slide 1) sit on the photo at the right */
.ps-floaters { justify-self: end; display: flex; flex-direction: column; gap: 12px; width: 220px; }
.ps-floater { display: flex; align-items: center; gap: 10px; padding: 12px 14px; background: rgba(255, 255, 255, .96); border: 1px solid var(--ps-line); border-radius: 14px; box-shadow: var(--ps-shadow); font-size: .8rem; font-weight: 700; line-height: 1.3; color: var(--ps-navy); }
.ps-floater__icon { flex: none; display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; color: #fff; }
.ps-floater__icon--blue { background: var(--ps-blue); }
.ps-floater__icon--green { background: var(--ps-green); }

.ps-appicons { display: flex; gap: 12px; margin-top: 22px; }
.ps-appicon { display: inline-grid; place-items: center; width: 52px; height: 52px; border-radius: 12px; color: #fff; font: 800 1.5rem 'Noto Sans', sans-serif; box-shadow: var(--ps-shadow); }
.ps-appicon--word { background: #2b579a; } .ps-appicon--excel { background: #1e7145; } .ps-appicon--ppt { background: #c43e1c; }

.ps-hero__arrow { position: absolute !important; top: 50%; z-index: 3; background: #fff !important; color: var(--ps-navy) !important; box-shadow: var(--ps-shadow); }
.ps-hero__arrow--prev { left: 14px; } .ps-hero__arrow--next { right: 14px; }
.ps-hero__dots { position: absolute; left: 0; right: 0; bottom: 18px; z-index: 3; display: flex; justify-content: center; gap: 8px; }
.ps-dot { width: 9px; height: 9px; padding: 0; border: 0; border-radius: 999px; background: #b8c9e6; cursor: pointer; transition: width .25s ease, background .25s ease; }
.ps-dot.is-active { width: 28px; background: var(--ps-blue); }
.ps-hero--dark .ps-dot { background: rgba(255, 255, 255, .45); }
.ps-hero--dark .ps-dot.is-active { background: #fff; }

@media (max-width: 1199px) {
  .ps-slide__inner { grid-template-columns: 1fr; }
  .ps-floaters { justify-self: stretch; flex-direction: row; flex-wrap: wrap; width: auto; }
  .ps-floater { flex: 1 1 180px; }
}
/* phones and small tablets: photo becomes a full-width banner on top that fades into the slide colour */
@media (max-width: 959px) {
  .ps-slide__bg { top: 0; bottom: auto; left: 0; right: 0; width: auto; height: 240px; background-image: var(--ps-bg-m, var(--ps-bg)); background-size: cover; background-position: center top;
                  -webkit-mask-image: linear-gradient(180deg, #000 50%, transparent 100%); mask-image: linear-gradient(180deg, #000 50%, transparent 100%); }
  .ps-slide__inner { min-height: 0; padding-top: 190px; padding-bottom: 64px; gap: 20px; }
  .ps-hero__arrow { display: none !important; }
  .ps-actions .mud-button-root { flex: 1 1 100%; }
  .ps-lead { max-width: none; }
}

/* Stats ----------------------------------------------------------------------- */
.ps-stats { padding: 20px 0 8px; }
.ps-stats__grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; padding: 14px 16px; background: #fff; border: 1px solid var(--ps-line); border-radius: var(--ps-radius); box-shadow: var(--ps-shadow); }
.ps-stat { display: flex; align-items: center; gap: 12px; padding: 6px 8px; }
.ps-stat__icon { flex: none; display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: #eaf2ff; color: var(--ps-blue); }
.ps-stat__value { font: 800 1.35rem/1.1 'Noto Sans', 'Noto Sans Armenian', sans-serif; color: var(--ps-navy); }
.ps-stat__label { margin-top: 2px; font-size: .74rem; color: var(--ps-muted); line-height: 1.25; }
@media (max-width: 1099px) { .ps-stats__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 599px) {
  .ps-stats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ps-stat:last-child { grid-column: 1 / -1; }
}

/* Audience ---------------------------------------------------------------------- */
.ps-audience__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
.ps-aud { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--ps-line); border-radius: 16px; overflow: hidden; box-shadow: 0 6px 18px rgba(16, 38, 80, .06); transition: transform .2s ease, box-shadow .2s ease; }
.ps-aud:hover { transform: translateY(-3px); box-shadow: var(--ps-shadow); }
.ps-aud img { width: 100%; aspect-ratio: 1.27; object-fit: cover; }
.ps-aud__body { position: relative; flex: 1; padding: 12px 12px 44px; }
.ps-aud__body h3 { font-size: .86rem; font-weight: 800; line-height: 1.3; color: var(--ps-navy); }
.ps-aud__body p { margin-top: 6px; font-size: .74rem; line-height: 1.45; color: var(--ps-muted); }
.ps-aud__go { position: absolute; right: 10px; bottom: 10px; display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #eaf2ff; color: var(--ps-blue); }
@media (max-width: 1099px) { .ps-audience__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 599px) {                          /* phones: two cards per row, no scrolling needed */
  .ps-audience__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .ps-aud__body { padding: 10px 10px 40px; }
  .ps-aud__body h3 { font-size: .8rem; }
  .ps-aud__body p { font-size: .7rem; }
  .ps-aud__go { right: 8px; bottom: 8px; width: 28px; height: 28px; }
}

/* Why literate Armenian: three columns  photo | text | cards ---------------------------- */
.ps-why { background: linear-gradient(135deg, var(--ps-navy) 0%, #0f3470 100%); color: #fff; overflow: hidden; }
.ps-why__inner {
  display: grid;
  grid-template-columns: minmax(240px, 300px) minmax(220px, 1fr) minmax(440px, 1.6fr);
  column-gap: clamp(24px, 3vw, 48px);
  align-items: stretch;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.ps-why__photo { width: 100%; height: 100%; min-height: 280px; object-fit: cover; object-position: center top; }
.ps-why__text, .ps-why__cards { align-self: center; min-width: 0; padding: 44px 0; }
.ps-why__text p { margin-top: 12px; max-width: 26em; font-size: .98rem; line-height: 1.6; color: #cddcf6; }
/* two cards per row while each has at least 220px, otherwise one per row: text never gets squeezed */
.ps-why__cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.ps-why-card { display: flex; gap: 12px; min-width: 0; padding: 16px; background: #fff; color: var(--ps-ink); border-radius: 14px; }
.ps-why-card > div { min-width: 0; }
.ps-why-card__icon { flex: none; display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: #eaf2ff; color: var(--ps-blue); }
.ps-why-card h3 { font-size: .9rem; font-weight: 800; line-height: 1.3; color: var(--ps-navy); overflow-wrap: break-word; }
.ps-why-card p { margin-top: 4px; font-size: .78rem; line-height: 1.5; color: var(--ps-muted); overflow-wrap: break-word; }
@media (max-width: 1099px) {
  .ps-why__inner { grid-template-columns: 1fr; padding-bottom: 32px !important; }
  .ps-why__photo { height: 220px; min-height: 0; margin-top: 24px; border-radius: 16px; object-position: center 20%; }
  .ps-why__text { padding: 28px 0 16px; }
  .ps-why__cards { padding: 0; }
}


/* Pricing ----------------------------------------------------------------------------- */
.ps-pricing { background: var(--ps-bg); }
.ps-pricing__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.ps-price { position: relative; display: flex; flex-direction: column; padding: 22px 20px 20px; background: #fff; border: 1px solid var(--ps-line); border-radius: var(--ps-radius); box-shadow: 0 6px 18px rgba(16, 38, 80, .06); }
.ps-price__head { display: flex; align-items: center; gap: 10px; }
.ps-price__head h3 { font-size: .98rem; font-weight: 800; }
.ps-price__icon { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; background: #eaf2ff; color: var(--ps-blue); }
.ps-price__amount { margin-top: 16px; font: 800 2rem/1.1 'Noto Sans', 'Noto Sans Armenian', sans-serif; color: var(--ps-navy); }
.ps-price__period { margin-top: 4px; color: var(--ps-muted); font-size: .9rem; }
.ps-price__features { display: flex; flex-direction: column; gap: 10px; margin: 18px 0 22px; padding-top: 16px; border-top: 1px solid var(--ps-line); font-size: .84rem; line-height: 1.4; color: #34507e; flex: 1; }
.ps-price__features li { display: flex; gap: 8px; align-items: flex-start; }
.ps-price__features .mud-icon-root { flex: none; margin-top: 1px; color: var(--ps-blue); }
.ps-price--featured { background: linear-gradient(180deg, #0f3270 0%, var(--ps-navy) 100%); border-color: var(--ps-navy); color: #fff; transform: translateY(-8px); box-shadow: 0 24px 48px rgba(11, 42, 94, .30); }
.ps-price--featured .ps-price__amount, .ps-price--featured h3 { color: #fff; }
.ps-price--featured .ps-price__period { color: #b9cdf0; }
.ps-price--featured .ps-price__features { color: #e1ebfb; border-color: rgba(255, 255, 255, .18); }
.ps-price--featured .ps-price__features .mud-icon-root { color: #7fe0be; }
.ps-price--featured .ps-price__icon { background: rgba(255, 255, 255, .14); color: #fff; }
.ps-price__badge { position: absolute; top: -13px; left: 50%; transform: translateX(-50%); padding: 4px 14px; border-radius: 999px; background: var(--ps-blue); color: #fff; font-size: .72rem; font-weight: 800; white-space: nowrap; box-shadow: 0 6px 14px rgba(31, 95, 216, .35); }
@media (max-width: 1099px) { .ps-pricing__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ps-price--featured { transform: none; } }
@media (max-width: 599px) { .ps-pricing__grid { grid-template-columns: 1fr; gap: 22px; } }

/* Gift knowledge ------------------------------------------------------------------------ */
.ps-gift { background: linear-gradient(135deg, #0b2a5e 0%, #0f3a7c 100%); color: #fff; padding: 40px 0; }
.ps-gift__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2.2fr) 190px; gap: 24px; align-items: center; }
.ps-gift__intro h3 { margin-top: 10px; font-size: 1rem; font-weight: 700; color: #cfe0fb; line-height: 1.4; }
.ps-gift__intro p { margin-top: 10px; font-size: .88rem; line-height: 1.6; color: #b9cdf0; }
.ps-gift__intro .mud-button-root { margin-top: 18px; }
.ps-gift__cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ps-gift-card { display: flex; flex-direction: column; gap: 6px; padding: 16px; background: #fff; color: var(--ps-ink); border-radius: 14px; }
.ps-gift-card__icon { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; background: #ffe9ef; color: #d8365f; }
.ps-gift-card h4 { margin-top: 4px; font-size: .9rem; font-weight: 800; color: var(--ps-navy); }
.ps-gift-card p { flex: 1; margin-bottom: 8px; font-size: .78rem; line-height: 1.5; color: var(--ps-muted); }
.ps-gift__photo { width: 100%; height: 200px; object-fit: cover; border-radius: 16px; }
@media (max-width: 1199px) { .ps-gift__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); } .ps-gift__photo { display: none; } }
@media (max-width: 899px) { .ps-gift__grid { grid-template-columns: 1fr; } }
@media (max-width: 699px) { .ps-gift__cards { grid-template-columns: 1fr; } .ps-gift { padding: 32px 0; } }

/* Final CTA -------------------------------------------------------------------------------- */
.ps-final { position: relative; overflow: hidden; background: #eef5ff; }
.ps-final__bg { position: absolute; inset: 0; background: linear-gradient(90deg, #eef5ff 0%, #eef5ff 32%, rgba(238, 245, 255, .55) 60%, rgba(238, 245, 255, .1) 100%), url('../images/cta-ararat.jpg') center / cover no-repeat; }
.ps-final__inner { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 32px; padding-top: 34px; padding-bottom: 34px; }
.ps-final__text h2 { font-size: clamp(1.3rem, 2.4vw, 1.8rem); font-weight: 800; color: var(--ps-navy); }
.ps-final__text p { margin-top: 6px; color: #34507e; }
@media (max-width: 699px) { .ps-final__bg { background: linear-gradient(180deg, rgba(238, 245, 255, .94) 0%, rgba(238, 245, 255, .7) 100%), url('../images/cta-ararat.jpg') center / cover no-repeat; } .ps-final__btn { width: 100%; } }

/* Footer --------------------------------------------------------------------------------------- */
.ps-footer { background: #fff; border-top: 1px solid var(--ps-line); padding: 24px 0 18px; }
.ps-footer__grid { display: grid; grid-template-columns: auto 1fr auto auto; gap: 20px 32px; align-items: center; }
.ps-footer__links { display: flex; flex-wrap: wrap; gap: 8px 24px; font-size: .86rem; font-weight: 600; color: #264574; }
.ps-footer__links a:hover { color: var(--ps-blue); }
.ps-footer__contacts { display: flex; flex-wrap: wrap; gap: 8px 24px; font-size: .86rem; color: #264574; }
.ps-footer__contacts a { display: inline-flex; align-items: center; gap: 6px; }
.ps-footer__social { display: flex; gap: 6px; }
.ps-social { color: #fff !important; width: 34px; height: 34px; padding: 6px !important; }
.ps-social--fb { background: #1877f2 !important; } .ps-social--in { background: #0a66c2 !important; } .ps-social--yt { background: #ff0000 !important; }
.ps-footer__legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--ps-line); font-size: .76rem; color: var(--ps-muted); }
.ps-footer__legal-links { display: flex; flex-wrap: wrap; gap: 6px 20px; }
.ps-footer__legal a:hover { color: var(--ps-blue); }
@media (max-width: 959px) { .ps-footer__grid { grid-template-columns: 1fr 1fr; } .ps-footer__links { grid-column: 1 / -1; order: 3; } }
@media (max-width: 599px) { .ps-footer__grid { grid-template-columns: 1fr; } }

/* 404 / error ------------------------------------------------------------------------------------ */
.ps-notfound { padding: 72px 0 96px; text-align: center; }
.ps-notfound__code { font: 800 5rem/1 'Noto Sans', sans-serif; color: var(--ps-blue); margin-bottom: 12px; }
.ps-notfound .ps-lead { margin: 12px auto 24px; }

/* Blazor reconnect / error UI --------------------------------------------------------------------------- */
#blazor-error-ui { display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: 2000; padding: .7rem 1.25rem; background: #fff7d6; box-shadow: 0 -1px 2px rgba(0, 0, 0, .2); }
#blazor-error-ui .dismiss { position: absolute; right: .75rem; top: .5rem; cursor: pointer; }
#blazor-error-ui .reload { margin-left: .5rem; font-weight: 700; text-decoration: underline; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .ps-slide, .ps-dot, .ps-aud { transition: none; }
}
.ps-gift-card__img { width: 100%; height: 110px; object-fit: cover; border-radius: 10px; display: block; }

/* Рамка фокуса вокруг заголовка страницы (Blazor ставит туда фокус после перехода) не нужна: заголовок не интерактивный */
h1:focus, h1:focus-visible, h2:focus, h2:focus-visible, [tabindex="-1"]:focus, [tabindex="-1"]:focus-visible { outline: none !important; box-shadow: none !important; }