@font-face {
  font-family:Nexora;
  src:url('../assets/fonts/nexora-arabic.woff2') format('woff2');
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
}

@font-face {
  font-family:Nexora;
  src:url('../assets/fonts/nexora-latin.woff2') format('woff2');
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root {
  color-scheme:dark;
  --bg:#0b0c10;
  --panel:#111218;
  --line:#292832;
  --text:#f8f6fc;
  --muted:#b3aebe;
  --purple:#9d4edd;
  --cyan:#00f0ff;
  --radius:20px;
  --ease:cubic-bezier(.16,1,.3,1);
}

* {
  box-sizing:border-box;
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:100px;
}

body {
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:Nexora,Tahoma,sans-serif;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}

a {
  color:inherit;
  text-decoration:none;
}

button {
  font:inherit;
  color:inherit;
  cursor:pointer;
}

button,a {
  -webkit-tap-highlight-color:transparent;
}

button {
  border:0;
}

img {
  display:block;
  max-width:100%;
}

svg {
  width:21px;
  height:21px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
  flex-shrink:0;
}

h1,h2,h3,p {
  margin:0;
}

h1,h2,h3 {
  text-wrap:balance;
}

::selection {
  background:#7b2cbf;
  color:#fff;
}

:focus-visible {
  outline:2px solid var(--cyan);
  outline-offset:5px;
}

* {
  scrollbar-width:thin;
  scrollbar-color:#635175 var(--bg);
}

[hidden] {
  display:none!important;
}

.container {
  width:min(1200px,calc(100% - 40px));
  margin-inline:auto;
}

.skip-link {
  position:fixed;
  inset-block-start:-100px;
  inset-inline-start:20px;
  background:var(--text);
  color:var(--bg);
  padding:12px 20px;
  z-index:100;
}

.skip-link:focus {
  inset-block-start:12px;
}

.header {
  position:sticky;
  top:0;
  z-index:20;
  background:#0b0c10e8;
  backdrop-filter:blur(16px);
  border-bottom:1px solid #ffffff0d;
}

.nav-shell {
  min-height:82px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  position:relative;
}

.brand {
  display:inline-flex;
  align-items:center;
  gap:10px;
  white-space:nowrap;
  font-size:19px;
  font-weight:800;
  letter-spacing:.02em;
  direction:ltr;
}

.brand-ai {
  font-weight:500;
}

.pro {
  display:inline-block;
  vertical-align:middle;
  font-size:10px;
  line-height:1.7;
  letter-spacing:.1em;
  margin-inline-start:8px;
  padding:1px 6px;
  border:1px solid #74548b;
  border-radius:4px;
  color:#d9b2fa;
}

.navigation {
  display:none;
}

.nav-actions {
  display:flex;
  align-items:center;
  gap:16px;
}

.language-switch {
  display:flex;
  align-items:center;
  gap:2px;
  font-size:12px;
  color:#746d80;
}

.language-switch button {
  background:none;
  min-width:32px;
  min-height:44px;
  padding:6px;
  color:var(--muted);
  font-weight:600;
}

.language-switch button[aria-pressed=true] {
  color:#fff;
}

.menu-toggle {
  background:none;
  width:40px;
  height:44px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:6px;
  padding:8px;
}

.menu-toggle span {
  height:2px;
  width:24px;
  background:var(--text);
  transition:transform .2s;
}

.menu-toggle[aria-expanded=true] span:first-child {
  transform:translateY(4px) rotate(45deg);
}

.menu-toggle[aria-expanded=true] span:last-child {
  transform:translateY(-4px) rotate(-45deg);
}

.navigation.is-open {
  display:flex;
  position:absolute;
  inset-inline:0;
  top:calc(100% + 1px);
  flex-direction:column;
  padding:16px;
  background:#14121b;
  border:1px solid var(--line);
  border-radius:0 0 16px 16px;
  box-shadow:0 20px 40px #0008;
}

.navigation a,.nav-pending {
  font-size:13px;
  padding:10px;
  transition:color .2s;
}

.navigation a:hover {
  color:#d6a0ff;
}

.nav-pending {
  color:#99929f;
  cursor:not-allowed;
}

.hero {
  position:relative;
  display:grid;
  gap:20px;
  padding-block:58px 24px;
  overflow:hidden;
}

.hero-copy {
  position:relative;
  z-index:2;
}

.hero h1 {
  font-size:14px;
  letter-spacing:.17em;
  text-align:start;
  font-weight:700;
  margin-bottom:18px;
}

.hero-pro {
  color:#c98bff;
  letter-spacing:.1em;
}

.hero h2 {
  font-size:clamp(35px,5vw,60px);
  line-height:1.35;
  letter-spacing:-.035em;
  max-width:620px;
  font-weight:750;
}

.hero-description {
  color:var(--muted);
  font-size:15px;
  max-width:470px;
  margin-top:22px;
  line-height:1.95;
}

.hero-actions {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:30px;
}

.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  min-height:48px;
  padding:12px 22px;
  border-radius:10px;
  font-size:14px;
  font-weight:650;
  transition:background .2s,transform .2s,box-shadow .2s;
  border:1px solid transparent;
  text-align:center;
}

.button:hover {
  transform:translateY(-2px);
}

.primary {
  background:linear-gradient(115deg,#7130c0,#9239d5);
  border-color:#ac65e0;
  box-shadow:0 6px 22px #7026b926;
  color:#fff;
}

.primary:hover {
  background:linear-gradient(115deg,#8342d2,#a04ce0);
  box-shadow:0 8px 28px #7026b944;
}

.secondary {
  background:#16141d;
  border-color:#36303f;
}

.secondary:hover {
  background:#211c2b;
}

.hero-footnote {
  display:flex;
  align-items:center;
  gap:9px;
  margin-top:25px;
  font-size:11px;
  color:var(--muted);
  flex-wrap:wrap;
}

.status-dot {
  width:5px;
  height:5px;
  background:var(--cyan);
  border-radius:50%;
}

.hero-domain {
  color:#91849e;
  border-inline-start:1px solid #39313f;
  padding-inline-start:12px;
  margin-inline-start:3px;
}

.hero-art {
  height:285px;
  position:relative;
  isolation:isolate;
  display:grid;
  place-items:center;
  direction:ltr;
}

.hero-art:before {
  content:'';
  position:absolute;
  inset:5%;
  background:radial-gradient(ellipse,#822cbd2e,transparent 68%);
  z-index:-1;
}

.art-grid {
  position:absolute;
  inset:0;
  background-image:linear-gradient(#895bc00a 1px,transparent 1px),linear-gradient(90deg,#895bc00a 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:radial-gradient(ellipse,#000,transparent 65%);
}

.orbit {
  position:absolute;
  width:90%;
  height:42%;
  border:1px solid #964ad85c;
  border-radius:50%;
  transform:rotate(-32deg);
  box-shadow:0 8px 30px #6424970b;
}

.orbit-two {
  transform:rotate(34deg);
  width:83%;
  height:48%;
  border-color:#7544a043;
}

.orbit-three {
  transform:rotate(-32deg);
  width:100%;
  height:53%;
  border-color:#72468920;
}

.nucleus {
  height:145px;
  width:145px;
  display:grid;
  place-items:center;
  border-radius:36px;
  background:linear-gradient(145deg,#352444b3,#100e1bf2);
  border:1px solid #9863bf7a;
  box-shadow:12px 25px 55px #0008,inset 1px 1px 22px #b368ed19;
  transform:rotate(-13deg);
  animation:arrive 1.3s var(--ease) both;
  backdrop-filter:blur(6px);
}

.nucleus svg {
  width:97px;
  height:97px;
  fill:#d6b2f2;
  stroke:none;
  filter:drop-shadow(0 4px 18px #a855f740);
}

.art-spark {
  position:absolute;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--cyan);
  box-shadow:0 0 14px #00f0ff88;
}

.spark-one {
  left:14%;
  top:66%;
}

.spark-two {
  right:17%;
  top:29%;
  background:#d68eff;
  box-shadow:0 0 14px #b653ff88;
}

.art-caption {
  position:absolute;
  bottom:4px;
  right:15px;
  color:#887695;
  font-size:8px;
  letter-spacing:.19em;
  line-height:1.9;
}

.art-caption strong {
  font-size:10px;
  color:#ccbdd6;
  letter-spacing:.4em;
}

.products-section {
  padding-block:40px 70px;
  border-top:1px solid #ffffff0a;
  background:linear-gradient(180deg,#11101955,transparent 200px);
}

.section-heading {
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:end;
  margin-bottom:27px;
}

.section-heading h2 {
  font-size:27px;
  letter-spacing:-.025em;
}

.section-heading p {
  font-size:14px;
  color:var(--muted);
  margin-top:7px;
}

.section-label {
  display:none;
  font-size:12px;
  color:#bfa4d0;
}

.product-grid {
  display:grid;
  gap:22px;
}

.product-card {
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  transition:border-color .2s,transform .2s;
}

.product-card:hover {
  border-color:#6b487f;
  transform:translateY(-3px);
}

.product-card.featured {
  border-color:#8143ac;
  box-shadow:0 12px 35px #5e25700b;
}

.product-art {
  position:relative;
  background:#14111e;
  aspect-ratio:1.9;
  overflow:hidden;
  border-bottom:1px solid #ffffff09;
}

.product-art img {
  width:100%;
  height:100%;
  object-fit:cover;
}

.image-caption {
  position:absolute;
  bottom:12px;
  inset-inline-end:14px;
  font-size:10px;
  color:#c1b6cc;
  background:#100d17bb;
  padding:2px 8px;
  border-radius:4px;
}

.offer-badge {
  position:absolute;
  top:16px;
  inset-inline-start:16px;
  background:#291b39;
  color:#e8c4ff;
  border:1px solid #795099;
  padding:3px 10px;
  border-radius:5px;
  font-size:11px;
  font-weight:600;
}

.card-body {
  padding:23px;
  display:flex;
  flex-direction:column;
  flex:1;
}

.product-title-row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.product-title-row h3 {
  font-size:23px;
  font-weight:700;
  letter-spacing:-.02em;
}

.product-mark {
  color:#887298;
  font-size:20px;
}

.duration {
  font-size:13px;
  color:#cbb8da;
  margin-top:6px;
}

.features {
  list-style:none;
  padding:0;
  margin:17px 0 23px;
  font-size:13px;
  color:#d0c9d6;
  min-height:24px;
}

.features li:before {
  content:'';
  display:inline-block;
  width:4px;
  height:4px;
  background:#8b7b97;
  border-radius:50%;
  margin-inline-end:9px;
  vertical-align:middle;
}

.pending {
  color:var(--muted);
  font-size:13px;
  line-height:1.85;
}

.price-block {
  margin-top:auto;
  min-height:81px;
  display:flex;
  flex-direction:column;
  justify-content:end;
  padding-bottom:13px;
}

.price-before {
  display:flex;
  gap:12px;
  align-items:center;
  margin-bottom:4px;
}

.price-before del {
  color:#b0a4b7;
  font-size:13px;
  text-decoration-thickness:1px;
}

.discount {
  font-size:11px;
  padding:2px 7px;
  border-radius:5px;
  background:#193031;
  color:#85f0e7;
}

.price-current {
  font-size:32px;
  font-weight:750;
  letter-spacing:-.035em;
  font-variant-numeric:tabular-nums;
  line-height:1.5;
}

.price-pending {
  color:#bdb0c7;
  font-size:17px;
  font-weight:500;
  padding-bottom:7px;
}

.card-actions {
  border-top:1px solid #ffffff0c;
  padding-top:18px;
  display:flex;
  flex-direction:column;
  gap:5px;
}

.card-subscribe {
  background:#201b29;
  border-color:#413149;
}

.card-subscribe:hover {
  background:#30203d;
}

.details-button {
  background:transparent;
  min-height:44px;
  padding:8px;
  font-size:12px;
  color:#c7b8d2;
}

.details-button:hover {
  color:#fff;
}

.contact-section {
  padding-block:40px 52px;
  border-top:1px solid var(--line);
  display:flex;
  flex-direction:column;
  gap:23px;
}

.contact-section h2 {
  font-size:26px;
  letter-spacing:-.025em;
}

.contact-section p {
  font-size:14px;
  color:var(--muted);
  margin-top:10px;
}

.contact-section .button {
  align-self:start;
}

.footer {
  border-top:1px solid #ffffff0b;
  padding-block:27px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:16px 24px;
  font-size:11px;
  color:var(--muted);
}

.footer-brand {
  font-size:15px;
  color:var(--text);
}

.footer p {
  width:100%;
}

.footer a:not(.brand):hover {
  color:var(--cyan);
}

.modal-open {
  overflow:hidden;
}

dialog {
  position:fixed;
  border:1px solid #654077;
  border-radius:20px;
  background:var(--panel);
  color:var(--text);
  padding:0;
  width:min(560px,calc(100% - 28px));
  max-height:88dvh;
  overscroll-behavior:contain;
  box-shadow:0 30px 90px #000b;
}

dialog::backdrop {
  background:#030107c9;
  backdrop-filter:blur(5px);
}

.dialog-close {
  position:absolute;
  top:10px;
  inset-inline-end:10px;
  z-index:2;
  border:1px solid #776486;
  background:#17101fed;
  border-radius:50%;
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
}

.dialog-body {
  padding:26px;
}

.dialog-body h2 {
  font-size:29px;
  text-align:start;
}

.dialog-body h3 {
  font-size:15px;
  margin:22px 0 7px;
}

.dialog-body .button {
  display:flex;
  margin-top:28px;
}

.dialog-body dl {
  margin:20px 0;
}

.detail-row {
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:8px 0;
  border-bottom:1px solid var(--line);
  font-size:13px;
}

.detail-row dt {
  color:var(--muted);
}

.detail-row dd {
  margin:0;
  text-align:end;
}

.dialog-body .features {
  margin-block:10px;
}

.dialog-body .price-block {
  min-height:0;
}

details {
  border-bottom:1px solid var(--line);
  padding:12px 0;
}

summary {
  cursor:pointer;
}

html[dir=ltr] .direction-arrow {
  transform:rotate(180deg);
}

html[dir=ltr] .hero h2 {
  line-height:1.15;
}

html[dir=ltr] .hero h1 {
  text-align:left;
}

@keyframes arrive {
  from {
    transform:translateY(15px) rotate(-17deg);
    filter:blur(3px);
  }
  to {
    transform:translateY(0) rotate(-13deg);
    filter:blur(0);
  }
}

@media(min-width:600px) {
  .container {
    width:min(1200px,calc(100% - 64px));
  }
  .hero-art {
    height:360px;
    max-width:520px;
    width:100%;
    justify-self:center;
  }
  .nucleus {
    width:185px;
    height:185px;
    border-radius:42px;
  }
  .nucleus svg {
    width:120px;
    height:120px;
  }
  .hero {
    padding-top:70px;
  }
  .product-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .section-label {
    display:block;
  }
  .footer p {
    width:auto;
  }
  .contact-section {
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
  }
  .contact-section .button {
    align-self:center;
    flex-shrink:0;
  }
}

@media(min-width:1024px) {
  .navigation {
    display:flex;
    gap:3px;
    align-items:center;
  }
  .menu-toggle {
    display:none;
  }
  .nav-shell {
    gap:16px;
  }
  .hero {
    grid-template-columns:1.05fr 1fr;
    align-items:center;
    min-height:620px;
    padding-block:75px 80px;
    gap:24px;
  }
  .hero-art {
    height:455px;
    max-width:none;
  }
  .nucleus {
    width:210px;
    height:210px;
    border-radius:49px;
  }
  .nucleus svg {
    width:139px;
    height:139px;
  }
  .art-caption {
    bottom:28px;
    right:36px;
  }
  .hero h1 {
    font-size:16px;
  }
  .hero-description {
    font-size:16px;
  }
  .hero-footnote {
    margin-top:35px;
  }
  .products-section {
    padding-block:56px 85px;
  }
  .section-heading {
    margin-bottom:32px;
  }
  .section-heading h2 {
    font-size:34px;
  }
  .product-grid {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .contact-section {
    padding-block:53px 65px;
  }
  .footer p {
    flex:1;
  }
  .contact-section h2 {
    font-size:30px;
  }
}

@media(max-width:389px) {
  .container {
    width:calc(100% - 32px);
  }
  .brand {
    font-size:15px;
    gap:6px;
  }
  .brand img {
    width:29px;
    height:29px;
  }
  .nav-shell {
    gap:8px;
    min-height:72px;
  }
  .nav-actions {
    gap:5px;
  }
  .hero h2 {
    font-size:34px;
  }
  .hero-actions {
    gap:9px;
  }
  .hero-actions .button {
    padding-inline:16px;
    font-size:13px;
  }
  .hero-domain {
    display:none;
  }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*::before,*::after {
    animation:none!important;
    transition:none!important;
  }
}


/* Supplied brand assets: same layout, responsive image sizing. */
.brand .brand-logo {
  width: 225px;
  height: auto;
  object-fit: contain;
}
.footer-brand .brand-logo { width: 200px; }
.hero-art--image {
  height: auto;
  aspect-ratio: 1;
  max-width: 540px;
  width: 100%;
  justify-self: center;
}
.hero-art--image::before { display: none; }
.hero-illustration {
  width: 100%;
  height: auto;
  object-fit: contain;
  mask-image: radial-gradient(ellipse at center, #000 48%, transparent 73%);
}
.product-intro { color: var(--muted); font-size: 14px; margin-top: 14px; line-height: 1.9; }
.features .feature-detail { padding-block: 15px; border-bottom: 1px solid var(--line); }
.features .feature-detail::before { display: none; }
.feature-detail strong { display: block; font-size: 15px; color: var(--text); margin-bottom: 6px; }
.feature-detail span { display: block; color: var(--muted); font-size: 13px; line-height: 1.9; }
@media (max-width: 599px) {
  .brand .brand-logo { width: 190px; height: auto; }
  .hero-art--image { max-width: 370px; }
}
@media (min-width: 600px) and (max-width: 1023px) {
  .hero-art--image { max-width: 450px; }
}

/* Informational payment methods only: no selection or checkout controls. */
.payment-section {
  padding-block: 40px 58px;
  border-top: 1px solid var(--line);
}
.payment-methods {
  list-style: none;
  display: grid;
  gap: 14px;
  margin: 0;
  padding: 0;
}
.payment-method {
  display: flex;
  align-items: center;
  gap: 18px;
  min-width: 0;
  padding: 23px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: linear-gradient(120deg, #1d1628, var(--panel) 75%);
}
.payment-symbol {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  color: #d2a0f5;
}
.payment-symbol svg { width: 34px; height: 34px; }
.payment-method h3 { font-size: 18px; line-height: 1.6; }
.payment-method p { margin-top: 4px; color: var(--muted); font-size: 13px; }
.payment-bottom { display: flex; flex-direction: column; align-items: start; gap: 22px; margin-top: 25px; }
.payment-bottom p { color: var(--muted); font-size: 13px; line-height: 1.9; max-width: 65ch; }
.payment-bottom .button { flex-shrink: 0; font-size: 13px; }
@media (min-width: 768px) {
  .payment-section { padding-block: 50px 68px; }
  .payment-methods { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .payment-method { padding: 20px 16px; gap: 10px; }
  .payment-method h3 { font-size: 16px; }
}
@media (min-width: 1024px) {
  .payment-method { padding: 26px; gap: 18px; }
  .payment-method h3 { font-size: 19px; }
  .payment-bottom { flex-direction: row; align-items: center; justify-content: space-between; }
}

/* Transform-only logo strip, with no slider dependency. */
.payment-marquee {
  /* Anchor the overwide track on the left in BOTH page languages. */
  direction: ltr;
  overflow: hidden;
  padding-block: 8px;
  mask-image: linear-gradient(to right, transparent, #000 3%, #000 97%, transparent);
}
.payment-track { display: flex; width: max-content; direction: ltr; }
.payment-group {
  display: flex;
  flex: 0 0 auto;
  gap: 16px;
  padding: 0 16px 0 0;
  margin: 0;
  list-style: none;
}
.payment-logo-tile {
  width: clamp(210px, 26vw, 310px);
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  text-align: center;
  padding: 22px 18px;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: linear-gradient(135deg, #20172b, var(--panel) 70%);
}
.payment-logo-well {
  width: 150px;
  height: 90px;
  display: block;
  overflow: hidden;
  border-radius: 10px;
  background: #fff;
}
.payment-logo-well img { width: 100%; height: 100%; object-fit: contain; }
.payment-logo-well--mastercard img, .payment-logo-well--zain img { padding: 15px; }
.payment-logo-well--cash { background: #6c3285; }
.payment-logo-well--asia { background: #ed1c24; }
.payment-logo-tile h3 { font-size: 17px; line-height: 1.7; }
.payment-logo-tile p { margin-top: 3px; font-size: 12px; color: var(--muted); }
.is-motion-ready .payment-track { animation: payment-drift 26s linear infinite; }
.is-offscreen .payment-track,
.is-page-hidden .payment-track { animation-play-state: paused; }
@keyframes payment-drift { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes soft-entrance { from { opacity: .72; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.is-revealed, .hero-illustration { animation: soft-entrance .7s cubic-bezier(.16,1,.3,1) both; }
@media (prefers-reduced-motion: reduce) {
  .payment-marquee { mask-image: none; }
  .payment-track { animation: none !important; transform: none; width: 100%; }
  .payment-group { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; padding: 0; width: 100%; }
  .payment-group[aria-hidden=true] { display: none; }
  .payment-logo-tile { width: auto; min-width: 0; padding: 16px 8px; }
  .payment-logo-well { width: min(120px,100%); height: 75px; }
  .payment-logo-tile h3 { font-size: 14px; }
  .is-revealed, .hero-illustration { animation: none !important; }
}

/* Refinement: four offers in balanced pairs; existing assets and palette preserved. */
.product-grid { align-items: stretch; }
.product-title-row h3 { font-size: clamp(22px, 2.3vw, 28px); }
.product-art { aspect-ratio: 16 / 9; }
.card-body { padding: clamp(20px, 3vw, 30px); }
.card-body > .duration:first-of-type { align-self: flex-start; padding: 4px 12px; margin-top: 12px; border-radius: 6px; background: #21172d; color: #e4c9fa; font-size: 14px; }
.card-body .features { font-size: 14px; line-height: 1.95; margin-block: 20px 24px; }
.card-body .features li + li { margin-top: 7px; }
.price-current { letter-spacing: -.02em; font-size: clamp(30px, 3vw, 38px); }
.card-warranty { display:flex; gap:8px; align-items:center; font-size:13px; color:#aee4dd; margin:0 0 18px; }
.card-warranty svg { width:18px; height:18px; }
.card-actions { gap:8px; }
.details-button { border:1px solid transparent; border-radius:8px; font-size:14px; }
.details-button:hover { background:#211b29; border-color:#3d3048; }
.language-switch { border:1px solid var(--line); border-radius:9px; padding:2px; }
.language-switch button[aria-pressed=true] { background:#2b1b3b; border-radius:6px; }
.confidence-section { display:grid; gap:32px; padding-block:72px; border-top:1px solid var(--line); }
.confidence-intro h2, .faq-section h2 { font-size:clamp(26px,3vw,38px); line-height:1.5; }
.confidence-intro > p { margin-top:16px; color:var(--muted); max-width:48ch; }
.confidence-point { display:flex; align-items:flex-start; gap:18px; padding-block:22px; }
.confidence-point + .confidence-point { border-top:1px solid var(--line); }
.confidence-point > svg { color:#ca98f4; width:25px; height:25px; margin-top:4px; }
.confidence-point h3 { font-size:18px; }
.confidence-point p { margin-top:7px; color:var(--muted); font-size:14px; line-height:1.95; }
.faq-section { padding-block:24px 80px; }
.faq-list { border-top:1px solid var(--line); }
.faq-list details { border-bottom:1px solid var(--line); }
.faq-list summary { list-style:none; display:flex; justify-content:space-between; align-items:center; gap:24px; cursor:pointer; min-height:72px; padding:20px 4px; font-weight:600; font-size:16px; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary svg { color:#c998ee; transition:transform .2s; }
.faq-list details[open] summary svg { transform:rotate(180deg); }
.faq-list details[open] summary { color:#dec0f5; }
.faq-list details > p { max-width:75ch; padding:0 4px 24px; color:var(--muted); line-height:1.95; font-size:15px; }
.dialog-body .features { font-size:14px; }
.dialog-body .pending { font-size:14px; }
@media (min-width:768px) {
 .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
 .confidence-section { grid-template-columns:1fr 1.15fr; gap:70px; align-items:start; }
 .confidence-intro { padding-top:20px; }
}
@media (max-width:767px) {
 .confidence-section { padding-block:48px; gap:12px; }
 .faq-section { padding-bottom:48px; }
 .nav-shell { gap:12px; }
 .nav-actions { gap:8px; }
 .card-body .features { margin-block:16px 20px; }
}
@media (prefers-reduced-motion:reduce) { .faq-list summary svg { transition:none; } }

/* Product detail reading panel: persistent close and order actions. */
#product-dialog { overflow: hidden; width: min(760px, calc(100% - 28px)); max-height: 92dvh; }
#dialog-content { display: flex; flex-direction: column; max-height: 92dvh; padding-top: 62px; }
.dialog-scroll { overflow-y: auto; overscroll-behavior: contain; min-height: 0; scroll-padding-block: 18px; }
.dialog-scroll:focus-visible { outline-offset: -3px; }
.dialog-scroll .product-art { aspect-ratio: 2.25; }
.dialog-scroll .product-art img { object-fit: contain; }
.dialog-close { top: 9px; background: #261a33; }
.dialog-order-bar { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 24px max(16px, env(safe-area-inset-bottom)); background: #19131f; border-top: 1px solid #493453; box-shadow: 0 -8px 24px #0003; }
.dialog-order-bar > div { display: flex; flex-direction: column; gap: 2px; }
.dialog-order-bar span { color: var(--muted); font-size: 12px; }
.dialog-order-bar strong { font-size: 23px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.dialog-order-bar .button { min-width: 170px; }
.dialog-scroll .dialog-body { padding: 26px 32px 36px; }
.dialog-scroll .feature-detail { padding-block: 12px; }
.dialog-scroll .feature-detail + .feature-detail { border-top: 1px solid var(--line); }
@media (max-width: 599px) {
 #product-dialog { width: calc(100% - 16px); border-radius: 18px; }
 .dialog-order-bar { padding-inline: 14px; gap: 10px; }
 .dialog-order-bar strong { font-size: 20px; }
 .dialog-order-bar .button { min-width: 0; padding-inline: 16px; }
 .dialog-scroll .dialog-body { padding: 22px 20px 30px; }
}

.request-section { display:grid; gap:28px; margin-block:16px 64px; padding:32px; border:1px solid #63417b; border-radius:20px; background:linear-gradient(125deg,#21142f,#111218 75%); }
.request-section h2 { font-size:clamp(25px,3vw,36px); }
.request-section p { color:var(--muted); line-height:1.95; margin-top:12px; max-width:55ch; }
.request-fields { display:grid; gap:12px; align-content:center; }
.request-fields label { font-size:14px; font-weight:600; }
.request-fields input { min-width:0; width:100%; min-height:52px; padding:12px 16px; font:inherit; color:var(--text); border:1px solid #675474; border-radius:9px; background:#0f0d14; }
.request-fields input::placeholder { color:#b3aebe; }
.request-fields #request-hint { font-size:12px; margin:0; }
@media(min-width:768px) { .request-section { grid-template-columns:1.1fr 1fr; gap:48px; padding:40px; } }
@media(max-width:430px) { .request-section { padding:22px; } }

/* Catalog discovery, offer selection and comfortable mobile controls. */
.catalog-tools { margin-bottom:24px; display:grid; gap:12px; }
.catalog-tools > label, .variant-label { font-size:14px; font-weight:600; }
#catalog-search, #gemini-duration { min-height:48px; width:100%; min-width:0; font:inherit; color:var(--text); background:#16111e; border:1px solid #675474; border-radius:9px; padding:10px 14px; }
#catalog-search::placeholder { color:var(--muted); }
.catalog-filters { display:flex; gap:8px; flex-wrap:wrap; }
.catalog-filters button { min-height:44px; padding:8px 16px; border-radius:8px; border:1px solid var(--line); background:var(--panel); color:var(--muted); }
.catalog-filters button[aria-pressed=true] { background:#322042; border-color:#9563bd; color:#fff; }
.catalog-status { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; font-size:14px; color:var(--muted); }
.catalog-status a { color:#d9b3f7; min-height:44px; display:inline-flex; align-items:center; text-decoration:underline; text-underline-offset:5px; }
#catalog-empty { padding:28px 0; }
#catalog-empty p { margin-bottom:18px; }
#catalog-empty .button { margin:0 0 12px 8px; }
.variant-label { margin-top:16px; margin-bottom:6px; }
#gemini-duration { font-size:14px; }
.language-switch button { min-width:44px; }
.menu-toggle { width:44px; flex-shrink:0; }
.footer a { min-height:44px; display:inline-flex; align-items:center; }
@media(max-width:599px) {
 .hero { padding-top:28px; padding-bottom:32px; gap:20px; }
 .hero-art--image { max-width:220px; margin-inline:auto; }
 .hero-illustration { max-height:220px; object-fit:contain; }
 .hero-footnote { margin-top:20px; }
 .nav-shell { min-height:72px; gap:8px; }
 .nav-shell .brand-logo { width:155px; }
 .nav-actions { gap:4px; }
}


/* Catalog refinement: preserve brand, emphasize discovery and actions. */
h1, h2, .product-title-row h3 { text-wrap: balance; }
button, a, select, summary { touch-action: manipulation; }
button, a, input, select, summary { scroll-margin-block: 110px 80px; }
:where(button, a, input, select, summary):focus-visible { outline: 2px solid var(--cyan); outline-offset: 4px; }
.catalog-tools { padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: #111218; }
.catalog-tools > label { color: #e5d9f1; }
#catalog-search { background: #0b0c10; padding-inline: 16px; }
.catalog-filters button:hover { border-color: #a379c4; color: #fff; }
.catalog-filters button[aria-pressed=true] { border-color: #b886df; background: #38234c; }
.catalog-status { border-top: 1px solid var(--line); padding-top: 8px; }
.product-title-row, .card-body { min-width: 0; }
.product-title-row h3 { overflow-wrap: anywhere; }
.card-body .price-block { padding-top: 18px; border-top: 1px solid var(--line); }
.price-current { font-variant-numeric: tabular-nums; }
.card-warranty { align-items: flex-start; }
.card-warranty svg { flex-shrink: 0; margin-top: 3px; }
.details-button { border-color: #4b3b59; min-height: 44px; }
.purchase-summary { padding: 16px 18px; margin-block: 18px; border-inline-start: 3px solid #9d4edd; background: #19131f; border-radius: 8px; }
.purchase-summary h3:first-child { margin-top: 0; }
.full-product-details > summary { cursor: pointer; }
.dialog-scroll { scrollbar-gutter: stable; }
@media (min-width: 1200px) {
 .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
 .card-body { padding: 22px; }
 .product-title-row h3 { font-size: 23px; }
 .card-body .features { font-size: 13px; }
 .price-current { font-size: 30px; }
}
@media (max-width: 599px) {
 .catalog-tools { padding: 14px; }
 .catalog-filters { gap: 6px; }
 .catalog-filters button { padding-inline: 12px; font-size: 13px; }
 #catalog-search, .request-fields input { font-size: 16px; }
}
@media (prefers-reduced-motion: no-preference) {
 #product-dialog[open] { animation: dialog-arrive .2s ease-out; }
 #product-dialog[open]::backdrop { animation: backdrop-arrive .2s ease-out; }
 .button:active, .details-button:active { transform: translateY(1px); }
 @keyframes dialog-arrive { from { opacity: 0; transform: translateY(10px) scale(.99); } to { opacity: 1; transform: none; } }
 @keyframes backdrop-arrive { from { opacity: 0; } to { opacity: 1; } }
}

/* Readable product summary; complete terms remain available. */
.summary-features { line-height:1.9; }
.summary-features li + li { margin-top:6px; }
.purchase-summary { padding-block:4px 18px; }
.purchase-summary p { font-size:14px; color:#d0c9d6; line-height:1.9; }
.full-product-details { border-block:1px solid var(--line); padding:0; }
.full-product-details > summary { min-height:52px; padding-block:14px; font-size:14px; font-weight:600; color:#ddbbf6; }
.full-product-details > p, .full-product-details details p { font-size:14px; line-height:1.9; color:var(--muted); }
.full-product-details[open] { padding-bottom:16px; }