@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css');
/* ExecuteOS — the original light, playful studio identity, evolved. */
:root {
  --ink: #161d2b;
  --muted: #737b8b;
  --blue: #3268f2;
  --purple: #9362e9;
  --line: #edf0f5;
  --surface: #f5f8ff;
  --surface-mid: #f8faff;
  --font: 'Plus Jakarta Sans', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --shadow: 0 18px 42px -18px rgba(37, 56, 99, .17);
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 110px; --nav-offset: 86px; }
.page-start { position: absolute; top: 0; left: 0; width: 1px; height: 1px; overflow: hidden; scroll-margin-top: -110px; }
body { margin: 0; color: var(--ink); font: 400 15px/1.75 var(--font); background: #f7f9ff; -webkit-font-smoothing: antialiased; }
::selection { color: #1c3d9f; background: #dce8ff; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }
img { display: block; max-width: 100%; height: auto; }
h1, h2, h3, p, figure { margin: 0; }
h1, h2, h3 { font-weight: 800; letter-spacing: -.045em; line-height: 1.17; text-wrap: balance; }
h2 { font-size: clamp(31px, 3.7vw, 46px); }
h3 { font-size: 21px; line-height: 1.35; letter-spacing: -.025em; }
h2 span, h1 span:not(.title-period) { background: linear-gradient(110deg, #3268f2 5%, #8f54d9 95%); -webkit-background-clip: text; background-clip: text; color: transparent; }
h2 .brand-os { background: none; -webkit-background-clip: unset; background-clip: unset; -webkit-text-fill-color: #4c83f5; color: #4c83f5; }
p { text-wrap: pretty; }
ul { padding: 0; list-style: none; }
a, button, summary { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid #3268f2; outline-offset: 5px; border-radius: 5px; }
.container { width: min(1184px, calc(100% - 64px)); margin-inline: auto; }
.icon { width: 22px; height: 22px; flex: 0 0 auto; vertical-align: middle; }
.button .icon, .text-link .icon, .floating-contact .icon { display: block; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 54px; padding: 14px 22px; border-radius: 16px; font-size: 13px; line-height: 1.5; font-weight: 700; border: 1px solid transparent; transition: transform .22s, box-shadow .22s, background .22s; }
.button:hover { transform: translateY(-3px); }
.button .icon { width: 17px; height: 17px; }
.button.primary { background: var(--blue); color: white; box-shadow: 0 9px 20px -8px #3268f28c; }
.button.primary:hover { background: #2455d5; box-shadow: 0 13px 25px -9px #3268f2a6; }
.button.white { background: white; color: #394253; border-color: #edf0f5; box-shadow: 0 5px 14px -10px #253b6970; }
.button.dark { color: #fff; background: var(--ink); box-shadow: 0 6px 14px -8px #161d2b99; }
.button.pill { border-radius: 999px; padding-inline: 28px; }
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.centered { text-align: center; justify-content: center; }
.text-link { display: inline-flex; align-items: center; gap: 12px; color: var(--blue); font-size: 13px; font-weight: 700; line-height: 1.5; }
.text-link .icon { width: 17px; height: 17px; transition: transform .2s; }
.text-link:hover .icon:not(.icon-telegram) { transform: translateX(4px); }
.eyebrow { color: var(--blue); font-size: 10px; font-weight: 800; letter-spacing: .14em; line-height: 1.7; margin-bottom: 16px; }
.section { padding-block: 100px; }
.section-heading { max-width: 700px; margin-bottom: 44px; }
.section-heading.centered { margin-inline: auto; }
.section-intro { color: var(--muted); font-size: 15px; line-height: 1.9; margin-top: 21px; max-width: 580px; }
.centered .section-intro { margin-inline: auto; max-width: 530px; }
.icon-tile { display: inline-grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; color: var(--accent, var(--blue)); background: var(--tint, #eaf2ff); flex-shrink: 0; }
.icon-tile .icon { width: 25px; height: 25px; }
.icon-tile.small { width: 38px; height: 38px; border-radius: 12px; }
.icon-tile.small .icon { width: 19px; height: 19px; }
.blue { --accent: #3268f2; --tint: #eaf2ff; }
.purple { --accent: #9861de; --tint: #f1e9ff; }
.orange { --accent: #d38425; --tint: #fff2de; }
.green { --accent: #218360; --tint: #e5f6ed; }
.red { --accent: #d56679; --tint: #fff0f1; }
.skip-link { position: fixed; z-index: 200; left: 20px; top: 10px; background: white; padding: 12px 20px; transform: translateY(-150%); }
.skip-link:focus { transform: none; }

/* Navigation */
.site-header { position: sticky; top: 0; z-index: 60; padding-block: 14px 8px; background: transparent; pointer-events: none; }
.nav { position: relative; pointer-events: auto; max-width: 1060px; margin-inline: auto; min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 8px 8px 8px 24px; border-radius: 999px; background: rgba(255,255,255,.78); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); border: 1px solid #e8ecf580; box-shadow: 0 12px 34px -22px #253b6952; transition: box-shadow .25s, background .25s, border-color .25s; }
.site-header.is-scrolled .nav { background: rgba(255,255,255,.92); border-color: #e5eaf4; box-shadow: 0 16px 40px -20px #253b6966; }
.wordmark { display: inline-flex; align-items: baseline; font-size: 24px; line-height: 1; font-weight: 800; letter-spacing: -.065em; white-space: nowrap; }
.wordmark span { color: #4c83f5; }
.desktop-links { position: absolute; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 4px; }
.desktop-links a { display: inline-flex; align-items: center; padding: 10px 18px; border-radius: 999px; color: #5a6474; font-size: 12px; font-weight: 700; transition: background .2s, color .2s; }
.desktop-links a:hover { background: #f0f4fd; color: var(--ink); }
.desktop-links a[aria-current] { background: #eaf2ff; color: var(--blue); }
.nav-actions { display: flex; align-items: center; gap: 12px; }
.language-switch { position: relative; z-index: 80; pointer-events: auto; }
.language-toggle { display: inline-flex; align-items: center; gap: 7px; min-height: 38px; padding: 0 12px 0 10px; border: 0; border-radius: 999px; background: #f0f3fa; color: #1d2637; font-size: 11px; font-weight: 800; letter-spacing: .02em; }
.language-toggle:hover, .language-switch.is-open .language-toggle { background: #fff; box-shadow: 0 2px 8px -3px #253b6940; }
.language-toggle span { line-height: 1; }
.lang-caret { width: 6px; height: 6px; margin-left: 1px; border-right: 1.6px solid currentColor; border-bottom: 1.6px solid currentColor; transform: rotate(45deg) translateY(-1px); opacity: .5; transition: transform .2s, opacity .2s; }
.language-switch.is-open .lang-caret { transform: rotate(225deg) translateY(-1px); opacity: .8; }
.language-menu { position: absolute; top: calc(100% + 8px); right: 0; min-width: 188px; padding: 6px; border-radius: 16px; background: #fff; border: 1px solid #e8ecf5; box-shadow: 0 18px 40px -18px #1d355a55; }
.language-menu[hidden] { display: none; }
.language-menu a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; color: #3f4a5c; font-size: 13px; font-weight: 600; }
.language-menu a:hover { background: #f0f4fd; color: #1d2637; }
.language-menu a[aria-current] { background: #eaf2ff; color: #1d2637; font-weight: 800; }
.lang-flag { display: block; width: 16px; height: 11px; border-radius: 2px; overflow: hidden; box-shadow: inset 0 0 0 1px #1d263714; flex-shrink: 0; }
.nav-cta { min-height: 46px; padding: 10px 21px; border-radius: 999px; font-size: 11px; }
.nav-cta .icon { width: 14px; height: 14px; }
.menu-button { width: 46px; height: 46px; padding: 10px; border-radius: 999px; border: 1px solid var(--line); background: white; display: none; }
.menu-button span { height: 2px; width: 20px; display: block; background: var(--ink); margin: 5px auto; transition: transform .2s; }
.menu-button[aria-expanded=true] span:first-child { transform: translateY(3.5px) rotate(45deg); }
.menu-button[aria-expanded=true] span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
.mobile-menu { display: none; }

/* First impression: real project, original floating-card language. */
.hero-section { position: relative; overflow: hidden; padding-top: 66px; }
.page-home .hero-section { margin-top: calc(var(--nav-offset) * -1); padding-top: calc(var(--nav-offset) + 66px); }
.hero-wash { position: absolute; inset: 0 0 80px; z-index: -1; background: radial-gradient(ellipse at 8% 8%, #e5efff 0, transparent 42%), radial-gradient(ellipse at 78% 22%, #f0eaff 0, transparent 44%), radial-gradient(ellipse at 92% 58%, #fff6ea 0, transparent 34%); }
.hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; padding-bottom: 58px; min-height: 510px; }
.hero-copy { position: relative; z-index: 2; }
.availability { display: inline-flex; align-items: center; gap: 9px; font-size: 10px; color: #687181; font-weight: 600; padding: 7px 12px; border: 1px solid white; border-radius: 999px; background: #ffffffc2; box-shadow: 0 2px 3px #102b5105; }
.status-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #48b985; box-shadow: 0 0 0 3px #48b98516; flex-shrink: 0; }
.hero-copy h1 { font-size: clamp(44px,4.6vw,62px); line-height: 1.16; margin: 24px 0 20px; letter-spacing: -.06em; }
.hero-description { max-width: 470px; font-size: 15px; line-height: 1.9; color: #788092; }
.hero-note { display: flex; gap: 13px; align-items: center; margin-top: 32px; }
.hero-note p { margin: 0; font-size: 11px; font-weight: 600; letter-spacing: .01em; color: #6a7384; }
.mini-avatars { display: flex; padding-left: 0; }
.mini-avatars i { width: 32px; height: 32px; border: 3px solid white; border-radius: 50%; background: #dfeaff; color: #5483e3; display: grid; place-items: center; }
.mini-avatars i + i { margin-left: -9px; background: #ede3fc; color: #9c70d7; }
.mini-avatars i:last-child { background: #dff3e8; color: #66a182; }
.mini-avatars .icon { width: 14px; height: 14px; }
.hero-art { position: relative; height: 444px; isolation: isolate; }
.art-orbit { position: absolute; border: 1px solid #b7c9f12e; width: 450px; height: 450px; top: -7px; left: 8%; border-radius: 50%; z-index: -1; }
.orbit-two { width: 340px; height: 340px; top: 47px; left: 18%; background: linear-gradient(150deg,#deebff3b,#f7ecfe60); border-color: #fff8; }
.hero-browser { position: absolute; top: 94px; left: 8%; width: 90%; background: white; border-radius: 18px; border: 5px solid white; box-shadow: 0 25px 55px -16px #43476c40, 0 0 0 1px #fff; overflow: hidden; transform: rotate(-3deg); transition: transform .5s; z-index: 2; }
.hero-browser:hover { transform: rotate(-1deg) translateY(-4px); }
.browser-toolbar { height: 35px; display: flex; align-items: center; padding: 0 12px; background: #fafbfe; gap: 15px; border-bottom: 1px solid #eff1f7; }
.browser-toolbar > span { font-size: 8px; color: #98a1b1; font-family: var(--font); flex: 1; text-align: center; }
.browser-toolbar > .icon { color: #a6afbf; width: 12px; height: 12px; }
.browser-dots { display: flex; gap: 4px; }
.browser-dots i { width: 5px; height: 5px; border-radius: 50%; background: #ffb5b2; }
.browser-dots i:nth-child(2) { background: #f5d696; }
.browser-dots i:nth-child(3) { background: #a5dec2; }
.hero-browser > img { width: 100%; }
.hero-browser-foot { display: flex; align-items: center; justify-content: space-between; padding: 12px 15px 9px; }
.hero-browser-foot small { font-size: 7px; font-weight: 700; letter-spacing: .13em; color: #97a0b0; display: block; }
.hero-browser-foot strong { font-size: 13px; display: block; }
.floating-card { position: absolute; padding: 19px; background: rgba(255,255,255,.96); border: 1px solid white; border-radius: 20px; box-shadow: 0 18px 50px -22px #303c6654; z-index: 3; }
.craft-card { top: 0; left: 1%; transform: rotate(-7deg); width: 199px; display: grid; grid-template-columns: 37px 1fr; column-gap: 12px; align-items: center; animation: float-craft 7s ease-in-out infinite; }
.craft-card .icon-tile { width: 38px; height: 38px; border-radius: 12px; }
.craft-card .icon { width: 20px; height: 20px; }
.craft-card strong { font-size: 12px; letter-spacing: -.03em; }
.craft-card div > span { display: block; font-size: 9px; color: #929aa8; }
.tiny-bars { grid-column: 1/-1; padding-top: 13px; }
.tiny-bars i { height: 4px; display: block; border-radius: 5px; background: linear-gradient(to right,#7fa5f1 70%,#f0f3f8 70%); }
.tiny-bars i + i { margin-top: 5px; background: linear-gradient(to right,#c097ef 45%,#f0f3f8 45%); }
.integration-card { bottom: -3px; right: 0; width: 264px; transform: rotate(5deg); animation: float-integration 8s ease-in-out infinite; }
.integration-heading { display: flex; align-items: center; gap: 8px; font-size: 10px; font-weight: 700; margin-bottom: 16px; }
.flow-nodes { display: flex; align-items: flex-start; gap: 7px; }
.flow-nodes > div { text-align: center; }
.flow-icon { width: 40px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: var(--tint); color: var(--accent); }
.flow-icon .icon { width: 18px; height: 18px; }
.flow-nodes small { display: block; font-size: 8px; margin-top: 5px; color: #798494; }
.flow-line { height: 1px; flex: 1; min-width: 12px; margin-top: 19px; background: #dce4ed; }
.spark-decoration { color: #be97ee; position: absolute; top: 35px; right: 20px; transform: rotate(14deg); }
.spark-decoration .icon { width: 33px; height: 33px; stroke-width: 1.3; }
.art-dot { width: 9px; height: 9px; background: #f6d77d; position: absolute; border-radius: 50%; }
.dot-one { top: 13px; left: 58%; }
.dot-two { bottom: 30px; left: 10%; width: 13px; height: 13px; background: #9cc1fc; }
@keyframes float-craft { 0%,100% { transform: translateY(0) rotate(-7deg); } 50% { transform: translateY(-8px) rotate(-5deg); } }
@keyframes float-integration { 0%,100% { transform: translateY(0) rotate(5deg); } 50% { transform: translateY(7px) rotate(3deg); } }
.proof-strip { border-top: 1px solid #e7ebf280; display: flex; align-items: center; gap: 45px; padding: 29px 0 32px; }
.proof-strip > span { max-width: 165px; font-size: 10px; color: #969eac; }
.project-wordmarks { display: flex; align-items: center; justify-content: space-around; flex: 1; gap: 20px; color: #677183; }
.project-wordmarks > a { font-size: 17px; font-weight: 800; letter-spacing: -.03em; opacity: .75; transition: opacity .2s; }
.project-wordmarks > a:hover { opacity: 1; }
.oyun-wordmark { font-style: italic; letter-spacing: -.06em !important; }
.oyun-wordmark span { font-weight: 500; }
.sener-wordmark { text-align: center; letter-spacing: .1em !important; }
.sener-wordmark small { display: block; font-size: 5px; letter-spacing: .15em; line-height: 1; }

/* Clear business needs and colourful, tangible services. */
.problems-section { border-top: none; padding-block: 88px; background: linear-gradient(180deg, #fafbff 0%, #fff 32%, #fff 100%); }
.problem-layout { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: 72px 80px; align-items: start; }
.problem-layout h2 { font-size: 37px; }
.problem-layout .section-intro { font-size: 15px; max-width: 36ch; }
.process-side { padding: 8px 0 0; }
.process-side .eyebrow { margin-bottom: 20px; }
.process-list { display: grid; margin: 0; padding: 0; list-style: none; }
.process-step { display: grid; grid-template-columns: 44px 1fr; gap: 16px; position: relative; padding-bottom: 14px; }
.process-step:last-child { padding-bottom: 0; }
.process-step:not(:last-child)::before { content: ''; position: absolute; left: 21px; top: 44px; bottom: 0; width: 2px; border-radius: 2px; background: linear-gradient(180deg, #c5d6fb 0%, #e7eef8 100%); }
.process-index { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; background: #fff; border: 1px solid #e4ebf7; box-shadow: 0 10px 22px -16px #2a4a8a55; color: var(--blue); font-size: 11px; font-weight: 800; letter-spacing: .06em; z-index: 1; }
.process-step:first-child .process-index { background: var(--blue); color: #fff; border-color: transparent; box-shadow: 0 12px 22px -12px #3268f280; }
.process-copy { background: #fff; border: 1px solid #eef1f6; border-radius: 20px; padding: 16px 20px 18px; box-shadow: 0 14px 32px -24px #1c395b40; }
.process-step h3 { font-size: 17px; letter-spacing: -.035em; }
.process-step p { color: #8a93a2; font-size: 13px; line-height: 1.7; margin-top: 6px; }
.services-section { background: linear-gradient(180deg, #fff 0%, var(--surface) 14%, var(--surface) 86%, #fff 100%); }
.services-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.service-card { padding: 29px; border-radius: 26px; background: white; border: 1px solid #edf0f7; box-shadow: 0 8px 22px -18px #203c6855; display: flex; flex-direction: column; min-height: 308px; position: relative; overflow: hidden; transition: transform .25s,box-shadow .25s,border-color .25s; }
a.service-card:hover { transform: translateY(-6px); border-color: var(--tint); box-shadow: 0 17px 34px -18px #203c6840; }
.card-top { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 27px; }
.card-index { font-size: 10px; font-weight: 700; color: #b7bfca; }
.service-card h3 { font-size: 19px; }
.service-card > p { color: #828a99; font-size: 12px; line-height: 1.85; margin-top: 13px; margin-bottom: 23px; }
.card-bottom { display: flex; justify-content: space-between; align-items: center; color: var(--accent); font-size: 10px; font-weight: 700; margin-top: auto; padding-top: 16px; border-top: 1px solid #f3f4f8; }
.card-bottom .icon { width: 17px; height: 17px; }
.service-invitation { background: linear-gradient(145deg,#edf4ff,#f5f0ff 80%); border-color: #e8ecfc; }
.small-orbit { display: grid; place-items: center; width: 52px; height: 52px; border: 1px solid #d4ddf6; border-radius: 50%; color: #8a7ad8; margin-bottom: 27px; }
.service-invitation h3 { font-size: 24px; }
.service-invitation .text-link { margin-top: auto; font-size: 11px; }
.support-strip { display: flex; align-items: center; gap: 18px; padding: 23px 26px; margin-top: 26px; background: #f0f5ff90; border: 1px solid #e9effa; border-radius: 20px; }
.support-strip strong { font-size: 12px; }
.support-strip p { color: #818a9a; font-size: 11px; }
.support-strip .text-link { margin-left: auto; flex-shrink: 0; font-size: 11px; }

/* Work, with screenshots rather than invented numbers. */
.heading-split { display: grid; grid-template-columns: 1.3fr 1fr; align-items: end; gap: 85px; max-width: none; }
.heading-split .section-intro { margin: 0 0 18px; font-size: 13px; }
.projects-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 25px; }
.project-image { display: block; position: relative; border-radius: 24px; padding: 35px 22px; background: #eff1fb; overflow: hidden; }
.project-tint-1 { background: #fef2f0; }
.project-tint-2 { background: #edf5f3; }
.project-browser { border: 3px solid white; border-radius: 9px; overflow: hidden; background: white; box-shadow: 0 12px 24px -9px #2236533b; transform: rotate(-2deg); transition: transform .4s; }
.project-tint-1 .project-browser { transform: rotate(2deg); }
.project-image:hover .project-browser { transform: rotate(0) translateY(-4px) scale(1.035); }
.project-browser .browser-toolbar { height: 22px; padding: 0 7px; }
.project-browser .browser-toolbar > span { font-size: 6px; }
.project-browser .browser-toolbar .icon { width: 8px; height: 8px; }
.project-browser .browser-dots i { width: 3px; height: 3px; }
.project-browser img { width: 100%; }
.image-arrow { position: absolute; right: 14px; bottom: 14px; width: 31px; height: 31px; border-radius: 50%; display: grid; place-items: center; background: #fff; box-shadow: 0 3px 8px #22365308; }
.image-arrow .icon { width: 14px; height: 14px; }
.project-info { padding: 24px 4px 0; }
.project-category { font-size: 9px; letter-spacing: .035em; color: #89919f; font-weight: 600; }
.project-info h3 { font-size: 19px; display: flex; justify-content: space-between; align-items: center; margin-top: 8px; }
.project-info h3 .icon { width: 17px; height: 17px; color: #a1a8b7; }
.project-info p { color: #8b92a1; font-size: 12px; line-height: 1.85; margin-top: 11px; }

.studio-section { background: radial-gradient(ellipse at 6% 42%, #eaf1ff 0%, transparent 52%), radial-gradient(ellipse at 94% 58%, #f3ecfc 0%, transparent 48%), linear-gradient(180deg, #fff 0%, #fafbfe 45%, #fff 100%); }
.studio-layout { display: grid; grid-template-columns: 1.2fr 1fr; align-items: center; gap: 85px; }
.studio-layout h2 { font-size: 38px; }
.studio-layout .section-intro { font-size: 14px; color: #687386; }
.studio-body { font-size: 13px; line-height: 1.9; color: #9198a5; margin-top: 15px; }
.values-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.value-card { padding: 28px 22px; border-radius: 22px; border: 1px solid #eef1f6; box-shadow: 0 8px 25px -16px #1c395b2e; background: white; }
.value-card:nth-child(even) { transform: translateY(27px); }
.value-card .icon-tile { width: 44px; height: 44px; margin-bottom: 26px; border-radius: 14px; }
.value-card h3 { font-size: 13px; }
.value-card p { font-size: 11px; color: #979eab; margin-top: 8px; }
.quotes-section .section-heading { max-width: none; }
.quotes-section h2 { font-size: 32px; }
.quotes-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; align-items: stretch; }
.quote-card { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: 100%; padding: 28px 30px 24px 34px; border: 1px solid #edf0f5; border-radius: 28px; background: #fff; box-shadow: 0 18px 40px -28px #1d355a33; overflow: hidden; }
.quote-card::before { content: ''; position: absolute; left: 0; top: 20px; bottom: 20px; width: 3px; border-radius: 0 3px 3px 0; background: var(--accent, var(--blue)); }
.quote-card blockquote { margin: 0 0 22px; font-size: 15px; line-height: 1.7; font-weight: 500; color: #3f4a5c; letter-spacing: -.015em; }
.quote-card figcaption { display: flex; align-items: center; gap: 12px; margin-top: auto; }
.quote-avatar { display: grid; place-items: center; background: var(--tint); color: var(--accent); width: 42px; height: 42px; border-radius: 14px; font-size: 12px; font-weight: 800; }
.quote-card figcaption strong { font-size: 13px; display: block; letter-spacing: -.02em; }
.quote-card figcaption small { font-size: 12px; color: #8b93a1; display: block; margin-top: 2px; font-weight: 500; }
.faq-section { background: linear-gradient(180deg, #fff 0%, var(--surface) 18%, var(--surface-mid) 100%); }
.faq-layout { display: grid; grid-template-columns: 1fr 1.5fr; gap: 100px; align-items: start; }
.faq-layout .section-intro { font-size: 13px; margin-bottom: 22px; }
.faq-list details { border-bottom: 1px solid #e8edf5; }
.faq-list summary { list-style: none; cursor: pointer; font-size: 13px; font-weight: 700; display: flex; align-items: center; gap: 14px; padding: 23px 0; line-height: 1.7; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-number { color: #b0b8c6; font-size: 9px; font-weight: 600; }
.plus { display: block; position: relative; margin-left: auto; width: 24px; height: 24px; flex: 0 0 24px; border-radius: 50%; background: #edf3ff; }
.plus::before, .plus::after { position: absolute; content: ''; background: #5f88d5; width: 8px; height: 1px; top: 11.5px; left: 8px; }
.plus::after { transform: rotate(90deg); transition: transform .2s; }
details[open] .plus::after { transform: rotate(0); }
.faq-answer { padding: 0 20px 24px 26px; font-size: 12px; color: #7d889a; line-height: 1.9; }

/* Closing CTA — split like a studio closer, not a centered hero. */
.ready-section { position: relative; padding: 72px 0 64px; background: #fff; }
.ready-layout { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 36px 80px; align-items: center; }
.ready-copy .eyebrow { margin-bottom: 14px; }
.ready-copy h2 { font-size: clamp(32px, 4.2vw, 52px); font-weight: 700; letter-spacing: -.045em; line-height: 1.12; max-width: 16ch; background: linear-gradient(110deg, #3268f2 5%, #8f54d9 95%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ready-copy > p { color: #7b8494; font-size: 15px; line-height: 1.8; margin-top: 16px; max-width: 42ch; }
.ready-copy .ready-note { font-size: 13px; color: #99a1ae; margin-top: 10px; }
.ready-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.tech-strip { border-block: 1px solid #eef2f8; padding: 18px 0; overflow: hidden; color: #b4bcc8; background: #fff; -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%); }
.tech-track { display: flex; width: max-content; animation: tech-scroll 42s linear infinite; }
.tech-group { display: flex; align-items: center; gap: 18px; padding-right: 18px; white-space: nowrap; flex-shrink: 0; }
.tech-group span { font-size: 11px; font-weight: 700; letter-spacing: .16em; }
.tech-group i { font-style: normal; font-size: 10px; color: #d0d5de; }
@keyframes tech-scroll { from { transform: translateX(0); } to { transform: translateX(-25%); } }

.site-footer { position: relative; overflow: hidden; padding: 72px 0 0; background: #fff; border-top: 1px solid #eef2f8; }
.footer-mark { position: absolute; left: 50%; bottom: -0.1em; transform: translateX(-50%); margin: 0; font-size: clamp(120px, 22vw, 280px); font-weight: 800; letter-spacing: -.08em; line-height: .8; color: #f3f5f9; pointer-events: none; user-select: none; white-space: nowrap; }
.footer-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1.3fr repeat(3, minmax(0, 1fr)); gap: 40px 32px; padding-bottom: 72px; }
.footer-brand .wordmark { font-size: 22px; }
.footer-brand p { margin-top: 10px; font-size: 13px; line-height: 1.55; color: #8d95a3; max-width: 24ch; }
.footer-grid nav { display: grid; gap: 10px; align-content: start; }
.footer-grid nav p { font-size: 10px; font-weight: 800; letter-spacing: .16em; color: #a8b0bc; margin-bottom: 6px; }
.footer-grid nav a { font-size: 14px; font-weight: 500; color: #4d5666; line-height: 1.45; }
.footer-grid nav a:hover { color: var(--blue); }
.footer-bar { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 0 28px; border-top: 1px solid #eef2f8; }
.footer-bar p { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: #a8b0bc; }
.back-to-top { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid #e8ecf3; color: #5d6675; background: #fff; }
.back-to-top:hover { color: var(--blue); border-color: #d7e3fb; }
.back-to-top .icon { width: 16px; height: 16px; }
.floating-contact { display: flex; align-items: center; justify-content: center; gap: 9px; position: fixed; right: 22px; bottom: 22px; width: 47px; height: 47px; z-index: 40; border-radius: 50%; background: #3268f2; color: white; box-shadow: 0 8px 22px #3268f23d; border: 3px solid white; }
.floating-contact .icon { width: 18px; height: 18px; }
.floating-contact .icon-telegram { width: 22px; height: 22px; }
.floating-contact span { display: none; }

/* Real, indexable service and project pages. */
.listing-hero, .detail-hero { position: relative; margin-top: calc(var(--nav-offset) * -1); padding: calc(var(--nav-offset) + 70px) 0 80px; background: radial-gradient(ellipse at 0 20%, #eaf2ff, transparent 65%), radial-gradient(ellipse at 90% 40%, #f7f0fd, transparent 60%), linear-gradient(180deg, #f7f9ff 0%, #fff 88%); }
.listing-hero h1 { font-size: clamp(40px,5vw,66px); max-width: 830px; }
.listing-content { padding-top: 20px; background: #fff; }
.breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; font-size: 10px; color: #8f9aab; margin-bottom: 40px; }
.breadcrumbs a:hover { color: var(--blue); }
.breadcrumbs [aria-current] { color: #49576f; }
.detail-hero-grid { display: grid; grid-template-columns: 1.65fr 1fr; gap: 100px; align-items: center; }
.detail-hero h1 { font-size: clamp(36px,4.5vw,58px); }
.title-period { color: var(--blue); }
.detail-description { font-size: 14px; color: #748094; line-height: 2; margin-top: 22px; }
.service-visual { position: relative; padding: 38px; border: 1px solid white; background: #ffffffd9; border-radius: 30px; transform: rotate(4deg); box-shadow: 0 25px 60px -22px #46619b40; }
.service-emblem { width: 90px; height: 90px; border-radius: 25px; background: var(--tint); color: var(--accent); display: grid; place-items: center; margin-bottom: 30px; }
.service-emblem .icon { width: 46px; height: 46px; }
.service-visual-label { font-size: 20px; font-weight: 800; line-height: 1.3; letter-spacing: -.035em; }
.visual-lines { display: grid; gap: 10px; margin-top: 26px; }
.visual-lines i { width: 100%; height: 6px; background: #eef2f8; border-radius: 999px; }
.visual-lines i:first-child { background: var(--accent); opacity: .5; width: 73%; }
.visual-lines i:last-child { width: 48%; }
.service-stamp { position: absolute; right: -18px; bottom: -22px; display: flex; gap: 8px; align-items: center; background: white; padding: 15px 22px; border: 1px solid #edf1f8; box-shadow: var(--shadow); border-radius: 15px; color: #748a82; font-weight: 700; font-size: 11px; transform: rotate(-7deg); }
.service-stamp .icon { color: #319969; width: 16px; height: 16px; }
.detail-body { display: grid; grid-template-columns: 1.8fr 1fr; gap: 85px; align-items: start; }
.article-block { margin-bottom: 50px; }
.article-block h2 { font-size: 29px; margin-bottom: 20px; }
.article-block > p { color: #768396; font-size: 14px; line-height: 2; }
.article-block .eyebrow { font-size: 9px; margin-bottom: 15px; }
.feature-list { display: grid; gap: 12px; margin-top: 22px; }
.feature-list li { display: flex; gap: 13px; padding: 17px 20px; background: var(--surface-mid); border: 1px solid #edf1f9; border-radius: 13px; font-size: 13px; color: #637187; }
.feature-list .icon { width: 17px; height: 17px; color: #3f91a2; margin-top: 4px; }
.delivery-card { position: sticky; top: 115px; border-radius: 26px; padding: 32px; border: 1px solid #e9edf7; background: linear-gradient(140deg, var(--surface), #fff); }
.delivery-card h2 { font-size: 23px; margin-top: 25px; }
.delivery-card li { display: flex; gap: 10px; color: #7d899c; font-size: 12px; padding: 14px 0; border-bottom: 1px solid #eaf0f8; }
.delivery-card li .icon { width: 15px; height: 15px; color: #7fa596; margin-top: 4px; }
.delivery-card .button { width: 100%; margin-top: 15px; font-size: 11px; }
.delivery-card small { display: block; color: #98a3b5; font-size: 10px; line-height: 1.8; margin-top: 16px; text-align: center; }
.related-section { padding-top: 20px; background: linear-gradient(180deg, #fff 0%, var(--surface) 28%, var(--surface-mid) 100%); }
.related-section h2 { font-size: 31px; }
.related-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.related-grid a { display: flex; align-items: center; gap: 16px; border: 1px solid var(--line); padding: 22px; border-radius: 18px; background: white; }
.related-grid a:hover { border-color: #d2dff7; }
.related-grid h3 { font-size: 13px; }
.related-grid a > .icon { width: 15px; height: 15px; margin-left: auto; color: #91a4c5; }
.related-grid .icon-tile { width: 40px; height: 40px; border-radius: 12px; }
.related-grid .icon-tile .icon { width: 20px; height: 20px; }
.related-work-link { margin-top: 24px; }
.project-detail-hero { margin-top: calc(var(--nav-offset) * -1); padding-top: calc(var(--nav-offset) + 45px); background: radial-gradient(ellipse at 12% 0%, #eaf2ff 0%, transparent 55%), radial-gradient(ellipse at 88% 20%, #f5effc 0%, transparent 50%), linear-gradient(180deg, #f7f9ff 0%, #fff 78%); }
.project-detail-hero h1 { font-size: clamp(39px,5vw,65px); }
.project-summary-row { display: flex; align-items: center; justify-content: space-between; gap: 30px; margin-bottom: 50px; }
.project-summary-row .button { flex-shrink: 0; }
.large-project-image { max-width: 1050px; margin-inline: auto; border: 1px solid #e6ebf4; background: #f4f7fc; padding: 10px; border-radius: 25px; overflow: hidden; box-shadow: 0 24px 60px -30px #3a536f45; }
.large-project-image > img { width: 100%; border-radius: 0 0 16px 16px; }
.large-project-image .browser-toolbar { border-radius: 15px 15px 0 0; height: 38px; }
.project-gallery { display: grid; gap: 22px; margin-top: 22px; }
.project-gallery .large-project-image { box-shadow: 0 16px 40px -28px #3a536f38; }
.not-found { padding-block: 140px; }
.not-found h1 { margin-bottom: 24px; }

@media(min-width:1450px) {
  .hero-section { padding-top: 86px; }
  .page-home .hero-section { padding-top: calc(var(--nav-offset) + 86px); }
  .hero-grid { min-height: 535px; }
}
@media(max-width:1100px) {
  .container { width: calc(100% - 48px); }
  .desktop-links { gap: 2px; }
  .desktop-links a { padding: 9px 13px; font-size: 11px; }
  .nav-actions { gap: 10px; }
  .hero-grid { gap: 20px; }
  .hero-copy h1 { font-size: 48px; }
  .hero-copy .actions { gap: 8px; }
  .hero-copy .button { padding-inline: 15px; font-size: 11px; }
  .hero-art { height: 401px; }
  .hero-browser { top: 102px; }
  .integration-card { bottom: -6px; }
  .problem-layout, .studio-layout, .faq-layout { gap: 50px; }
  .service-card { padding: 25px; }
  .service-card h3 { font-size: 17px; }
  .project-image { padding: 31px 16px; }
  .detail-hero-grid { gap: 65px; }
  .detail-body { gap: 45px; }
}
@media(max-width:960px) {
  html { --nav-offset: 74px; }
  .site-header { padding-block: 10px 6px; }
  .nav { min-height: 58px; padding: 6px 6px 6px 18px; }
  .desktop-links, .nav-cta { display: none; }
  .menu-button { display: block; }
  .language-toggle { min-height: 36px; padding: 0 10px 0 8px; }
  .mobile-menu { pointer-events: auto; }
  .mobile-menu.is-open { display: grid; position: absolute; top: calc(100% - 2px); left: 24px; right: 24px; padding: 14px; border: 1px solid #e8ecf5; border-radius: 26px; box-shadow: 0 22px 48px -16px #203c6842; background: rgba(255,255,255,.96); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); gap: 2px; }
  .mobile-menu > a:not(.button) { padding: 13px 16px; font-size: 14px; font-weight: 600; border-radius: 14px; }
  .mobile-menu > a:not(.button):hover, .mobile-menu > a[aria-current]:not(.button) { background: #f0f4fd; color: var(--blue); }
  .ready-layout { grid-template-columns: 1fr; gap: 24px; }
  .ready-copy h2 { max-width: none; }
  .ready-actions { justify-content: flex-start; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
  .mobile-menu .button { margin-top: 10px; border-radius: 999px; }
  .hero-copy h1 { font-size: 42px; }
  .hero-description { font-size: 13px; }
  .hero-copy .actions { flex-direction: column; align-items: flex-start; }
  .hero-copy .button { min-height: 45px; }
  .craft-card { width: 176px; padding: 15px; top: 18px; }
  .hero-browser { top: 125px; }
  .integration-card { width: 235px; padding: 17px; bottom: 2px; }
  .art-orbit { width: 370px; height: 370px; }
  .orbit-two { width: 270px; height: 270px; top: 47px; }
  .service-card { min-height: 310px; }
  .service-card h3 { font-size: 17px; }
  .services-grid { grid-template-columns: repeat(2,1fr); }
  .support-strip { flex-wrap: wrap; }
  .support-strip > div { flex: 1; }
  .support-strip .text-link { width: 100%; margin-left: 56px; }
  .projects-grid { gap: 18px; }
  .project-info h3 { font-size: 16px; }
  .project-info p { font-size: 11px; }
  .studio-layout { gap: 38px; }
  .values-grid { gap: 12px; }
  .value-card { padding: 22px 16px; }
  .faq-layout { gap: 40px; }
  .heading-split { gap: 45px; }
  .tech-group { gap: 25px; padding-right: 25px; }
  .tech-group span { font-size: 17px; }
  .detail-hero-grid { gap: 45px; }
  .service-visual { padding: 27px; }
  .detail-body { gap: 30px; grid-template-columns: 1.4fr 1fr; }
  .delivery-card { padding: 25px; }
  .related-grid { grid-template-columns: 1fr; }
}
@media(max-width:700px) {
  html { scroll-padding-top: 100px; }
  .page-start { scroll-margin-top: -100px; }
  .container { width: calc(100% - 40px); }
  .section { padding-block: 68px; }
  .wordmark { font-size: 23px; }
  .hero-section { padding-top: 34px; }
  .page-home .hero-section { padding-top: calc(var(--nav-offset) + 34px); }
  .hero-grid { grid-template-columns: 1fr; gap: 30px; padding-bottom: 35px; }
  .hero-copy h1 { font-size: clamp(40px,8.8vw,57px); max-width: 560px; margin-top: 20px; }
  .hero-description { font-size: 14px; max-width: 500px; }
  .hero-copy .actions { flex-direction: row; gap: 9px; align-items: stretch; margin-top: 24px; }
  .hero-copy .button { font-size: 11px; padding: 13px 16px; }
  .hero-note { margin-top: 24px; }
  .hero-art { height: 370px; width: min(500px,100%); margin-inline: auto; }
  .hero-browser { top: 82px; width: 89%; left: 5%; }
  .craft-card { top: 0; left: 0; }
  .integration-card { right: 0; bottom: -3px; }
  .art-orbit { left: 10%; width: 320px; height: 320px; }
  .orbit-two { width: 240px; height: 240px; left: 19%; }
  .hero-wash { bottom: 145px; }
  .proof-strip { flex-direction: column; align-items: stretch; gap: 20px; padding: 24px 0; }
  .proof-strip > span { text-align: center; max-width: none; font-size: 9px; }
  .project-wordmarks { justify-content: space-between; gap: 15px; }
  .project-wordmarks > a { font-size: 14px; }
  .problem-layout, .studio-layout, .faq-layout { grid-template-columns: 1fr; gap: 32px; }
  .problem-layout h2 { font-size: 33px; }
  .process-step { padding-bottom: 12px; }
  .process-copy { padding: 14px 16px 16px; }
  .section-heading { margin-bottom: 32px; }
  .section-intro { font-size: 14px; line-height: 1.9; }
  .services-grid { gap: 14px; }
  .service-card { padding: 23px; min-height: 285px; border-radius: 23px; }
  .service-card h3 { font-size: 17px; }
  .service-card > p { font-size: 12px; }
  .service-invitation h3 { font-size: 20px; }
  .support-strip { padding: 21px; align-items: flex-start; }
  .support-strip p { margin-top: 5px; }
  .support-strip .text-link { margin-left: 0; }
  .heading-split { grid-template-columns: 1fr; gap: 20px; }
  .projects-grid { grid-template-columns: 1fr; gap: 35px; }
  .project-image { padding: 30px; }
  .project-info { padding-top: 18px; }
  .project-info h3 { font-size: 20px; }
  .project-info p { font-size: 13px; }
  .studio-layout h2 { font-size: 34px; }
  .values-grid { gap: 16px; margin-bottom: 22px; }
  .value-card { padding: 27px; }
  .value-card h3 { font-size: 14px; }
  .value-card p { font-size: 12px; }
  .value-card:nth-child(even) { transform: translateY(18px); }
  .quotes-section .centered { text-align: left; }
  .quotes-grid { grid-template-columns: 1fr; gap: 16px; }
  .quote-card { padding: 26px 24px 22px 28px; }
  .faq-layout { gap: 24px; }
  .faq-list summary { font-size: 12px; }
  .ready-section { padding-block: 64px 48px; }
  .ready-copy > p { font-size: 13px; }
  .button.pill { padding: 13px 20px; min-height: 49px; font-size: 11px; }
  .floating-contact { right: 14px; bottom: 14px; width: 45px; height: 45px; }
  .listing-hero { padding: calc(var(--nav-offset) + 48px) 0 55px; }
  .listing-content { padding-top: 5px; }
  .detail-hero { padding: calc(var(--nav-offset) + 30px) 0 65px; }
  .breadcrumbs { gap: 9px; font-size: 9px; margin-bottom: 32px; }
  .detail-hero-grid { grid-template-columns: 1fr; gap: 45px; }
  .detail-description { font-size: 14px; }
  .service-visual { width: 280px; margin-inline: auto; }
  .service-emblem { width: 65px; height: 65px; margin-bottom: 20px; }
  .service-emblem .icon { width: 33px; height: 33px; }
  .service-visual-label { font-size: 20px; }
  .detail-body { grid-template-columns: 1fr; }
  .delivery-card { position: static; }
  .article-block { margin-bottom: 35px; }
  .article-block h2 { font-size: 25px; }
  .project-summary-row { flex-direction: column; align-items: flex-start; gap: 22px; }
  .project-summary-row .section-intro { margin-top: 18px; }
  .large-project-image { padding: 5px; border-radius: 17px; }
  .not-found { padding-block: 90px; }
}
@media(max-width:460px) {
  .hero-copy h1 { font-size: 40px; }
  .hero-copy .button { padding-inline: 12px; gap: 8px; font-size: 10.5px; }
  .hero-art { height: 330px; }
  .hero-browser { top: 83px; }
  .hero-browser-foot { padding: 9px 12px 7px; }
  .hero-browser-foot strong { font-size: 11px; }
  .hero-browser-foot small { font-size: 6px; }
  .hero-browser .browser-toolbar { height: 28px; }
  .hero-browser-foot .icon-tile { width: 29px; height: 29px; border-radius: 10px; }
  .craft-card { width: 170px; padding: 13px; }
  .integration-card { width: 208px; padding: 13px; bottom: -5px; }
  .integration-heading { font-size: 9px; margin-bottom: 12px; }
  .flow-icon { width: 35px; height: 32px; border-radius: 10px; }
  .flow-line { margin-top: 15px; }
  .flow-icon .icon { width: 16px; height: 16px; }
  .services-grid { grid-template-columns: 1fr; }
  .service-card { min-height: 255px; padding: 27px; }
  .service-card h3 { font-size: 20px; }
  .service-card > p { font-size: 13px; }
  .card-top { margin-bottom: 22px; }
  .service-invitation { min-height: 265px; }
  .value-card { padding: 22px 18px; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-mark { font-size: 96px; }
}
/* Keep supporting copy readable on the light surfaces. */
.hero-description, .section-intro, .process-step p, .service-card > p,
.support-strip p, .project-info p, .studio-body,
.value-card p, .faq-answer, .ready-copy > p:not(.ready-note),
.detail-description, .article-block > p, .delivery-card li {
  color: #68758a;
}
.project-category, .hero-note,
.footer-bar p, .proof-strip > span, .quotes-grid figcaption small {
  color: #667085;
}
.orange { --accent: #b66d1b; }
.red { --accent: #b84c60; }
.purple { --accent: #8550ca; }

/* Contact page */
.page-contact .listing-hero, .page-legal .listing-hero { text-align: center; }
.page-contact .listing-hero h1, .page-legal .listing-hero h1 { margin-inline: auto; }
.page-contact .listing-hero .section-intro, .page-legal .listing-hero .section-intro { margin-inline: auto; }
.contact-section { padding-top: 30px; }
.contact-layout { display: grid; grid-template-columns: 1.5fr 1fr; gap: 55px; align-items: start; max-width: 1080px; margin-inline: auto; }
.contact-form { position: relative; background: #fff; border: 1px solid var(--line); border-radius: 26px; padding: 34px; display: grid; gap: 20px; box-shadow: 0 14px 34px -26px #253b6960; }
.contact-form label { display: grid; gap: 8px; font-size: 12px; font-weight: 700; color: #394253; }
.contact-form input, .contact-form textarea { width: 100%; border: 1px solid #e2e7f0; border-radius: 14px; padding: 13px 16px; font: inherit; font-size: 14px; color: var(--ink); background: #fafbff; transition: border-color .2s, box-shadow .2s, background .2s; }
.contact-form input::placeholder, .contact-form textarea::placeholder { color: #a8b1c0; }
.contact-form input:focus, .contact-form textarea:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px #3268f21f; background: #fff; }
.contact-form textarea { resize: vertical; min-height: 150px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.contact-form .button { justify-self: start; }
.contact-form > small { color: #98a3b5; font-size: 10px; line-height: 1.8; }
.contact-form > small a { color: var(--blue); font-weight: 700; }
.hp-wrap { position: absolute; left: -9999px; top: 0; width: 1px; height: 1px; overflow: hidden; }
.form-status { display: flex; gap: 10px; align-items: center; border-radius: 14px; padding: 14px 18px; background: #e8f7ee; border: 1px solid #c4e7d2; color: #1e7a44; font-size: 13px; font-weight: 600; }
.form-status .icon { width: 18px; height: 18px; flex-shrink: 0; }
.form-status.error { background: #fdeeee; border-color: #f2cfcf; color: #b4383d; }
.form-status[hidden] { display: none; }
.contact-aside .delivery-card p { color: #7d899c; font-size: 13px; line-height: 1.8; margin-top: 10px; }

/* Legal pages */
.legal-section { padding-top: 30px; }
.legal-article { max-width: 760px; margin-inline: auto; text-align: center; }
.legal-article h2 { font-size: 20px; margin-top: 42px; }
.legal-article h2:first-child { margin-top: 0; }
.legal-article p { color: #68758a; font-size: 14px; line-height: 1.9; margin-top: 14px; }
.legal-updated { font-size: 11px; color: #98a3b5 !important; margin-top: 44px; }

@media (max-width: 900px) {
  .contact-layout { grid-template-columns: 1fr; gap: 30px; }
  .form-grid { grid-template-columns: 1fr; }
  .contact-form { padding: 26px 20px; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

html[dir="rtl"] {
  --font: 'Noto Sans Arabic', 'Plus Jakarta Sans', ui-sans-serif, system-ui, sans-serif;
}
html[dir="rtl"] body { font-family: var(--font); }
html[dir="rtl"] h1, html[dir="rtl"] h2, html[dir="rtl"] h3 { letter-spacing: 0; }
html[dir="rtl"] .wordmark,
html[dir="rtl"] .tech-strip,
html[dir="rtl"] .browser-toolbar,
html[dir="rtl"] .footer-mark,
html[dir="rtl"] .process-index,
html[dir="rtl"] .card-index { direction: ltr; unicode-bidi: isolate; }
html[dir="rtl"] .language-menu { right: auto; left: 0; }
html[dir="rtl"] .mini-avatars i + i { margin-left: 0; margin-right: -9px; }
html[dir="rtl"] .breadcrumbs span { display: inline-block; transform: scaleX(-1); }