/* 26 MAISI — главная v7 в языке 111W57: светлый тёплый фон, тауп, антиква фразами, кадры в сетке, тонкие кнопки со стрелкой */
:root {
  --white: #ffffff;
  --stone: #f0eeea;        /* серые блоки и подвал */
  --taupe: #7c7262;        /* весь текст */
  --taupe-d: #5e5648;
  --taupe-l: rgba(124, 114, 98, .38);
  --night: #0e1720;
  --serif: "Noto Serif Display", "Noto Serif Georgian", "Noto Serif Hebrew", "Noto Naskh Arabic", Georgia, serif;
  --sans: "Inter", "Noto Sans Georgian", "Noto Sans Hebrew", "Noto Sans Arabic", system-ui, sans-serif;
  --gut: clamp(16px, 2.2vw, 32px);
  --ease: cubic-bezier(.2, .7, .1, 1);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--white); color: var(--taupe); font: 400 14px/1.5 var(--sans); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img, video { display: block; max-width: 100%; }
figure { margin: 0; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; padding: 0; }
svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.3; flex: none; }
[dir="rtl"] svg { transform: scaleX(-1); }

/* кнопки: тонкий контур, подпись капслоком, стрелка справа */
.btn { display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; min-width: 150px; height: 40px; padding: 0 14px; border-radius: 0; font: 500 12.5px/1 var(--sans); letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; transition: background .3s, color .3s, border-color .3s; }
.btn--line { border: 1px solid var(--taupe-l); }
.btn--line:hover { border-color: var(--taupe); background: var(--taupe); color: var(--white); }
.btn--fill { background: var(--taupe); color: var(--white); border: 1px solid var(--taupe); }
.btn--fill:hover { background: var(--taupe-d); border-color: var(--taupe-d); }
.btn--xl { height: 60px; min-width: 320px; padding: 0 20px; font-size: 13.5px; }
.btn--xl .tel { font-weight: 400; letter-spacing: .03em; }
:lang(ka) .btn, :lang(he) .btn, :lang(ar) .btn { text-transform: none; letter-spacing: 0; font-size: 13.5px; }

/* шапка: на видео белая, дальше белый фон и тауп */
.bar { position: fixed; inset: 0 0 auto; z-index: 30; display: flex; align-items: center; justify-content: space-between; height: 64px; padding: 0 var(--gut); color: var(--white); transition: background .35s, color .35s, box-shadow .35s; }
.bar.is-solid { background: var(--white); color: var(--taupe); box-shadow: 0 1px 0 rgba(124,114,98,.12); }
.bar__menu { display: flex; align-items: center; gap: 16px; font: 500 12.5px/1 var(--sans); letter-spacing: .04em; text-transform: uppercase; }
.burger { position: relative; width: 44px; height: 8px; }
.burger::before, .burger::after { content: ""; position: absolute; left: 0; right: 0; height: 1px; background: currentColor; transition: transform .35s var(--ease), top .35s var(--ease); }
.burger::before { top: 0; } .burger::after { top: 7px; }
.is-menu .burger::before { top: 4px; transform: rotate(10deg); } .is-menu .burger::after { top: 4px; transform: rotate(-10deg); }
.bar__mark { position: absolute; left: 50%; transform: translateX(-50%); font: 400 22px/1 var(--serif); letter-spacing: .02em; opacity: 0; transition: opacity .35s; pointer-events: none; }
.bar.is-solid .bar__mark { opacity: 1; pointer-events: auto; }
.bar__call { border-color: currentColor; border-color: color-mix(in srgb, currentColor 55%, transparent); }
.bar__call:hover { background: currentColor; }
.bar__call:hover > * { color: var(--night); }
.bar.is-solid .bar__call:hover > * { color: var(--white); }
.is-menu .bar { background: var(--white); color: var(--taupe); }

/* меню: белый лист, пункты антиквой */
.menu { position: fixed; inset: 0; z-index: 25; background: var(--white); display: flex; flex-direction: column; justify-content: center; padding: 110px var(--gut) 40px; opacity: 0; visibility: hidden; transition: opacity .4s var(--ease), visibility 0s .4s; }
.is-menu .menu { opacity: 1; visibility: visible; transition: opacity .4s var(--ease); }
.menu__list { list-style: none; margin: 0; padding: 0; }
.menu__list a { display: inline-block; font: 300 clamp(38px, 5.6vw, 80px)/1.15 var(--serif); letter-spacing: -.02em; color: var(--taupe); opacity: .55; transition: opacity .25s; }
.menu__list a:hover { opacity: 1; }
.menu__langs { display: flex; gap: 22px; margin-top: auto; font: 500 12.5px/1 var(--sans); letter-spacing: .06em; }
.menu__langs a { opacity: .45; } .menu__langs a.is-on, .menu__langs a:hover { opacity: 1; }

/* первый экран */
.hero { position: relative; height: 100vh; height: 100svh; min-height: 560px; overflow: hidden; background: var(--night); color: var(--white); }
.hero__media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(0,0,0,.28) 0%, rgba(0,0,0,0) 20%, rgba(0,0,0,0) 62%, rgba(0,0,0,.42) 100%); }
.hero__mark { position: absolute; z-index: 2; left: 50%; top: 9vh; transform: translateX(-50%); margin: 0; display: flex; flex-direction: column; align-items: center; font: 300 clamp(96px, 17vh, 190px)/.92 var(--serif); letter-spacing: -.03em; direction: ltr; text-shadow: 0 2px 30px rgba(0,0,0,.2); }
.hero__line { position: absolute; z-index: 2; left: var(--gut); bottom: clamp(24px, 5vh, 48px); margin: 0; max-width: 13ch; font: 300 clamp(44px, 4.6vw, 76px)/1 var(--serif); letter-spacing: -.025em; }
.hero__go { position: absolute; z-index: 2; right: var(--gut); bottom: clamp(30px, 5.6vh, 54px); display: flex; align-items: center; gap: 14px; font: 500 12.5px/1 var(--sans); letter-spacing: .04em; text-transform: uppercase; }
.hero__go svg { width: 36px; height: 36px; padding: 10px; border: 1px solid rgba(255,255,255,.6); transition: background .3s, color .3s; }
.hero__go:hover svg { background: var(--white); color: var(--night); }
.hero__down { position: absolute; z-index: 2; left: 50%; bottom: 22px; transform: translateX(-50%); }
.hero__down svg { width: 14px; height: 22px; }
[dir="rtl"] .hero__line { left: auto; right: var(--gut); }
[dir="rtl"] .hero__go { right: auto; left: var(--gut); }

/* блоки на белом */
.block { padding: clamp(80px, 12vh, 150px) var(--gut) 0; }
.block--tight { padding-top: clamp(48px, 8vh, 96px); }
.say { margin: 0 0 40px; max-width: 22ch; font: 300 clamp(34px, 4vw, 58px)/1.08 var(--serif); letter-spacing: -.025em; color: var(--taupe); }
.say--s { font-size: clamp(30px, 2.9vw, 44px); max-width: 16ch; }
.cap { margin: 14px 0 0; font: 500 12px/1 var(--sans); letter-spacing: .05em; text-transform: uppercase; }
:lang(ka) .cap, :lang(he) .cap, :lang(ar) .cap { text-transform: none; letter-spacing: 0; font-size: 13px; }

/* коллаж: большой кадр + малый со сдвигом вниз */
.collage { display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--gut); margin-top: clamp(56px, 9vh, 110px); align-items: start; }
.collage__big { grid-column: 1 / span 8; }
.collage__big img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.collage__small { grid-column: 10 / span 3; margin-top: 0; }
.collage__small img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }

/* панорама в полях */
.wide img { width: 100%; aspect-ratio: 21 / 9; object-fit: cover; }

/* триптих: кадр + подпись-ссылка со стрелкой */
.tri { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gut); margin-top: clamp(56px, 9vh, 100px); }
.tri__item img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; transition: opacity .4s; }
.tri__item:hover img { opacity: .88; }
.tri__item span { display: inline-flex; align-items: center; gap: 10px; margin-top: 14px; font: 500 12px/1 var(--sans); letter-spacing: .05em; text-transform: uppercase; }
.tri__item span::after { content: "→"; font-size: 13px; transition: transform .3s; }
.tri__item:hover span::after { transform: translateX(4px); }
[dir="rtl"] .tri__item span::after { content: "←"; }
:lang(ka) .tri__item span, :lang(he) .tri__item span, :lang(ar) .tri__item span { text-transform: none; letter-spacing: 0; font-size: 13px; }

/* серый блок: картинка + текст */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gut); margin-top: clamp(80px, 12vh, 150px); padding: clamp(48px, 8vh, 96px) var(--gut); background: var(--stone); align-items: end; }
.split__img img { width: 100%; aspect-ratio: 5 / 4; object-fit: cover; }
.split__text { padding: 0 clamp(0px, 4vw, 72px); }
.dist { margin: 0 0 36px; }
.dist div { display: grid; grid-template-columns: 120px 1fr; align-items: baseline; gap: 12px; padding: 14px 0; border-top: 1px solid rgba(124,114,98,.2); }
.dist dt { font: 300 28px/1 var(--serif); letter-spacing: -.02em; white-space: nowrap; direction: ltr; text-align: start; }
[dir="rtl"] .dist dt { text-align: end; }
.dist dt i { font-style: normal; font-size: 14px; }
.dist dd { margin: 0; font-size: 14px; }

/* 360 */
.spin__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.spin__head .say { margin: 0; }
.spin { position: relative; margin-top: clamp(40px, 6vh, 72px); aspect-ratio: 16 / 9; max-height: 86vh; width: 100%; overflow: hidden; background: var(--stone); }
.spin__stage { position: absolute; inset: 0; cursor: grab; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.spin__stage.is-drag { cursor: grabbing; }
.spin__stage canvas { width: 100%; height: 100%; display: block; }
.spin__hint { position: absolute; left: 50%; bottom: 20px; transform: translateX(-50%); margin: 0; padding: 10px 14px; background: rgba(255,255,255,.88); font: 500 11.5px/1 var(--sans); letter-spacing: .05em; text-transform: uppercase; pointer-events: none; transition: opacity .6s; }
#spin.is-touched .spin__hint { opacity: 0; }

/* числа */
.nums { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gut); }
.num { display: flex; flex-direction: column; gap: 12px; padding-top: 20px; border-top: 1px solid rgba(124,114,98,.25); }
.num b { font: 300 clamp(40px, 4.4vw, 64px)/1 var(--serif); letter-spacing: -.03em; direction: ltr; text-align: start; }
.num b small { font-size: .5em; }
.num span { font-size: 14px; max-width: 26ch; }

/* связь */
.split--contact { align-items: center; }
.split--contact .say { max-width: 12ch; }
.split--contact .split__text { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.row { display: flex; gap: 10px; flex-wrap: wrap; }
.row .btn { min-width: 0; gap: 0; justify-content: center; padding: 0 22px; }
.cbtn { margin-top: 10px; font-size: 13.5px; border-bottom: 1px solid var(--taupe-l); padding-bottom: 2px; }
.cbtn:hover { border-color: var(--taupe); }
.cb { display: flex; gap: 10px; }
.cb input { height: 40px; width: 220px; padding: 0 12px; border: 1px solid var(--taupe-l); background: var(--white); color: var(--taupe-d); font: 400 15px var(--sans); border-radius: 0; }
.cb input:focus { outline: none; border-color: var(--taupe); }

/* подвал */
.foot { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: var(--gut); padding: clamp(64px, 10vh, 110px) var(--gut) 28px; background: var(--stone); margin-top: 6px; }
.foot__mark { display: flex; flex-direction: column; align-items: flex-start; font: 300 54px/.95 var(--serif); letter-spacing: -.02em; direction: ltr; }
.foot__links { list-style: none; margin: 0; padding: 0; font: 300 19px/1.5 var(--serif); }
.foot__links a:hover, .foot__contact a:hover { color: var(--taupe-d); }
.foot__contact { display: flex; flex-direction: column; gap: 4px; font: 300 19px/1.5 var(--serif); }
.foot__legal { grid-column: 1 / -1; margin: 48px 0 0; padding-top: 18px; border-top: 1px solid rgba(124,114,98,.2); font: 500 11px/1 var(--sans); letter-spacing: .05em; text-transform: uppercase; }

.dock { display: none; }

/* появление */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity 1.1s var(--ease), transform 1.1s var(--ease); }
.reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; transition: none; } html { scroll-behavior: auto; } }

@media (max-width: 860px) {
  .bar { height: 56px; padding: 0 16px; }
  .bar__label { display: none; }
  .burger { width: 32px; }
  .bar__call { min-width: 0; gap: 0; padding: 0 14px; }
  .bar__call svg { display: none; }
  .bar__mark { font-size: 18px; }
  .hero__mark { top: 11vh; font-size: clamp(64px, 9vh, 96px); }
  .hero__line { bottom: 96px; left: 16px; font-size: 40px; }
  [dir="rtl"] .hero__line { right: 16px; }
  .hero__go, .hero__down { display: none; }
  .block { padding: 72px 16px 0; }
  .say { font-size: 32px; }
  .collage { grid-template-columns: 1fr 1fr; margin-top: 40px; gap: 10px; }
  .collage__big { grid-column: 1 / -1; }
  .collage__small { grid-column: 2; }
  .wide img { aspect-ratio: 4 / 3; }
  .tri { grid-template-columns: 1fr; gap: 28px; margin-top: 40px; }
  .split { grid-template-columns: 1fr; padding: 40px 16px 56px; margin-top: 72px; gap: 32px; }
  .split__text { padding: 0; }
  .split--contact .split__img { order: -1; }
  .spin { aspect-ratio: 4 / 5; }
  .spin__head .btn { display: none; }
  .nums { grid-template-columns: 1fr; gap: 24px; }
  .btn--xl { width: 100%; min-width: 0; }
  .cb { width: 100%; } .cb input { flex: 1; width: auto; }
  .foot { grid-template-columns: 1fr; padding: 56px 16px 96px; gap: 36px; }
  .dock { display: grid; grid-template-columns: 1fr 1fr; position: fixed; z-index: 40; left: 0; right: 0; bottom: 0; padding: 8px 8px calc(8px + env(safe-area-inset-bottom)); gap: 8px; background: rgba(255,255,255,.96); box-shadow: 0 -1px 0 rgba(124,114,98,.15); }
  .dock a { display: flex; align-items: center; justify-content: center; height: 48px; border: 1px solid var(--taupe-l); font: 500 12.5px/1 var(--sans); letter-spacing: .04em; text-transform: uppercase; }
  .dock .dock__call { background: var(--taupe); border-color: var(--taupe); color: var(--white); }
  :lang(ka) .dock a, :lang(he) .dock a, :lang(ar) .dock a { text-transform: none; letter-spacing: 0; font-size: 13.5px; }
}
