/* v5.2 — unique service visual systems */
.service-page{--accent:#59a8ff;--accent2:#7a5cff}.u-hero{padding:96px 0 70px}.u-kicker{font-size:11px;letter-spacing:.16em;font-weight:850;color:var(--accent);margin-bottom:16px}.u-title{font-size:clamp(46px,6vw,76px);line-height:.98;letter-spacing:-.055em;margin:0}.u-title span{background:linear-gradient(90deg,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent}.u-lead{font-size:18px;line-height:1.75;color:#a9b5c7;max-width:720px}.u-panel{border:1px solid rgba(137,164,210,.22);border-radius:24px;background:linear-gradient(145deg,rgba(16,27,47,.94),rgba(6,11,20,.9));box-shadow:0 30px 90px rgba(0,0,0,.32)}
/* WEB */
.web-page{--accent:#57b8ff;--accent2:#56e3cf}.web-hero-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:58px;align-items:center}.browser{overflow:hidden}.browser-bar{height:46px;border-bottom:1px solid rgba(255,255,255,.07);display:flex;align-items:center;gap:7px;padding:0 16px}.browser-bar i{width:9px;height:9px;border-radius:50%;background:#ff6577}.browser-bar i:nth-child(2){background:#ffc857}.browser-bar i:nth-child(3){background:#55d98b}.browser-url{margin-left:10px;flex:1;padding:7px 12px;border-radius:8px;background:rgba(255,255,255,.04);font-size:10px;color:#728197}.browser-stage{padding:24px;display:grid;grid-template-columns:1.25fr .75fr;gap:16px}.mock-main,.mock-side{border:1px solid rgba(255,255,255,.07);border-radius:14px;background:rgba(255,255,255,.025);padding:16px}.mock-line{height:8px;border-radius:99px;background:linear-gradient(90deg,var(--accent),transparent);margin-bottom:10px}.mock-line.s{width:55%}.mock-hero{height:112px;border-radius:12px;background:radial-gradient(circle at 70% 20%,rgba(87,184,255,.42),transparent 36%),linear-gradient(135deg,#14213a,#0a101c);margin:14px 0}.device-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.device{height:92px;border:1px solid rgba(255,255,255,.08);border-radius:12px;position:relative;overflow:hidden}.device:before{content:"";position:absolute;inset:12px;border-radius:8px;background:linear-gradient(135deg,rgba(87,184,255,.18),rgba(86,227,207,.08))}.web-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:24px}.metric{padding:18px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.025)}.metric strong{display:block;font-size:24px}.metric span{font-size:10px;color:#8190a5;letter-spacing:.1em}
/* PLATFORM */
.platform-page{--accent:#8f7bff;--accent2:#5dc8ff}.platform-layout{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center}.admin-shell{display:grid;grid-template-columns:130px 1fr;min-height:390px;overflow:hidden}.admin-side{border-right:1px solid rgba(255,255,255,.07);padding:18px}.admin-side b{display:block;margin-bottom:20px}.admin-side span{display:block;padding:9px 8px;border-radius:8px;color:#8390a6;font-size:11px;margin-bottom:5px}.admin-side span.active{background:rgba(143,123,255,.13);color:#c8c0ff}.admin-main{padding:20px}.admin-top{display:flex;justify-content:space-between;align-items:center}.admin-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0}.admin-card{padding:14px;border:1px solid rgba(255,255,255,.07);border-radius:11px;background:rgba(255,255,255,.025)}.admin-card strong{display:block;font-size:22px}.admin-card small{color:#7f8ca1}.workflow{display:grid;gap:9px}.flow-row{display:grid;grid-template-columns:34px 1fr auto;gap:10px;align-items:center;padding:11px;border:1px solid rgba(255,255,255,.06);border-radius:10px}.flow-row i{width:27px;height:27px;border-radius:8px;background:linear-gradient(145deg,var(--accent),var(--accent2))}.flow-row small{color:#7e8da2}.role-matrix{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.role-card{padding:22px;border:1px solid rgba(255,255,255,.08);border-radius:16px;background:rgba(255,255,255,.025)}
/* AUTOMATION */
.automation-page{--accent:#45e0b5;--accent2:#4b8cff}.automation-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:55px;align-items:center}.flow-canvas{position:relative;min-height:430px;overflow:hidden}.flow-canvas svg{position:absolute;inset:0;width:100%;height:100%}.flow-node{position:absolute;min-width:126px;padding:14px;border:1px solid rgba(69,224,181,.28);border-radius:14px;background:rgba(7,18,27,.95);box-shadow:0 15px 45px rgba(0,0,0,.24)}.flow-node b{display:block}.flow-node small{color:#7f8ea1}.fn1{top:25px;left:34%}.fn2{top:155px;left:4%}.fn3{top:155px;right:4%}.fn4{bottom:25px;left:12%}.fn5{bottom:25px;right:12%}.flow-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:112px;height:112px;border-radius:34px;display:grid;place-items:center;background:linear-gradient(145deg,var(--accent),var(--accent2));font-weight:900;box-shadow:0 0 65px rgba(69,224,181,.28)}.automation-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.automation-strip div{padding:18px 12px;text-align:center;border:1px solid rgba(255,255,255,.07);border-radius:14px;background:rgba(255,255,255,.025)}
/* INFRA */
.infrastructure-page{--accent:#4f9dff;--accent2:#9a65ff}.infra-grid{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}.rack{padding:20px}.rack-head{display:flex;justify-content:space-between;margin-bottom:14px;color:#8fa0b8;font-size:11px}.server{display:grid;grid-template-columns:20px 1fr 90px;gap:12px;align-items:center;padding:13px;border:1px solid rgba(255,255,255,.07);border-radius:11px;margin-bottom:10px;background:rgba(255,255,255,.025)}.server i{width:9px;height:9px;border-radius:50%;background:#50e1ad;box-shadow:0 0 14px #50e1ad}.bars{height:7px;border-radius:99px;background:rgba(255,255,255,.06);overflow:hidden}.bars span{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2))}.security-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.security-card{padding:20px;border:1px solid rgba(255,255,255,.08);border-radius:15px;background:rgba(255,255,255,.025)}
/* DATABASE */
.database-page{--accent:#ffd166;--accent2:#ff7b72}.db-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:55px;align-items:center}.schema{position:relative;min-height:420px;padding:22px}.table-box{position:absolute;width:170px;border:1px solid rgba(255,209,102,.24);border-radius:12px;overflow:hidden;background:#0a111d}.table-box h4{margin:0;padding:10px 12px;background:rgba(255,209,102,.09);font-size:12px}.table-box span{display:block;padding:7px 12px;border-top:1px solid rgba(255,255,255,.05);font-size:10px;color:#8f9eb1}.tb1{top:30px;left:30px}.tb2{top:30px;right:30px}.tb3{bottom:30px;left:50%;transform:translateX(-50%)}.schema-line{position:absolute;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent);transform-origin:left}.sl1{width:175px;left:190px;top:125px;transform:rotate(22deg)}.sl2{width:175px;right:190px;top:125px;transform:rotate(-22deg)}.query-board{display:grid;grid-template-columns:1.3fr .7fr;gap:16px}.query-code{padding:20px;border:1px solid rgba(255,255,255,.07);border-radius:15px;background:#07101b;font-family:ui-monospace,monospace;color:#9fd7ff;line-height:1.8}.query-stats{display:grid;gap:10px}.query-stats div{padding:16px;border:1px solid rgba(255,255,255,.07);border-radius:13px;background:rgba(255,255,255,.025)}
/* SUPPORT */
.support-page{--accent:#ff8bcf;--accent2:#7d7bff}.support-grid{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}.incident-board{padding:22px}.incident-top{display:flex;justify-content:space-between;align-items:center}.sla{padding:7px 10px;border-radius:999px;background:rgba(80,225,173,.1);color:#75e8bb;font-size:10px}.timeline{margin-top:20px;padding-left:24px;border-left:1px solid rgba(255,139,207,.25)}.event{position:relative;padding:0 0 22px 16px}.event:before{content:"";position:absolute;left:-29px;top:4px;width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px var(--accent)}.event b{display:block}.event small{color:#7f8da1}.support-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.support-card{padding:22px;border:1px solid rgba(255,255,255,.08);border-radius:15px;background:rgba(255,255,255,.025)}
.u-section{padding:88px 0;border-top:1px solid rgba(255,255,255,.07)}.u-heading{max-width:780px;margin-bottom:34px}.u-heading small{color:var(--accent);font-weight:850;letter-spacing:.14em}.u-heading h2{font-size:clamp(34px,4vw,54px);letter-spacing:-.045em;line-height:1.04;margin:12px 0}.u-heading p{color:#96a5bc;line-height:1.75}.u-features{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.u-feature{padding:24px;border:1px solid rgba(255,255,255,.08);border-radius:17px;background:linear-gradient(145deg,rgba(15,24,41,.78),rgba(7,12,21,.7))}.u-feature b{color:var(--accent);font-size:11px;letter-spacing:.12em}.u-feature h3{margin:24px 0 9px}.u-feature p{color:#93a1b5;line-height:1.65;font-size:14px}.u-process{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.u-step{padding:24px;border:1px solid rgba(255,255,255,.08);border-radius:16px}.u-step span{color:var(--accent);font-size:11px}.u-step p{color:#8e9db1;line-height:1.65;font-size:13px}.u-cta{padding:72px 0 95px}.u-cta-box{padding:44px;border:1px solid rgba(255,255,255,.1);border-radius:24px;background:radial-gradient(circle at 80% 20%,color-mix(in srgb,var(--accent2) 18%,transparent),transparent 36%),linear-gradient(145deg,rgba(16,28,50,.94),rgba(7,13,24,.9));display:flex;justify-content:space-between;align-items:center;gap:24px}.u-cta-box h2{font-size:clamp(30px,4vw,50px);margin:0}.u-cta-box p{color:#9caabd}
@media(max-width:900px){.web-hero-grid,.platform-layout,.automation-grid,.infra-grid,.db-grid,.support-grid{grid-template-columns:1fr}.u-features{grid-template-columns:repeat(2,1fr)}.u-process{grid-template-columns:repeat(2,1fr)}.web-metrics,.security-grid{grid-template-columns:repeat(2,1fr)}.automation-strip{grid-template-columns:repeat(2,1fr)}.support-cards{grid-template-columns:1fr}.u-cta-box{display:block}.query-board{grid-template-columns:1fr}}
@media(max-width:600px){.u-features,.u-process,.web-metrics,.security-grid,.automation-strip,.role-matrix{grid-template-columns:1fr}.browser-stage{grid-template-columns:1fr}.admin-shell{grid-template-columns:90px 1fr}.admin-cards{grid-template-columns:1fr}.flow-canvas{min-height:520px}.flow-node{min-width:110px}.fn2{left:0}.fn3{right:0}.schema{min-height:500px}.tb1,.tb2,.tb3{position:relative;inset:auto;transform:none;margin:12px auto}.schema-line{display:none}.u-cta-box{padding:30px}}
