/* Controls, cinematic English, motion, and the alternate night palette. */
.brand-mark{background:none!important;object-fit:contain;border-radius:0!important;width:48px;height:48px;filter:drop-shadow(0 1px 1px #00000015)}
.brand-emblem{width:56px;height:56px;flex-shrink:0;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 35% 20%,#263851,#0d1522 75%);border:1px solid #365a8e;box-shadow:inset 0 0 0 3px #ffffff05,0 3px 8px #142b4814}
.brand-emblem .brand-mark{width:50px;height:50px;filter:drop-shadow(0 1px 1px #0006)}
[data-theme=dark] .brand-emblem{background:transparent;border-color:transparent;box-shadow:none}
body,.header{transition:background-color .25s,color .25s}
.display-controls{display:flex;align-items:center;gap:7px;flex-shrink:0}
.display-controls button{width:44px;height:44px;display:grid;place-items:center;background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:50%;font:600 13px var(--font);transition:background .2s,border-color .2s,transform .2s}
.display-controls button:hover{border-color:var(--blue);color:var(--blue);transform:translateY(-2px)}
.sun-icon{display:none}.nav-wrap{gap:20px}.header nav{gap:24px}
.reading-progress{position:fixed;top:0;left:0;height:3px;width:100%;background:var(--blue);transform:scaleX(0);transform-origin:left;z-index:50;pointer-events:none}
.brand-stage{transform:perspective(900px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) rotate(2deg);transition:transform .35s ease-out}
.tag-one{animation:float-one 6s ease-in-out 2;animation-play-state:running}.tag-two{animation:float-two 7s ease-in-out 2}
@keyframes float-one{0%,100%{translate:0 0}50%{translate:0 -9px}}
@keyframes float-two{0%,100%{translate:0 0}50%{translate:0 8px}}
.hero-copy{animation:hero-enter .85s cubic-bezier(.2,.65,.3,1) both}
@keyframes hero-enter{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
.section-heading,.service-card,.work-card,.process-grid article,.erp-copy,.erp-visual,.faq-section,.contact-layout>div,.contact-layout form{transition:opacity .65s ease,translate .65s ease,transform .25s ease,border-color .25s ease,box-shadow .25s ease;transition-delay:var(--reveal-delay,0ms),var(--reveal-delay,0ms),0ms,0ms,0ms}
.reveal-pending{opacity:0;translate:0 25px}
.button{position:relative;overflow:hidden}.button:after{content:'';position:absolute;inset:-40% auto -40% -90%;width:40%;background:linear-gradient(90deg,transparent,#ffffff26,transparent);transform:skewX(-20deg);transition:left .6s;pointer-events:none}.button:hover:after{left:145%}
.service-card:hover .service-icon{transform:rotate(-7deg) scale(1.06)}.service-icon{transition:transform .25s ease}
.work-card:hover .browser-demo{transform:rotate(-3deg) translateY(0)}.browser-demo{transition:transform .5s ease}.work-card:hover .chip{transform:rotate(0deg) scale(1.05)}.chip{transition:transform .5s ease}
html[lang=en]{--font:'Space Grotesk',Arial,sans-serif;--heading:'Cormorant Garamond',Georgia,serif}
html[lang=en] body{font-size:16px;line-height:1.75}html[lang=en] h1{font-size:clamp(58px,6.5vw,94px);line-height:1.04;letter-spacing:-2.5px;font-weight:500;margin-bottom:30px}
html[lang=en] h1 .blue{font-style:italic;font-weight:500;white-space:normal}html[lang=en] h1 .blue:after{bottom:0}
html[lang=en] h2{font-size:58px;line-height:1.08;font-weight:500;letter-spacing:-1.6px}html[lang=en] h2 .muted,html[lang=en] h2 .blue{font-style:italic}
html[lang=en] .hero-description{font-size:16px;line-height:1.9}html[lang=en] .hero-description br{display:none}
html[lang=en] .hero-note{font-size:11px}html[lang=en] .eyebrow{font:500 10px var(--latin);letter-spacing:1.5px;line-height:1.7}
html[lang=en] .header nav{font-size:12px;gap:21px}html[lang=en] .button{font-size:13px;gap:20px}html[lang=en] .text-link{font-size:12px;gap:10px}
html[lang=en] .service-card h3{font-size:30px;line-height:1.12;letter-spacing:-.5px;font-weight:600}html[lang=en] .service-card p{font-size:13px;line-height:1.85}
html[lang=en] .card-link{font-size:12px}html[lang=en] .section-intro{font-size:14px;line-height:1.9}html[lang=en] .erp-copy h2{font-size:49px}html[lang=en] .erp-copy>p:not(.eyebrow){font-size:15px}
html[lang=en] .erp-topics span{font-size:10px}html[lang=en] .art-tag b{font-size:12px}html[lang=en] .art-tag small{font-size:10px}html[lang=en] .hero-art{direction:ltr}
html[lang=en] .product h3{text-align:left}html[lang=en] .product p{font-size:13px}html[lang=en] .product a{font-size:12px}html[lang=en] .work-caption h3{font-size:29px;line-height:1.2;font-weight:600}
html[lang=en] .button>span,html[lang=en] .text-link>span,html[lang=en] .card-link>b,html[lang=en] .product a>span,html[lang=en] .art-tag>span:last-child{display:inline-block;transform:scaleX(-1)}
html[lang=en] .process-grid h3{font-size:30px;line-height:1.2;font-weight:600}html[lang=en] .process-grid p{font-size:14px}html[lang=en] .contact-layout h2{font-size:57px;line-height:1.1}
html[lang=en] .contact-layout>div>p:not(.eyebrow){font-size:15px}html[lang=en] .contact-detail{font-size:16px}html[lang=en] summary{font-size:14px}html[lang=en] details p{font-size:14px}
html[lang=en] .contact-layout .blue{text-underline-offset:7px}html[lang=en] .catalog-note{font-size:11px}html[lang=en] form>small{font-size:11px}html[lang=en] .system-node{font-size:11px}html[lang=en] .erp-visual>small{font-size:10px}
:root[data-theme=dark]{color-scheme:dark;--bg:#0b0e14;--panel:#131923;--line:#293243;--text:#edf2fb;--muted:#a7b3c7;--blue:#8bb5ff}
[data-theme=dark] .header{background:#0b0e14ed}[data-theme=dark] .moon-icon{display:none}[data-theme=dark] .sun-icon{display:block}
[data-theme=dark] .button{background:#185ee8;border-color:#367fff;color:#fff;box-shadow:0 8px 25px #0003}[data-theme=dark] .button:hover{background:#2e73fa}
[data-theme=dark] .hero-description,[data-theme=dark] .hero-note,[data-theme=dark] .art-coordinate{color:#a7b3c7}[data-theme=dark] .mini-line{background:#91b7ff}
[data-theme=dark] .hero-art:before{background:#165bdf}[data-theme=dark] .brand-stage{box-shadow:0 25px 70px #0005;border-color:#2b3545}
[data-theme=dark] .art-tag{background:#161e2c;border-color:#35435a;color:#f2f5ff;box-shadow:0 14px 40px #0005}[data-theme=dark] .art-tag small{color:#b1bed2}[data-theme=dark] .tag-icon{background:#243859;color:#a9caff}[data-theme=dark] .tag-two .tag-icon{background:#2165e8;color:#fff}
[data-theme=dark] .capabilities{background:#124fce}[data-theme=dark] .service-card{background:#121925;border-color:#2a3649}[data-theme=dark] .service-card:hover{border-color:#74a6ff;box-shadow:0 15px 35px #0003}
[data-theme=dark] .service-icon{background:#1b2e4e;color:#a9caff}[data-theme=dark] .card-number{color:#afbdd2}[data-theme=dark] .featured{background:#1657d5;border-color:#367fff}[data-theme=dark] .featured .service-icon{background:#ffffff22;color:white}
[data-theme=dark] .featured .card-number,[data-theme=dark] .featured p{color:#e5edff}[data-theme=dark] .featured .card-link{color:#fff}
[data-theme=dark] .erp-section{background:#070a10}[data-theme=dark] .erp-visual{background:radial-gradient(ellipse,#0d4fc333,transparent 65%)}
[data-theme=dark] .subscriptions-section{background:#0f141e}[data-theme=dark] .product{background:#151d2a;border-color:#2b374b}
[data-theme=dark] .filter{background:#121b2b;color:#b9c7df;border-color:#334159}[data-theme=dark] .filter.active{background:#dae7ff;color:#13264b;border-color:#dae7ff}[data-theme=dark] .catalog-note{color:#a9b8d0}
[data-theme=dark] .process-grid article{border-color:#849bc1}[data-theme=dark] .footer p,[data-theme=dark] .footer>span{color:#aab8cf}
[data-theme=dark] .contact-section{background:#0e2650}[data-theme=dark] .contact-layout form{background:#141e2f;color:#eef3ff;box-shadow:0 20px 50px #0003}
[data-theme=dark] input,[data-theme=dark] textarea,[data-theme=dark] select{background:#0c1423;border-color:#40516d;color:#f2f6ff}[data-theme=dark] input::placeholder,[data-theme=dark] textarea::placeholder{color:#a5b4ca}[data-theme=dark] form>small{color:#afbdd3}
[data-theme=dark] .floating-contact{background:#17243b;border-color:#50698f;color:#eef4ff}[data-theme=dark] .web-art{background:#172640}
@media(max-width:1100px){.header nav{gap:16px}.nav-wrap{gap:15px}.header .brand>span:last-child{font-size:20px}.display-controls button{width:40px;height:44px}.header .button-small{font-size:12px;padding:8px 12px}html[lang=en] .header nav{gap:14px;font-size:11px}html[lang=en] h1{font-size:65px}html[lang=en] h2{font-size:48px}html[lang=en] .hero .actions{gap:17px}}
@media(min-width:761px) and (max-width:1000px){.header nav{gap:12px;font-size:12px}.header .brand small{display:none}.header .brand>span:last-child{font-size:17px}.header .brand-mark{width:34px;height:40px}.nav-wrap{gap:12px}.header .nav-cta{display:none}.display-controls{margin-inline-start:auto}}
@media(max-width:760px){.header .nav-cta{display:none}.header .brand-mark{width:38px;height:42px}.header .brand>span:last-child{font-size:17px}.display-controls{margin-inline-start:auto}.display-controls button{width:42px;height:44px}.menu-toggle{background:var(--bg);color:var(--text);border-color:var(--line)}[data-theme=dark] .header nav{background:#111a29;border-color:#35435a}
  .brand-emblem{width:46px;height:46px}.header .brand-emblem .brand-mark,.brand-emblem .brand-mark{width:42px;height:42px}
  html[lang=en] h1{font-size:clamp(53px,12vw,76px);line-height:1.07;letter-spacing:-1.5px}html[lang=en] h2{font-size:43px;line-height:1.12}html[lang=en] .hero-description{font-size:15px;line-height:1.9}html[lang=en] .hero-description br{display:none}html[lang=en] .hero .actions{gap:20px}html[lang=en] .hero .button{font-size:13px}html[lang=en] .text-link{font-size:12px}html[lang=en] .hero-note{font-size:10px}
  html[lang=en] .erp-copy h2{font-size:41px}html[lang=en] .section-intro{font-size:14px}html[lang=en] .contact-layout h2{font-size:46px}html[lang=en] .service-card h3{font-size:31px}html[lang=en] .service-card p{font-size:14px}html[lang=en] .product h3{font-size:16px}html[lang=en] .product p{font-size:12px}html[lang=en] .product a{font-size:11px}html[lang=en] .filter{font-size:11px;padding-inline:12px}html[lang=en] .art-tag b{font-size:11px}html[lang=en] .art-tag small{font-size:9px}html[lang=en] .process-grid h3{font-size:27px}html[lang=en] .process-grid p{font-size:13px}html[lang=en] .contact-layout form{padding:23px 20px}
}
@media(max-width:370px){.header .brand small{display:none}.header .brand>span:last-child{font-size:15px}.display-controls{gap:4px}.nav-wrap{gap:8px}.header .brand{gap:6px}}

.hero-details {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 20px;
  margin-block-start: 24px;
}
.hero-details .hero-note { margin: 0; }
.customer-count {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 4px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--text);
  font-size: 13px;
  font-weight: 700;
}
.customer-count strong { color: var(--blue); font: 700 23px/1.5 var(--latin); }

.courses-section {
  background: var(--panel);
  border-block: 1px solid var(--line);
}
.courses-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(28px, 7vw, 110px);
}
.courses-copy h2 { margin-block-end: 12px; }
.courses-copy > p:last-child { max-width: 32rem; margin: 0; color: var(--muted); }
.course-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  padding: clamp(18px, 4vw, 32px);
  border: 1px solid var(--line);
  border-radius: 17px;
  background: var(--bg);
}
.course-form label { margin-block-end: 4px; font-weight: 600; }
.course-form input { margin-block-end: 14px; }
.course-form .button { justify-content: center; text-align: center; }
.course-form small { margin-block-start: 10px; color: var(--muted); }
@media (max-width: 760px) {
  .courses-layout { grid-template-columns: 1fr; }
}
