/* Finance House for Banking Consultant - site stylesheet
   Brand-locked palette (navy + gold from the logo). Dark theme only.
   Sharp corner system echoing the hexagon mark. Logical properties for RTL. */

:root {
  --navy-950: #050b16;
  --navy-900: #0a1628;
  --navy-800: #0f1f38;
  --navy-700: #16294a;
  --gold: #c9a24e;
  --gold-300: #e6cf95;
  --gold-700: #8f6e2a;
  --ink: #f2eee6;
  --ink-2: rgba(242, 238, 230, 0.7);
  --ink-3: rgba(242, 238, 230, 0.45);
  --hair: rgba(201, 162, 78, 0.2);
  --hair-2: rgba(242, 238, 230, 0.09);
  --danger: #e8a196;
  --font-display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --font-body: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-latin-display: "Cormorant Garamond", Georgia, serif;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-2: cubic-bezier(0.32, 0.72, 0, 1);
  --container: 1320px;
  --gutter: clamp(20px, 5vw, 64px);
  --nav-h: 76px;
  --origin-start: left;
  --dir: 1;
  --z-nav: 40;
  --z-menu: 50;
  --z-grain: 60;
  --z-float: 45;
  --r-pill: 999px;
  --r-lg: 20px;
  --r-md: 14px;
  --r-sm: 10px;
  --hexes: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48.5' height='84' viewBox='0 0 48.5 84'%3E%3Cg fill='none' stroke='%23c9a24e' stroke-opacity='.13' stroke-width='1'%3E%3Cpolygon points='24.25,0 48.5,14 48.5,42 24.25,56 0,42 0,14'/%3E%3Cpolygon points='0,42 24.25,56 24.25,84 0,98 -24.25,84 -24.25,56'/%3E%3Cpolygon points='48.5,42 72.75,56 72.75,84 48.5,98 24.25,84 24.25,56'/%3E%3Cpolygon points='48.5,-42 72.75,-28 72.75,0 48.5,14 24.25,0 24.25,-28'/%3E%3Cpolygon points='0,-42 24.25,-28 24.25,0 0,14 -24.25,0 -24.25,-28'/%3E%3C/g%3E%3C/svg%3E");
  --hex-clip: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
  --arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E");
  --chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c9a24e' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
}

[dir="rtl"] {
  --font-display: "Amiri", "Cormorant Garamond", serif;
  --font-body: "IBM Plex Sans Arabic", "Manrope", system-ui, sans-serif;
  --origin-start: right;
  --dir: -1;
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--navy-950);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
body.menu-open { overflow: hidden; }
body.menu-open .nav { z-index: calc(var(--z-menu) + 1); }
main, .footer { overflow-x: clip; }
img, svg, iframe { max-width: 100%; display: block; }
a { color: inherit; }
h1, h2, h3, h4, p, ul, ol, dl, figure, blockquote { margin: 0; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--gold-300); outline-offset: 3px; }

.skip {
  position: absolute; inset-inline-start: 1rem; top: -4rem; z-index: 100; border-radius: var(--r-pill);
  background: var(--gold); color: var(--navy-950); padding: .7rem 1rem; text-decoration: none;
  font-size: .85rem; transition: top .2s;
}
.skip:focus { top: 1rem; }

.grain {
  position: fixed; inset: 0; z-index: var(--z-grain); pointer-events: none; opacity: .045;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

.container { max-width: var(--container); margin-inline: auto; padding-inline: var(--gutter); }

/* ---------- Typography ---------- */
.display-xl, .display-lg, .display-md { font-family: var(--font-display); font-weight: 500; text-wrap: balance; }
.display-xl { font-size: clamp(2.6rem, 5.4vw, 4.9rem); line-height: 1.04; letter-spacing: -.012em; }
.display-lg { font-size: clamp(2.1rem, 3.9vw, 3.3rem); line-height: 1.08; letter-spacing: -.008em; }
.display-md { font-size: clamp(1.7rem, 2.7vw, 2.35rem); line-height: 1.15; }
[dir="rtl"] .display-xl { line-height: 1.3; letter-spacing: 0; font-size: clamp(2.3rem, 4.8vw, 4.3rem); }
[dir="rtl"] .display-lg { line-height: 1.35; letter-spacing: 0; }
[dir="rtl"] .display-md { line-height: 1.45; }
[dir="rtl"] body { line-height: 1.8; }

.eyebrow {
  font-family: var(--font-body); font-size: .72rem; font-weight: 600; letter-spacing: .24em;
  text-transform: uppercase; color: var(--gold);
}
[dir="rtl"] .eyebrow { letter-spacing: 0; font-size: .95rem; }
.eyebrow + .display-lg, .eyebrow + .display-md { margin-top: 1rem; }
.lede { font-size: clamp(1.05rem, 1.3vw, 1.2rem); line-height: 1.65; color: var(--ink-2); max-width: 56ch; }
.prose { color: var(--ink-2); line-height: 1.75; max-width: 62ch; }
.prose + .prose { margin-top: 1.2rem; }

/* Split-word reveal (JS wraps words; CSS hides only while html.anim) */
[data-split] .w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .12em; margin-bottom: -.12em; }
[data-split] .wi { display: inline-block; }
html.anim [data-split] .wi { transform: translateY(112%); }

/* Reveal states */
html.anim [data-reveal], html.anim [data-reveal-group] > * { opacity: 0; transform: translateY(28px); }
html.anim [data-reveal].is-in, html.anim [data-reveal-group] > .is-in { opacity: 1; transform: none; }

/* ---------- Buttons and links ---------- */
.btn {
  position: relative; isolation: isolate; overflow: hidden; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; gap: .9rem;
  padding: .7rem .7rem .7rem 1.6rem; border: 1px solid var(--gold); background: transparent; border-radius: var(--r-pill);
  color: var(--gold-300); text-decoration: none; white-space: nowrap;
  font-family: var(--font-body); font-size: .78rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
  transition: color .45s var(--ease), border-color .45s var(--ease), transform .15s var(--ease);
}
[dir="rtl"] .btn { letter-spacing: 0; font-size: .95rem; font-weight: 500; padding: .7rem 1.6rem .7rem .7rem; }
.btn:not(:has(.btn__arrow)) { padding-inline: 1.6rem; }
.btn::before {
  content: ""; position: absolute; inset: 0; z-index: -1; background: var(--gold);
  transform: scaleX(0); transform-origin: var(--origin-start); transition: transform .55s var(--ease);
}
.btn:hover::before, .btn:focus-visible::before { transform: scaleX(1); }
.btn:hover, .btn:focus-visible { color: var(--navy-950); }
.btn:active { transform: scale(.98); }
.btn--solid { background: var(--gold); color: var(--navy-950); }
.btn--solid::before { background: var(--gold-300); }
.btn--sm { padding: .5rem 1.15rem; font-size: .7rem; }
[dir="rtl"] .btn--sm { font-size: .88rem; }
.btn--block { width: 100%; }
.btn__arrow {
  display: inline-block; width: 1.05em; height: 1.05em; flex: none; background: currentColor;
  -webkit-mask: var(--arrow) center / contain no-repeat; mask: var(--arrow) center / contain no-repeat;
  transform: scaleX(var(--dir)); transition: transform .45s var(--ease);
}
.textlink:hover .btn__arrow, .ledger__row:hover .btn__arrow, .related__link:hover .btn__arrow, .panel--link:hover .btn__arrow {
  transform: scaleX(var(--dir)) translateX(5px);
}
/* Inside pill buttons the arrow sits in its own circle (button-in-button) */
.btn .btn__arrow {
  position: relative; width: 2.3em; height: 2.3em; border-radius: 50%; background: rgba(201, 162, 78, .14);
  -webkit-mask: none; mask: none; transform: none; transition: background .4s var(--ease), transform .5s var(--ease);
}
.btn .btn__arrow::before {
  content: ""; position: absolute; inset: 27%; background: currentColor;
  -webkit-mask: var(--arrow) center / contain no-repeat; mask: var(--arrow) center / contain no-repeat;
  transform: scaleX(var(--dir)); transition: transform .5s var(--ease);
}
.btn--solid .btn__arrow { background: rgba(5, 11, 22, .14); }
.btn:hover .btn__arrow { background: rgba(5, 11, 22, .16); transform: scale(1.08); }
.btn:hover .btn__arrow::before { transform: scaleX(var(--dir)) translateX(2px); }
.textlink {
  display: inline-flex; align-items: center; gap: .6rem; margin-top: 1.5rem;
  color: var(--gold-300); text-decoration: none; font-size: .78rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
  transition: color .3s;
}
[dir="rtl"] .textlink { letter-spacing: 0; font-size: .95rem; font-weight: 500; }
.textlink:hover { color: var(--ink); }

/* ---------- Panel (certificate-style enclosure) ---------- */
.panel {
  position: relative; padding: clamp(1.6rem, 3vw, 2.6rem);
  border: 1px solid var(--hair); border-radius: var(--r-lg);
  background: linear-gradient(180deg, rgba(255, 255, 255, .035), rgba(255, 255, 255, .008));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07), 0 40px 80px -40px rgba(2, 6, 14, .9);
}
.panel::before {
  content: ""; position: absolute; inset: 0 auto auto 50%; width: 40%; height: 1px; transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, rgba(201, 162, 78, .7), transparent); pointer-events: none;
}
.panel__title { font-family: var(--font-display); font-size: clamp(1.5rem, 2.2vw, 1.85rem); font-weight: 500; line-height: 1.15; margin-bottom: .9rem; }
.panel__body { color: var(--ink-2); line-height: 1.7; }
.panel--link { display: block; text-decoration: none; color: inherit; transition: transform .6s var(--ease), border-color .4s, background .4s; }
.panel--link:hover { transform: translateY(-5px); border-color: rgba(201, 162, 78, .5); background: linear-gradient(180deg, rgba(201, 162, 78, .07), rgba(255, 255, 255, .01)); }
.panel__hex { display: block; width: 18px; height: 20px; margin-bottom: 1.4rem; background: var(--gold); clip-path: var(--hex-clip); opacity: .8; }
.panel__uses { list-style: none; padding: 0; margin: 1.4rem 0 .4rem; display: grid; gap: .55rem; color: var(--ink-2); font-size: .95rem; }
.panel__uses li, .checklist li { display: flex; gap: .8rem; align-items: baseline; }
.panel__uses li::before, .checklist li::before {
  content: ""; flex: none; width: 7px; height: 8px; background: var(--gold); clip-path: var(--hex-clip); position: relative; top: -1px;
}
.panel--quote .panel__quote { font-family: var(--font-display); font-size: clamp(1.25rem, 1.8vw, 1.5rem); line-height: 1.5; color: var(--ink); margin-top: .9rem; }
.panel--quote .eyebrow { margin-bottom: .4rem; }

/* ---------- Navigation ---------- */
.nav {
  position: fixed; inset-inline: 0; top: 0; z-index: var(--z-nav);
  border-bottom: 1px solid transparent;
  transition: background .5s var(--ease), border-color .5s var(--ease);
}
.nav.is-scrolled {
  background: rgba(5, 11, 22, .82);
  -webkit-backdrop-filter: blur(16px) saturate(140%); backdrop-filter: blur(16px) saturate(140%);
  border-bottom-color: var(--hair-2);
}
.nav__inner {
  max-width: var(--container); margin-inline: auto; padding-inline: var(--gutter); height: var(--nav-h);
  display: flex; align-items: center; justify-content: space-between; gap: 2rem;
}
.brand { display: inline-flex; align-items: center; gap: .85rem; text-decoration: none; color: var(--ink); }
.brand__mark { width: 40px; height: 40px; }
.brand__word {
  font-family: var(--font-latin-display); font-weight: 600; font-size: 1.05rem; letter-spacing: .22em; text-transform: uppercase; color: var(--gold-300); white-space: nowrap;
}
[dir="rtl"] .brand__word { font-family: var(--font-display); font-weight: 700; letter-spacing: 0; font-size: 1.3rem; text-transform: none; }
.nav__links { display: flex; gap: 2.2rem; }
.nav__links a {
  position: relative; padding-block: .4rem; text-decoration: none; color: var(--ink-2);
  font-size: .8rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; transition: color .3s;
}
[dir="rtl"] .nav__links a { letter-spacing: 0; font-size: .98rem; }
.nav__links a::after {
  content: ""; position: absolute; inset-inline-start: 0; bottom: 0; width: 100%; height: 1px; background: var(--gold);
  transform: scaleX(0); transform-origin: var(--origin-start); transition: transform .5s var(--ease);
}
.nav__links a:hover, .nav__links a[aria-current] { color: var(--ink); }
.nav__links a:hover::after, .nav__links a[aria-current]::after { transform: scaleX(1); }
.nav__actions { display: flex; align-items: center; gap: 1.4rem; }
.lang { font-size: .9rem; color: var(--ink-2); text-decoration: none; transition: color .3s; }
.lang:hover { color: var(--gold-300); }
[dir="rtl"] .lang { font-family: "Manrope", system-ui, sans-serif; letter-spacing: .06em; font-size: .8rem; text-transform: uppercase; }
[dir="ltr"] .lang { font-family: "IBM Plex Sans Arabic", system-ui, sans-serif; font-size: 1rem; }

.burger {
  display: none; position: relative; width: 44px; height: 44px; margin-inline-end: -10px;
  background: none; border: 0; cursor: pointer; padding: 0;
}
.burger span {
  position: absolute; left: 10px; width: 24px; height: 1.5px; background: var(--gold-300);
  transition: transform .5s var(--ease), top .5s var(--ease);
}
.burger span:first-child { top: 17px; }
.burger span:last-child { top: 26px; }
.burger[aria-expanded="true"] span:first-child { top: 21px; transform: rotate(45deg); }
.burger[aria-expanded="true"] span:last-child { top: 21px; transform: rotate(-45deg); }

.menu {
  position: fixed; inset: 0; z-index: var(--z-menu); padding-top: var(--nav-h);
  background: rgba(5, 11, 22, .94);
  -webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px);
  opacity: 0; transition: opacity .5s var(--ease);
}
.menu.is-open { opacity: 1; }
.menu__inner { height: 100%; display: flex; flex-direction: column; justify-content: space-between; padding: 2rem var(--gutter) 2.5rem; overflow-y: auto; }
.menu__links { display: flex; flex-direction: column; gap: .2rem; }
.menu__links a {
  font-family: var(--font-display); font-size: clamp(2rem, 8vw, 3rem); font-weight: 500; line-height: 1.25;
  text-decoration: none; color: var(--ink); padding: .35rem 0; border-bottom: 1px solid var(--hair-2);
  opacity: 0; transform: translateY(24px); transition: opacity .7s var(--ease), transform .7s var(--ease), color .3s;
}
.menu.is-open .menu__links a { opacity: 1; transform: none; }
.menu__links a:nth-child(1) { transition-delay: .08s; }
.menu__links a:nth-child(2) { transition-delay: .14s; }
.menu__links a:nth-child(3) { transition-delay: .2s; }
.menu__links a:nth-child(4) { transition-delay: .26s; }
.menu__links a:nth-child(5) { transition-delay: .32s; }
.menu__links a:hover { color: var(--gold-300); }
.menu__foot { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding-top: 2rem; color: var(--ink-2); }
.menu__foot a { text-decoration: none; }
.menu__foot a:last-child { font-family: var(--font-latin-display); font-size: 1.35rem; color: var(--ink); }

/* ---------- Hero ---------- */
.hero {
  position: relative; overflow: hidden; min-height: 100dvh;
  display: flex; align-items: center;
  padding-top: calc(var(--nav-h) + 1.5rem); padding-bottom: 4rem;
}
.hero__glow {
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(55% 55% at 76% 48%, rgba(201, 162, 78, .17), transparent 66%),
    radial-gradient(45% 45% at 12% 95%, rgba(22, 41, 74, .75), transparent 70%),
    var(--hexes);
  -webkit-mask-image: radial-gradient(70% 70% at 70% 50%, #000 30%, transparent 100%);
  mask-image: radial-gradient(70% 70% at 70% 50%, #000 30%, transparent 100%);
}
.hero__grid { position: relative; width: 100%; display: grid; grid-template-columns: 7fr 5fr; gap: 3rem; align-items: center; }
.hero__copy .display-xl { max-width: 13ch; }
[dir="rtl"] .hero__copy .display-xl { max-width: 16ch; }
.hero__sub { margin-top: 1.6rem; max-width: 46ch; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2.4rem; }
.hero__emblem { position: relative; width: 100%; max-width: 540px; aspect-ratio: 1; margin-inline: auto; }
.hero__rings { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.ring { stroke: var(--gold); opacity: .6; }
.ring--spin { opacity: .3; transform-origin: 50% 50%; animation: spin 160s linear infinite; }
.hero__mark {
  position: absolute; left: 50%; top: 50%; width: 41%; height: auto; transform: translate(-50%, -50%);
  filter: drop-shadow(0 30px 50px rgba(0, 0, 0, .55));
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ---------- Partners strip ---------- */
.partners { border-block: 1px solid var(--hair-2); padding-block: 2.2rem; }
.partners--about { border-top: 0; }
.partners__row { display: flex; flex-wrap: wrap; align-items: center; gap: 1.2rem 3.5rem; }
.partners__lead { font-size: .76rem; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-3); margin-inline-end: auto; }
[dir="rtl"] .partners__lead { letter-spacing: 0; font-size: .95rem; }
.partners__name { font-family: var(--font-latin-display); font-weight: 600; font-size: 1.55rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); white-space: nowrap; }

/* ---------- Sections ---------- */
.section { padding-block: clamp(5rem, 10vw, 9rem); }
.section--tight { padding-block: clamp(3.5rem, 7vw, 6rem); }
.section__head { max-width: 760px; margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.section__head .lede { margin-top: 1.2rem; }

/* Instruments ledger */
.ledger { border-top: 1px solid var(--hair-2); }
.ledger__row {
  position: relative; display: grid; grid-template-columns: auto minmax(0, 1.05fr) minmax(0, 1.7fr) auto;
  gap: 2rem; align-items: center; padding-block: 2rem; border-bottom: 1px solid var(--hair-2);
  text-decoration: none; color: inherit;
}
.ledger__row::before {
  content: ""; position: absolute; inset-block: 0; inset-inline: calc(-1 * var(--gutter));
  background: linear-gradient(var(--dir-grad, 90deg), rgba(201, 162, 78, .07), transparent 70%);
  opacity: 0; transition: opacity .45s var(--ease); pointer-events: none;
}
[dir="rtl"] .ledger__row::before { --dir-grad: 270deg; }
.ledger__row:hover::before { opacity: 1; }
.ledger__hex { width: 14px; height: 16px; background: var(--gold); clip-path: var(--hex-clip); opacity: .5; transition: opacity .3s, transform .5s var(--ease); }
.ledger__row:hover .ledger__hex { opacity: 1; transform: scale(1.3); }
.ledger__title { font-family: var(--font-display); font-size: clamp(1.5rem, 2.5vw, 2.15rem); font-weight: 500; line-height: 1.12; transition: transform .55s var(--ease); }
.ledger__row:hover .ledger__title { transform: translateX(calc(8px * var(--dir))); }
.ledger__desc { color: var(--ink-2); line-height: 1.6; }
.ledger__go { display: inline-flex; align-items: center; gap: .6rem; white-space: nowrap; color: var(--gold-300); font-size: .74rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }
[dir="rtl"] .ledger__go { letter-spacing: 0; font-size: .92rem; font-weight: 500; }

/* Process (sticky side + drawn line) */
.process__grid { display: grid; grid-template-columns: 5fr 7fr; gap: 5rem; align-items: start; }
.process__sticky { position: sticky; top: calc(var(--nav-h) + 2rem); }
.process__sticky .lede { margin-top: 1.2rem; }
.steps { list-style: none; margin: 0; padding: 0 0 0 3rem; position: relative; }
[dir="rtl"] .steps { padding: 0 3rem 0 0; }
.steps__track { position: absolute; inset-inline-start: 7px; top: 10px; bottom: 10px; width: 1px; background: var(--hair-2); }
.steps__line { position: absolute; inset: 0; background: linear-gradient(180deg, var(--gold-300), var(--gold)); transform: scaleY(0); transform-origin: top; }
html:not(.anim) .steps__line { transform: none; }
.step { position: relative; padding-bottom: 3.5rem; }
.step:last-child { padding-bottom: 0; }
.step__marker {
  position: absolute; inset-inline-start: -3rem; top: .3em; width: 15px; height: 17px;
  background: var(--gold); clip-path: var(--hex-clip);
}
.step__marker::after {
  content: ""; position: absolute; inset: 1.5px; background: var(--navy-950); clip-path: var(--hex-clip);
  transition: transform .6s var(--ease) .3s;
}
.step.is-in .step__marker::after, html:not(.anim) .step__marker::after { transform: scale(0); }
.step__title { font-family: var(--font-display); font-size: clamp(1.45rem, 2vw, 1.75rem); font-weight: 500; line-height: 1.15; margin-bottom: .6rem; }
.step__body { color: var(--ink-2); line-height: 1.7; max-width: 54ch; }
.step__detail { margin-top: .7rem; color: var(--ink-3); font-size: .92rem; max-width: 54ch; }

/* Why (gapless bento with hairlines) */
.why__title { max-width: 16ch; margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.bento { display: grid; grid-template-columns: 1.25fr 1fr 1fr; grid-auto-rows: minmax(250px, auto); gap: 1px; background: var(--hair-2); border: 1px solid var(--hair-2); border-radius: var(--r-lg); overflow: hidden; }
.bento__cell {
  position: relative; overflow: hidden; background: var(--navy-950); padding: 2.2rem;
  display: flex; flex-direction: column; justify-content: flex-end; transition: background .5s var(--ease);
}
.bento__cell:not(.bento__cell--image):not(.bento__cell--gold):hover { background: var(--navy-900); }
.bento__cell h3 { font-family: var(--font-display); font-size: 1.6rem; font-weight: 500; line-height: 1.15; margin-bottom: .6rem; }
.bento__cell p { color: var(--ink-2); line-height: 1.65; max-width: 36ch; }
.bento__cell--image { grid-row: span 2; min-height: 460px; background-size: cover; background-position: center; margin: 0; }
.bento__cell--image::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10, 22, 40, .25) 0%, rgba(5, 11, 22, .2) 40%, rgba(5, 11, 22, .94) 100%); }
.bento__cell--image::after { content: ""; position: absolute; inset: 0; background: var(--navy-900); mix-blend-mode: color; opacity: .35; pointer-events: none; }
.bento__cell--image figcaption { position: relative; }
.bento__label { display: block; font-size: .72rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--gold-300); margin-bottom: .5rem; }
[dir="rtl"] .bento__label { letter-spacing: 0; font-size: .95rem; }
.bento__addr { display: block; font-family: var(--font-display); font-size: 1.35rem; line-height: 1.35; }
.bento__cell--gold { background: linear-gradient(135deg, #dcb968, #c19a48 55%, #9a7730); color: var(--navy-950); }
.bento__cell--gold h3 { color: var(--navy-950); }
.bento__cell--gold p { color: rgba(5, 11, 22, .72); }
.bento__big { font-family: var(--font-display); font-size: clamp(3.4rem, 6vw, 5rem); line-height: 1; font-weight: 500; margin-bottom: auto; letter-spacing: -.02em; }
.bento__cell--tinted { background: var(--navy-800); }

/* Statement */
.statement {
  padding-block: clamp(4rem, 8vw, 7rem); text-align: center; border-block: 1px solid var(--hair-2);
  background: radial-gradient(50% 90% at 50% 50%, rgba(201, 162, 78, .08), transparent 70%);
}
.statement__quote { max-width: 920px; margin-inline: auto; }
.statement__quote p { font-family: var(--font-display); font-size: clamp(1.6rem, 3.1vw, 2.6rem); line-height: 1.3; font-weight: 500; text-wrap: balance; }
[dir="rtl"] .statement__quote p { line-height: 1.6; }
.statement__link { margin-top: 2.2rem; }

/* FAQ teaser */
.faqteaser__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 2rem; flex-wrap: wrap; margin-bottom: 2.5rem; }
.faqteaser__head .textlink { margin: 0 0 .4rem; }
.faqteaser__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3rem; border-top: 1px solid var(--hair-2); padding-top: 2.5rem; }
.faqteaser__item h3, .faqlist__item h3, .uses__item h3, .objective h3, .principle h3, .flow__step h3 {
  font-family: var(--font-display); font-size: 1.42rem; font-weight: 500; line-height: 1.2; margin-bottom: .75rem;
}
.faqteaser__item p, .faqlist__item p, .uses__item p, .objective p, .principle p, .flow__step p { color: var(--ink-2); line-height: 1.7; font-size: .98rem; }

/* CTA band */
.cta { padding-block: clamp(4rem, 8vw, 7rem); }
.cta__panel {
  position: relative; overflow: hidden; padding: clamp(2.5rem, 6vw, 5rem);
  border: 1px solid var(--hair); background: var(--navy-900) var(--hexes); border-radius: var(--r-lg);
  display: grid; grid-template-columns: 1.4fr 1fr; gap: 3rem; align-items: center;
}
.cta__panel::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(60% 110% at 100% 50%, rgba(201, 162, 78, .2), transparent 60%); }
.cta__text, .cta__actions { position: relative; }
.cta__text .lede { margin-top: 1rem; }
.cta__actions { display: flex; flex-direction: column; align-items: flex-start; gap: 1.6rem; justify-self: end; }
.cta__phone { display: flex; flex-direction: column; gap: .2rem; text-decoration: none; color: var(--ink-2); }
.cta__phone span { font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: var(--ink-3); }
[dir="rtl"] .cta__phone span { letter-spacing: 0; font-size: .92rem; }
.cta__phone strong { font-family: var(--font-latin-display); font-size: 1.9rem; font-weight: 500; color: var(--ink); transition: color .3s; }
.cta__phone:hover strong { color: var(--gold-300); }

/* ---------- Footer ---------- */
.footer { border-top: 1px solid var(--hair-2); padding-block: 4rem 2rem; background: linear-gradient(180deg, var(--navy-950), #030711); }
.footer__grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.2fr; gap: 3rem; }
.footer__h { font-size: .72rem; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--gold); margin-bottom: 1.2rem; }
[dir="rtl"] .footer__h { letter-spacing: 0; font-size: .95rem; }
.footer__list { list-style: none; padding: 0; display: grid; gap: .7rem; }
.footer__list a, .footer__addr a { color: var(--ink-2); text-decoration: none; transition: color .3s; }
.footer__list a:hover, .footer__addr a:hover { color: var(--ink); }
.footer__slogan { font-family: var(--font-display); color: var(--gold-300); letter-spacing: .14em; text-transform: uppercase; font-size: .9rem; margin: 1.2rem 0 .8rem; }
[dir="rtl"] .footer__slogan { letter-spacing: 0; font-size: 1.1rem; }
.footer__blurb { color: var(--ink-3); font-size: .92rem; line-height: 1.7; max-width: 36ch; }
.footer__addr { font-style: normal; color: var(--ink-2); line-height: 1.8; }
.footer__bottom { margin-top: 3.5rem; padding-top: 1.5rem; border-top: 1px solid var(--hair-2); display: flex; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; font-size: .8rem; color: var(--ink-3); }
.footer__disclaimer { max-width: 62ch; }

/* ---------- Photos ---------- */
.photo { position: relative; overflow: hidden; border-radius: var(--r-lg); border: 1px solid var(--hair); background: var(--navy-900); }
.photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.photo::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(10, 22, 40, .12), rgba(5, 11, 22, .45)); }
.photo--tint::before { content: ""; position: absolute; inset: 0; z-index: 1; background: var(--navy-900); mix-blend-mode: color; opacity: .3; pointer-events: none; }
.photo--4x3 { aspect-ratio: 4 / 3; }
.photo--16x10 { aspect-ratio: 16 / 10; }
.photo__caption { position: absolute; z-index: 2; inset-inline: 1.4rem; bottom: 1.2rem; color: var(--ink); font-family: var(--font-display); font-size: 1.15rem; line-height: 1.3; text-shadow: 0 2px 12px rgba(0, 0, 0, .5); }

/* Full-bleed image band */
.band { position: relative; overflow: hidden; min-height: 420px; display: flex; align-items: center; isolation: isolate; }
.band img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.band::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(var(--band-grad, 90deg), rgba(5, 11, 22, .96) 0%, rgba(5, 11, 22, .82) 45%, rgba(5, 11, 22, .35) 100%); }
[dir="rtl"] .band { --band-grad: 270deg; }
.band__inner { padding-block: clamp(4rem, 8vw, 7rem); max-width: 560px; }
.band__inner .lede { margin-top: 1.2rem; }

/* Floating contact buttons */
.float { position: fixed; inset-inline-end: 1.25rem; bottom: 1.25rem; z-index: var(--z-float); display: flex; flex-direction: column; gap: .6rem; align-items: flex-end; }
[dir="rtl"] .float { align-items: flex-start; }
body.menu-open .float { display: none; }
.float__btn {
  display: inline-flex; align-items: center; gap: .6rem; height: 52px; padding: 0 1.1rem 0 .75rem; border-radius: var(--r-pill);
  background: rgba(10, 22, 40, .85); border: 1px solid var(--hair); color: var(--ink); text-decoration: none;
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  box-shadow: 0 18px 40px -18px rgba(0, 0, 0, .8); font-size: .82rem; font-weight: 600; letter-spacing: .06em;
  transition: transform .4s var(--ease), border-color .3s, background .3s;
}
[dir="rtl"] .float__btn { padding: 0 .75rem 0 1.1rem; letter-spacing: 0; font-size: .95rem; font-weight: 500; }
.float__btn:hover { transform: translateY(-3px); border-color: var(--gold); background: rgba(15, 31, 56, .95); }
.float__btn:active { transform: scale(.97); }
.float__icon { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; flex: none; }
.float__icon svg { width: 20px; height: 20px; display: block; }
.float__btn--wa .float__icon { background: rgba(37, 211, 102, .16); color: #4ade80; }
.float__btn--mail .float__icon { background: rgba(201, 162, 78, .18); color: var(--gold-300); }
@media (max-width: 600px) {
  .float { inset-inline-end: .9rem; bottom: .9rem; }
  .float__btn { padding: 0; width: 52px; justify-content: center; }
  .float__btn span:not(.float__icon) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .float__icon { width: 40px; height: 40px; }
}

/* ---------- Page head ---------- */
.pagehead {
  padding-top: calc(var(--nav-h) + clamp(3rem, 7vw, 6rem)); padding-bottom: clamp(2rem, 5vw, 4rem);
  background: radial-gradient(50% 60% at 85% 0%, rgba(201, 162, 78, .13), transparent 70%);
}
.crumbs { display: flex; flex-wrap: wrap; gap: .8rem; margin-bottom: 1.6rem; font-size: .74rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); }
[dir="rtl"] .crumbs { letter-spacing: 0; font-size: .9rem; }
.crumbs a { text-decoration: none; color: inherit; transition: color .3s; }
.crumbs a:hover { color: var(--ink); }
.crumbs a:last-child { color: var(--gold-300); }
.pagehead .display-xl { max-width: 18ch; }
.pagehead__intro { margin-top: 1.4rem; }
.pagehead__actions { margin-top: 2rem; }
.pagehead__grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: 4rem; align-items: end; }
.pagehead__photo { justify-self: end; width: 100%; max-width: 520px; }
.service__photo { margin-bottom: 1.5rem; }
.process__photo { margin-top: 2rem; }

.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }

/* Compare table */
.tablewrap { overflow-x: auto; border: 1px solid var(--hair-2); border-radius: var(--r-md); }
.compare__table { width: 100%; border-collapse: collapse; min-width: 680px; }
.compare__table th, .compare__table td { padding: 1.2rem 1.4rem; text-align: start; vertical-align: top; border-bottom: 1px solid var(--hair-2); }
.compare__table thead th { font-family: var(--font-display); font-size: 1.35rem; font-weight: 500; color: var(--gold-300); background: rgba(255, 255, 255, .025); }
.compare__table tbody th { font-size: .72rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-3); width: 18%; }
[dir="rtl"] .compare__table tbody th { letter-spacing: 0; font-size: .9rem; }
.compare__table td { color: var(--ink-2); line-height: 1.6; }
.compare__table tr:last-child td, .compare__table tr:last-child th { border-bottom: 0; }
.compare__note { margin-top: 1.2rem; color: var(--ink-3); font-size: .9rem; max-width: 70ch; }

/* Service page */
.service__grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 4rem; align-items: start; }
.service__text .display-md { margin-bottom: 1.4rem; }
.service__facts { position: sticky; top: calc(var(--nav-h) + 2rem); }
.facts { margin-top: 1.2rem; display: grid; gap: 1rem; }
.facts div { display: grid; gap: .3rem; padding-top: 1rem; border-top: 1px solid var(--hair-2); }
.facts dt { font-size: .7rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-3); }
[dir="rtl"] .facts dt { letter-spacing: 0; font-size: .88rem; }
.facts dd { color: var(--ink); line-height: 1.5; }
.flow { list-style: none; padding: 0; margin-top: 2.5rem; display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.5rem; position: relative; }
.flow::before { content: ""; position: absolute; top: 8px; inset-inline: 0; height: 1px; background: var(--hair-2); }
.flow__step { position: relative; padding-top: 2rem; }
.flow__marker { position: absolute; top: 0; inset-inline-start: 0; width: 15px; height: 17px; background: var(--gold); clip-path: var(--hex-clip); }
.uses__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3rem; margin-top: 2.5rem; border-top: 1px solid var(--hair-2); padding-top: 2.5rem; }
.faqlist__items { margin-top: 2.5rem; display: grid; grid-template-columns: 1fr 1fr; gap: 0 4rem; }
.faqlist__item { padding-block: 1.8rem; border-top: 1px solid var(--hair-2); }
.related .eyebrow { display: block; }
.related__row { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 1.4rem; }
.related__link {
  display: inline-flex; align-items: center; gap: .8rem; padding: .95rem 1.4rem; border: 1px solid var(--hair);
  color: var(--ink); text-decoration: none; font-family: var(--font-display); font-size: 1.2rem; border-radius: var(--r-pill);
  transition: border-color .3s, background .3s;
}
.related__link:hover { border-color: var(--gold); background: rgba(201, 162, 78, .08); }

/* How page */
.docs__grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 4rem; align-items: start; }
.checklist { list-style: none; padding: 0; margin-top: 1.4rem; display: grid; gap: .85rem; color: var(--ink-2); line-height: 1.6; }
.docs__text .display-md { margin-bottom: 1rem; }
.principle { padding-block: 1.6rem; border-top: 1px solid var(--hair-2); }

/* About page */
.about__grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 4rem; align-items: center; }
.about__figure { border: 1px solid var(--hair); padding: .5rem; background: rgba(255, 255, 255, .03); border-radius: var(--r-lg); }
.about__figure img { width: 100%; height: auto; border-radius: calc(var(--r-lg) - .5rem); }
.about__figure figcaption { padding: 1rem .5rem .5rem; text-align: center; font-family: var(--font-display); font-size: .85rem; letter-spacing: .22em; text-transform: uppercase; color: var(--gold-300); }
[dir="rtl"] .about__figure figcaption { letter-spacing: 0; font-size: 1.05rem; }
.objectives__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 4rem; }
.objective { padding-block: 1.8rem; border-top: 1px solid var(--hair-2); }
.office__grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 4rem; align-items: start; }
.office__text .prose { margin-top: 1.2rem; }
.office__addr { font-style: normal; margin: 1.5rem 0 2rem; color: var(--ink-2); line-height: 1.8; }
.office__addr a { text-decoration: none; color: var(--ink); }
.map { border: 1px solid var(--hair); padding: .4rem; background: rgba(255, 255, 255, .03); min-height: 380px; border-radius: var(--r-lg); }
.map iframe { width: 100%; height: 100%; min-height: 360px; border: 0; border-radius: calc(var(--r-lg) - .4rem); filter: invert(.9) hue-rotate(190deg) saturate(.45) brightness(.85); transition: filter .6s var(--ease); }
.map:hover iframe { filter: none; }
.map--contact { min-height: 300px; margin-top: .5rem; }
.map--contact iframe { min-height: 280px; }

/* FAQ page */
.faqpage__grid { display: grid; grid-template-columns: 1fr 3fr; gap: 4rem; align-items: start; }
.faqpage__nav ul { list-style: none; padding: 0; display: grid; gap: .3rem; }
.faqpage__nav a {
  display: block; padding: .5rem 0; padding-inline-start: 1rem; border-inline-start: 1px solid var(--hair-2);
  text-decoration: none; color: var(--ink-3); font-size: .78rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; transition: color .3s, border-color .3s;
}
[dir="rtl"] .faqpage__nav a { letter-spacing: 0; font-size: .98rem; font-weight: 500; }
.faqpage__nav a:hover { color: var(--ink); border-color: var(--gold); }
.faqgroup { scroll-margin-top: calc(var(--nav-h) + 1.5rem); }
.faqgroup + .faqgroup { margin-top: 4rem; }

/* Contact page */
.contact__grid { display: grid; grid-template-columns: 1fr 1.25fr; gap: 4rem; align-items: start; }
.contact__block { padding-bottom: 1.8rem; margin-bottom: 1.8rem; border-bottom: 1px solid var(--hair-2); }
.contact__block h2 { font-size: .72rem; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--gold); margin-bottom: .8rem; }
[dir="rtl"] .contact__block h2 { letter-spacing: 0; font-size: .95rem; }
.contact__block address { font-style: normal; color: var(--ink-2); line-height: 1.8; }
.contact__block .checklist { margin-top: .4rem; }
.contact__big { font-family: var(--font-latin-display); font-size: 2rem; color: var(--ink); text-decoration: none; transition: color .3s; }
.contact__big:hover { color: var(--gold-300); }

.form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.3rem; }
.field { display: grid; gap: .5rem; margin-bottom: 1.3rem; }
.field label { font-size: .72rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-2); }
[dir="rtl"] .field label { letter-spacing: 0; font-size: .92rem; }
.field__opt { color: var(--ink-3); letter-spacing: .04em; text-transform: none; font-weight: 400; }
.field input, .field select, .field textarea {
  width: 100%; background: rgba(5, 11, 22, .65); border: 1px solid rgba(242, 238, 230, .18); color: var(--ink);
  padding: .95rem 1.1rem; font: inherit; font-size: 1rem; line-height: 1.4; border-radius: var(--r-sm); appearance: none; -webkit-appearance: none;
  transition: border-color .3s, box-shadow .3s;
}
.field textarea { resize: vertical; min-height: 150px; }
.field select { background-image: var(--chevron); background-repeat: no-repeat; background-size: 18px; background-position: right 1rem center; padding-inline-end: 2.8rem; }
[dir="rtl"] .field select { background-position: left 1rem center; }
.field select option { background: var(--navy-900); color: var(--ink); }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px rgba(201, 162, 78, .18); }
.field.is-invalid input, .field.is-invalid textarea { border-color: #d9776b; }
.field__error { display: none; color: var(--danger); font-size: .85rem; }
.field.is-invalid .field__error { display: block; }
.field__hint { color: var(--ink-3); font-size: .85rem; }
.form__alert { padding: 1rem 1.2rem; margin-bottom: 1.2rem; border: 1px solid rgba(217, 119, 107, .5); color: var(--danger); font-size: .95rem; border-radius: var(--r-sm); }
.form__privacy { margin-top: 1rem; font-size: .82rem; color: var(--ink-3); }
.form__privacy a { color: var(--gold-300); }
.botcheck { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); opacity: 0; }
.form__success { text-align: center; padding: 2rem 0; }
.form__success p { color: var(--ink-2); max-width: 44ch; margin-inline: auto; }
.form__success-mark { display: block; width: 44px; height: 50px; margin: 0 auto 1.5rem; background: var(--gold); clip-path: var(--hex-clip); }
.btn[disabled] { opacity: .65; cursor: progress; }

/* Legal */
.legal__body { max-width: 72ch; }
.legal__updated { font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 1rem; }
[dir="rtl"] .legal__updated { letter-spacing: 0; font-size: .9rem; }
.legal h2 { font-family: var(--font-display); font-size: 1.7rem; font-weight: 500; margin: 2.4rem 0 .8rem; }
.legal .checklist { margin-top: 1rem; }

/* 404 */
.notfound { min-height: 100dvh; display: flex; align-items: center; padding-top: var(--nav-h); }
.notfound__inner { text-align: center; max-width: 720px; margin-inline: auto; padding-block: 4rem; }
.notfound__mark { margin: 0 auto 1.5rem; width: 100px; height: auto; }
.notfound .lede { margin: 1.2rem auto 0; }
.notfound .hero__actions { justify-content: center; }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
  .nav__links { gap: 1.6rem; }
  .nav__actions .btn { display: none; }
}
@media (max-width: 1023px) {
  .nav__links, .nav__actions .lang { display: none; }
  .burger { display: block; }
  .hero__grid { grid-template-columns: 1fr; gap: 2rem; }
  .hero__emblem { max-width: 300px; order: -1; }
  .hero__copy .display-xl { max-width: none; }
  .process__grid, .service__grid, .docs__grid, .about__grid, .office__grid, .faqpage__grid, .contact__grid, .pagehead__grid { grid-template-columns: 1fr; gap: 3rem; }
  .pagehead__photo { justify-self: start; max-width: 100%; }
  .band { min-height: 0; }
  .band::before { background: rgba(5, 11, 22, .85); }
  .process__sticky, .service__facts { position: static; }
  .faqpage__nav { display: none; }
  .flow { grid-template-columns: 1fr 1fr; }
  .cta__panel { grid-template-columns: 1fr; }
  .cta__actions { justify-self: start; }
  .footer__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 860px) {
  .ledger__row { grid-template-columns: auto 1fr; gap: 1rem 1.4rem; }
  .ledger__desc, .ledger__go { grid-column: 2; }
  .bento { grid-template-columns: 1fr 1fr; }
  .bento__cell--image { grid-column: span 2; grid-row: auto; min-height: 320px; }
  .faqteaser__grid, .uses__grid { grid-template-columns: 1fr; gap: 2rem; }
  .faqlist__items, .objectives__grid, .grid2 { grid-template-columns: 1fr; }
  .compare__table tbody th { width: auto; }
}
@media (max-width: 600px) {
  .hero { padding-top: calc(var(--nav-h) + 1rem); }
  .hero__emblem { max-width: 220px; }
  .bento { grid-template-columns: 1fr; }
  .bento__cell--image { grid-column: auto; }
  .flow { grid-template-columns: 1fr; }
  .form__row { grid-template-columns: 1fr; }
  .footer__grid { grid-template-columns: 1fr; gap: 2.2rem; }
  .partners__lead { width: 100%; margin: 0; }
  .partners__name { font-size: 1.25rem; }
  .btn { font-size: .72rem; letter-spacing: .1em; }
  [dir="rtl"] .btn { font-size: .9rem; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  html.anim [data-reveal], html.anim [data-reveal-group] > *, html.anim [data-split] .wi { opacity: 1; transform: none; }
  .steps__line { transform: none; }
}