@font-face {
  font-family: "Cairo";
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url("assets/fonts/Cairo-Arabic.woff2") format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FEFC, U+1EE00-1EEFF;
}

@font-face {
  font-family: "Cairo";
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url("assets/fonts/Cairo-Latin-Ext.woff2") format("woff2");
  unicode-range: U+0100-02FF, U+1D00-1DBF, U+1E00-1EFF, U+20A0-20CF, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "Cairo";
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url("assets/fonts/Cairo-Latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+2000-206F, U+20AC, U+2122, U+2190-2215, U+FEFF, U+FFFD;
}

:root {
  color-scheme: light;
  --red: #f0000c;
  --red-bright: #ff101c;
  --red-deep: #c5000a;
  --bg: #ffffff;
  --bg-rgb: 255,255,255;
  --surface: #f7f7f7;
  --text: #151515;
  --muted: #686868;
  --border: #dddddd;
  --soft-red: rgba(240,0,12,.08);
  --header-bg: rgba(255,255,255,.82);
  --shadow: 0 24px 70px rgba(0,0,0,.09);
  --service-card-bg: #ffffff;
  --service-card-hover: #fff7f8;
  --service-card-border: #e3e3e3;
  --service-spot: rgba(240,0,12,.22);
  --service-hover-border: rgba(240,0,12,.52);
  --service-hover-shadow: 0 26px 62px rgba(122,0,7,.14),0 0 0 1px rgba(240,0,12,.08);
  --ease: cubic-bezier(.16,1,.3,1);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #050505;
  --bg-rgb: 5,5,5;
  --surface: #111111;
  --text: #ffffff;
  --muted: #b8b8b8;
  --border: #292929;
  --soft-red: rgba(240,0,12,.11);
  --header-bg: rgba(5,5,5,.82);
  --shadow: 0 24px 70px rgba(0,0,0,.42);
  --service-card-bg: #0d0d0d;
  --service-card-hover: #141011;
  --service-card-border: #2a2a2a;
  --service-spot: rgba(240,0,12,.15);
  --service-hover-border: rgba(240,0,12,.42);
  --service-hover-shadow: 0 28px 68px rgba(0,0,0,.48),0 0 0 1px rgba(240,0,12,.07);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body { margin: 0; min-width: 320px; overflow-x: hidden; background: var(--bg); color: var(--text); font-family: "Cairo", sans-serif; transition: background-color .45s,color .45s; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button,input,select,textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
img { max-width: 100%; }
::selection { color: #fff; background: var(--red); }
.container { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.hero-layout > *,
.about-layout > *,
.services-grid > *,
.contact-layout > *,
.footer-layout > * { min-width: 0; }
.info-row p,.info-row a,.footer-layout a { overflow-wrap: anywhere; }
.theme-image { display: block; width: 100%; height: auto; }
html[data-theme="light"] .image-dark, html[data-theme="dark"] .image-light { display: none; }
.noise { position: fixed; inset: 0; pointer-events: none; z-index: 999; opacity: .025; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E"); }
.scroll-progress { position: fixed; top: 0; right: 0; z-index: 1000; width: 0; height: 2px; background: var(--red); box-shadow: 0 0 16px rgba(240,0,12,.75); }

.site-header { position: fixed; inset: 0 0 auto; z-index: 100; border-bottom: 1px solid transparent; transition: .35s var(--ease); }
.site-header.scrolled { background: var(--header-bg); backdrop-filter: blur(18px); border-color: var(--border); }
.header-inner { width: min(1360px, calc(100% - 48px)); height: 88px; margin-inline: auto; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; transition: height .35s; }
.site-header.scrolled .header-inner { height: 72px; }
.brand-logo { justify-self: start; width: 210px; height: auto; overflow: visible; display: flex; align-items: center; }
.brand-logo img { width: 100%; height: auto; max-width: 100%; margin: 0; object-fit: contain; }
.desktop-nav { display: flex; align-items: center; gap: 34px; font-size: .9rem; font-weight: 700; }
.nav-link { position: relative; color: var(--muted); transition: color .25s; }
.nav-link::after { content: ""; position: absolute; right: 0; bottom: -9px; width: 0; height: 2px; background: var(--red); transition: width .35s var(--ease); }
.nav-link:hover,.nav-link.active { color: var(--text); }
.nav-link.active::after,.nav-link:hover::after { width: 100%; }
.header-actions { justify-self: end; display: flex; gap: 10px; }
.theme-toggle,.menu-toggle { width: 46px; height: 46px; border: 1px solid var(--border); background: var(--surface); display: grid; place-items: center; transition: .3s; }
.theme-toggle:hover,.menu-toggle:hover { border-color: var(--red); color: var(--red); }
.theme-toggle span { grid-area: 1/1; transition: .3s var(--ease); font-size: 1.05rem; }
html[data-theme="light"] .theme-toggle .sun, html[data-theme="dark"] .theme-toggle .moon { opacity: 0; transform: rotate(60deg) scale(.45); }
html[data-theme="light"] .theme-toggle .moon, html[data-theme="dark"] .theme-toggle .sun { opacity: 1; transform: none; }
.menu-toggle { display: none; align-content: center; gap: 7px; }
.menu-toggle span { width: 20px; height: 1px; background: currentColor; transition: .3s; }
.menu-toggle.open span:first-child { transform: translateY(4px) rotate(45deg); }
.menu-toggle.open span:last-child { transform: translateY(-4px) rotate(-45deg); }
.mobile-menu { position: fixed; inset: 0; z-index: 90; min-height: 100vh; min-height: 100dvh; padding: calc(120px + env(safe-area-inset-top)) max(8vw,env(safe-area-inset-right)) calc(40px + env(safe-area-inset-bottom)) max(8vw,env(safe-area-inset-left)); overflow-y: auto; overscroll-behavior: contain; background: var(--bg); display: flex; flex-direction: column; transform: translateY(-102%); transition: .6s var(--ease); }
.mobile-menu.open { transform: none; }
.mobile-menu a { font-size: clamp(2rem,9vw,4rem); font-weight: 900; border-bottom: 1px solid var(--border); padding: 14px 0; }
.contact-dock { position: fixed; z-index: 80; top: 50%; left: max(18px,env(safe-area-inset-left)); display: grid; gap: 8px; transform: translateY(-50%); transition: opacity .3s ease,visibility .3s ease,transform .35s var(--ease); }
.contact-dock a { position: relative; width: 42px; height: 42px; display: grid; place-items: center; color: var(--text); border: 1px solid var(--border); border-radius: 12px; background: var(--header-bg); backdrop-filter: blur(14px); box-shadow: 0 8px 24px rgba(0,0,0,.12); transition: color .25s,background-color .25s,border-color .25s,transform .3s var(--ease),box-shadow .3s; }
.contact-dock svg { display: block; width: 18px; height: 18px; }
.contact-dock a:hover,.contact-dock a:focus-visible { color: #fff; background: var(--red); border-color: var(--red); transform: translateX(3px); box-shadow: 0 10px 30px rgba(240,0,12,.25); outline: none; }
.contact-dock.is-hidden { opacity: 0; visibility: hidden; pointer-events: none; transform: translate(-12px,-50%); }
@media (hover: hover) and (pointer: fine) {
  .contact-dock a::after { content: attr(data-label); position: absolute; top: 50%; left: calc(100% + 9px); padding: 5px 8px; color: var(--text); background: var(--header-bg); border: 1px solid var(--border); border-radius: 7px; box-shadow: 0 8px 22px rgba(0,0,0,.12); white-space: nowrap; font-size: .68rem; font-weight: 700; opacity: 0; visibility: hidden; transform: translate(-5px,-50%); transition: opacity .22s,visibility .22s,transform .25s var(--ease); }
  .contact-dock a:hover::after,.contact-dock a:focus-visible::after { opacity: 1; visibility: visible; transform: translate(0,-50%); }
}

.hero { position: relative; min-height: 100svh; overflow: hidden; display: grid; align-items: center; isolation: isolate; padding: 130px 0 105px; }
#networkCanvas { position: absolute; inset: 0; z-index: -4; width: 100%; height: 100%; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -3; background: radial-gradient(circle at 24% 45%,var(--soft-red),transparent 32%),linear-gradient(90deg,rgba(var(--bg-rgb),.35),rgba(var(--bg-rgb),.9) 70%); }
.hero-grid-bg { position: absolute; inset: 0; z-index: -2; background-image: linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px); background-size: 74px 74px; opacity: .22; mask-image: linear-gradient(to bottom,black 10%,transparent 95%); }
.hero-layout { display: grid; grid-template-columns: 1.08fr .92fr; align-items: center; gap: 48px; }
.hero-content { position: relative; z-index: 3; }
.eyebrow { display: flex; align-items: center; gap: 12px; color: var(--muted); font-size: .78rem; font-weight: 700; letter-spacing: .02em; margin: 0 0 24px; }
.eyebrow span { width: 36px; height: 2px; background: var(--red); box-shadow: 0 0 12px rgba(240,0,12,.6); }
.hero-title { margin: 0; font-size: clamp(3.7rem,6.4vw,6.9rem); line-height: 1.04; letter-spacing: 0; word-spacing: .04em; font-weight: 900; }
.title-line { display: block; overflow: hidden; padding-bottom: .08em; }
.title-line > span { display: block; transform: translateY(115%); animation: titleIn 1.05s var(--ease) .2s forwards; }
.title-line:nth-child(2) > span { animation-delay: .34s; }
.title-line.accent { color: var(--red); }
.title-line.accent > span { line-height: 1.2; padding-bottom: .12em; }
@keyframes titleIn { to { transform: translateY(0); } }
.hero-description { max-width: 680px; margin: 28px 0 34px; color: var(--muted); font-size: 1.08rem; line-height: 2; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; }
.button { min-height: 56px; border: 1px solid transparent; padding: 0 25px; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; transition: .35s var(--ease); }
.button-primary { color: #fff; background: var(--red); box-shadow: 0 14px 45px rgba(240,0,12,.2); }
.button-primary:hover { background: var(--red-bright); transform: translateY(-3px); box-shadow: 0 18px 55px rgba(240,0,12,.32); }
.button-secondary { border-color: var(--border); background: rgba(var(--bg-rgb),.45); backdrop-filter: blur(9px); }
.button-secondary:hover { border-color: var(--red); color: var(--red); }
.hero-stats { position: relative; display: grid; grid-template-columns: repeat(4,1fr); height: 74.90625px; margin-top: 52px; border-top: 1px solid var(--border); padding-top: 22px; box-sizing: border-box; }
.hero-stats .process-step { position: relative; min-width: 0; display: grid; align-content: center; justify-items: center; gap: 4px; padding: 0 12px; }
.hero-stats .process-step::before { content: ""; position: absolute; z-index: 1; top: -23px; left: 50%; width: 7px; height: 7px; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 4px rgb(var(--bg-rgb)),0 0 14px rgba(240,0,12,.48); transform: translate(-50%,-50%); transition: transform .4s var(--ease),box-shadow .4s var(--ease),background-color .3s; }
.hero-stats .process-number { direction: ltr; color: var(--red); font-size: .62rem; font-weight: 800; line-height: 1; letter-spacing: .09em; transition: color .3s,text-shadow .35s var(--ease),transform .35s var(--ease); }
.hero-stats .process-step strong { color: var(--text); font-size: .98rem; font-weight: 800; line-height: 1.35; white-space: nowrap; transition: color .3s,transform .35s var(--ease); }
.hero-stats .process-note { position: absolute; top: -8px; right: 0; transform: translateY(-100%); margin: 0; display: inline-flex; align-items: center; gap: 7px; color: var(--text); font-size: .68rem; font-weight: 700; line-height: 1; }
.hero-stats .process-note::before { content: ""; width: 12px; height: 1px; flex: 0 0 auto; background: var(--red); }
@media (hover: hover) and (pointer: fine) {
  .hero-stats .process-step:hover .process-number { color: var(--red-bright); text-shadow: 0 0 16px rgba(240,0,12,.5); transform: translateY(-1px); }
  .hero-stats .process-step:hover strong { transform: translateY(-1px); }
  .hero-stats .process-step:hover::before { background: var(--red-bright); box-shadow: 0 0 0 4px rgb(var(--bg-rgb)),0 0 22px rgba(240,0,12,.72); transform: translate(-50%,-50%) scale(1.35); }
}
.hero-engine { width: min(42vw,570px); aspect-ratio: 1; position: relative; justify-self: center; display: grid; place-items: center; transform-style: preserve-3d; transition: transform .25s; }
.engine-glow { position: absolute; inset: 27%; border-radius: 50%; background: rgba(240,0,12,.22); filter: blur(40px); animation: breathe 4s ease-in-out infinite; }
html[data-theme="light"] .engine-glow { inset: 25%; background: rgba(240,0,12,.34); filter: blur(34px); animation: lightCoreGlow 3.6s ease-in-out infinite; }
@keyframes breathe { 50% { transform: scale(1.25); opacity: .5; } }
@keyframes lightCoreGlow {
  0%,100% { transform: scale(.92); opacity: .68; box-shadow: 0 0 42px rgba(240,0,12,.32),0 0 85px rgba(240,0,12,.16); }
  50% { transform: scale(1.28); opacity: 1; box-shadow: 0 0 72px rgba(240,0,12,.52),0 0 145px rgba(240,0,12,.28); }
}
.orbit { position: absolute; border: 1px solid var(--border); border-radius: 50%; animation: spin 22s linear infinite; }
.orbit::before { content: ""; position: absolute; inset: -2px; border-radius: 50%; border-top: 2px solid var(--red); border-right: 2px solid transparent; }
.orbit-outer { inset: 5%; }.orbit-inner { inset: 20%; animation-direction: reverse; animation-duration: 14s; border-style: dashed; }
@keyframes spin { to { transform: rotate(360deg); } }
.click-core { width: 245px; border: 0; padding: 0; background: transparent; position: relative; z-index: 3; filter: drop-shadow(0 20px 25px rgba(0,0,0,.2)) drop-shadow(0 0 25px rgba(240,0,12,.28)); transition: .4s var(--ease); }
html[data-theme="light"] .click-core { filter: drop-shadow(0 18px 24px rgba(110,0,6,.2)) drop-shadow(0 0 38px rgba(240,0,12,.48)); }
.click-core .theme-image { animation: coreFloat 4.6s ease-in-out infinite; }
.click-core .image-light { mix-blend-mode: multiply; }
.click-core .image-dark { mix-blend-mode: screen; }
.click-core:hover { transform: scale(1.045); filter: drop-shadow(0 25px 30px rgba(0,0,0,.25)) drop-shadow(0 0 42px rgba(240,0,12,.5)); }
.click-core.pulse { animation: brandPulse .85s var(--ease); }
@keyframes brandPulse { 35% { transform: scale(.86); } 62% { transform: scale(1.15); filter: drop-shadow(0 0 65px rgba(240,0,12,.8)); } }
@keyframes coreFloat { 50% { transform: translateY(-12px) rotate(-2deg); } }
.engine-card { position: absolute; min-width: 138px; padding: 13px 15px; border: 1px solid var(--border); background: rgba(var(--bg-rgb),.74); backdrop-filter: blur(12px); box-shadow: var(--shadow); display: grid; gap: 3px; }
.engine-card span { color: var(--muted); font-size: .65rem; }.engine-card strong { direction: ltr; text-align: right; font-size: 1.15rem; }
.engine-card-a { top: 17%; left: 0; animation: float 4.5s ease-in-out infinite; }.engine-card-b { bottom: 15%; right: -2%; animation: float 5.1s ease-in-out infinite reverse; }
@keyframes float { 50% { transform: translateY(-13px); } }
.hero-bottom { position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; color: var(--muted); font-size: .72rem; }
.online { display: flex; align-items: center; gap: 9px; }.online i { width: 7px; height: 7px; background: var(--red); border-radius: 50%; box-shadow: 0 0 12px var(--red); animation: blink 1.7s infinite; }
@keyframes blink { 50% { opacity: .28; } }

.section { padding: 125px 0; background: var(--bg); }
.section-heading { max-width: 920px; margin-bottom: 72px; }
.section-label { display: inline-flex; align-items: center; gap: 10px; color: var(--red); font-weight: 800; font-size: .85rem; margin-bottom: 19px; }
.section-label::before { content: ""; width: 28px; height: 2px; background: currentColor; }
.section-heading h2 { margin: 0; font-size: clamp(2.7rem,5.35vw,5.8rem); line-height: 1.15; letter-spacing: 0; word-spacing: .035em; }
.section-heading h2 em { color: var(--red); font-style: normal; }
.section-heading > p { max-width: 680px; color: var(--muted); line-height: 2; margin: 25px 0 0; }

.about { background: var(--surface); }
.about-layout { display: grid; grid-template-columns: 1.1fr .9fr; gap: 65px; align-items: stretch; }
.about-copy > p { margin: 0 0 20px; color: var(--muted); font-size: 1.04rem; line-height: 2.1; }
.values-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 42px; }
.value-card,.vision-card { --spot-x: 50%; --spot-y: 50%; position: relative; overflow: hidden; isolation: isolate; border: 1px solid var(--service-card-border); border-radius: 24px; background: var(--service-card-bg); box-shadow: 0 10px 34px rgba(0,0,0,.035); transition: transform .55s var(--ease),background-color .45s,border-color .45s,box-shadow .55s var(--ease); }
.value-card { display: flex; gap: 18px; padding: 22px; }
.value-card::before,.vision-card::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: radial-gradient(430px circle at var(--spot-x) var(--spot-y),var(--service-spot),transparent 58%); opacity: 0; transition: opacity .45s ease; }
.value-card::after,.vision-card::after { content: ""; position: absolute; z-index: 2; top: 0; right: 10%; left: 10%; height: 3px; border-radius: 0 0 999px 999px; pointer-events: none; background: linear-gradient(90deg,transparent,var(--red-bright),transparent); box-shadow: 0 4px 18px rgba(240,0,12,.24); transform: scaleX(0); transform-origin: center; transition: transform .65s var(--ease); }
.value-card > *,.vision-card > h3,.vision-card > p { position: relative; z-index: 1; }
.value-number { color: var(--red); font-size: .7rem; font-weight: 800; transition: letter-spacing .5s var(--ease); }.value-card h3 { margin: 0 0 7px; font-size: 1rem; }.value-card p { margin: 0; color: var(--muted); font-size: .82rem; line-height: 1.7; }
.vision-card { min-height: 390px; padding: 42px; display: flex; flex-direction: column; justify-content: flex-end; }
.vision-index { position: absolute; top: 30px; right: 32px; color: var(--red); font-size: .72rem; font-weight: 800; transition: letter-spacing .5s var(--ease); }
.vision-card h3 { margin: 0 0 15px; font-size: 1.7rem; }.vision-card p { margin: 0; color: var(--muted); line-height: 2; }
.vision-orbit { position: absolute; z-index: 0; width: 270px; height: 270px; left: -55px; top: -70px; border: 1px solid var(--border); border-radius: 50%; }
.vision-orbit::before,.vision-orbit::after { content: ""; position: absolute; border: 1px solid var(--border); border-radius: 50%; }.vision-orbit::before { inset: 35px; }.vision-orbit::after { inset: 82px; background: var(--soft-red); border-color: rgba(240,0,12,.35); box-shadow: 0 0 55px rgba(240,0,12,.18); }.vision-orbit i { position: absolute; top: 50%; left: 50%; width: 10px; height: 10px; background: var(--red); border-radius: 50%; box-shadow: 0 0 18px var(--red); }

.services { background: var(--bg); }
.services-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; align-items: stretch; }
.service-card { --spot-x: 50%; --spot-y: 50%; min-height: 420px; height: 100%; padding: 34px; position: relative; overflow: hidden; isolation: isolate; border: 1px solid var(--service-card-border); border-radius: 24px; background: var(--service-card-bg); display: flex; flex-direction: column; box-shadow: 0 10px 34px rgba(0,0,0,.035); transition: transform .55s var(--ease),background-color .45s,border-color .45s,box-shadow .55s var(--ease); }
.service-card:last-child:nth-child(odd) { grid-column: 1/-1; width: calc((100% - 22px)/2); justify-self: center; }
.service-card::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: radial-gradient(430px circle at var(--spot-x) var(--spot-y),var(--service-spot),transparent 58%); opacity: 0; transition: opacity .45s ease; }
.service-card::after { content: ""; position: absolute; z-index: 2; top: 0; right: 10%; left: 10%; height: 3px; border-radius: 0 0 999px 999px; pointer-events: none; background: linear-gradient(90deg,transparent,var(--red-bright),transparent); box-shadow: 0 4px 18px rgba(240,0,12,.24); transform: scaleX(0); transform-origin: center; transition: transform .65s var(--ease); }
.service-card > * { position: relative; z-index: 1; }
.service-top { position: relative; display: flex; align-items: center; justify-content: center; margin-bottom: 54px; }.service-top b { position: absolute; left: 0; color: var(--muted); font-size: .7rem; transition: color .35s,letter-spacing .5s var(--ease),opacity .35s; }.service-symbol { width: 60px; height: 60px; border: 1px solid var(--border); display: grid; place-items: center; color: var(--red); font-weight: 900; font-size: 1.1rem; transition: transform .55s var(--ease),background-color .4s,color .4s,border-color .4s,box-shadow .45s; }
.service-symbol svg { display: block; width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.service-card h3 { margin: 0 0 18px; font-size: 1.55rem; }.service-card > p { color: var(--muted); line-height: 1.95; margin: 0 0 26px; }.service-card ul { list-style: none; padding: 0; margin: auto 0 0; display: grid; gap: 10px; color: var(--muted); font-size: .83rem; }.service-card li::before { content: "•"; color: var(--red); margin-left: 9px; }

@media (hover: hover) and (pointer: fine) {
  .service-card:hover,.value-card:hover,.vision-card:hover { z-index: 3; transform: translateY(-6px) scale(1.006); background-color: var(--service-card-hover); border-color: var(--service-hover-border); box-shadow: var(--service-hover-shadow); }
  .service-card:hover::before,.value-card:hover::before,.vision-card:hover::before { opacity: 1; }
  .service-card:hover::after,.value-card:hover::after,.vision-card:hover::after { transform: scaleX(1); }
  .service-card:hover .service-symbol { transform: translateY(-4px) rotate(-5deg); color: #fff; background: var(--red); border-color: var(--red); box-shadow: 0 13px 32px rgba(240,0,12,.24); }
  .service-card:hover .service-top b { color: var(--red); letter-spacing: .16em; opacity: .9; }
  .value-card:hover .value-number,.vision-card:hover .vision-index { letter-spacing: .16em; }
}

.contact { background: var(--surface); }
.contact-layout { display: grid; grid-template-columns: .82fr 1.18fr; gap: 24px; align-items: stretch; }
.contact-info,.contact-form { border: 1px solid var(--service-card-border); border-radius: 24px; background: var(--service-card-bg); box-shadow: 0 10px 34px rgba(0,0,0,.035); }
.contact-info { padding: 38px; display: flex; flex-direction: column; justify-content: space-between; gap: 45px; }.contact-kicker { margin: 0 0 25px; color: var(--red); font-weight: 800; }.info-row { display: grid; grid-template-columns: 48px 1fr; gap: 16px; align-items: start; padding: 21px 0; border-bottom: 1px solid var(--border); }.info-row > span { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--border); color: var(--red); font-weight: 900; }.info-row h3 { font-size: .92rem; margin: 0 0 6px; }.info-row p,.info-row a { margin: 0; color: var(--muted); line-height: 1.75; font-size: .84rem; }
.info-row > span svg { display: block; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.social-area > p { color: var(--muted); font-size: .8rem; }.social-area > div { display: flex; direction: ltr; gap: 8px; }.social-area a { width: 40px; height: 40px; border: 1px solid var(--border); display: grid; place-items: center; font-size: .7rem; font-weight: 800; transition: .25s; }.social-area a:hover { background: var(--red); color: #fff; border-color: var(--red); }.social-area svg { display: block; width: 16px; height: 16px; fill: currentColor; }
.contact-form { padding: 38px; display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }.form-honeypot { display: none; }.field { display: grid; gap: 9px; }.field-full { grid-column: 1/-1; }.field label { font-size: .8rem; font-weight: 800; }.field input,.field select,.field textarea { width: 100%; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); padding: 14px 15px; outline: none; transition: .25s; }.field input,.field select { min-height: 52px; }.field textarea { min-height: 140px; resize: vertical; }.field input:focus,.field select:focus,.field textarea:focus { border-color: var(--red); box-shadow: 0 0 0 3px rgba(240,0,12,.08); }.field input::placeholder,.field textarea::placeholder { color: var(--muted); opacity: .65; }.contact-form .button { border-radius: 10px; }.contact-form .button:disabled { cursor: wait; opacity: .72; transform: none; }.form-status { margin: 0; padding: 12px 14px; border: 1px solid transparent; border-radius: 10px; font-size: .82rem; font-weight: 700; line-height: 1.7; text-align: right; }.form-status:empty { display: none; }.form-status::before { content: ''; display: inline-block; width: 6px; height: 6px; margin-left: 8px; border-radius: 50%; background: var(--red); vertical-align: middle; }.form-status.is-success { color: var(--text); border-color: rgba(240,0,12,.3); background: var(--soft-red); }.form-status.is-error { color: var(--red); border-color: rgba(240,0,12,.5); background: rgba(240,0,12,.07); }

.final-cta { min-height: 820px; position: relative; overflow: hidden; display: grid; place-items: center; text-align: center; background: var(--bg); isolation: isolate; }
#ctaCanvas { position: absolute; inset: 0; z-index: -3; width: 100%; height: 100%; }
.final-cta::before { content: ""; position: absolute; inset: 0; z-index: -2; background: radial-gradient(circle,var(--soft-red),rgba(var(--bg-rgb),.94) 64%); }
.cta-brand-bg { position: absolute; inset: 0; z-index: -1; display: grid; place-items: center; opacity: .055; pointer-events: none; }
.cta-brand-bg::before { content: ""; grid-area: 1/1; width: min(540px,64vw); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle,rgba(240,0,12,.9) 0%,rgba(240,0,12,.3) 34%,transparent 70%); filter: blur(34px); opacity: .72; }
html[data-theme="light"] .cta-brand-bg { opacity: .12; filter: contrast(1.08) saturate(1.08); }
.cta-brand-bg img { grid-area: 1/1; position: relative; z-index: 1; width: clamp(280px,80vw,860px); max-width: calc(100vw - 24px); max-height: 90%; height: auto; object-fit: contain; }
.cta-content { display: flex; flex-direction: column; align-items: center; padding: 130px 0; }.cta-content .eyebrow { justify-content: center; }.cta-content h2 { margin: 8px 0 30px; font-size: clamp(3.8rem,8.15vw,8.35rem); line-height: 1.04; letter-spacing: 0; word-spacing: .06em; }.cta-content h2 em { color: var(--red); font-style: normal; background: linear-gradient(105deg,var(--red-deep) 12%,var(--red) 42%,#ff6971 50%,var(--red) 58%,var(--red-deep) 88%); background-size: 220% 100%; background-position: 50% 50%; background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }.cta-content > p:not(.eyebrow) { max-width: 640px; color: var(--muted); line-height: 2; }.button-large { min-height: 66px; padding-inline: 34px; margin-top: 25px; }
.final-cta .reveal { opacity: 1; transform: none; transition: none; }

.site-footer { background: var(--surface); border-top: 1px solid var(--border); padding: 75px 0 25px; }.footer-layout { display: grid; grid-template-columns: 1.55fr repeat(3,1fr); gap: 55px; }.footer-about p { max-width: 360px; color: var(--muted); line-height: 1.9; font-size: .84rem; }.footer-logo { width: 220px; height: auto; overflow: visible; display: flex; align-items: center; }.footer-logo img { width: 100%; height: auto; max-width: 100%; margin: 0; object-fit: contain; }.footer-layout h3 { margin: 0 0 20px; font-size: .9rem; }.footer-layout > div:not(.footer-about) { display: flex; flex-direction: column; gap: 11px; }.footer-layout a { color: var(--muted); font-size: .8rem; transition: .25s; }.footer-layout a:hover { color: var(--red); }.footer-bottom { display: flex; justify-content: space-between; align-items: center; gap: 25px; border-top: 1px solid var(--border); margin-top: 55px; padding-top: 24px; color: var(--muted); font-size: .72rem; }.footer-legal-links { display: none; align-items: center; gap: 16px; }.footer-legal-links a { color: var(--muted); transition: color .25s; }.footer-legal-links a:hover { color: var(--red); }.legal-link:focus-visible,.legal-page a:focus-visible,.legal-page button:focus-visible { outline: 2px solid var(--red); outline-offset: 4px; }

.legal-page .site-header { background: var(--header-bg); backdrop-filter: blur(18px); border-color: var(--border); }.legal-header .header-inner { grid-template-columns: minmax(0,1fr) auto; }.legal-home-link { color: var(--muted); font-size: .8rem; font-weight: 800; transition: color .25s; }.legal-home-link:hover { color: var(--red); }.legal-main { min-height: calc(100vh - 120px); padding: 155px 0 105px; }.legal-content { width: min(860px,calc(100% - 48px)); margin-inline: auto; }.legal-eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 18px; color: var(--muted); font-size: .78rem; font-weight: 800; }.legal-eyebrow::before { content: ""; width: 28px; height: 2px; background: var(--red); }.legal-content h1 { max-width: 760px; margin: 0; overflow-wrap: anywhere; font-size: clamp(2.7rem,7vw,5.8rem); line-height: 1.12; letter-spacing: -.04em; }.legal-intro { max-width: 760px; margin: 28px 0 14px; color: var(--muted); font-size: 1.02rem; line-height: 2; }.legal-updated { margin: 0 0 58px; color: var(--muted); font-size: .75rem; }.legal-section { padding: 32px 0; border-top: 1px solid var(--border); }.legal-section h2 { margin: 0 0 14px; font-size: 1.3rem; }.legal-section p,.legal-section li { color: var(--muted); font-size: .94rem; line-height: 2; }.legal-section p { margin: 0 0 12px; }.legal-section p:last-child { margin-bottom: 0; }.legal-section ul { margin: 0; padding-right: 22px; }.legal-section li + li { margin-top: 5px; }.legal-section a { color: var(--text); font-weight: 800; text-decoration: underline; text-decoration-color: var(--red); text-underline-offset: 4px; }.legal-note { padding: 18px 20px; border-right: 3px solid var(--red); background: var(--soft-red); }.legal-footer { padding-top: 0; }.legal-footer .footer-bottom { margin-top: 0; }.legal-footer-links { display: flex; align-items: center; gap: 16px; }

.reveal { opacity: 1; transform: none; }.js .reveal { opacity: 0; transform: translateY(34px); transition: opacity .85s var(--ease),transform .85s var(--ease); }.js .reveal.visible,.js .final-cta .reveal { opacity: 1; transform: none; }.js .final-cta .reveal { transition: none; }

@media (min-width: 1001px) and (max-height: 820px) {
  .hero { padding-block: 104px 68px; }
  .hero-layout { gap: 36px; }
  .hero-content .eyebrow { margin-bottom: 16px; }
  .hero-title { font-size: clamp(3.3rem,5.4vw,5.85rem); }
  .hero-description { margin-block: 18px 24px; font-size: 1rem; line-height: 1.8; }
  .hero-actions .button { min-height: 52px; padding-inline: 22px; }
  .hero-stats { margin-top: 34px; }
  .hero-engine { width: min(38vw,500px); }
  .hero-bottom { bottom: 16px; }
}

@media (max-width: 1000px) {
  .desktop-nav { display: none; }.menu-toggle { display: grid; }.header-inner { grid-template-columns: 1fr auto; }
  .mobile-menu a { font-size: clamp(1.55rem,4.5vw,2.5rem); line-height: 1.45; }
  .hero-layout { grid-template-columns: 1fr; }.hero-content { max-width: 800px; }.hero-engine { position: absolute; width: 570px; left: -230px; opacity: .48; z-index: 0; }.hero-content { z-index: 2; }.hero::before { background: linear-gradient(90deg,rgba(var(--bg-rgb),.58),rgba(var(--bg-rgb),.95) 68%); }
  .about-layout,.contact-layout { grid-template-columns: 1fr; }.vision-card { min-height: 350px; }.contact-info { min-height: 520px; }
  .footer-layout { grid-template-columns: 1.5fr 1fr 1fr; }.footer-layout > div:last-child { display: none; }.footer-legal-links { display: flex; }
}

@media (max-width: 720px) {
  .container,.header-inner { width: min(100% - 36px,1180px); }.header-inner { height: 72px; }.site-header.scrolled .header-inner { height: 66px; }.brand-logo { width: 158px; }
  .mobile-menu { padding: calc(88px + env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left)); }
  .mobile-menu a { font-size: clamp(1.05rem,4.5vw,1.35rem); line-height: 1.55; padding: 11px 0; }
  .contact-dock { top: auto; bottom: max(16px,env(safe-area-inset-bottom)); left: max(14px,env(safe-area-inset-left)); display: flex; transform: none; }.contact-dock a { width: 44px; height: 44px; }.contact-dock.is-hidden { transform: translateY(12px); }
  .hero { min-height: auto; padding: 104px 0 105px; }.hero-layout { display: block; }.hero-title { font-size: clamp(2.7rem,13vw,5rem); }.hero-description { font-size: .92rem; line-height: 1.95; }.hero-actions .button { flex: 1; min-width: 145px; padding-inline: 15px; }.hero-stats { grid-template-columns: 1fr 1fr; height: 145.8125px; gap: 19px 0; }.hero-engine { position: relative; width: min(92vw,390px); left: auto; top: auto; margin: 44px auto 0; opacity: 1; }.engine-card { display: none; }.click-core { width: min(210px,54vw); }.hero-bottom { bottom: 20px; }.online { display: none; }
  .hero-stats .process-step:nth-of-type(n+3)::after { content: ""; position: absolute; top: -10px; right: 0; left: 0; height: 1px; background: var(--border); }
  .hero-stats .process-step:nth-of-type(n+3)::before { top: -9.5px; }
  .section { padding: 92px 0; }.section-heading { margin-bottom: 48px; }.section-heading h2 { font-size: clamp(2.35rem,11vw,4.3rem); }.section-heading > p { font-size: .9rem; }
  .values-grid { grid-template-columns: 1fr; }.vision-card { padding: 30px; min-height: 330px; }.vision-orbit { transform: scale(.8); transform-origin: top left; }
  .services-grid { grid-template-columns: 1fr; gap: 16px; }.service-card,.service-card:last-child:nth-child(odd) { grid-column: auto; width: 100%; min-height: 370px; padding: 27px; border-radius: 20px; }.service-top { margin-bottom: 36px; }.service-symbol { width: 56px; height: 56px; }.service-symbol svg { width: 27px; height: 27px; }
  .contact-info,.contact-form { padding: 25px; border-radius: 20px; }.contact-info { min-height: auto; }.contact-form { grid-template-columns: 1fr; }.field-full { grid-column: auto; }
  .final-cta { min-height: 670px; }.cta-content h2 { font-size: clamp(2.8rem,14vw,5.5rem); }
  .footer-layout { grid-template-columns: 1fr 1fr; }.footer-about { grid-column: 1/-1; }.footer-bottom { align-items: flex-start; flex-wrap: wrap; }.footer-legal-links { margin-inline-start: auto; }
  .legal-main { padding: 125px 0 82px; }.legal-content h1 { font-size: clamp(2.45rem,11vw,4.4rem); }.legal-updated { margin-bottom: 44px; }.legal-section { padding: 27px 0; }
}

@media (max-width: 430px) {
  .container,.header-inner { width: calc(100% - 28px); }.brand-logo { width: 142px; }.theme-toggle,.menu-toggle { width: 42px; height: 42px; }
  .hero-actions { flex-direction: column; align-items: stretch; }.hero-actions .button { width: 100%; }.hero-stats { height: 134.15625px; }.hero-stats .process-step strong { font-size: .9rem; }.hero-stats .process-number { font-size: .6rem; }.hero-stats .process-note { font-size: .64rem; }.hero-title { font-size: clamp(2.5rem,12.5vw,3.15rem); }
  .section { padding: 76px 0; }.section-heading h2 { font-size: clamp(2.15rem,10.5vw,2.8rem); }.section-heading h2 br,.cta-content h2 br { display: none; }
  .value-card { gap: 13px; padding: 18px; }.value-card,.vision-card,.service-card { border-radius: 20px; }.service-card { min-height: 340px; padding: 22px; }
  .contact-info,.contact-form { padding: 20px; }.info-row { grid-template-columns: 40px minmax(0,1fr); gap: 12px; }.info-row > span { width: 40px; height: 40px; }
  .final-cta { min-height: 600px; }.cta-content { padding: 95px 0; }.cta-content h2 { font-size: clamp(2.55rem,13vw,3.35rem); }
  .footer-layout { grid-template-columns: 1fr; }.footer-about { grid-column: auto; }.footer-layout > div:nth-child(3) { display: none; }.footer-bottom { display: grid; }.footer-legal-links { margin: 0; flex-wrap: wrap; gap: 10px 16px; }
  .legal-home-link { font-size: .7rem; }.legal-main { padding-top: 112px; }.legal-content h1 { font-size: clamp(2rem,9.5vw,2.55rem); }.legal-intro { font-size: .92rem; }.legal-section p,.legal-section li { font-size: .88rem; }
}

@media (max-width: 350px) {
  body { min-width: 280px; }
  .container,.header-inner { width: calc(100% - 24px); }
  .brand-logo { width: 128px; }
  .hero-title { font-size: 2.3rem; }
  .hero-stats .process-step { padding-inline: 10px; }
  .section-heading h2 { font-size: 2rem; }
  .contact-info,.contact-form { padding: 16px; }
}

@media (max-height: 520px) and (max-width: 1000px) {
  .mobile-menu { padding-top: calc(72px + env(safe-area-inset-top)); }
  .mobile-menu a { font-size: 1rem; line-height: 1.35; padding: 7px 0; }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
  .js .reveal { opacity: 1; transform: none; }.title-line > span,.service-card:hover,.value-card:hover,.vision-card:hover { transform: none; }
}