:root {
  --g: 24px;
  --hdr-top: 64px;
  --hdr-past: 56px;
  --hdr: var(--hdr-top);
  --t-display: clamp(34px, 9.6vw, 40px);
  --t-h2: clamp(26px, 7.4vw, 30px);
  --t-h3: 22px;
  --t-stmt: 24px;
  --t-lead: 18px;
  --t-body: 16px;
  --t-small: 13px;
  --t-num-xl: clamp(84px, 26vw, 112px);
  --t-num-l: 48px;
  --shot: min(76vw, 340px);
  --eye: min(70vw, 300px);
  --panel: 84vw;
  --card: min(80vw, 320px);
  --fig: min(48vw, 240px);
  --lh-display: 1.06; --lh-h2: 1.12; --lh-h3: 1.2; --lh-stmt: 1.35; --lh-lead: 1.45; --lh-body: 1.6; --lh-small: 1.45;
}
:root[dir="rtl"] { --lh-display: 1.3; --lh-h2: 1.3; --lh-h3: 1.35; --lh-stmt: 1.6; --lh-lead: 1.7; --lh-body: 1.8; --lh-small: 1.6; }
.past-hero { --hdr: var(--hdr-past); }
@media (max-width: 360px) { :root { --g: 20px; --panel: 86vw; --fig: 52vw; } }
@media (max-width: 330px) { :root { --g: 16px; --t-display: 32px; --t-h2: 25px; } }
@media (min-width: 700px) and (min-height: 501px) {
  :root { --g: 48px; --hdr-top: 72px; --hdr-past: 64px; --t-display: clamp(48px, 7vw, 60px); --t-h2: clamp(34px, 4.8vw, 42px);
          --t-h3: 26px; --t-stmt: 30px; --t-lead: 20px; --t-body: 17px; --t-small: 14px;
          --t-num-xl: 150px; --t-num-l: 60px; --shot: min(56vw, 440px); --eye: min(46vw, 380px);
          --panel: 64vw; --card: 42vw; --fig: 28vw; }
}
@media (orientation: landscape) and (max-height: 500px) {
  :root { --hdr-top: 56px; --hdr-past: 48px; --t-display: clamp(28px, 8.5svh, 36px); --t-h2: clamp(24px, 6.5svh, 28px); --t-h3: 20px; --t-stmt: 22px;
          --t-num-xl: clamp(64px, 24svh, 96px); --shot: calc(50svh * 32.9 / 36.3); --eye: 34svh; --panel: 40vw; --card: 40vw; --fig: 24vw; }
}
@supports not (height: 1svh) { @media (orientation: landscape) and (max-height: 500px) { :root { --shot: calc(50vh * 32.9 / 36.3); --eye: 34vh; } } }
html { scroll-padding-top: 72px; }
body { background: var(--black); }
body.legal { background: var(--paper); }
.cursor { display: none; }
p { font-size: var(--t-body); line-height: var(--lh-body); }
.top { padding: 10px var(--g); transition: transform .35s var(--ease), background-color .4s, color .3s; }
.past-hero .top { padding-block: 6px; -webkit-backdrop-filter: none; backdrop-filter: none; }
.past-hero:not(.top-light) .top { background-color: #231f20; }
.past-hero.top-light .top { background-color: #fff; }
.top .logo { flex: none; width: 48px; transition: none; }
.past-hero .top .logo { width: 40px; }
.top .logo { position: relative; }
.top .logo::after { content: ""; position: absolute; inset: -6px; }
.top-end { gap: 8px; }
.top .lang, .top .menu-btn { display: inline-flex; align-items: center; height: 44px; min-height: 44px; padding: 0 14px; font-size: 14px; line-height: 1; }
.top.open nav { padding: 12px var(--g) 24px; border-top: 1px solid rgba(255, 255, 255, .12); max-height: calc(100vh - var(--hdr)); max-height: calc(100dvh - var(--hdr)); }
.top.open nav a { font-size: 18px; font-weight: 600; min-height: 48px; }
@media (max-width: 360px) { .top .logo { width: 44px; } }
@media (min-width: 700px) and (min-height: 501px) { .top { padding-block: 14px; } .past-hero .top { padding-block: 10px; } .top .logo { width: 56px; } .past-hero .top .logo { width: 48px; } }
@media (orientation: landscape) and (max-height: 500px) { .top { padding-block: 6px; } .top .logo { width: 40px; } .past-hero .top .logo { width: 36px; } }
@media (max-width: 240px) { .top .logo { width: 36px; } .top-end { gap: 4px; } .top .lang, .top .menu-btn { padding: 0 8px; font-size: 13px; } }
@media (min-width: 901px) and (max-height: 500px) {
  .top { display: flex; justify-content: space-between; gap: 12px; }
  .top nav { display: none; }
  .menu-btn { display: inline-flex; }
  .top.open nav { display: grid; grid-template-columns: 1fr 1fr; column-gap: 6vw; align-content: start; position: absolute; top: 100%; left: 0; right: 0; width: 100%; max-width: none; justify-self: stretch; box-sizing: border-box; padding: 8px var(--g) 12px; gap: 2px; background: #231f20; color: #fff; font-size: 1.15rem; overflow-y: auto; overscroll-behavior: contain; }
  .top.open nav :focus-visible { outline-color: #fff; }
  .top.open nav a { display: block !important; padding: 8px 0; min-height: 44px; }
  .top.open nav a::after { display: none; }
  .no-js .menu-btn { display: none; }
  .no-js .top { position: absolute; flex-wrap: wrap; row-gap: 4px; }
  .no-js .top nav { display: flex; flex-wrap: wrap; order: 3; width: 100%; gap: 0 18px; }
  .no-js .top nav a { display: inline-flex !important; align-items: center; min-height: 44px; padding: 0; }
  .no-js .top nav a::after { display: none; }
  .way small, .way h3, .way p { text-shadow: 0 1px 12px rgba(0, 0, 0, .55); }
  footer a { display: inline-flex; align-items: center; min-height: 44px; padding-block: 0; }
  footer .social a { width: 44px; height: 44px; }
}
:root .hero-copy.first h1 { font-size: var(--t-display); line-height: var(--lh-display); max-width: none; }
html:not([dir="rtl"]) .hero-copy h1, html:not([dir="rtl"]) .hero-copy h2 { letter-spacing: -.015em; }
:root .hero-copy.second h2 { font-size: var(--t-display); line-height: var(--lh-display); }
:root .hero-copy.second p { max-width: 30ch; margin: 18px 0 0; font-size: var(--t-lead); line-height: var(--lh-lead); }
.hint { font-size: var(--t-small); font-weight: 500; margin-top: 16px; }
:root .facts-copy .facts-title, .latest h2, .plain h2, .ps h2, .swap h2, .panel.intro h2 { font-size: var(--t-h2); line-height: var(--lh-h2); }
.screen h3, .swap li h3, .way h3, .cmp h3 { font-size: var(--t-h3); line-height: var(--lh-h3); }
.static .hero .pin { padding: 120px var(--g) 56px; gap: 40px; }
.sadu { height: 32px; }
@media (min-width: 700px) and (min-height: 501px) { .sadu { height: 48px; } }
.facts-copy, :root .facts-copy .facts-title, .fc-rest { text-align: start; max-width: none; margin-inline: 0; }
:root .facts-copy .facts-title { max-width: 16ch; }
.fc-rest > * { text-align: start; }
.fc-rest .fc-lead { margin: 20px 0 0 !important; max-width: 34em; font-size: var(--t-lead); line-height: var(--lh-lead); color: #fff; }
.fc-rest .fc-text { margin: 16px 0 0 !important; max-width: 34em; font-size: var(--t-body); line-height: var(--lh-body); color: rgba(255, 255, 255, .78); }
.fc-rest .since { margin: 24px 0 0 !important; padding-top: 16px; font-size: var(--t-body); line-height: 1.5; max-width: none; }
.fc-rest .since::before { left: 0; margin-left: 0; width: 40px; }
[dir="rtl"] .fc-rest .since::before { left: auto; right: 0; }
.static .facts .pin { padding: 64px var(--g) 56px; }
@media (min-width: 700px) { :root .facts-copy .facts-title { max-width: 18ch; } .fc-rest .fc-lead, .fc-rest .fc-text { max-width: 60ch; } }
.latest { padding: 44px var(--g) 36px; }
.lt-head { display: block; }
.lt-head p { margin-top: 10px; max-width: 34ch; font-size: var(--t-body); line-height: 1.55; }
.lt-list { margin-top: 28px; }
.lt-list .nw { grid-template-columns: 1fr; row-gap: 12px; padding-block: 22px; }
.lt-logo img { height: 32px; max-width: 120px; }
.lt-meta { font-size: var(--t-small); gap: 12px; }
.lt-title { font-size: 19px; line-height: 1.3; }
.lt-list .src { font-size: var(--t-small); }
.nw:active .lt-title { text-decoration-color: var(--red); }
@media (min-width: 700px) { .lt-list .nw { grid-template-columns: 160px minmax(0, 1fr); column-gap: 32px; } }
.screen .n { font-size: var(--t-num-xl); line-height: .78; }
.static .screen .n { font-size: 72px; }
.screen p { font-size: var(--t-body); line-height: 1.55; max-width: 30ch; }
.static .panel.intro, .static .screen .txt { padding-inline: var(--g); }
.static .track { gap: 48px; }
.swap li .n { font-size: var(--t-num-l); line-height: .8; }
.swap ol { gap: 28px; }
.swap li { grid-template-columns: auto minmax(0, 1fr); column-gap: 16px; }
.swap li h3, .swap li p { overflow-wrap: anywhere; }
html[lang="en"] .swap li h3 { -webkit-hyphens: auto; hyphens: auto; }
.swap li p { font-size: var(--t-body); line-height: 1.55; }
.ps li b { font-size: 20px; line-height: 1.2; }
.ps li span { font-size: var(--t-body); line-height: 1.5; }
[dir="rtl"] .ps li span { line-height: 1.8; }
.static .swap .pin, .static .culture .pin { padding: 64px var(--g); }
.static .culture .pin { gap: 40px; }
.plain .inner { width: auto; margin: 0 var(--g); padding: 44px 0 36px; }
.plain h2 { margin-bottom: 28px; max-width: 16ch; }
.cards, .people {
  display: flex; gap: 12px; overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory; scroll-padding-inline: var(--g);
  margin-inline: calc(var(--g) * -1); padding-inline: var(--g) 0;
  scrollbar-width: none;
}
.cards::-webkit-scrollbar, .people::-webkit-scrollbar { display: none; }
.cards > *, .people > * { flex: none; scroll-snap-align: start; }
.cards::after, .people::after { content: ""; flex: 0 0 calc(var(--g) - 12px); }
.card { flex-basis: var(--card); padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, .16); gap: 10px; }
.card img { width: 200px; height: 44px; margin-bottom: 12px; }
.card small { font-size: var(--t-small); }
.card p { font-size: var(--t-body); line-height: 1.55; max-width: none; }
.record { margin-bottom: 32px; }
.rc-line { font-size: var(--t-stmt); line-height: var(--lh-stmt); max-width: none; }
.rc-note { margin-top: 16px; font-size: var(--t-small); }
.people figure { flex-basis: var(--fig); }
.people figure:last-child:nth-child(odd) { grid-column: auto; width: auto; justify-self: auto; }
.people figcaption { padding: 12px 2px 0; font-size: 14px; line-height: 1.45; }
.people figcaption b { font-size: 16px; }
.people .more-n b { font-size: 3.2rem; }
#partner h2 { text-align: start; }
.ways {
  display: flex; gap: 12px; overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory; scroll-padding-inline: var(--g);
  margin-inline: calc(var(--g) * -1); padding-inline: var(--g) 0;
  scrollbar-width: none;
}
.ways::-webkit-scrollbar { display: none; }
.ways::after { content: ""; flex: 0 0 calc(var(--g) - 12px); }
.way { --ph: calc(var(--card) * .75); flex: 0 0 var(--card); scroll-snap-align: start; min-height: 0; padding: calc(var(--ph) + 12px) 22px 22px; justify-content: flex-end; }
.way img { inset: 0 0 auto 0; height: var(--ph); }
.way::before { background: linear-gradient(180deg, rgba(35, 31, 32, 0) calc(var(--ph) * .55), rgba(35, 31, 32, .6) calc(var(--ph) * .82), #231f20 var(--ph)); }
@media (orientation: landscape) and (max-height: 500px) { .way { --ph: calc(var(--card) * .42); } }
.way small { font-size: var(--t-small); }
.way p { font-size: var(--t-body); line-height: 1.5; }
.way .go { display: inline-flex; align-items: center; min-height: 44px; margin-top: 4px; font-size: 15px; }
.reg { padding: 20px; scroll-margin-top: 72px; }
.reg-tabs [role="tab"] { font-size: 17px; min-height: 44px; box-sizing: border-box; }
.reg-form label { font-size: 14px; }
.reg-form input:not([type="checkbox"]), .reg-form select, .reg-form textarea { font-size: 16px; min-height: 48px; }
.reg-consent label { font-size: 14px; line-height: 1.5; }
.reg-consent label a { position: relative; z-index: 1; padding-block: 14px; }
.reg-send { width: 100%; min-height: 48px; }
footer { grid-template-columns: minmax(0, 1fr); padding: 36px var(--g) 36px; gap: 20px; font-size: 15px; line-height: 1.6; }
footer p, footer a, footer span { overflow-wrap: anywhere; }
footer p { font-size: 15px; line-height: 1.6; }
footer .logo { width: 56px; margin-bottom: 18px; }
footer .fine, footer .copy { font-size: var(--t-small); line-height: 1.55; }
[dir="rtl"] footer .fine { line-height: 1.8; }
footer .f-legal .m-nw { white-space: nowrap; }
footer nav { grid-template-columns: minmax(0, 1fr); gap: 0; justify-items: start; }
.cmp h4 { font-size: 16px; }
.cmp p, .cmp li, .cmp dd { font-size: 15px; line-height: 1.6; }
[dir="rtl"] .cmp p, [dir="rtl"] .cmp li, [dir="rtl"] .cmp dd { line-height: 1.8; }
@media (min-width: 700px) { footer { grid-template-columns: repeat(2, minmax(0, 1fr)); } footer nav { grid-column: 1 / -1; } }
.lg-top { padding: 12px var(--g); }
.lg-top .lg-logo { width: 48px; }
.legal .lang { min-height: 44px; font-size: 14px; }
.lg-main { width: auto; margin: 0 var(--g); padding: 36px 0 56px; }
.legal h1 { font-size: clamp(28px, 8vw, 32px); line-height: var(--lh-h2); margin-top: 20px; }
.lg-date { font-size: var(--t-small); }
.legal h2 { font-size: 20px; line-height: 1.25; margin: 36px 0 10px; }
[dir="rtl"] .legal h2 { line-height: 1.4; }
.lg-main p, .lg-main li { font-size: 16px; line-height: 1.65; }
[dir="rtl"] .lg-main p, [dir="rtl"] .lg-main li { line-height: 1.8; }
.lg-foot { font-size: var(--t-small); padding: 24px var(--g) 32px; }
@media (min-width: 700px) { .lg-main { max-width: 68ch; margin-inline: auto; } }
@media screen {
.phone .scene { height: auto; }
.phone body::before { content: ""; position: fixed; left: 0; top: 0; z-index: -1; width: 100%; height: 100vh; height: 100lvh; pointer-events: none; background: radial-gradient(130vw 70vh at 78% 18%, rgba(122, 30, 30, .42), transparent 70%); }
.phone .hero-dim { background-color: #754e36; }
.phone .way:nth-child(1) { background-color: #5d5353; }
.phone .way:nth-child(2) { background-color: #5d403e; }
.phone .way:nth-child(3) { background-color: #887469; }
.phone.m-hide .top { transform: translate3d(0, calc(-100% - 44px), 0); }
.phone .top.open nav a { animation: m-in .35s var(--ease) both; }
.phone .top.open nav a:nth-child(2) { animation-delay: 30ms; }
.phone .top.open nav a:nth-child(3) { animation-delay: 60ms; }
.phone .top.open nav a:nth-child(4) { animation-delay: 90ms; }
.phone .top.open nav a:nth-child(5) { animation-delay: 120ms; }
.phone .top.open nav a:nth-child(6) { animation-delay: 150ms; }
.phone .top.open nav a:nth-child(7) { animation-delay: 180ms; }
.phone .scene.hero { height: 162vh; height: calc(100lvh + 62svh); }
.phone .hero .pin { position: sticky; top: 0; height: 100vh; height: 100lvh; overflow: hidden; overflow: clip; }
.phone .hero-window { display: none; }
.phone .hero.m-veiled:not(.m-flat) .hero-dim::after { display: none; }
.m-veil { position: absolute; left: 0; top: 0; overflow: visible; pointer-events: none; transform-origin: 0 0; will-change: transform; }
.m-veil path { fill: rgba(35, 31, 32, .86); }
.phone .hero.m-open .m-veil { visibility: hidden; }
.phone .hero-copy.first { inset: auto var(--g) 9vh var(--g); inset: auto var(--g) calc(100lvh - 100svh + 9svh) var(--g); max-width: none; opacity: calc(1 - var(--p) * 3.4); will-change: opacity, transform; }
[dir="rtl"].phone .hero-copy.first { inset: auto var(--g) 9vh var(--g); inset: auto var(--g) calc(100lvh - 100svh + 9svh) var(--g); }
.phone .hero-copy.first em { text-decoration: none; background: linear-gradient(var(--red), var(--red)) left 100% / 0 .08em no-repeat; padding-bottom: .06em; -webkit-box-decoration-break: clone; box-decoration-break: clone; animation: m-draw .9s var(--ease) .35s forwards; }
.phone .hint::after { display: inline-block; content: "↓"; content: "↓" / ""; margin-inline-start: .35em; animation: m-bob 1.6s ease-in-out infinite; }
.phone .hero.m-moved .hint::after { animation-play-state: paused; }
.phone .hero-copy.second { inset: auto var(--g) 9vh var(--g); inset: auto var(--g) calc(100lvh - 100svh + 9svh) var(--g); display: block; text-align: start; padding: 0; opacity: clamp(0, calc((var(--p) - .7) * 5), 1); will-change: opacity, transform; }
.phone .hero-copy.second::before { inset: -70vh calc(var(--g) * -1) -9vh; inset: -70svh calc(var(--g) * -1) calc(-9svh - 100lvh + 100svh); background: linear-gradient(rgba(35, 31, 32, 0), rgba(35, 31, 32, .55) 35%, rgba(35, 31, 32, .88)); }
.phone .hero-copy.second em { text-decoration: none; background: linear-gradient(var(--red), var(--red)) left 100% / calc(clamp(0, calc((var(--p) - .74) * 5), 1) * 100%) .08em no-repeat; padding-bottom: .06em; }
[dir="rtl"].phone .hero-copy em { background-position: right 0 bottom .12em; }
.phone .scene.hero.m-flat { height: auto; }
.phone .hero.m-flat .pin { position: relative; height: auto; min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; justify-content: flex-end; gap: 40px; padding: 120px var(--g) 56px; }
.phone .hero.m-flat .hero-copy { position: relative; inset: auto; opacity: 1; translate: none; }
.phone .hero.m-flat .hero-copy.second::before, .phone .hero.m-flat .m-veil, .phone .hero.m-flat .hint { display: none; }
.phone .hero.m-flat .hero-copy.second em { background-size: 100% .08em; }
.phone .m-weave { transition: opacity .8s var(--ease), background-position .9s var(--ease); }
.phone .m-weave:not(.in) { opacity: 0; background-position: calc(50% - 40px) center; }
[dir="rtl"].phone .m-weave:not(.in) { background-position: calc(50% + 40px) center; }
.phone .m-rise { transition: opacity .6s var(--ease), translate .7s var(--ease); }
.phone .m-rise:not(.in) { opacity: 0; translate: 0 24px; }
.phone .m-side { transition: opacity .6s var(--ease); }
.phone .m-side > * { transition: translate .7s var(--ease); }
.phone .m-side:not(.in) { opacity: 0; }
.phone .m-side:not(.in) > * { translate: 32px 0; }
[dir="rtl"].phone .m-side:not(.in) > * { translate: -32px 0; }
.phone .m-side:nth-child(2), .phone .m-side:nth-child(2) > * { transition-delay: 80ms; }
.phone .m-side:nth-child(3), .phone .m-side:nth-child(3) > * { transition-delay: 160ms; }
.phone .m-side:nth-child(4), .phone .m-side:nth-child(4) > * { transition-delay: 240ms; }
.phone .m-side:nth-child(5), .phone .m-side:nth-child(5) > * { transition-delay: 320ms; }
.phone .facts .pin { position: relative; height: auto; display: block; overflow: visible; padding: 44px var(--g) 36px; }
.phone .facts-copy .facts-title { transform: none; }
.phone .fc-rest > * { opacity: 1; transform: none; }
.phone .lt-list .nw { opacity: 0; translate: 0 18px; }
.phone .latest.in .nw { opacity: 1; translate: 0 0; }
.phone .lt-head em { text-decoration: none; background: linear-gradient(var(--red), var(--red)) left 100% / 100% .08em no-repeat; padding-bottom: .06em; transition: background-size .9s var(--ease) .25s; }
.phone .lt-head.m-rise:not(.in) em { background-size: 0 .08em; }
[dir="rtl"].phone .lt-head em { background-position: right 0 bottom .12em; }
.phone .rail .pin { position: relative; height: auto; min-height: 0; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-start; padding: 64px 0 48px; }
.phone .sky-bg { inset: -2% -30% -2% -2%; translate: none; background: linear-gradient(180deg, rgba(35, 31, 32, .78), rgba(35, 31, 32, .55) 45%, rgba(35, 31, 32, .86)), var(--sky, none) center / cover no-repeat; background-color: #431f23; }
[dir="rtl"].phone .sky-bg { inset: -2% -2% -2% -30%; }
.phone .rail .panel.intro { width: auto; padding: 0 var(--g) 28px; justify-content: flex-start; }
.phone .rail .panel.intro h2 { max-width: 14ch; }
.phone .rail .track {
  display: flex; align-items: flex-start; gap: 12px;
  width: auto; transform: none !important; will-change: auto;
  overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: var(--g);
  padding-inline: var(--g) 0; scrollbar-width: none;
}
.phone .rail .track::-webkit-scrollbar { display: none; }
.phone .rail .track::after { content: ""; flex: 0 0 calc(var(--g) - 12px); }
.phone .rail .track > .panel { flex: 0 0 var(--panel); }
.phone .rail .track > .panel.intro { scroll-snap-align: start; }
.phone .rail .panel.screen.solo { width: auto; height: auto; display: block; scroll-snap-align: start; }
.phone .rail .solo .txt { padding: 0; gap: 14px; justify-content: flex-start; }
.phone .rail .pin::after { content: ""; position: relative; z-index: 1; display: block; height: 2px; margin: 28px var(--g) 0; background: linear-gradient(var(--red), var(--red)) var(--bx, 0%) 0 / var(--bw, 0%) 100% no-repeat, rgba(255, 255, 255, .18); }
.phone .swap .pin, .phone .culture .pin { position: relative; display: flex; flex-direction: column; align-items: stretch; height: auto; overflow: visible; padding: 56px var(--g) 48px; }
.phone .swap .pin > div:not(.swap-shot), .phone .culture .ps { display: contents; }
.phone .swap h2, .phone .culture .ps h2 { order: 0; }
.phone .swap .swap-shot, .phone .culture .eye { order: 1; }
.phone .swap ol, .phone .culture .ps ol { order: 2; }
.phone .swap .swap-shot { position: relative; top: auto; display: block; flex: none; width: var(--shot); height: auto; aspect-ratio: 32.9 / 36.3; margin: 0 auto 36px; translate: none; }
.phone .swap-shot.m-pics i:nth-child(1) { background-image: url("/assets/palms-1200.jpg"); background-image: image-set(url("/assets/phone/palms-m.avif") type("image/avif"), url("/assets/palms-1200.jpg") type("image/jpeg")); }
.phone .swap-shot.m-pics i:nth-child(2) { background-image: url("/assets/road.jpg"); background-image: image-set(url("/assets/phone/road-m.avif") type("image/avif"), url("/assets/road.jpg") type("image/jpeg")); }
.phone .swap-shot.m-pics i:nth-child(3) { background-image: url("/assets/kafd.jpg"); background-image: image-set(url("/assets/phone/kafd-m.avif") type("image/avif"), url("/assets/kafd.jpg") type("image/jpeg")); }
.phone .swap-shot i { inset: -12px 0; translate: 0 calc((var(--q, .5) - .5) * -18px); }
.phone .swap-shot i:nth-child(1) { background-color: #5d403e; }
.phone .swap-shot i:nth-child(2) { background-color: #715659; }
.phone .swap-shot i:nth-child(3) { background-color: #b7bbba; }
.phone .swap h2 { margin-bottom: 28px; }
.phone .swap li { opacity: .6; }
.phone .swap li.on { opacity: 1; }
.phone .swap li h3 { line-height: var(--lh-h3); }
.phone .swap li p { max-height: none; overflow: visible; margin-top: 8px; }
.phone .culture .eye { position: relative; top: auto; flex: none; width: var(--eye); margin: calc(var(--eye) * .15 + 28px) auto calc(var(--eye) * .15 + 24px); translate: none; }
.phone .eye::after { rotate: calc(45deg + var(--q, 0) * 90deg); }
.phone .eye-in { background-color: #673e38; }
.phone .eye-in img { translate: none; }
.phone .ps h2 { max-width: 14ch; }
.phone .culture .ps ol { margin-top: 0; }
.phone .ps li { padding: 10px 0; opacity: .6; }
.phone .ps li.on { opacity: 1; }
.phone .ps li b { width: fit-content; padding-bottom: 4px; background: linear-gradient(var(--red), var(--red)) left 100% / 0 2px no-repeat; transition: background-size .5s var(--ease); }
[dir="rtl"].phone .ps li b { background-position: right 100%; }
.phone .ps li.on b { background-size: 100% 2px; }
.phone .ps li span { max-height: none; overflow: visible; margin-top: 6px; }
.phone #portfolio .inner::after, .phone #team .inner::after, .phone .m-bar { content: ""; display: block; height: 2px; margin-top: 20px; background: linear-gradient(var(--red), var(--red)) var(--bx, 0%) 0 / var(--bw, 0%) 100% no-repeat, rgba(255, 255, 255, .18); }
.phone .m-zoom img { transition: scale 1.6s var(--ease); }
.phone .m-zoom:not(.in) img { scale: 1.08; }
.phone .reg:not([hidden]) { animation: m-up .45s var(--ease) both; }
@media (orientation: landscape) and (max-height: 500px) {
  .phone .hero-copy.first { inset: auto auto calc(100lvh - 100svh + 9svh) var(--g); max-width: 52vw; }
  [dir="rtl"].phone .hero-copy.first { inset: auto var(--g) calc(100lvh - 100svh + 9svh) auto; }
  .phone .hero-copy.second h2, .phone .hero-copy.second p { max-width: 60vw; }
}
@keyframes m-in { from { opacity: 0; translate: 0 8px; } }
@keyframes m-up { from { opacity: 0; translate: 0 16px; } }
@keyframes m-draw { to { background-size: 100% .08em; } }
@keyframes m-bob { 50% { translate: 0 4px; } }
}
@media (hover: hover) and (pointer: fine) {
  .cards, .people, .ways, .phone .rail .track { scrollbar-width: thin; scrollbar-color: var(--red) transparent; }
  .cards::-webkit-scrollbar, .people::-webkit-scrollbar, .ways::-webkit-scrollbar, .phone .rail .track::-webkit-scrollbar { display: block; height: 6px; }
  .cards::-webkit-scrollbar-thumb, .people::-webkit-scrollbar-thumb, .ways::-webkit-scrollbar-thumb, .phone .rail .track::-webkit-scrollbar-thumb { background: var(--red); }
}