/* OraCleid SITE — one visual language for the whole public website.
   (TRS_03 WEBSITE COMPLETE VISUAL COHERENCE.) Website-layer CSS; loads last.
   No literal colour: identity from --ora-*, neutral base and scene from --w-*.

   The Home (ora-home.css) set the language: a neutral base, lifted panels
   (1 px line + inset light, one shadow scale), Cairo/Sora display type on an
   IBM Plex body, purple only where intelligence is active (kicker line, CTA,
   focus, live state). This sheet carries that language to every page and
   section that was still on the earlier "air" atmosphere: the air-layer
   tokens are re-pointed at the neutral system (so every component that
   derived its material from them changes at once), and the few components
   that authored their own material are re-skinned by name.

   Order of business: 0 tokens · 1 ground and chrome · 2 shell, sections and
   page stage · 3 type · 4 controls · 5 panels · 6 lists and paths · 7 forms ·
   8 Living and reading · 9 product page (Journey) · 10 confirmation pages ·
   11 footer · 12 responsive · 13 motion. */

/* ---- 0. the air layer resolves to the neutral system (all three theme states) ---- */
:root,
:root:not([data-ora-appearance="light"]),
:root[data-ora-appearance="dark"] {
  --air-ground: var(--w-base);
  --air-deep: var(--w-base);
  --air-lift: var(--w-base-2);
  --air-lift-2: var(--w-base-2);
  --air-haze: transparent;
  --air-haze-2: transparent;
  --air-glow-core: rgb(var(--w-glow) / .14);
  --air-glow-far: rgb(var(--w-glow) / .07);
  --air-glow-cool: transparent;
  --air-edge: var(--w-line);
  --air-edge-lit: color-mix(in srgb, var(--ora-accent-solid) 35%, var(--w-line));
  --air-orbit: color-mix(in srgb, var(--ora-accent-solid) 30%, transparent);
  --air-orbit-dim: var(--w-line-2);
  --air-orbit-live: var(--ora-accent-solid);
  --air-node-face: var(--w-base-2);
  --air-node-ring: color-mix(in srgb, var(--ora-accent-solid) 35%, transparent);
  --air-node-live-ring: var(--ora-accent-solid);
  --air-node-halo: rgb(var(--w-glow) / .2);
  --air-shadow-lift: var(--s-shadow-sm);
  --air-shadow-focal: var(--s-shadow-md);
  --air-pearl: var(--w-base);
  --air-wash: var(--w-base);
  --air-stage: var(--w-base);
  --air-ink: var(--w-base-3);
  --air-on-ink: var(--w-text);
  --air-on-ink-muted: var(--w-text-2);
}

/* the site system: the Home's scale, radii and materials, page-wide */
:root {
  --s-shell: min(100% - 2 * clamp(16px, 2.4vw, 36px), 1600px);
  --s-space-1: 4px; --s-space-2: 8px; --s-space-3: 12px; --s-space-4: 16px; --s-space-5: 24px; --s-space-6: 32px; --s-space-7: 48px; --s-space-8: 64px;
  --s-r: 22px; --s-r-2: 16px; --s-r-3: 10px; --s-r-4: 7px;
  --s-line: 1px solid var(--w-line);
  --s-inset: inset 0 1px 0 color-mix(in srgb, var(--w-silver-bright) 10%, transparent);
  --s-shadow-sm: 0 1px 0 color-mix(in srgb, var(--w-text) 6%, transparent);
  --s-shadow-md: 0 24px 60px -24px color-mix(in srgb, var(--w-text) 30%, transparent);
  --s-halo: 0 0 24px rgb(var(--w-glow) / .25);
  --s-ring: 0 0 0 1px color-mix(in srgb, var(--ora-accent-solid) 40%, transparent);
  --s-panel: linear-gradient(180deg, color-mix(in srgb, var(--w-base-2) 40%, transparent), var(--w-base-2));
  --s-t-display: clamp(1.9rem, 1rem + 1.9vw, 2.75rem);
  --s-t-display-ar: clamp(2rem, 1rem + 2.1vw, 3rem);
  --s-t-h2: clamp(1.4rem, 1rem + 1.1vw, 2rem);
  --s-t-h2-ar: clamp(1.5rem, 1rem + 1.2vw, 2.15rem);
  --s-t-h3: clamp(1.15rem, .9rem + .7vw, 1.45rem);
  --s-section: clamp(40px, 4.5vw, 64px);
  --s-ease: var(--w-ease-actor);
  --s-fast: 180ms; --s-tap: 120ms;
}

/* ---- 1. ground and chrome ------------------------------------------------------- */
body,
[dir="ltr"] body {
  background: var(--w-base);
  background-image: none;
  color: var(--w-text);
  font-family: var(--w-font-body);
}
.ora-entry,
.ora-entry--inner { background: transparent; color: var(--w-text); }
/* the entry composition's own atmosphere stays with the frozen hero; inner wrappers carry none */
.ora-entry--inner::before,
.ora-entry--inner::after { display: none; }
.ora-entry__bar {
  position: relative;
  z-index: 30;
  background: color-mix(in srgb, var(--w-base) 92%, transparent);
  color: var(--w-text);
  border-block-end: var(--s-line);
}
.ora-entry__nav a { color: var(--w-text-2); }
.ora-entry__nav a:hover { color: var(--w-text); }
.ora-lockup { color: var(--w-text); }
.ora-skip { background: var(--ora-accent-cta); color: var(--ora-text-on-cta); }
:where(a, button, summary, input, textarea, select, [tabindex]):focus-visible { outline: 2px solid var(--ora-border-focus); outline-offset: 2px; }

/* ---- 2. shell, sections, page stage ------------------------------------------- */
.ora-w,
.ora-w--alt, .ora-w--deep, .ora-w--pearl, .ora-w--spot, .ora-w--stage, .ora-w--lit {
  background: transparent;
  box-shadow: none;
  color: var(--w-text);
  padding-block: 0 var(--s-section);
}
.ora-w--lit::before,
.ora-showcase::before,
.ora-w--spot::before { display: none; }
.ora-w__inner {
  inline-size: var(--s-shell);
  max-inline-size: none;
  margin-inline: auto;
  padding-inline: 0;
  padding-block-start: var(--s-section);
  border-block-start: var(--s-line);
}
/* the first section after the page stage, and a section that follows the head directly, need no rule */
.ora-w--head + .ora-w > .ora-w__inner,
.h-world + .ora-entry .ora-w > .ora-w__inner,
.ora-ecosystem > .ora-w__inner { border-block-start: 0; }

/* the page stage: the Home's stage panel carried to every page head */
.ora-w--head {
  inline-size: var(--s-shell);
  margin: var(--s-space-5) auto 0;
  padding: clamp(24px, 3vw, 40px);
  border-radius: var(--s-r);
  background: var(--s-panel);
  box-shadow: var(--s-inset);
}
.ora-w--head > .ora-w__inner { inline-size: 100%; padding: 0; border: 0; }
.ora-w--head + .ora-w { padding-block-start: var(--s-space-6); }
.ora-w--head + .ora-w > .ora-w__inner { padding-block-start: 0; }

/* ---- 3. type ------------------------------------------------------------------- */
.ora-w__eyebrow,
.ora-showcase__cat,
.ora-offer__h,
.ora-ecogroup__label,
.ora-plan__k,
.ora-rx-cap {
  display: flex;
  align-items: center;
  gap: var(--s-space-3);
  margin: 0 0 var(--s-space-4);
  font-family: var(--w-font-body);
  font-size: var(--w-t-small);
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  color: var(--w-text-2);
}
.ora-rx-cap { display: inline-flex; }
.ora-living__kind { margin: 0 0 var(--s-space-3); font-size: var(--w-t-body); font-weight: 600; color: var(--ora-accent-text); }
.ora-living__cap--director { position: relative; overflow: clip; background: radial-gradient(240px 170px at 80% 0%, rgb(var(--w-glow) / .16), transparent 70%), var(--w-base-2); border-color: color-mix(in srgb, var(--ora-accent-solid) 35%, var(--w-line)); }
/* the Director is present in his own card (canonical raster, unmodified) */
.ora-living__cap--director::before { content: ""; position: absolute; inset-block-start: -4%; inset-inline-end: 2%; inline-size: 46%; max-inline-size: 300px; aspect-ratio: 711 / 661; background: url(/assets/brand/canonical/director-hero.png) center / contain no-repeat; opacity: .92; pointer-events: none; -webkit-mask-image: linear-gradient(180deg, currentColor 60%, transparent 100%); mask-image: linear-gradient(180deg, currentColor 60%, transparent 100%); }
.ora-living__cap--director > * { position: relative; z-index: 1; }
.ora-w__eyebrow::before,
.ora-offer__h::before {
  content: "";
  flex: none;
  inline-size: 24px;
  block-size: 1px;
  background: var(--ora-accent-solid);
}
.ora-w__h,
.ora-w__h--page,
.ora-living__h3,
.ora-rx__h,
.ora-showcase__name,
.ora-svc__entry-h,
.ora-profile__principles h2,
.ora-w__vm h3,
.ora-do__h,
.ora-give__h,
.ora-path__h,
.ora-evidence__h,
.ora-scale__h,
.ora-why__h,
.ora-svc__truth-h,
.ora-w__outcome-h,
.ora-relay__h,
.ora-living__cap-h,
.ora-living__moment-h,
.ora-living__gift-h,
.ora-living__readpt-h,
.ora-foot__col h2 {
  font-family: var(--w-font-display-en);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.15;
  color: var(--w-text);
  text-wrap: balance;
}
:lang(ar) :is(.ora-w__h, .ora-w__h--page, .ora-living__h3, .ora-rx__h, .ora-showcase__name, .ora-svc__entry-h, .ora-profile__principles h2, .ora-w__vm h3, .ora-do__h, .ora-give__h, .ora-path__h, .ora-evidence__h, .ora-scale__h, .ora-why__h, .ora-svc__truth-h, .ora-w__outcome-h, .ora-relay__h, .ora-living__cap-h, .ora-living__moment-h, .ora-living__gift-h, .ora-living__readpt-h, .ora-foot__col h2) {
  font-family: var(--w-font-display-ar);
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.3;
}
.ora-w__h { font-size: var(--s-t-h2); max-inline-size: 26ch; margin: 0; }
.ora-w__h:lang(ar) { font-size: var(--s-t-h2-ar); }
.ora-w__h--page, .ora-rx__h { font-size: var(--s-t-display); max-inline-size: 22ch; line-height: 1.08; }
:lang(ar) :is(.ora-w__h--page, .ora-rx__h) { font-size: var(--s-t-display-ar); max-inline-size: 24ch; line-height: 1.3; }
.ora-living__h3, .ora-showcase__name, .ora-svc__entry-h { font-size: var(--s-t-h3); max-inline-size: 30ch; margin: 0; }
.ora-profile__principles h2, .ora-w__vm h3, .ora-do__h, .ora-give__h, .ora-path__h, .ora-evidence__h, .ora-scale__h, .ora-why__h, .ora-svc__truth-h, .ora-w__outcome-h, .ora-relay__h, .ora-living__cap-h, .ora-living__moment-h, .ora-living__gift-h, .ora-living__readpt-h { font-size: var(--w-t-body); line-height: 1.3; }
.ora-w__eyebrow + .ora-w__h,
.ora-w__eyebrow + .ora-w__h--page { margin-block-start: 0; }
.ora-w__lede,
.ora-rx__sub,
.ora-living__support {
  margin: var(--s-space-4) 0 0;
  max-inline-size: 48ch;
  color: var(--w-text-2);
  font-family: var(--w-font-body);
  font-size: var(--w-t-lead);
  font-weight: 400;
  line-height: 1.6;
}
.ora-w__p,
.ora-living__lead,
.ora-living__hint,
.ora-rx__benefit,
.ora-do__p,
.ora-give__p,
.ora-path__p,
.ora-evidence__p,
.ora-scale__p,
.ora-why__p,
.ora-svc__truth-p,
.ora-svc__entry-p,
.ora-w__outcome-p,
.ora-relay__p,
.ora-showcase__p,
.ora-profile__principles p,
.ora-w__vm p,
.ora-living__cap-p,
.ora-living__moment-p,
.ora-living__gift-p,
.ora-living__readpt-p,
.ora-products__keep {
  color: var(--w-text-2);
  font-family: var(--w-font-body);
  font-size: var(--w-t-body);
  line-height: 1.6;
}
.ora-w__p { margin: 0 0 var(--s-space-4); max-inline-size: 58ch; }
.ora-w__fineprint,
.ora-living__note,
.ora-ecogroup__note,
.ora-w__why { color: var(--w-text-3); font-size: var(--w-t-small); line-height: 1.5; max-inline-size: 58ch; }
.ora-w__why { color: var(--w-text); font-weight: 500; }
.ora-showcase__line { color: var(--ora-accent-text); font-weight: 600; }
.ora-accounts, .ora-accounts a { color: var(--w-text-3); }
.ora-accounts a { color: var(--ora-accent-text); }
a { color: var(--ora-accent-text); }
::selection { background: color-mix(in srgb, var(--ora-accent-solid) 30%, transparent); }

/* ---- 4. controls: the Home's grammar (primary = active intelligence, secondary = line) ---- */
.ora-btn {
  min-block-size: 44px;
  height: auto;
  gap: 10px;
  padding-inline: 18px;
  border: 1px solid transparent;
  border-radius: var(--s-r-3);
  font-family: var(--w-font-body);
  font-size: var(--w-t-small);
  font-weight: 700;
  line-height: 1.2;
  cursor: pointer;
  transition: background-color var(--s-fast), color var(--s-fast), border-color var(--s-fast), box-shadow var(--s-fast), transform var(--s-tap) var(--w-ease-micro);
}
.ora-btn:active { transform: scale(.97); }
.ora-btn svg { flex: none; inline-size: 16px; block-size: 16px; }
.ora-btn--primary,
.ora-btn--primary:not(:disabled) { background: var(--ora-accent-cta); color: var(--ora-text-on-cta); box-shadow: var(--s-halo); }
.ora-btn--primary:hover:not(:disabled) { background: var(--ora-accent-cta-hover); color: var(--ora-text-on-cta); }
.ora-btn--secondary { background: transparent; border-color: var(--w-line-2); color: var(--w-text); }
.ora-btn--secondary:hover:not(:disabled) { background: var(--w-base-3); border-color: var(--w-line-2); color: var(--w-text); }
.ora-btn--quiet { background: transparent; color: var(--ora-accent-text); padding-inline: 4px; }
.ora-btn--quiet:hover:not(:disabled) { background: transparent; color: var(--w-text); }
.ora-w__actions { display: flex; flex-wrap: wrap; gap: var(--s-space-3); margin-block-start: var(--s-space-5); }
.ora-w__actions .ora-btn { min-block-size: 46px; }

/* ---- 5. panels: one material for every lifted surface ---------------------------- */
.ora-showcase,
.ora-lift,
.ora-svc__entry,
.ora-trust__gate,
.ora-relay__item,
.ora-why__item,
.ora-why__item--lead,
.ora-svc__mosaic li,
.ora-svc__mosaic li:nth-child(1),
.ora-svc__mosaic li:nth-child(6),
.ora-acquire li,
.ora-living__talk,
.ora-living__world,
.ora-living__gift,
.ora-living__cap,
.ora-living__moment,
.ora-living__moment--morning,
.ora-device--desk,
.ora-rx-chat,
.ora-rx-lib,
.ora-w__product,
.ora-form.ora-w__two-body {
  background: var(--s-panel);
  border: var(--s-line);
  border-radius: var(--s-r-2);
  box-shadow: var(--s-inset), var(--s-shadow-sm);
}
.ora-showcase,
.ora-svc__entry,
.ora-living__talk,
.ora-living__world,
.ora-form.ora-w__two-body { border-radius: var(--s-r); box-shadow: var(--s-inset), var(--s-shadow-md); }
.ora-showcase { margin-block-start: var(--s-space-5); padding: clamp(20px, 2.6vw, 36px); gap: clamp(20px, 3vw, 44px); }
.ora-showcase__points li { color: var(--w-text-2); font-size: var(--w-t-body); }
.ora-showcase__points svg { color: var(--ora-accent-text); }
/* an explicit size: a shrink-to-fit figure around a lazy image resolves to 0 and the image never loads */
.ora-book { inline-size: min(100%, 340px); max-inline-size: none; }
.ora-book__img { border-radius: var(--s-r-3); filter: drop-shadow(0 22px 28px color-mix(in srgb, var(--w-text) 22%, transparent)); }
.ora-kinds__item,
.ora-living__prompt,
.ora-living__obj,
.ora-living__obj--books, .ora-living__obj--products, .ora-living__obj--services, .ora-living__obj--requests, .ora-living__obj--saved,
.ora-soon {
  background: var(--w-base-3);
  border: var(--s-line);
  color: var(--w-text);
}
.ora-kinds__item--soon { color: var(--w-text-2); }
.ora-soon { color: var(--ora-accent-text); border-color: color-mix(in srgb, var(--ora-accent-solid) 30%, transparent); background: color-mix(in srgb, var(--ora-accent-solid) 10%, transparent); }
.ora-acquire li { font-weight: 700; color: var(--w-text); }
.ora-acquire li:not(:last-child)::after { border-inline-start-color: var(--ora-accent-solid); }
.ora-trust__gate li { color: var(--w-text); border-inline-start-color: var(--w-line-2); }
.ora-trust__gate li:last-child { color: var(--ora-accent-text); border-inline-start-color: var(--ora-accent-solid); }
.ora-relay__item[data-relay-center] { border-color: color-mix(in srgb, var(--ora-accent-solid) 45%, transparent); box-shadow: var(--s-ring), var(--s-inset); }

/* ---- 6. lists, paths, dividers --------------------------------------------------- */
.ora-do--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 var(--s-space-6); }
.ora-do__i { display: grid; place-items: center; inline-size: 36px; block-size: 36px; margin-block-end: var(--s-space-2); border-radius: var(--s-r-3); background: color-mix(in srgb, var(--ora-accent-solid) 12%, transparent); color: var(--ora-accent-text); }
.ora-do__i svg { inline-size: 18px; block-size: 18px; }
@media (max-width: 860px) { .ora-do--3 { grid-template-columns: 1fr; } }
.ora-do li,
.ora-w__outcomes li,
.ora-profile__principles li,
.ora-library { border-color: var(--w-line); }
.ora-library { border-block-start: var(--s-line); }
.ora-give__item { border-block-start: 2px solid color-mix(in srgb, var(--ora-accent-solid) 60%, var(--w-line)); }
.ora-give__n, .ora-scale__n { font-family: var(--w-font-body); color: var(--ora-accent-text); font-weight: 700; }
.ora-scale li { border-block-start-color: var(--ora-accent-solid); }
/* the ecosystem panel takes the shell's width, like the Home stage above it */
.ora-entry .ora-ecosystem,
.ora-ecosystem {
  inline-size: var(--s-shell);
  max-inline-size: none;
  margin: var(--s-space-6) auto 0;
  padding: clamp(24px, 3vw, 40px);
  border: var(--s-line);
  border-radius: var(--s-r);
  background: var(--s-panel);
  box-shadow: var(--s-inset), var(--s-shadow-sm);
}
.ora-eco { color: var(--w-text); }
.ora-eco__glyph { background: var(--w-base-3); border: var(--s-line); color: var(--ora-accent-text); }
.ora-eco__name { color: var(--w-text-2); }
.ora-ecosystem { padding-block: var(--s-section) 0; }

/* ---- 7. forms ------------------------------------------------------------------- */
.ora-form { gap: var(--s-space-5); }
.ora-form.ora-w__two-body { max-inline-size: none; padding: clamp(20px, 2.6vw, 32px); }
.ora-field label { color: var(--w-text); font-size: var(--w-t-small); font-weight: 700; }
.ora-field__hint { color: var(--w-text-3); font-size: var(--w-t-micro); }
.ora-field input,
.ora-field select,
.ora-field textarea {
  min-block-size: 46px;
  padding: 10px 14px;
  border: var(--s-line);
  border-radius: var(--s-r-3);
  background: var(--w-base);
  color: var(--w-text);
  font-family: var(--w-font-body);
  font-size: var(--w-t-body);
  box-shadow: var(--s-inset);
  transition: border-color var(--s-fast), box-shadow var(--s-fast);
}
.ora-field textarea { min-block-size: 140px; }
.ora-field input:hover, .ora-field select:hover, .ora-field textarea:hover { border-color: var(--w-line-2); }
.ora-field input:focus, .ora-field select:focus, .ora-field textarea:focus {
  outline: none;
  border-color: var(--ora-accent-solid);
  box-shadow: var(--s-inset), 0 0 0 3px rgb(var(--w-glow) / .18);
}
.ora-form .ora-btn { min-block-size: 46px; }

/* ---- 8. Living and reading: the same panels, tighter chapters ------------------------- */
.ora-living { background: transparent; padding-block: 0 var(--s-section); }
.ora-living__chapter { padding-block: 0 var(--s-section); background: transparent; }
.ora-living__chapter > .ora-w__inner { padding-block-start: var(--s-section); border-block-start: var(--s-line); }
/* the opening and closing chapters are stages, like the Home's */
.ora-living__chapter--open,
.ora-living__chapter--free {
  inline-size: var(--s-shell);
  margin-inline: auto;
  padding: clamp(24px, 3vw, 44px);
  border-radius: var(--s-r);
  background: var(--s-panel);
  box-shadow: var(--s-inset);
  color: var(--w-text);
}
.ora-living__chapter--open { margin-block-start: var(--s-space-6); }
.ora-living__chapter--free { margin-block-end: var(--s-section); }
.ora-living__chapter--open > .ora-w__inner,
.ora-living__chapter--free > .ora-w__inner { inline-size: 100%; padding: 0; border: 0; }
.ora-living__chapter--open + .ora-living__chapter > .ora-w__inner { border-block-start: 0; }
.ora-living__chapter--open :is(.ora-living__h, .ora-living__support, .ora-living__kind, .ora-living__hint, .ora-living__lead, .ora-living__core-caption, .ora-w__eyebrow, .ora-accounts, .ora-accounts a),
.ora-living__chapter--free :is(.ora-living__h3, .ora-living__gift-h, .ora-living__lead, .ora-living__gift-p, .ora-w__fineprint, .ora-accounts, .ora-accounts a) { color: inherit; }
.ora-living__chapter--open .ora-living__lead,
.ora-living__chapter--open .ora-living__core-caption,
.ora-living__chapter--free .ora-living__lead,
.ora-living__chapter--free .ora-w__fineprint { color: var(--w-text-2); }
.ora-living__chapter--open .ora-btn--secondary,
.ora-living__chapter--free .ora-btn--secondary { background: transparent; color: var(--w-text); border-color: var(--w-line-2); }
.ora-living__core-glow { background: radial-gradient(circle, rgb(var(--w-glow) / .5), transparent 70%); }
.ora-living__core-star { background: var(--ora-accent-solid); }
.ora-living__talk-you,
.ora-device__you,
.ora-living__path-step,
.ora-living__band,
.ora-living__gift,
.ora-rx-chat__bubble,
.ora-rx-ex,
.ora-rx-note__card,
.ora-rx-card,
.ora-rx-lib__panel { color: var(--w-text); }
.ora-living__path-step { background: var(--w-base-2); border: var(--s-line); border-radius: var(--s-r-2); }
.ora-living__band { background: var(--w-base-3); border: var(--s-line); border-radius: var(--s-r-2); }
.ora-living__band-k, .ora-living__band-n, .ora-living__path-k { color: var(--w-text-2); }
.ora-living__device-line, .ora-device__next span { color: var(--w-text-2); }
.ora-readx { background: transparent; }
.ora-rx { background: transparent; }
.ora-rx--talk, .ora-rx--cont, .ora-rx--share, .ora-rx--pair { background: var(--s-panel); border: var(--s-line); border-radius: var(--s-r); box-shadow: var(--s-inset); }

/* ---- 9. product page (Journey): the offer composition, on the site's stage ---------------- */
.ora-w--product { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, 320px); column-gap: clamp(24px, 3vw, 48px); align-items: center; }
.ora-w--product > .ora-w__inner { inline-size: 100%; }
.ora-product__cover { margin: 0; justify-self: end; inline-size: 100%; max-inline-size: 320px; }
.ora-product__cover img { display: block; inline-size: 100%; height: auto; border-radius: var(--s-r-3); box-shadow: var(--s-shadow-md); }
.ora-product__price { margin: var(--s-space-4) 0 0; font-family: var(--w-font-display-en); font-size: var(--w-t-lead); font-weight: 700; color: var(--w-text); }
.ora-product__price:lang(ar) { font-family: var(--w-font-display-ar); font-weight: 800; }
.ora-note {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  max-inline-size: 58ch;
  margin: var(--s-space-4) 0 0;
  padding: 12px 14px;
  border: var(--s-line);
  border-radius: 14px;
  background: var(--w-base-3);
  color: var(--w-text-2);
  font-size: var(--w-t-small);
  line-height: 1.5;
}
.ora-note svg { flex: none; inline-size: 18px; block-size: 18px; margin-block-start: 2px; color: var(--ora-accent-text); }
.ora-note strong { color: var(--w-text); font-weight: 700; }
.ora-steps { list-style: none; counter-reset: step; margin: 0; padding: 0; display: grid; gap: var(--s-space-2); }
.ora-steps li { display: grid; grid-template-columns: 30px minmax(0, 1fr); column-gap: 14px; align-items: start; padding: 12px 0; border-block-start: var(--s-line); }
.ora-steps li:first-child { border-block-start: 0; }
.ora-steps li::before { counter-increment: step; content: counter(step); display: grid; place-items: center; inline-size: 30px; block-size: 30px; border-radius: 50%; border: 1.5px solid var(--ora-accent-solid); color: var(--ora-accent-text); font-size: var(--w-t-small); font-weight: 700; }
.ora-steps h3 { margin: 2px 0 2px; font-family: var(--w-font-display-en); font-weight: 600; font-size: var(--w-t-body); color: var(--w-text); }
.ora-steps h3:lang(ar) { font-family: var(--w-font-display-ar); font-weight: 800; }
.ora-steps p { margin: 0; color: var(--w-text-2); font-size: var(--w-t-small); line-height: 1.5; }
.ora-faq { display: grid; gap: var(--s-space-2); max-inline-size: 70ch; }
.ora-faq details { border: var(--s-line); border-radius: var(--s-r-2); background: var(--w-base-2); box-shadow: var(--s-inset); transition: border-color var(--s-fast); }
.ora-faq details[open] { border-color: var(--w-line-2); }
.ora-faq summary { display: flex; align-items: center; justify-content: space-between; gap: var(--s-space-4); min-block-size: 52px; padding: 12px 18px; cursor: pointer; list-style: none; font-weight: 700; color: var(--w-text); }
.ora-faq summary::-webkit-details-marker { display: none; }
.ora-faq summary::after { content: ""; flex: none; inline-size: 8px; block-size: 8px; border-inline-end: 1.5px solid var(--w-text-3); border-block-end: 1.5px solid var(--w-text-3); transform: rotate(45deg); transition: transform var(--s-fast); }
.ora-faq details[open] summary::after { transform: rotate(-135deg); }
.ora-faq p { margin: 0; padding: 0 18px 16px; color: var(--w-text-2); font-size: var(--w-t-body); line-height: 1.6; }
.ora-w--cta,
.ora-w--cta.ora-w {
  inline-size: var(--s-shell);
  margin-inline: auto;
  margin-block-end: var(--s-section);
  padding: clamp(28px, 3.5vw, 56px);
  border-radius: var(--s-r);
  background: var(--s-panel);
  box-shadow: var(--s-inset), var(--s-ring);
  color: var(--w-text);
  text-align: center;
}
.ora-w--cta > .ora-w__inner { inline-size: 100%; padding: 0; border: 0; display: grid; justify-items: center; }
.ora-w--cta .ora-w__h, .ora-w--cta .ora-w__lede { color: var(--w-text); margin-inline: auto; }
.ora-w--cta .ora-w__lede { color: var(--w-text-2); }
.ora-w--cta .ora-w__actions { justify-content: center; }
.ora-w--cta .ora-accounts { align-items: center; text-align: center; }
.ora-w--cta .ora-accounts a { color: var(--ora-accent-text); }
.ora-w__ctainner { display: grid; justify-items: center; }

/* ---- 10. confirmation pages (thanks, not found): one quiet stage --------------------- */
.ora-w--note { text-align: center; }
.ora-w--note > .ora-w__inner { display: grid; justify-items: center; }
.ora-w--note .ora-w__h--page, .ora-w--note .ora-w__lede { margin-inline: auto; }
.ora-badge { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 var(--s-space-4); padding: 4px 12px; border-radius: 999px; border: var(--s-line); background: var(--w-base-3); color: var(--w-text-2); font-size: var(--w-t-small); font-weight: 700; }
.ora-badge::before { content: ""; inline-size: 8px; block-size: 8px; border-radius: 50%; background: var(--ora-accent-solid); }
.ora-w--note .ora-w__actions { justify-content: center; }

/* ---- 11. footer ---------------------------------------------------------------- */
.ora-foot {
  background: var(--w-base);
  border-block-start: var(--s-line);
  color: var(--w-text-2);
  font-family: var(--w-font-body);
  padding-block: var(--s-space-7) var(--s-space-5);
}
.ora-foot__inner,
.ora-foot__bar { inline-size: var(--s-shell); max-inline-size: none; margin-inline: auto; padding-inline: 0; }
.ora-foot__col h2 { margin: 0 0 var(--s-space-3); font-size: var(--w-t-small); color: var(--w-text); }
.ora-foot__col a, .ora-foot a { color: var(--w-text-2); text-decoration: none; }
.ora-foot__col a:hover, .ora-foot a:hover { color: var(--w-text); }
.ora-foot__bar { margin-block-start: var(--s-space-6); padding-block-start: var(--s-space-4); border-block-start: var(--s-line); color: var(--w-text-3); font-size: var(--w-t-micro); }
.ora-foot__tag { color: var(--w-text-3); letter-spacing: .08em; }
.ora-foot .ora-lockup__engine { color: var(--w-text-3); }

/* ---- 12. responsive ------------------------------------------------------------- */
@media (max-width: 1100px) {
  .ora-w--product { grid-template-columns: minmax(0, 1fr) minmax(180px, 240px); }
}
@media (max-width: 760px) {
  :root { --s-section: 36px; }
  .ora-w--head, .ora-living__chapter--open, .ora-living__chapter--free, .ora-w--cta, .ora-w--cta.ora-w { padding: var(--s-space-4); border-radius: var(--s-r-2); }
  .ora-w--product { grid-template-columns: minmax(0, 1fr); row-gap: var(--s-space-4); }
  .ora-product__cover { justify-self: start; max-inline-size: 200px; }
  .ora-showcase { padding: var(--s-space-4); }
  .ora-book { inline-size: min(100%, 220px); justify-self: start; }
  .ora-form.ora-w__two-body { padding: var(--s-space-4); }
  .ora-foot { padding-block: var(--s-space-6) var(--s-space-5); }
}

/* ---- 13. motion ----------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .ora-btn, .ora-field input, .ora-field select, .ora-field textarea, .ora-faq summary::after, .ora-faq details { transition: none; }
}

/* ---- 14. late refinements from browser QA ------------------------------------------ */
.ora-svc__entry + .ora-offer__h { margin-block-start: var(--s-space-6); }
/* laptops between the sheet breakpoint and the wide bar: the bar wraps instead of overflowing */
@media (min-width: 901px) and (max-width: 1160px) {
  .ora-entry__bar { flex-wrap: wrap; row-gap: 8px; }
  .ora-entry__nav { gap: 12px; }
}
