/* XIS tokens: generated from the XIS Design System tokens.json. Edit there, not here. */
:root {
  --night: #0b0f1a;
  --night-2: #121828;
  --ivory: #f3ede3;
  --text-2: #c9ccd6;
  --text-3: #a9aebc;
  --text-link: #aeb3c0;
  --mist: #8e95a8;
  --sand: #d9c3a0;
  --orange: #f65800;
  --orange-soft: #ff9a62;
  --line: rgba(243, 237, 227, .12);
  --dawn: #efe7da;
  --ink: #161b26;
  --dawn-text: #4a4e5a;
  --dawn-label: #64626a;
  --dawn-accent: #a0784a;
  --dawn-step: #6f6457;
  --orange-text: #b84200;
  --font-display: "Bricolage Grotesque", "Helvetica Neue", Arial, sans-serif;
  --font-body: Manrope, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "DM Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --space-xs: 8px;
  --space-s: 12px;
  --space-m: 18px;
  --space-l: 28px;
  --space-xl: 48px;
  --section-y: 128px;
  --gutter: 16px;
  --radius-pill: 999px;
  --radius-card: 18px;
  --radius-panel: 14px;
  --radius-field: 0;
  --shadow-dot: 0 0 12px #f65800;
  --shadow-dot-strong: 0 0 40px rgba(246, 88, 0, .6);
  --wrap: 1080px;
  --header-offset: 96px;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
}

/* XIS core components. Scoped under .xis so nothing leaks into Houzez or Elementor.
   Tokens (colours, type, spacing, radii) come from xis-tokens.css; load that first. */
.xis { color-scheme: dark; }
/* Inner pages: give the header class "solid" permanently; start content with .page-top */
.xis .page-top { padding-top: calc(env(safe-area-inset-top, 0px) + 96px); }
.xis .h2, .xis .area .nm, .xis .steps h3, .xis .voices blockquote p, .xis summary, .xis .marq span { font-variation-settings: 'opsz' 60, 'wdth' 87; font-stretch: 87%; }
.xis *, .xis { box-sizing: border-box; }
.xis [hidden] { display: none !important; }
.xis { background: var(--night); }
.xis { margin: 0; background: var(--night); color: var(--ivory); font: 400 15.5px/1.75 var(--font-body); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
.xis img { max-width: 100%; display: block; }
.xis a { color: inherit; }
.xis h1, .xis h2, .xis h3, .xis p { margin: 0; }
.xis h1, .xis h2, .xis h3 { text-wrap: balance; font-weight: 400; }
.xis :focus-visible { outline: 1.5px solid var(--orange); outline-offset: 4px; }
.xis ::selection { background: var(--orange); color: #fff; }
.xis .band { padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
.xis .wrap { max-width: var(--wrap); margin: 0 auto; }
.xis .sec { padding-block: clamp(72px, 9vw, 128px); }
/* rhythm: where two sections share a background, the second starts closer */
.xis .close { padding-top: clamp(56px, 6vw, 88px); }
.xis .voices { padding-block: clamp(64px, 7.5vw, 104px); }
.xis .label { font: 500 11.5px var(--font-mono); letter-spacing: .22em; text-transform: uppercase; color: var(--mist); }
.xis .label.slogan { font-size: 14.4px; letter-spacing: .2em; white-space: nowrap; }
@media (max-width: 380px) {
  .xis .label.slogan { letter-spacing: .12em; }
}
.xis .label .d { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--orange); margin-right: 10px; vertical-align: 1px; }
.xis .h2 { font: 350 clamp(28px, 3.4vw, 44px)/1.12 var(--font-display); letter-spacing: -.015em; }
.xis .h2 em { font-style: normal; color: var(--sand); }
.xis .lede { font-size: clamp(15px, 1.3vw, 17px); color: var(--text-2); max-width: 54ch; margin-inline: auto; }
.xis .center { text-align: center; }
.xis .stack { display: grid; gap: 18px; justify-items: center; }
.xis .btn { display: inline-flex; align-items: center; gap: 10px; padding: 13px 24px; border-radius: 999px; font: 500 13px var(--font-body); letter-spacing: .06em; text-decoration: none; cursor: pointer; border: 0; transition: transform .4s var(--ease), background .3s, color .3s, box-shadow .3s; }
.xis .btn.solid { background: var(--ivory); color: var(--night); }
.xis .btn.solid:hover { background: #fff; transform: translateY(-2px); }
.xis .btn.ghost { color: var(--ivory); box-shadow: inset 0 0 0 1px rgba(243,237,227,.35); background: transparent; }
.xis .btn.ghost:hover { box-shadow: inset 0 0 0 1px var(--ivory); }
.xis .btn .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 12px var(--orange); }
/* Header */
.xis header.top { position: fixed; z-index: 50; left: 0; right: 0; top: 0; padding-top: calc(env(safe-area-inset-top, 0px) + 18px); pointer-events: none; }
.xis header.top .wrap { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px; max-width: 1240px; }
.xis header.top a, .xis header.top nav, .xis header.top button, .xis header.top .langmenu { pointer-events: auto; }
.xis .logo img { height: 40px; width: auto; }
.xis header nav { display: flex; gap: clamp(22px, 2.6vw, 38px); }
.xis header .cta, .xis .langbtn { white-space: nowrap; }
@media (min-width: 1101px) and (max-width: 1260px) { .xis header nav { gap: 20px; } }   /* six header items fit from 1,101 px */
.xis header nav a { position: relative; text-decoration: none; font-size: 13px; letter-spacing: .04em; color: rgba(243,237,227,.72); padding: 6px 0; transition: color .3s; }
.xis header nav a::after { content: ""; position: absolute; left: 50%; bottom: -4px; width: 4px; height: 4px; margin-left: -2px; border-radius: 50%; background: var(--orange); opacity: 0; transform: translateY(3px); transition: opacity .3s, transform .3s var(--ease); }
.xis header nav a:hover::after, .xis header nav a:focus-visible::after { opacity: 1; transform: none; }
.xis header nav a:hover { color: var(--ivory); }
.xis header .cta { justify-self: end; padding: 10px 18px; }
.xis header.top.solid { background: linear-gradient(to bottom, rgba(11,15,26,.92), rgba(11,15,26,.75)); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); padding-bottom: 14px; transition: background .4s; }
@media (max-width: 860px) {
  .xis header nav { display: none; }
  .xis header.top .wrap { grid-template-columns: 1fr auto; }
}
.xis header .cta .short { display: none; }
@media (max-width: 420px) {
  .xis header .cta span.long { display: none; }
  .xis header .cta .short { display: inline; }
  .xis .logo img { height: 34px; }
}
/* Areas */
.xis .areas .list { margin-top: clamp(40px, 5vw, 64px); border-top: 1px solid var(--line); }
.xis .area { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 20px; padding: 22px 0; border-bottom: 1px solid var(--line); text-decoration: none; position: relative; }
.xis .area > * { min-width: 0; }
.xis .area .ix { font: 500 11px var(--font-mono); letter-spacing: .2em; color: var(--mist); }
.xis .area .nm { font: 400 clamp(24px, 3vw, 38px)/1.1 var(--font-display); text-align: center; transition: color .4s, letter-spacing .6s var(--ease); }
.xis .area .tags { justify-self: end; display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.xis .tag { font: 500 10.5px var(--font-mono); letter-spacing: .16em; text-transform: uppercase; padding: 5px 10px; border-radius: 999px; border: 1px solid rgba(217,195,160,.4); color: var(--sand); white-space: nowrap; }
.xis .tag.o { border-color: rgba(246,88,0,.6); color: var(--orange-soft); }
.xis .area::before { content: ""; position: absolute; left: 50%; bottom: -4px; width: 7px; height: 7px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 12px var(--orange); transform: translateX(-50%) scale(0); transition: transform .5s var(--ease); }
.xis .area:hover .nm { color: #fff; letter-spacing: .02em; }
.xis .area:hover::before { transform: translateX(-50%) scale(1); }
.xis .areas .foot { margin-top: 26px; font-size: 13.5px; color: var(--mist); text-align: center; }
@media (max-width: 700px) {
  .xis .area { grid-template-columns: 1fr; justify-items: center; gap: 8px; }
  .xis .area .ix { display: none; }
  .xis .area .tags { justify-self: center; justify-content: center; }
}
/* Zone finder */
.xis .areas .chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: clamp(30px, 4vw, 44px); }
.xis .chip { font: 500 13px var(--font-body); color: var(--text-2); background: transparent; border: 1px solid var(--line); border-radius: 999px; padding: 8px 16px; cursor: pointer; transition: all .25s; }
.xis .chip:hover { border-color: rgba(243,237,227,.4); color: var(--ivory); }
.xis .chipsep { width: 1px; height: 22px; align-self: center; background: var(--line); margin: 0 6px; }
.xis .chip[aria-pressed="true"] { background: var(--ivory); color: var(--night); border-color: var(--ivory); }
.xis .zcount { text-align: center; margin-top: 16px; font: 500 11px var(--font-mono); letter-spacing: .2em; text-transform: uppercase; color: var(--mist); }
.xis .areas .list { margin-top: 22px; }
.xis .area .ix { font: 500 10.5px var(--font-mono); letter-spacing: .14em; text-transform: uppercase; }
.xis .area, .xis .zall li { transition: opacity .4s var(--ease); }
.xis .area.off, .xis .zall li.off { opacity: .16; }
.xis .more { margin-top: 30px; }
.xis .zall { margin-top: 40px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
.xis .zg { min-width: 0; display: grid; align-content: start; gap: 6px; padding-top: 18px; border-top: 1px solid var(--line); }
.xis .zs { font-size: 13px; color: var(--mist); margin-bottom: 8px; }
.xis .zall ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.xis .zall li { display: grid; gap: 1px; }
.xis .zn { font: 400 20px/1.25 var(--font-display); font-variation-settings: 'opsz' 60, 'wdth' 87; }
.xis .zn small { font: 400 12px var(--font-body); color: var(--mist); }
.xis .zt { font-size: 12.5px; color: var(--text-3); }
.xis .zall li.on .zn { color: var(--sand); }
.xis .zk { justify-self: start; margin: 3px 0 1px; font: 500 9.5px var(--font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--sand); }
.xis .zk.o { color: var(--orange-soft); }
@media (max-width: 900px) {
  .xis .zall { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 520px) {
  .xis .zall { grid-template-columns: 1fr; }
}
/* Dawn band: the method */
.xis .dawn { background: var(--dawn); color: var(--ink); }
.xis .dawn .label { color: var(--dawn-label); }
.xis .dawn .h2 em { color: var(--dawn-accent); }
.xis .dawn .lede { color: var(--dawn-text); }
.xis .method { position: relative; margin-top: clamp(48px, 6vw, 80px); }
.xis .method .rail { position: absolute; left: 12.5%; right: 12.5%; top: 6px; height: 1px; background: rgba(22,27,38,.15); }
.xis .method .rail b { position: absolute; left: 0; top: 0; height: 1px; width: 0; background: var(--ink); }
.xis .method .rail i { position: absolute; z-index: 3; top: -4px; left: 0; width: 9px; height: 9px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 14px rgba(246,88,0,.7); transform: translateX(-50%); }
.xis .steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 24px; list-style: none; margin: 0; padding: 0; }
.xis .steps li { text-align: center; display: grid; gap: 10px; justify-items: center; align-content: start; padding-top: 34px; position: relative; min-width: 0; }
.xis .steps li::before { content: ""; position: absolute; top: 3px; left: 50%; margin-left: -3.5px; width: 7px; height: 7px; border-radius: 50%; background: var(--dawn); box-shadow: inset 0 0 0 1px rgba(22,27,38,.4); }
.xis .steps .n { font: 500 11px var(--font-mono); letter-spacing: .2em; color: var(--dawn-step); }
.xis .steps h3 { font: 450 21px/1.2 var(--font-display); }
.xis .steps p { font-size: 14px; color: var(--dawn-text); max-width: 24ch; }
.xis .after { margin-top: 56px; display: flex; gap: 12px 28px; flex-wrap: wrap; justify-content: center; font-size: 14px; color: var(--dawn-text); }
.xis .after span::before { content: "—"; margin-right: 10px; color: var(--dawn-accent); }
@media (max-width: 760px) {
  .xis .steps { grid-template-columns: 1fr 1fr; row-gap: 40px; }
  .xis .steps li:last-child { grid-column: 1 / -1; }
  .xis .method .rail { display: none; }
}
/* Voices */
.xis .voices .q { position: relative; height: 230px; margin-top: 40px; }
.xis .voices blockquote { position: absolute; inset: 0; margin: 0; display: grid; align-content: center; justify-items: center; gap: 22px; text-align: center; opacity: 0; transform: translateY(10px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.xis .voices blockquote.on { opacity: 1; transform: none; }
.xis .voices blockquote p { font: 300 clamp(21px, 2.4vw, 30px)/1.4 var(--font-display); max-width: 32ch; }
.xis .voices cite { font: 500 11.5px var(--font-mono); letter-spacing: .22em; text-transform: uppercase; color: var(--sand); font-style: normal; }
.xis .qdots { display: flex; justify-content: center; gap: 10px; margin-top: 18px; }
.xis .qdots button { width: 26px; height: 26px; border: 0; background: transparent; cursor: pointer; display: grid; place-items: center; padding: 0; }
.xis .qdots button::after { content: ""; width: 6px; height: 6px; border-radius: 50%; background: rgba(243,237,227,.25); transition: background .3s, transform .3s; }
.xis .qdots button[aria-current="true"]::after { background: var(--orange); transform: scale(1.3); box-shadow: 0 0 10px var(--orange); }
@media (max-width: 600px) {
  .xis .voices .q { height: 330px; }
}
.xis .voices .q { height: 284px; }
.xis .grate { text-align: center; margin-top: 14px; font: 500 11.5px var(--font-mono); letter-spacing: .16em; text-transform: uppercase; }
.xis .grate a { color: var(--mist); text-decoration: none; transition: color .3s; }
.xis .grate a:hover { color: var(--ivory); }
.xis .grate .stars { color: var(--orange); letter-spacing: .1em; margin-right: 8px; }
/* Owners */
.xis .owners { background: var(--night-2); }
.xis .ogrid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px 64px; align-items: center; }
.xis .ogrid > * { min-width: 0; }
.xis .ogrid .intro { text-align: center; display: grid; gap: 18px; justify-items: center; }
.xis .ogrid ul { list-style: none; padding: 0; margin: 6px 0 0; display: grid; gap: 8px; justify-items: start; text-align: left; font-size: 14.5px; color: var(--text-2); }
.xis .ogrid li::before { content: ""; display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: var(--orange); margin-right: 12px; vertical-align: 2px; }
.xis form.of { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: clamp(22px, 3vw, 32px); border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.02); }
.xis .seg { grid-column: 1 / -1; display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; }
.xis .seg label { position: relative; }
.xis .seg input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.xis .seg span { display: inline-block; padding: 8px 16px; border-radius: 999px; font-size: 13px; border: 1px solid var(--line); color: var(--text-2); cursor: pointer; transition: all .25s; }
.xis .seg input:checked + span { background: var(--ivory); color: var(--night); border-color: var(--ivory); }
.xis .seg input:focus-visible + span { outline: 1.5px solid var(--orange); outline-offset: 2px; }
.xis .fld { display: grid; gap: 6px; min-width: 0; }
.xis .fld.full { grid-column: 1 / -1; }
.xis .fld label { font: 500 10.5px var(--font-mono); letter-spacing: .18em; text-transform: uppercase; color: var(--mist); }
.xis .fld input, .xis .fld select { width: 100%; min-width: 0; background: transparent; border: 0; border-bottom: 1px solid rgba(243,237,227,.22); color: var(--ivory); font: 400 15px var(--font-body); padding: 8px 2px; border-radius: 0; }
.xis .fld select option { color: #111; }
.xis .fld input:focus, .xis .fld select:focus { outline: none; border-bottom-color: var(--orange); }
.xis .consent { grid-column: 1 / -1; display: flex; gap: 10px; font-size: 12.5px; color: var(--mist); align-items: flex-start; }
.xis .consent input { accent-color: var(--orange); margin-top: 4px; }
.xis .fmsg { grid-column: 1 / -1; font-size: 13px; }
.xis .fmsg.err { color: var(--orange-soft); }
.xis .fok { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; justify-content: center; font-size: 13.5px; color: var(--sand); }
.xis form.of .submit { grid-column: 1 / -1; justify-self: center; margin-top: 6px; }
@media (max-width: 860px) {
  .xis .ogrid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .xis form.of { grid-template-columns: 1fr; }
}
/* Questions */
.xis .faq { max-width: 760px; margin: clamp(36px, 5vw, 56px) auto 0; border-top: 1px solid var(--line); }
.xis details { border-bottom: 1px solid var(--line); }
.xis p.h2 { text-wrap: balance; margin: 0; }
.xis summary h3 { font: inherit; font-variation-settings: inherit; margin: 0; }
.xis .vh { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.xis summary { list-style: none; cursor: pointer; padding: 20px 4px; display: flex; justify-content: space-between; align-items: center; gap: 18px; font: 400 clamp(17px, 1.6vw, 20px)/1.35 var(--font-display); }
.xis summary::-webkit-details-marker { display: none; }
.xis summary i { flex: none; width: 9px; height: 9px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(243,237,227,.5); transition: background .3s, box-shadow .3s; }
.xis details[open] summary i { background: var(--orange); box-shadow: 0 0 12px var(--orange); }
.xis details p { padding: 0 4px 22px; color: var(--text-2); font-size: 14.5px; max-width: 62ch; }
/* Questions: pinned intro + tabbed answers */
.xis .qgrid { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.4fr); gap: 40px 80px; align-items: start; }
.xis .qside { position: sticky; top: calc(env(safe-area-inset-top, 0px) + 110px); display: grid; gap: 18px; }
.xis .qlede { color: var(--text-2); max-width: 34ch; }
.xis .qcta { margin-top: 18px; padding-top: 22px; border-top: 1px solid var(--line); display: grid; gap: 12px; justify-items: start; }
.xis .qcta p { font-size: 14px; color: var(--mist); }
.xis .ftabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.xis .ftab { font: 500 13px var(--font-body); color: var(--text-2); background: transparent; border: 1px solid var(--line); border-radius: 999px; padding: 8px 18px; cursor: pointer; transition: all .25s; }
.xis .ftab:hover { color: var(--ivory); border-color: rgba(243,237,227,.4); }
.xis .ftab[aria-selected="true"] { background: var(--ivory); color: var(--night); border-color: var(--ivory); }
.xis .fpanel { border-top: 1px solid var(--line); margin-top: 14px; }
.xis .fpanel details p a.jump { display: inline-block; margin-top: 8px; color: var(--sand); text-underline-offset: 3px; }
.xis .fpanel details p a.jump::after { content: " →"; }
@media (max-width: 900px) {
  .xis .qgrid { grid-template-columns: 1fr; row-gap: 18px; }
  .xis .qside { display: contents; }
  .xis .qside > * { text-align: center; justify-self: center; }
  .xis .qcta { order: 3; margin-top: 10px; }
  .xis .qmain { order: 2; margin-top: 14px; }
  .xis .qside { position: static; text-align: center; justify-items: center; }
  .xis .qlede { margin-inline: auto; }
  .xis .qcta { justify-items: center; }
  .xis .ftabs { justify-content: center; }
}
/* Header right: language, phone, advisor */
.xis .hright { justify-self: end; display: flex; align-items: center; gap: 0; }
.xis .lang { padding-right: 18px; margin-right: 18px; border-right: 1px solid rgba(243,237,227,.16); }
.xis header .hright .cta { justify-self: auto; }
.xis .lang { position: relative; }
.xis .langbtn { background: transparent; border: 0; color: rgba(243,237,227,.55); font: 500 11px var(--font-mono); letter-spacing: .16em; cursor: pointer; padding: 6px 2px; }
.xis .langbtn::after { content: ""; display: inline-block; width: 5px; height: 5px; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: rotate(45deg); margin-left: 8px; vertical-align: 3px; }
.xis .langbtn:hover, .xis .langbtn[aria-expanded="true"] { color: var(--ivory); }
.xis .langmenu { position: absolute; right: 10px; top: calc(100% + 10px); list-style: none; margin: 0; padding: 8px; min-width: 150px; background: rgba(17,22,40,.96); border: 1px solid var(--line); border-radius: 12px; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); display: grid; gap: 2px; z-index: 60; }
.xis .langmenu[hidden] { display: none; }
.xis .langmenu a { display: block; padding: 8px 12px; border-radius: 8px; text-decoration: none; color: var(--text-2); font-size: 14px; }
.xis .langmenu a:hover, .xis .langmenu a[aria-current="true"] { background: rgba(243,237,227,.06); color: var(--ivory); }
@media (max-width: 420px) {
  .xis .lang { padding-right: 12px; margin-right: 12px; }
}
/* Hero search */
.xis .hsearch { display: flex; align-items: center; width: min(460px, 100%); margin-top: 8px; padding: 5px 5px 5px 16px; border: 1px solid rgba(243,237,227,.28); border-radius: 999px; background: rgba(11,15,26,.45); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); transition: border-color .3s; }
.xis .hsearch:focus-within { border-color: var(--orange); }
.xis .hsearch select { width: auto; field-sizing: content; appearance: none; -webkit-appearance: none; padding-right: 14px !important; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5'%3E%3Cpath d='M0 0l4 5 4-5z' fill='%23D9C3A0'/%3E%3C/svg%3E") no-repeat right 2px center; border: 0; color: var(--sand); font: 500 12px var(--font-mono); letter-spacing: .1em; text-transform: uppercase; padding: 8px 6px 8px 0; cursor: pointer; }
.xis .hsearch select option { color: #111; text-transform: none; }
.xis .hsearch input { flex: 1; min-width: 0; background: transparent; border: 0; border-left: 1px solid rgba(243,237,227,.18); color: var(--ivory); font: 400 14.5px var(--font-body); padding: 8px 12px; }
.xis .hsearch input::placeholder { color: var(--mist); }
.xis .hsearch input:focus, .xis .hsearch select:focus { outline: none; }
.xis .hsearch button { flex: none; width: 38px; height: 38px; border-radius: 50%; border: 0; background: var(--ivory); color: var(--night); font-size: 16px; cursor: pointer; transition: transform .35s var(--ease), background .3s; }
.xis .hsearch button:hover { background: #fff; transform: translateX(2px); }
.xis .chlink, .xis .tlink { font: 500 12px var(--font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--sand); text-decoration: none; transition: color .3s; }
.xis .chlink { margin-top: 4px; }
.xis .chlink:hover, .xis .tlink:hover { color: #fff; }
/* About + insights */
.xis .aboutx { padding-bottom: clamp(40px, 5vw, 64px); }
.xis .aboutx .tlink { margin-top: 6px; }
.xis .ihead { display: flex; justify-content: space-between; align-items: end; gap: 16px; flex-wrap: wrap; margin-bottom: clamp(28px, 4vw, 44px); }
.xis .ihead > div { display: grid; gap: 14px; }
.xis .insights .posts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.xis .insights .post { display: grid; gap: 12px; align-content: start; padding: 26px 24px; border: 1px solid var(--line); border-radius: 16px; text-decoration: none; transition: border-color .35s, transform .5s var(--ease); min-width: 0; }
.xis .insights .post:hover { border-color: rgba(246,88,0,.55); transform: translateY(-3px); }
.xis .insights .post .ptag { font: 500 11px var(--font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--mist); }
.xis .insights .post h3 { margin: 0; font: 400 21px/1.25 var(--font-display); font-variation-settings: 'opsz' 60, 'wdth' 87; color: var(--ivory); }
.xis .insights .post p { margin: 0; font-size: 14px; color: var(--text-3); }
@media (max-width: 860px) {
  .xis .insights .posts { grid-template-columns: 1fr; }
}
.xis .consent a { color: var(--sand); }
/* Mobile menu */
.xis .menubtn { display: none; width: 40px; height: 40px; border: 1px solid rgba(243,237,227,.22); border-radius: 50%; background: transparent; cursor: pointer; margin-left: 10px; position: relative; }
.xis .menubtn i { position: absolute; left: 12px; right: 12px; height: 1px; background: var(--ivory); transition: transform .35s var(--ease), top .35s var(--ease); }
.xis .menubtn i:first-child { top: 16px; }
.xis .menubtn i:last-child { top: 22px; }
.xis .menubtn[aria-expanded="true"] i:first-child { top: 19px; transform: rotate(45deg); }
.xis .menubtn[aria-expanded="true"] i:last-child { top: 19px; transform: rotate(-45deg); }
.xis .mmenu { position: fixed; inset: 0; z-index: 45; background: rgba(11,15,26,.97); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); display: grid; align-content: center; justify-items: center; gap: 36px; padding: 96px 24px 40px; }
.xis .mmenu[hidden] { display: none; }
.xis .mmenu nav { display: grid; gap: 18px; text-align: center; }
.xis .mmenu nav a { font: 350 26px/1.15 var(--font-display); font-variation-settings: 'opsz' 60, 'wdth' 87; color: var(--ivory); text-decoration: none; }
.xis .mmenu nav a:first-child { color: var(--sand); }
.xis .mfoot { display: grid; gap: 14px; justify-items: center; }
.xis .mtel { font: 500 13px var(--font-mono); letter-spacing: .08em; color: var(--mist); text-decoration: none; }
@media (max-width: 860px) {
  .xis .menubtn { display: inline-block; }
}
/* Proof: analysis in action */
.xis .proof .pgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: clamp(36px, 5vw, 56px); max-width: 980px; margin-inline: auto; }
.xis .pcard { border: 1px solid var(--line); border-radius: 18px; padding: clamp(22px, 3vw, 34px); display: grid; gap: 22px; align-content: start; background: rgba(255,255,255,.02); min-width: 0; }
.xis .pcard header { display: grid; gap: 6px; }
.xis .pcard .pk { font: 500 11px var(--font-mono); letter-spacing: .2em; text-transform: uppercase; color: var(--orange); }
.xis .pcard h3 { margin: 0; font: 350 26px/1.15 var(--font-display); font-variation-settings: 'opsz' 60, 'wdth' 87; color: var(--ivory); }
.xis .pcard .pl { font: 500 11px var(--font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--mist); }
.xis .pcard dl { margin: 0; display: grid; }
.xis .pcard dl div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 12px 0; border-top: 1px solid var(--line); }
.xis .pcard dt { font-size: 13.5px; color: var(--text-3); }
.xis .pcard dd { margin: 0; text-align: right; font: 400 19px var(--font-display); font-variation-settings: 'opsz' 60, 'wdth' 87; color: var(--ivory); font-variant-numeric: tabular-nums; white-space: nowrap; }
.xis .pcard dd small { display: block; font: 400 11.5px var(--font-body); color: var(--mist); white-space: normal; }
.xis .pcard .key dt { color: var(--sand); }
.xis .pcard .key dd { font-size: 26px; color: var(--sand); }
.xis .pcard .verdict { margin: 0; font-size: 14px; color: var(--text-2); padding-top: 18px; border-top: 1px solid var(--line); }
.xis .pcard .verdict b { display: block; font: 500 10.5px var(--font-mono); letter-spacing: .2em; text-transform: uppercase; color: var(--orange); margin-bottom: 8px; }
.xis .pbench { text-align: center; margin: 28px auto 26px; font-size: 14.5px; color: var(--text-2); }
.xis .pbench .d { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--orange); margin-right: 10px; vertical-align: 2px; }
.xis .pnote { max-width: 760px; margin: 30px auto 0; text-align: center; font-size: 12px; line-height: 1.65; color: var(--mist); }
@media (max-width: 760px) {
  .xis .proof .pgrid { grid-template-columns: 1fr; }
}
/* Analysis request */
.xis .analysis { background: var(--night-2); }
.xis .fld .opt { text-transform: none; letter-spacing: 0; color: #8E95A8; font: 400 11px var(--font-body); }
.xis .ftrust { grid-column: 1 / -1; margin: 4px 0 0; text-align: center; font: 500 10.5px var(--font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--mist); }
/* About facts */
.xis .facts { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px 0; margin: 10px 0 4px; }
.xis .facts div { display: grid; gap: 4px; padding: 0 clamp(16px, 2.6vw, 34px); text-align: center; }
.xis .facts div + div { border-left: 1px solid var(--line); }
.xis .facts dt { font: 500 10.5px var(--font-mono); letter-spacing: .2em; text-transform: uppercase; color: var(--mist); }
.xis .facts dd { margin: 0; font-size: 15px; color: var(--ivory); font-variant-numeric: tabular-nums; }
@media (max-width: 600px) {
  .xis .facts { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 0; }
  .xis .facts div + div { border-left: 0; }
  .xis .facts div:nth-child(even) { border-left: 1px solid var(--line); }
}
/* Method: the Data step carries the XIS edge */
.xis .steps li.core { isolation: isolate; padding-inline: 12px; }
.xis .steps li.core::after { content: ""; position: absolute; z-index: -1; top: 24px; bottom: -18px; left: -6px; right: -6px; border-radius: 16px; background: #FBF7F0; box-shadow: 0 0 0 1px rgba(246,88,0,.28), 0 18px 40px rgba(160,120,74,.14); }
.xis .steps li.core::before { top: 0; margin-left: -6.5px; width: 13px; height: 13px; background: var(--orange); box-shadow: 0 0 0 4px rgba(246,88,0,.16), 0 0 14px rgba(246,88,0,.5); }
.xis .steps li.core .n { color: var(--orange); }
.xis .steps .edge { font: 500 10px var(--font-mono); letter-spacing: .18em; text-transform: uppercase; color: var(--orange); margin-top: -4px; }
.xis .steps li.core h3 { font-size: 24px; }
.xis .steps li.core p { color: #2E323C; }
/* Methodology disclosure */
.xis .pmeth { max-width: 760px; margin: 14px auto 0; text-align: center; font-size: 12.5px; color: var(--mist); }
.xis .pmeth summary { display: inline-block; cursor: pointer; list-style: none; font: 500 11px var(--font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--sand); padding: 6px 2px; }
.xis .pmeth summary::-webkit-details-marker { display: none; }
.xis .pmeth summary::after { content: " +"; }
.xis .pmeth[open] summary::after { content: " −"; }
.xis .pmeth ul { list-style: none; margin: 14px 0 0; padding: 18px 22px; display: grid; gap: 10px; text-align: left; border: 1px solid var(--line); border-radius: 14px; line-height: 1.65; }
.xis .pmeth b { color: var(--text-2); font-weight: 500; }
/* Projects dropdown */
.xis .ndrop { position: relative; }
.xis .ndbtn { background: transparent; border: 0; padding: 6px 0; cursor: pointer; font: 400 13px var(--font-body); letter-spacing: .04em; color: rgba(243,237,227,.72); transition: color .3s; display: inline-flex; align-items: center; gap: 8px; }
.xis .ndbtn { line-height: inherit; } /* ndbtn line-height: same text line as the header links */
.xis .ndbtn::after { content: ""; width: 5px; height: 5px; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform .3s var(--ease); }
.xis .ndbtn:hover, .xis .ndbtn[aria-expanded="true"] { color: var(--ivory); }
.xis .ndbtn[aria-expanded="true"]::after { transform: translateY(1px) rotate(-135deg); }
.xis .ndmenu { position: absolute; left: -28px; top: calc(100% + 18px); display: grid; gap: 4px; padding: 18px 28px 20px; min-width: 330px; background: linear-gradient(to bottom, rgba(11,15,26,.94), rgba(11,15,26,.88)); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-top: 1px solid rgba(243,237,227,.10); border-radius: 0 0 14px 14px; z-index: 60; opacity: 1; transition: opacity .3s; }
.xis .ndmenu[hidden] { display: none; }
.xis header .ndmenu a { position: relative; display: grid; gap: 3px; padding: 10px 0 10px 16px; text-decoration: none; }
.xis header .ndmenu a::after { left: 0; top: 18px; bottom: auto; margin: 0; }
.xis header .ndmenu a:hover::after, .xis header .ndmenu a:focus-visible::after { transform: none; }
.xis header .ndmenu b { font: 400 13.5px var(--font-body); letter-spacing: .04em; color: rgba(243,237,227,.78); transition: color .3s; white-space: nowrap; }
.xis header .ndmenu small { font-size: 12px; color: var(--mist); letter-spacing: .01em; white-space: nowrap; }
.xis header .ndmenu a:hover b { color: var(--ivory); }
/* Developers */
.xis .devs { padding-block: 56px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.xis .marq { overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); margin-top: 22px; }
.xis .marq .row { display: flex; align-items: center; gap: 64px; padding-block: 8px; width: max-content; animation: marq 46s linear infinite; }
.xis .marq span { font: 400 20px var(--font-display); letter-spacing: .16em; color: #B9BDC8; white-space: nowrap; }
.xis .marq span.sep { width: 5px; height: 5px; border-radius: 50%; background: var(--orange); flex: none; }
.xis .marq .dl { width: auto; max-width: none; flex: none; opacity: .78; transition: opacity .3s; }
.xis .marq .dl:hover { opacity: 1; }
@keyframes marq { to { transform: translateX(-50%); } }
/* Close */
.xis .close { position: relative; overflow: hidden; }
.xis .bigdot { position: relative; width: 18px; height: 18px; border-radius: 50%; background: var(--orange); margin: 0 auto 36px; box-shadow: 0 0 40px rgba(246,88,0,.6); }
.xis .bigdot::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 1px solid rgba(246,88,0,.7); animation: pulse 2.8s ease-out infinite; }
@keyframes pulse { 0% { transform: scale(1); opacity: .9; } 100% { transform: scale(5); opacity: 0; } }
.xis .close .h2 { font-size: clamp(32px, 4.4vw, 58px); }
.xis .contact { margin-top: 40px; display: flex; gap: 14px 48px; flex-wrap: wrap; justify-content: center; }
.xis .contact div { display: grid; gap: 2px; text-align: center; }
.xis .contact small { font: 500 10.5px var(--font-mono); letter-spacing: .2em; text-transform: uppercase; color: var(--mist); }
.xis .contact b { font-weight: 400; font-size: 16px; user-select: all; font-variant-numeric: tabular-nums; }
.xis footer.foot { padding-block: clamp(64px, 8vw, 96px) calc(env(safe-area-inset-bottom, 0px) + 28px); border-top: 1px solid var(--line); color: var(--mist); font-size: 14px; }
.xis .fgrid { display: grid; grid-template-columns: 1.45fr 1fr 1fr 1fr 1.35fr; gap: 40px 36px; align-items: start; }
.xis .fgrid .fh { margin: 0; line-height: 16px; color: var(--mist); }
.xis .fgrid > * { min-width: 0; }
.xis .flogo { display: block; height: 44px; width: auto; margin-top: -14px; }
.xis .ftag { margin-top: 14px; color: var(--text-2); }
.xis .fcontact { margin: 26px 0 0; display: grid; gap: 14px; }
.xis .fcontact a { color: inherit; text-decoration: none; transition: color .3s; }
.xis .fcontact a:hover { color: var(--sand); }
.xis .fcontact a:hover { color: var(--sand); }
.xis .fcontact div { display: grid; gap: 1px; }
.xis .fcontact dt { font: 500 10.5px var(--font-mono); letter-spacing: .2em; text-transform: uppercase; color: var(--mist); }
.xis .fcontact dd { margin: 0; color: var(--ivory); user-select: all; font-variant-numeric: tabular-nums; }
.xis .fsoc { display: flex; gap: 8px; margin-top: 22px; }
.xis .fsoc a { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--line); display: grid; place-items: center; color: var(--text-2); transition: border-color .3s, color .3s; }
.xis .fsoc svg { width: 16px; height: 16px; }
.xis .fsoc a:hover { border-color: var(--orange); color: var(--ivory); }
.xis .fcol ul { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 11px; }
.xis .fcol a { position: relative; text-decoration: none; color: var(--text-link); transition: color .3s, padding .4s var(--ease); }
.xis .fcol a::before { content: ""; position: absolute; left: -12px; top: 50%; width: 5px; height: 5px; margin-top: -2.5px; border-radius: 50%; background: var(--orange); opacity: 0; transform: scale(.4); transition: all .35s var(--ease); }
.xis .fcol a:hover { color: var(--ivory); }
.xis .fcol a:hover::before { opacity: 1; transform: none; }
.xis .fzone { margin-top: 10px; padding-top: 14px; border-top: 1px solid var(--line); }
.xis .fzone a { color: var(--sand); }
.xis .fzone a::before { display: none; }
.xis .fzone .d { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 10px var(--orange); margin-right: 9px; vertical-align: 1px; }
.xis .fnews p { margin-top: 18px; color: var(--text-2); }
.xis .fnews p.fh { margin-top: 0; }
.xis .fzone a { white-space: nowrap; }
.xis .nf { margin-top: 18px; display: flex; align-items: center; border-bottom: 1px solid rgba(243,237,227,.25); transition: border-color .3s; }
.xis .nf:focus-within { border-bottom-color: var(--orange); }
.xis .nf input { flex: 1; min-width: 0; background: transparent; border: 0; color: var(--ivory); font: 400 15px var(--font-body); padding: 10px 2px; }
.xis .nf input:focus { outline: none; }
.xis .nf button { background: transparent; border: 0; color: var(--ivory); font-size: 18px; cursor: pointer; padding: 6px 4px 6px 12px; transition: transform .35s var(--ease), color .3s; }
.xis .nf button:hover { color: var(--orange); transform: translateX(3px); }
.xis .nmsg { font-size: 13px; color: var(--sand); }
.xis .nmsg a { color: var(--sand); }
.xis .fbar { margin-top: clamp(48px, 6vw, 72px); padding-top: 22px; border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: 12px 28px; justify-content: space-between; align-items: flex-start; font-size: 12.5px; }
.xis .fcopy { display: grid; gap: 4px; }
.xis .flegal { display: flex; gap: 22px; flex-wrap: wrap; }
.xis .fright { margin-left: auto; display: flex; align-items: center; gap: 12px 28px; flex-wrap: wrap; justify-content: flex-end; }
.xis .fbar a { text-decoration: none; color: var(--text-link); transition: color .3s; }
.xis .fbar a:hover { color: var(--ivory); }
@media (max-width: 1080px) {
  .xis .fgrid { grid-template-columns: 1fr 1fr 1fr; }
  .xis .fbrand, .xis .fnews { grid-column: 1 / -1; }
  .xis .fnews { max-width: 460px; }
}
@media (max-width: 600px) {
  .xis .fgrid { grid-template-columns: 1fr 1fr; text-align: left; }
  .xis .fbar { flex-direction: column; align-items: flex-start; }
  .xis .fright { margin-left: 0; width: 100%; justify-content: space-between; }
}
.xis .rv { transition: opacity 1s var(--ease), transform 1.1s var(--ease); }
.xis .rv.pre { opacity: 0; transform: translateY(24px); }
@media (prefers-reduced-motion: reduce) {
  .xis .rv, .xis .voices blockquote { transition: none; }
  .xis .rv.pre { opacity: 1; transform: none; }
  .xis .marq .row, .xis .bigdot::after { animation: none; }
  .xis .marq .row { flex-wrap: wrap; width: auto; justify-content: center; row-gap: 18px; }
}

/* Inner-page hero: compact, sized to content, with a soft orange glow */
.xis .phero { padding-block: clamp(56px, 8vw, 104px) clamp(56px, 7vw, 96px); position: relative; overflow: hidden; }
.xis .phero::before { content: ""; position: absolute; left: 50%; top: 58%; width: 520px; height: 520px; margin: -260px 0 0 -260px; border-radius: 50%; background: radial-gradient(circle, rgba(246,88,0,.16), rgba(246,88,0,0) 62%); pointer-events: none; }
.xis .phero .h1 { font: 350 clamp(32px, 4.6vw, 58px)/1.08 var(--font-display); font-variation-settings: 'opsz' 60, 'wdth' 87; letter-spacing: -.02em; }
.xis .phero .h1 em { font-style: normal; color: var(--sand); }


/* Reem page */
.xis .phero .sub { color: var(--text-2); max-width: 58ch; font-size: clamp(15px, 1.3vw, 17px); }
.xis .phero .row { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; margin-top: 10px; }
.xis .crumbs { font: 500 11px var(--font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--mist); display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.xis .crumbs a { color: var(--mist); text-decoration: none; } .xis .crumbs a:hover { color: var(--ivory); }
.xis .crumbs span[aria-hidden] { color: #4a5064; }
.xis .ptable-wrap { margin-top: clamp(36px, 5vw, 56px); overflow-x: auto; }
.xis table.ptable { width: 100%; min-width: 600px; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.xis .ptable th, .xis .ptable td { text-align: left; padding: 18px 14px; border-top: 1px solid var(--line); vertical-align: middle; }
.xis .ptable thead th { font: 500 10.5px var(--font-mono); letter-spacing: .18em; text-transform: uppercase; color: var(--mist); border-top: 0; padding-top: 0; }
.xis .ptable tbody th { font: 350 22px/1.2 var(--font-display); font-variation-settings: 'opsz' 60, 'wdth' 87; color: var(--ivory); }
.xis .ptable td.num { font: 400 22px var(--font-display); font-variation-settings: 'opsz' 60, 'wdth' 87; color: var(--ivory); }
.xis .ptable td.gr { width: 38%; }
.xis .ptable .bar { display: block; height: 6px; width: var(--w); background: var(--sand); border-radius: 0 4px 4px 0; margin-bottom: 10px; }
.xis .ptable .gv { font: 400 20px var(--font-display); color: var(--sand); }
.xis .ptable small { display: block; font-size: 12px; color: var(--mist); margin-top: 2px; }
.xis .pfoot { margin-top: 22px; font-size: 13px; color: var(--mist); max-width: 760px; }
.xis .pfoot b { color: var(--text-2); font-weight: 500; }
.xis .insights3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: clamp(36px, 5vw, 56px); }
.xis .icard { background: #fbf7f0; border-radius: 18px; padding: 28px 26px; display: grid; gap: 14px; align-content: start; }
.xis .icard .k { font: 500 10.5px var(--font-mono); letter-spacing: .18em; text-transform: uppercase; color: var(--orange-text); }
.xis .icard .fig { font: 350 44px/1 var(--font-display); font-variation-settings: 'opsz' 60, 'wdth' 87; color: var(--ink); }
.xis .icard .fig small { font: 400 14px var(--font-body); color: var(--dawn-text); margin-left: 6px; }
.xis .icard h3 { font: 400 21px/1.25 var(--font-display); font-variation-settings: 'opsz' 60, 'wdth' 87; color: var(--ink); }
.xis .icard p { font-size: 14.5px; color: var(--dawn-text); }
.xis .live { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 5vw, 64px); margin-top: clamp(36px, 5vw, 56px); }
.xis .live h3 { font: 500 10.5px var(--font-mono); letter-spacing: .18em; text-transform: uppercase; color: var(--mist); margin-bottom: 14px; }
.xis .live ul { list-style: none; padding: 0; margin: 0; display: grid; }
.xis .live li { padding: 14px 0; border-top: 1px solid var(--line); display: grid; gap: 2px; }
.xis .live li b { font: 400 18px var(--font-display); font-variation-settings: 'opsz' 60, 'wdth' 87; color: var(--ivory); font-weight: 400; }
.xis .live li span { font-size: 14px; color: var(--text-3); }
.xis .facts2 { margin-top: 26px; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.xis .facts2 div { border: 1px solid var(--line); border-radius: 14px; padding: 20px 22px; }
.xis .facts2 small { font: 500 10.5px var(--font-mono); letter-spacing: .18em; text-transform: uppercase; color: var(--mist); display: block; margin-bottom: 6px; }
.xis .facts2 p { color: var(--text-2); font-size: 14.5px; }
.xis .fit { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: clamp(36px, 5vw, 56px); }
.xis .fit > div { border: 1px solid var(--line); border-radius: 18px; padding: 28px 26px; }
.xis .fit h3 { font: 350 24px/1.2 var(--font-display); font-variation-settings: 'opsz' 60, 'wdth' 87; margin-bottom: 14px; }
.xis .fit h3 em { font-style: normal; color: var(--sand); }
.xis .fit ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.xis .fit li { position: relative; padding-left: 20px; font-size: 14.5px; color: var(--text-2); }
.xis .fit li::before { content: ""; position: absolute; left: 0; top: 10px; width: 6px; height: 6px; border-radius: 50%; background: var(--orange); }
.xis .fit .warn li::before { background: transparent; box-shadow: inset 0 0 0 1.5px var(--sand); }
.xis .rfaq { display: grid; grid-template-columns: 1fr 1.6fr; gap: clamp(28px, 5vw, 64px); align-items: start; }
.xis .rfaq .intro { position: sticky; top: 110px; display: grid; gap: 16px; }

.xis .trend { margin: clamp(36px, 5vw, 56px) 0 0; position: relative; }
.xis .tchart { width: 100%; height: 340px; }
.xis .tchart svg { display: block; width: 100%; height: 100%; overflow: visible; }
.xis .tchart .grid { stroke: rgba(243,237,227,.08); stroke-width: 1; }
.xis .tchart .ax { fill: var(--mist); font: 500 11px var(--font-mono); letter-spacing: .06em; }
.xis .tchart .ln { fill: none; stroke: var(--sand); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.xis .tchart .ln.part { stroke-dasharray: 4 5; }
.xis .tchart .wash { fill: var(--sand); opacity: .1; }
.xis .tchart .pt { fill: var(--sand); stroke: var(--night); stroke-width: 2; }
.xis .tchart .pt.end { fill: var(--night); stroke: var(--sand); stroke-width: 2; }
.xis .tchart .lab { fill: var(--ivory); font: 400 13px var(--font-body); }
.xis .tchart .lab.m { fill: var(--text-3); font-size: 12px; }
.xis .tchart .xh { stroke: rgba(243,237,227,.35); stroke-width: 1; }
.xis .tchart .hit { fill: transparent; cursor: crosshair; }
.xis .ttip { position: absolute; pointer-events: none; transform: translate(-50%, calc(-100% - 12px)); background: var(--night-2); border: 1px solid var(--line); border-radius: 10px; padding: 8px 12px; font-size: 13px; color: var(--ivory); white-space: nowrap; }
.xis .ttip small { display: block; font: 500 10px var(--font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--mist); }
.xis .vs { margin-top: 36px; }
.xis .vs-h { font: 500 10.5px var(--font-mono); letter-spacing: .18em; text-transform: uppercase; color: var(--mist); margin-bottom: 14px; }
.xis .vs-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.xis .vs-row div { border-top: 1px solid var(--line); padding-top: 14px; display: grid; gap: 4px; }
.xis .vs-row b { font: 350 34px/1 var(--font-display); font-variation-settings: 'opsz' 60, 'wdth' 87; color: var(--sand); font-weight: 350; }
.xis .vs-row span { font-size: 14px; color: var(--text-2); }
@media (max-width: 760px) { .xis .vs-row { grid-template-columns: 1fr; } .xis .tchart { height: 280px; } }
@media (max-width: 600px) {
  .xis table.ptable { min-width: 0; }
  .xis .ptable thead { display: none; }
  .xis .ptable tbody tr { display: grid; grid-template-columns: 1fr 1fr; column-gap: 14px; border-top: 1px solid var(--line); padding: 16px 0; }
  .xis .ptable tbody th { grid-column: 1 / -1; border: 0; padding: 0 0 10px; }
  .xis .ptable td { border: 0; padding: 4px 0; }
  .xis .ptable td.gr { grid-column: 1 / -1; width: auto; padding-top: 12px; }
  .xis .ptable td::before { content: attr(data-l); display: block; font: 500 10px var(--font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--mist); margin-bottom: 4px; }
}

.xis .checkpoint { font: 500 10.5px var(--font-mono); letter-spacing: .18em; text-transform: uppercase; color: var(--sand); border: 1px solid rgba(217,195,160,.3); border-radius: 999px; padding: 6px 14px; display: inline-flex; align-items: center; }
.xis .checkpoint .d { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--orange); margin-right: 10px; }
.xis .btable td.num.neg { color: var(--orange-soft); }
.xis .btable td.num { font-size: 20px; }
.xis .bnotes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 26px; }
.xis .bnotes p { font-size: 14px; color: var(--text-2); border-top: 1px solid var(--line); padding-top: 14px; }
.xis .bnotes b { color: var(--ivory); font-weight: 500; }
.xis .pmeth { max-width: 860px; margin: 0 auto; text-align: center; font-size: 13px; color: var(--mist); }
.xis .pmeth summary { display: inline-flex; justify-content: center; cursor: pointer; list-style: none; font: 500 11px var(--font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--sand); padding: 6px 2px; border: 0; }
.xis .pmeth summary::after { content: " +"; white-space: pre; }
.xis .pmeth[open] summary::after { content: " −"; }
.xis .pmeth ul { list-style: none; margin: 14px 0 0; padding: 20px 24px; display: grid; gap: 12px; text-align: left; border: 1px solid var(--line); border-radius: 14px; line-height: 1.65; }
.xis .pmeth b { color: var(--text-2); font-weight: 500; }
.xis details.pmeth { border-bottom: 0; }
@media (max-width: 760px) { .xis .bnotes { grid-template-columns: 1fr; } }
.xis .pano { margin: clamp(36px, 5vw, 56px) 0 0; }
.xis .pano img { width: 100%; height: clamp(240px, 38vw, 460px); object-fit: cover; object-position: center 55%; border-radius: 18px; display: block; }
.xis .pano figcaption { margin-top: 10px; font: 500 10.5px var(--font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--mist); }
@media (max-width: 860px) { .xis .insights3, .xis .live, .xis .fit, .xis .rfaq, .xis .facts2 { grid-template-columns: 1fr; } .xis .rfaq .intro { position: static; } }

body.xis { margin: 0; }

/* XIS interaction language: orange is the accent of the interaction, never the fill */
.xis .btn { position: relative; }
.xis .btn.solid, .xis .btn.cta, .xis .btn.wa { transition: transform .4s var(--ease), background .3s, color .3s, box-shadow .3s, padding .25s var(--ease); }
.xis .btn.solid::after, .xis .btn.cta::after, .xis .btn.wa::after { content: "\2192"; color: var(--orange); position: absolute; right: 14px; top: 50%; opacity: 0; transform: translate(-6px, -50%); transition: opacity .2s ease, transform .25s var(--ease); }
.xis .btn.solid:hover, .xis .btn.cta:hover, .xis .btn.wa:hover,
.xis .btn.solid:focus-visible, .xis .btn.cta:focus-visible, .xis .btn.wa:focus-visible { padding-left: 14px; padding-right: 34px; }
.xis header .btn.cta:hover, .xis header .btn.cta:focus-visible { padding-left: 8px; padding-right: 28px; }
.xis header .btn.cta::after { right: 10px; }
.xis .btn.solid:hover::after, .xis .btn.cta:hover::after, .xis .btn.wa:hover::after,
.xis .btn.solid:focus-visible::after, .xis .btn.cta:focus-visible::after, .xis .btn.wa:focus-visible::after { opacity: 1; transform: translate(0, -50%); }
.xis .btn.ghost:hover, .xis .btn.ghost:focus-visible { box-shadow: inset 0 0 0 1px var(--orange), 0 0 14px rgba(246,88,0,.16); }
.xis .btn::before { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; }
.xis .btn.xp::before { animation: xisPulse .28s ease-out; }
.xis .btn.ghost.xp::before { animation: xisFlash .28s ease-out; }
@keyframes xisPulse { 0% { opacity: 1; box-shadow: 0 0 0 0 rgba(246,88,0,.5); } 100% { opacity: 0; box-shadow: 0 0 0 7px rgba(246,88,0,0); } }
@keyframes xisFlash { 0% { opacity: 1; box-shadow: inset 0 0 0 1px var(--orange), 0 0 16px rgba(246,88,0,.3); } 100% { opacity: 0; box-shadow: inset 0 0 0 1px rgba(246,88,0,0), 0 0 16px rgba(246,88,0,0); } }
.xis .fok.xok > span::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 10px; vertical-align: 1px; border-radius: 50%; background: var(--orange); animation: xisOk .6s var(--ease) both; }
@keyframes xisOk { 0% { transform: scale(0); box-shadow: 0 0 0 0 rgba(246,88,0,.55); } 60% { transform: scale(1.3); box-shadow: 0 0 0 8px rgba(246,88,0,0); } 100% { transform: scale(1); box-shadow: 0 0 10px rgba(246,88,0,.6); } }
@media (prefers-reduced-motion: reduce) {
  .xis .btn.solid::after, .xis .btn.cta::after, .xis .btn.wa::after { transition: opacity .2s ease; transform: translate(0, -50%) !important; }
  .xis .btn.solid, .xis .btn.cta, .xis .btn.wa { transition: background .3s, color .3s, box-shadow .3s; }
  .xis .btn.xp::before, .xis .fok.xok > span::before { animation: none; }
}
.xis .vstats { margin: clamp(28px, 4vw, 44px) 0 0; }
.xis .vhead { margin: clamp(32px, 4vw, 44px) 0 4px; font: 500 10.5px var(--font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--mist); }
.xis .btable tr.cs td:nth-child(4)::after { content: "*"; margin-left: 2px; color: var(--sand); }

/* ---- Audit fixes, October 2026 (see the five-standard audit). No change to the approved layout. ---- */
.xis .nw { white-space: nowrap; }
/* hero: the eyebrow line is part of the H1, so the heading carries the search phrase; it looks exactly as before */
.xis .phero h1.hhead { margin: 0; display: grid; gap: 18px; justify-items: center; font-weight: 400; }
.xis .phero .hhead > .h1 { display: block; }
.xis .phero .hhead > .label { text-wrap: balance; }
/* byline: who analysed the data and when */
.xis .phero .byline { margin-top: 12px; font: 500 10.5px/1.9 var(--font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--mist); text-wrap: balance; }
.xis .phero .byline > span:not(.bsep) { white-space: nowrap; }
@media (max-width: 640px) { .xis .phero .byline .bsep { display: none; } .xis .phero .byline > span:not(.bsep) { display: block; } }
/* data-through pill: on small screens the source words fold away instead of wrapping the pill */
.xis .checkpoint .cp-x { white-space: pre; }   /* keeps the space before the dot inside the flex pill */
@media (max-width: 560px) { .xis .checkpoint .cp-x { display: none; } }
/* building names stay on one line where they are short (desktop and tablet table) */
@media (min-width: 601px) { .xis .ptable tbody th { min-width: 6.5em; } }
/* the figures behind the trend chart, in the HTML for readers, screen readers and search */
.xis .tdata { margin-top: 22px; }
.xis .tdata .dwrap { margin: 14px auto 0; max-width: 620px; padding: 16px 22px 14px; border: 1px solid var(--line); border-radius: 14px; overflow-x: auto; }
.xis .tdata table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.xis .tdata th, .xis .tdata td { padding: 8px; text-align: right; border-top: 1px solid var(--line); font: 400 14px/1.4 var(--font-body); color: var(--text-2); white-space: nowrap; }
.xis .tdata thead th { border-top: 0; padding-top: 0; font: 500 10.5px var(--font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--mist); }
.xis .tdata tbody th, .xis .tdata thead th:first-child { text-align: left; }
.xis .tdata tbody th { color: var(--ivory); }
.xis .tdata caption { caption-side: bottom; padding-top: 12px; text-align: left; font-size: 12px; line-height: 1.6; color: var(--mist); white-space: normal; }
/* neighbour figures link to that area's analysis; figure and line stay top-aligned, links line up at the foot */
.xis .vs-row > div { grid-template-rows: auto 1fr auto; align-items: start; }
.xis .vs-row .vs-a { justify-self: start; margin-top: 2px; padding: 6px 0; font: 500 10.5px var(--font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--sand); text-decoration: none; }
.xis .vs-row .vs-a::after { content: "\2192"; display: inline-block; margin-left: 8px; color: var(--orange); opacity: 0; transform: translateX(-4px); transition: opacity .2s ease, transform .25s var(--ease); }
.xis .vs-row .vs-a:hover::after, .xis .vs-row .vs-a:focus-visible::after { opacity: 1; transform: none; }
@media (hover: none) { .xis .vs-row .vs-a::after { opacity: 1; transform: none; } }
/* FAQ: a further-reading link under an answer */
.xis .faqlist details p.more { margin-top: -10px; }
.xis .faqlist .more a { color: var(--sand); text-underline-offset: 3px; }
/* larger hit areas for small text links (24 px minimum), no visual change */
.xis .crumbs a, .xis .grate a, .xis .chlink, .xis .skip { padding-block: 6px; margin-block: -6px; }
/* unit and bedroom labels stay on one line (they wrapped as "2 / bedrooms" at tablet width) */
.xis tbody[data-repeat="unit_types"] th, .xis tbody[data-repeat="villas.by_bedrooms"] th { white-space: nowrap; }
/* fit → reviews share a background, so the second starts closer (same rule as the homepage) */
.xis #fit + .voices { padding-top: clamp(24px, 3vw, 48px); }
.xis .qdots button { flex: 0 0 auto; }
@media (max-width: 420px) { .xis .qdots { gap: 2px; } .xis .qdots button { width: 24px; height: 26px; } }   /* 12 review dots stay 24 px wide on small phones */
/* enquiry form (#af): four tabs, contact number with country code, preferred contact method, message */
.xis form.of [hidden] { display: none !important; }
.xis .seg.etabs span { white-space: nowrap; }
.xis .seg.etabs input:checked + span { border-color: var(--orange); box-shadow: 0 0 14px rgba(246,88,0,.16); }
.xis .fld textarea { width: 100%; min-width: 0; min-height: 76px; resize: vertical; background: transparent; border: 0; border-bottom: 1px solid rgba(243,237,227,.22); color: var(--ivory); font: 400 15px/1.5 var(--font-body); padding: 8px 2px; border-radius: 0; }
.xis .fld textarea:focus { outline: none; border-bottom-color: var(--orange); }
.xis .fld textarea::placeholder, .xis .fld input::placeholder { color: #6E7487; }
.xis .fld.bad input, .xis .fld.bad select, .xis .fld.bad textarea { border-bottom-color: var(--orange-soft); }
.xis .iti { display: block; width: 100%; --iti-border-color: var(--line); --iti-country-selector-bg: var(--night-2); --iti-icon-color: var(--mist); --iti-hover-color: rgba(243,237,227,.07); --iti-spacer-horizontal: 8px; }
.xis .iti--detached-country-selector { --iti-border-color: var(--line); --iti-country-selector-bg: var(--night-2); --iti-icon-color: var(--mist); --iti-hover-color: rgba(243,237,227,.07); }
.xis .iti__selected-country { color: var(--ivory); }
.xis .iti__selected-country-primary { padding-left: 2px; }
.xis .iti__selected-dial-code { color: var(--text-2); font-variant-numeric: tabular-nums; }
.xis .iti__selected-country:focus-visible { outline: 1.5px solid var(--orange); outline-offset: 2px; }
.xis .iti__country-selector { color: var(--ivory); font: 400 14px var(--font-body); border-radius: 12px; overflow: hidden; }
.xis .iti__country-list { scrollbar-color: rgba(243,237,227,.2) transparent; }
.xis .iti__search-input { background: transparent; color: var(--ivory); font: 400 14px var(--font-body); }
.xis .iti__search-input::placeholder { color: var(--mist); }
.xis .iti__dial-code { color: var(--mist); }
.xis .iti__country.iti__highlight { background-color: rgba(243,237,227,.07); }
.xis .iti__country[aria-selected="true"] .iti__country-name { color: var(--ivory); }
@media (max-width: 480px) {
  .xis .seg.etabs { display: grid; grid-template-columns: 1fr 1fr; }
  .xis .seg.etabs span { display: block; text-align: center; }
}
.xis .fld .iti__search-input { padding: 10px 34px; border-bottom: 1px solid var(--line); }
.xis .iti li::before, .xis .iti__country::before { content: none !important; display: none !important; }
.xis .iti__country-list { justify-items: stretch; text-align: left; }
.xis .iti--inline-country-selector .iti__country-container { position: static; padding: 0; }
.xis .iti--inline-country-selector .iti__selected-country { position: absolute; left: 0; top: 0; bottom: 0; height: auto; }
.xis .iti--inline-country-selector:not(.iti--detached-country-selector) .iti__country-selector { left: auto !important; right: 0 !important; width: max(100%, 300px) !important; max-width: calc(100vw - 32px); }
.xis .iti__country { white-space: nowrap; min-width: 0; box-sizing: border-box; width: 100%; }
.xis .iti__country-list { overflow-x: hidden; }
.xis .iti__country-name { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
/* Header: menu button below 1,101 px, so the five menu items, language and "Request an analysis" never wrap */
@media (max-width: 1100px) { .xis header nav { display: none; } .xis header.top .wrap { grid-template-columns: 1fr auto; } .xis .menubtn { display: inline-block; } }
/* Footer: investment zones link wraps below 341 px, so the footer never overflows */
@media (max-width: 340px) { .xis .fzone a { white-space: normal; } }

/* interactive states (approved 23 October 2026): transparent controls show the XIS orange outline on hover and focus */
.btn.ghost:hover, .btn.ghost:focus-visible { box-shadow: inset 0 0 0 1px var(--orange), 0 0 14px rgba(246,88,0,.16); }
.chip:not([aria-pressed="true"]):hover, .chip:focus-visible, .ftab:not([aria-selected="true"]):hover, .ftab:focus-visible,
.seg label:hover input:not(:checked) + span, .seg input:focus-visible + span { border-color: var(--orange); color: var(--ivory); }
.pill:hover, .pill:focus-within, .pxchip:hover, .pxchip:focus-visible, .ictry a:hover, .ictry a:focus-visible,
.lxpage a:not([aria-current]):hover, .lxpage a:focus-visible, .lxfeat a:hover { box-shadow: inset 0 0 0 1px var(--orange); color: var(--ivory); }
.hmk label:hover input:not(:checked) + span { box-shadow: inset 0 0 0 1px var(--orange); color: var(--ivory); }
.nconsent { display: flex; gap: 10px; align-items: flex-start; margin-top: 12px; font-size: 12.5px; line-height: 1.5; color: var(--mist); cursor: pointer; }
.nconsent input { margin-top: 2px; accent-color: var(--orange); flex: none; }
.nconsent a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }