:root { --ink:#100b3e; --violet:#31217d; --cyan:#00a8e0; --sky:#41c8ef; --mist:#eff6f8; --line:#d9e3e8; --text:#20242c; --muted:#68717b; --white:#fff; --radius:18px; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; scroll-padding-top:78px; } body { margin:0; font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color:var(--text); background:#fff; line-height:1.5; } a { color:inherit; text-decoration:none; } img { max-width:100%; display:block; } .container { width:min(1160px, calc(100% - 48px)); margin:auto; } .section { padding:110px 0; } h1,h2,h3,p { margin-top:0; } h1,h2,h3 { letter-spacing:-.045em; line-height:1.04; } h2 { font-size:clamp(2.15rem,4vw,4.1rem); color:var(--ink); } .skip-link { position:fixed; z-index:1000; transform:translateY(-150%); background:var(--cyan); color:var(--ink); padding:10px 18px; font-weight:800; } .skip-link:focus { transform:translateY(0); }
.site-header { position:sticky; top:0; z-index:20; background:rgba(255,255,255,.94); backdrop-filter:blur(16px); border-bottom:1px solid rgba(16,11,62,.08); } .nav-wrap { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:26px; } .brand img,.footer-brand img { width:162px; height:auto; } .main-nav { display:flex; align-items:center; gap:28px; color:#4e5260; font-size:.88rem; font-weight:700; } .main-nav a { position:relative; } .main-nav a:not(.nav-cta)::after { content:""; position:absolute; left:0; right:0; bottom:-7px; height:2px; background:var(--cyan); transform:scaleX(0); transition:transform .2s; } .main-nav a:hover::after,.main-nav .active::after { transform:scaleX(1); } .nav-cta { color:var(--ink); border:1px solid #cbdce4; border-radius:100px; padding:10px 17px; transition:.2s; } .nav-cta:hover { background:var(--ink); border-color:var(--ink); color:white; } .menu-toggle { display:none; }
.hero { overflow:hidden; padding:84px 0 0; background:linear-gradient(125deg,#fafcff 0%,#f2f8fa 48%,#e9f6fb 100%); } .hero-grid { min-height:500px; display:grid; grid-template-columns:1.03fr .97fr; align-items:center; gap:60px; } .eyebrow { color:var(--violet); text-transform:uppercase; letter-spacing:.13em; font-weight:800; font-size:.72rem; margin-bottom:23px; display:flex; align-items:center; gap:9px; } .eyebrow span { width:24px; height:2px; background:var(--cyan); display:inline-block; } .hero h1 { max-width:620px; color:var(--ink); font-size:clamp(3.35rem,6.3vw,6rem); margin-bottom:25px; } .hero h1 em { color:var(--cyan); font-style:normal; } .hero-text { max-width:540px; font-size:1.08rem; color:var(--muted); } .hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:19px; margin-top:35px; } .button { border:0; cursor:pointer; display:inline-flex; align-items:center; gap:20px; font:800 .9rem inherit; padding:15px 21px; border-radius:4px; transition:transform .2s,box-shadow .2s; } .button:hover { transform:translateY(-2px); box-shadow:0 12px 24px rgba(16,11,62,.14); } .button-primary { background:var(--ink); color:#fff; } .button-primary span,.button-white span { color:var(--cyan); font-size:1.25rem; } .button-quiet { color:var(--violet); padding-left:0; }.hero-visual { position:relative; min-height:475px; }
.hero-visual { overflow:hidden; min-height:420px; border-radius:4px; background:#12134a; box-shadow:0 24px 50px rgba(20,38,92,.18); }.hero-building-image { width:100%; height:100%; min-height:420px; object-fit:cover; object-position:66% center; }.hero-image-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(7,9,41,.54),rgba(10,18,63,.08) 68%,rgba(10,16,50,.24)); }.status-dot { width:6px; height:6px; border-radius:50%; background:#53e5d5; box-shadow:0 0 0 4px rgba(83,229,213,.2); }.bms-hub { position:absolute; z-index:2; top:24px; left:24px; display:grid; grid-template-columns:8px auto; column-gap:7px; align-items:center; padding:12px 14px; background:rgba(11,13,56,.84); color:#fff; backdrop-filter:blur(8px); }.bms-hub .status-dot { grid-row:span 2; }.bms-hub strong { font-size:.85rem; letter-spacing:.11em; }.bms-hub small { color:#a7e9fb; font-size:.52rem; font-weight:800; letter-spacing:.11em; }.hero-system { position:absolute; z-index:2; display:flex; align-items:center; gap:9px; min-width:150px; padding:10px 12px; border:1px solid rgba(255,255,255,.45); background:rgba(255,255,255,.89); box-shadow:0 9px 22px rgba(0,0,30,.18); backdrop-filter:blur(10px); }.hero-system > span { display:grid; place-items:center; width:27px; height:27px; border-radius:50%; color:var(--cyan); background:#e4f8fe; font-size:1.02rem; }.hero-system small,.hero-system strong { display:block; }.hero-system small { color:#63717a; font-size:.58rem; }.hero-system strong { color:var(--ink); font-size:.69rem; }.system-climate { top:136px; left:16px; }.system-energy { right:16px; top:172px; }.system-fire { bottom:23px; left:44px; }.system-security { right:24px; bottom:42px; }.trust-row { display:flex; flex-wrap:wrap; padding:24px 0; gap:15px 30px; border-top:1px solid #d9ebf1; color:var(--violet); font-size:.66rem; font-weight:800; letter-spacing:.12em; }.trust-row span { display:flex; align-items:center; gap:12px; }.trust-row span::before { content:""; width:4px; height:4px; border-radius:50%; background:var(--cyan); }
.intro { padding:115px 0 95px; }.intro-grid { display:grid; grid-template-columns:1fr 2fr; gap:30px; }.intro h2 { margin-bottom:18px; max-width:800px; }.intro p:not(.eyebrow) { color:var(--muted); max-width:650px; font-size:1.06rem; }.intro-detail { display:grid; grid-template-columns:.86fr 1.14fr; gap:9%; margin-top:66px; padding-top:42px; border-top:1px solid var(--line); }.intro-kicker { margin-bottom:12px!important; color:var(--violet)!important; font-size:.69rem!important; font-weight:850; letter-spacing:.11em; text-transform:uppercase; }.intro-context h3 { max-width:400px; margin-bottom:13px; color:var(--ink); font-size:1.62rem; line-height:1.12; }.intro-context p:not(.intro-kicker) { max-width:440px; margin-bottom:20px; color:var(--muted); font-size:.93rem; }.intro-tags { display:flex; flex-wrap:wrap; gap:8px; }.intro-tags span { padding:7px 10px; border:1px solid #d4e5eb; color:var(--violet); background:#f8fcfd; font-size:.67rem; font-weight:800; }.intro-process { display:grid; gap:0; }.intro-process article { display:grid; grid-template-columns:48px 1fr; gap:14px; padding:0 0 21px; margin-bottom:20px; border-bottom:1px solid var(--line); }.intro-process article:last-child { padding-bottom:0; margin-bottom:0; border:0; }.intro-process article > span { width:30px; height:30px; display:grid; place-items:center; color:var(--cyan); background:#e7f8fc; border-radius:50%; font-size:.62rem; font-weight:900; }.intro-process h3 { margin:1px 0 7px; color:var(--ink); font-size:1.05rem; }.intro-process p { margin:0; color:var(--muted); font-size:.88rem!important; }.solutions { background:var(--mist); }.section-heading { display:flex; align-items:end; justify-content:space-between; gap:50px; margin-bottom:47px; }.section-heading h2 { margin-bottom:0; }.section-heading > p { max-width:315px; color:var(--muted); margin:0 0 5px; }.solution-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }.solution-card { position:relative; min-height:350px; display:flex; flex-direction:column; padding:30px; background:white; border:1px solid #e2ebef; border-radius:var(--radius); transition:transform .25s,box-shadow .25s; }.solution-card:hover { transform:translateY(-6px); box-shadow:0 22px 40px rgba(24,46,92,.12); }.solution-card.featured { background:var(--ink); border-color:var(--ink); color:white; }.card-number { color:#9da8b1; font-size:.75rem; font-weight:800; }.featured .card-number { color:#9bcde2; }.card-icon { margin:36px 0 27px; color:var(--cyan); height:40px; }.icon-grid { display:grid; grid-template-columns:repeat(2,14px); gap:4px; align-content:start; }.icon-grid b { border:2px solid currentColor; height:14px; }.icon-pulse { display:flex; align-items:center; gap:5px; }.icon-pulse b { width:5px; background:var(--cyan); }.icon-pulse b:nth-child(1){height:15px}.icon-pulse b:nth-child(2){height:33px}.icon-pulse b:nth-child(3){height:23px}.icon-shield { font-size:2.6rem; line-height:.8; }.solution-card h3 { font-size:1.53rem; margin-bottom:15px; }.solution-card p { color:#6a7480; font-size:.92rem; }.featured p { color:#b8cad4; }.solution-card a { margin-top:auto; color:var(--violet); font-size:.79rem; font-weight:800; }.featured a { color:#79dfff; }.solution-card a span { margin-left:8px; font-size:1rem; }
.bms-overlay { position:absolute; z-index:2; left:0; right:0; bottom:0; display:grid; grid-template-columns:142px 1fr; align-items:stretch; background:linear-gradient(90deg,rgba(7,11,43,.94),rgba(7,18,55,.76)); border-top:1px solid rgba(157,230,248,.35); backdrop-filter:blur(9px); }.bms-hub { position:static; display:grid; grid-template-columns:8px auto; column-gap:7px; align-content:center; align-items:center; padding:17px 19px; background:rgba(5,9,38,.45); color:#fff; border-right:1px solid rgba(157,230,248,.24); }.bms-hub .status-dot { grid-row:span 2; }.bms-hub strong { font-size:.85rem; letter-spacing:.11em; }.bms-hub small { color:#a7e9fb; font-size:.52rem; font-weight:800; letter-spacing:.11em; }.bms-systems { display:grid; grid-template-columns:repeat(4,1fr); }.bms-systems > div { display:grid; grid-template-columns:29px 1fr; grid-template-rows:auto auto; column-gap:8px; align-content:center; padding:12px 13px; border-right:1px solid rgba(157,230,248,.16); }.bms-systems > div:last-child { border-right:0; }.bms-systems span { grid-row:span 2; display:grid; place-items:center; width:27px; height:27px; border-radius:50%; color:#74e4fa; background:rgba(116,228,250,.14); font-size:1rem; }.bms-systems small,.bms-systems strong { display:block; }.bms-systems small { color:#b4dce8; font-size:.55rem; }.bms-systems strong { color:#fff; font-size:.67rem; }.bms { overflow:hidden; background:linear-gradient(122deg,#0b0834,#17145d 64%,#086b9e); color:white; }.bms .eyebrow { color:#bdeffd; }.bms .eyebrow span { background:#74def5; }.bms-heading { display:grid; grid-template-columns:1.2fr .8fr; gap:9%; align-items:end; margin-bottom:47px; }.bms h2 { color:white; margin:0; max-width:770px; }.bms-heading > p:not(.eyebrow) { margin:0 0 4px; color:#c0d0e3; }.bms-grid { display:grid; grid-template-columns:1.03fr .97fr; gap:8%; align-items:center; }.bms-image { position:relative; min-height:460px; margin:0; overflow:hidden; border-radius:4px; background:#111; }.bms-image::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 52%,rgba(4,4,28,.82)); pointer-events:none; }.bms-image img { width:100%; height:100%; min-height:460px; object-fit:cover; object-position:center; }.bms-image figcaption { position:absolute; z-index:1; bottom:20px; left:23px; right:23px; color:#e9f8ff; font-size:.75rem; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }.bms-services { display:grid; gap:0; }.bms-services article { display:grid; grid-template-columns:42px 1fr; gap:16px; padding:19px 0; border-bottom:1px solid rgba(177,230,247,.24); }.bms-services article:first-child { padding-top:0; }.bms-services article > span { color:#6bdcf5; font-size:.7rem; font-weight:900; padding-top:4px; }.bms-services h3 { color:#fff; margin:0 0 8px; font-size:1.28rem; }.bms-services p { color:#bfcee1; margin:0; font-size:.91rem; }.bms-services .text-link { color:white; margin-top:19px; }.bms-services .text-link span { color:#78e2f6; }
.bms-tabs { min-width:0; }.bms-tablist { display:flex; gap:0; border-bottom:1px solid rgba(177,230,247,.28); }.bms-tablist button { flex:1; min-width:0; padding:0 0 14px; border:0; border-bottom:2px solid transparent; background:none; color:#acc5dc; cursor:pointer; font:800 .7rem inherit; letter-spacing:.035em; text-align:left; transition:.2s; }.bms-tablist button:hover,.bms-tablist button:focus-visible { color:#fff; }.bms-tablist button[aria-selected="true"] { border-bottom-color:#66dcf6; color:#fff; }.bms-panel { min-height:255px; padding:28px 0 0; }.bms-panel-kicker { margin:0 0 8px!important; color:#6de0fa!important; font-size:.68rem!important; font-weight:850; letter-spacing:.1em; text-transform:uppercase; }.bms-panel h3 { max-width:430px; margin:0 0 12px; color:#fff; font-size:1.65rem; line-height:1.1; }.bms-panel > p:not(.bms-panel-kicker) { max-width:490px; margin:0; color:#bfd0e3; font-size:.94rem; }.bms-panel ul { display:grid; gap:7px; padding:17px 0 0; margin:17px 0 0; border-top:1px solid rgba(177,230,247,.22); list-style:none; }.bms-panel li { position:relative; padding-left:15px; color:#d4e7f2; font-size:.81rem; }.bms-panel li::before { content:""; position:absolute; left:0; top:.5em; width:5px; height:5px; border-radius:50%; background:#6bdef7; }.partners { background:#fff; }.partners-layout { display:grid; grid-template-columns:.75fr 1.25fr; gap:10%; align-items:center; }.partners h2 { margin-bottom:20px; }.partners-copy > p:not(.eyebrow) { max-width:390px; color:var(--muted); }.partner-cta { margin-top:14px; }.partner-carousel { min-width:0; }.partner-viewport { overflow:hidden; outline:0; border-radius:var(--radius); }.partner-viewport:focus-visible { box-shadow:0 0 0 3px rgba(0,168,224,.45); }.partner-track { display:flex; transition:transform .45s cubic-bezier(.2,.7,.3,1); }.partner-slide { flex:0 0 100%; min-height:304px; padding:32px; border:1px solid #dce8ed; border-radius:var(--radius); background:linear-gradient(135deg,#fff,#f5fafb); box-shadow:0 18px 42px rgba(20,50,92,.07); }.partner-logo { position:relative; width:285px; max-width:100%; height:86px; overflow:hidden; margin:0 0 24px; border-bottom:1px solid var(--line); }.partner-logo img { position:absolute; top:-56px; left:0; width:280px; max-width:none; height:auto; }.partner-logo.clean img { position:static; width:100%; height:100%; max-width:100%; object-fit:contain; object-position:left center; }.partner-logo.axis img { width:280px; top:-79px; }.partner-logo.hikvision { height:62px; }.partner-detail { display:flex; gap:17px; }.fire-mark,.access-mark,.cctv-mark { flex:0 0 42px; width:42px; height:42px; display:grid; place-items:center; border-radius:50%; font-size:1.45rem; }.fire-mark { background:#fff0f0; color:#d32d32; font-size:1.7rem; }.access-mark { background:#f5ecf0; color:#9e274c; }.cctv-mark { background:#eef8fc; color:#008abf; }.partner-label { margin:1px 0 3px!important; color:var(--violet)!important; font-size:.65rem!important; font-weight:800; letter-spacing:.09em; text-transform:uppercase; }.partner-detail h3 { margin:0 0 8px; color:var(--ink); font-size:1.35rem; }.partner-detail p { color:var(--muted); font-size:.93rem; margin-bottom:16px; }.carousel-controls { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-top:18px; }.carousel-arrows { display:flex; gap:8px; }.carousel-button { display:grid; place-items:center; width:38px; height:38px; border:1px solid #cbdde5; background:#fff; color:var(--ink); border-radius:50%; cursor:pointer; font-size:1.15rem; transition:.2s; }.carousel-button:hover,.carousel-button:focus-visible { color:white; background:var(--ink); border-color:var(--ink); }.carousel-dots { display:flex; gap:7px; }.carousel-dots button { width:8px; height:8px; padding:0; border:0; border-radius:50%; background:#cbd7dd; cursor:pointer; transition:.2s; }.carousel-dots button[aria-selected="true"] { width:25px; border-radius:10px; background:var(--cyan); }.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.about { overflow:hidden; }.about-grid { display:grid; grid-template-columns:1fr 1fr; gap:9%; align-items:center; }.about-art { position:relative; background:var(--ink); height:430px; border-radius:3px; overflow:hidden; }.art-square { position:absolute; border:1px solid rgba(89,218,250,.8); }.square-a { width:145px; height:145px; left:24%; top:21%; box-shadow:0 0 0 16px rgba(65,200,239,.08),0 0 0 34px rgba(65,200,239,.045); }.square-b { width:212px; height:212px; right:-30px; bottom:-39px; border-color:rgba(124,105,217,.8); transform:rotate(45deg); }.art-line { position:absolute; width:85%; height:1px; left:0; bottom:33%; background:linear-gradient(90deg,transparent,#3fcdf1,transparent); transform:rotate(-36deg); }.art-label { position:absolute; left:31px; bottom:27px; color:white; font-weight:900; font-size:1.1rem; letter-spacing:.12em; }.art-label span { color:#62d9f4; font-size:.55rem; }.about-copy p:not(.eyebrow) { color:var(--muted); max-width:480px; }.text-link { display:inline-flex; gap:12px; align-items:center; color:var(--violet); font-weight:800; font-size:.88rem; margin-top:15px; }.text-link span { color:var(--cyan); font-size:1.3rem; }.location { background:var(--mist); }.location-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:10%; align-items:center; }.location-grid h2 { margin-bottom:22px; }.location-grid p:not(.eyebrow) { max-width:405px; color:var(--muted); }.map-card { position:relative; height:340px; overflow:hidden; background:#dceaf0; border-radius:4px; }.map-card > img { width:100%; height:100%; object-fit:cover; object-position:center; }.nbx-pin { position:absolute; z-index:2; left:50.5%; top:55%; width:47px; height:47px; display:grid; place-items:center; border:3px solid #fff; border-radius:50% 50% 50% 0; background:var(--cyan); color:var(--ink); box-shadow:0 8px 18px rgba(0,103,160,.35); transform:translate(-50%,-100%) rotate(-45deg); }.nbx-pin::after { content:""; position:absolute; inset:-10px; border-radius:50%; border:1px solid rgba(0,168,224,.55); animation:pinPulse 2.2s ease-out infinite; }.nbx-pin span { display:block; font-size:.6rem; font-weight:950; letter-spacing:-.07em; transform:rotate(45deg); }.map-label { position:absolute; z-index:2; left:53%; top:52%; display:grid; gap:1px; min-width:142px; padding:8px 10px; background:rgba(255,255,255,.93); color:var(--ink); box-shadow:0 7px 18px rgba(27,49,92,.13); font-size:.64rem; line-height:1.2; }.map-label strong { font-size:.7rem; }.map-label span { color:#4e6d7a; }.map-label::before { content:""; position:absolute; width:25px; height:1px; left:-25px; top:50%; background:var(--cyan); } @keyframes pinPulse { 0%,100% { transform:scale(.65); opacity:.7; } 70% { transform:scale(1.2); opacity:0; } }
.contact { background:linear-gradient(118deg,var(--ink),#1b1663 67%,#076ba5); color:white; }.contact-grid { display:grid; grid-template-columns:1fr 1.05fr; gap:9%; align-items:start; }.light { color:#c0ecfa; }.light span { background:#7cdff6; }.contact h2 { color:white; font-size:clamp(2.2rem,3.9vw,3.7rem); }.contact-copy > p:not(.eyebrow) { color:#bfccdc; max-width:415px; }.contact-form { display:grid; gap:18px; }.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }.contact-form label { display:grid; gap:7px; color:#cae9f6; font-size:.72rem; font-weight:800; letter-spacing:.045em; }.contact-form input,.contact-form textarea { width:100%; resize:vertical; background:rgba(255,255,255,.08); border:1px solid rgba(175,227,245,.36); outline:0; color:white; border-radius:2px; padding:12px; font:400 .95rem inherit; transition:border-color .2s,background .2s; }.contact-form input:focus,.contact-form textarea:focus { border-color:#72dff6; background:rgba(255,255,255,.13); }.form-footer { display:flex; justify-content:space-between; align-items:center; gap:12px; }.form-status { font-size:.78rem; color:#bfefff; margin:0; }.button-white { color:var(--ink); background:white; }.site-footer { padding:43px 0 24px; background:#09072b; color:#b8c3d0; }.footer-top,.footer-bottom { display:flex; justify-content:space-between; align-items:center; gap:24px; }.footer-top { padding-bottom:35px; border-bottom:1px solid rgba(183,225,242,.15); font-size:.86rem; font-weight:700; }.footer-top > a:not(.footer-brand):hover { color:#6dddf5; }.footer-brand img { filter:brightness(0) invert(1) grayscale(1) brightness(4); opacity:.9; }.footer-bottom { padding-top:20px; color:#7f8a9b; font-size:.69rem; }.reveal { opacity:0; transform:translateY(22px); transition:opacity .65s ease,transform .65s ease; }.reveal.visible { opacity:1; transform:none; }
@media (max-width:800px) { .container { width:min(100% - 34px,1160px); }.section { padding:78px 0; }.menu-toggle { display:flex; flex-direction:column; gap:4px; padding:8px 3px; border:0; background:none; }.menu-toggle span { width:24px; height:2px; background:var(--ink); transition:.2s; }.menu-toggle.open span:nth-child(1){transform:translateY(6px) rotate(45deg)}.menu-toggle.open span:nth-child(2){opacity:0}.menu-toggle.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}.main-nav { visibility:hidden; opacity:0; pointer-events:none; position:absolute; top:76px; left:0; right:0; padding:22px max(17px,calc((100% - 1160px)/2)); flex-direction:column; align-items:flex-start; gap:19px; background:white; border-bottom:1px solid var(--line); box-shadow:0 14px 25px rgba(18,25,55,.08); transition:.18s; }.main-nav.open { visibility:visible; opacity:1; pointer-events:auto; }.main-nav a { font-size:1rem; }.nav-cta { padding:9px 16px; }.hero { padding-top:48px; }.hero-grid,.partners-layout,.about-grid,.location-grid,.contact-grid { grid-template-columns:1fr; gap:44px; }.hero-visual { min-height:400px; max-width:510px; width:100%; margin:auto; }.building-main { right:18%; }.metric-energy { left:1%; }.metric-air { right:0; }.trust-row { flex-wrap:wrap; gap:12px 22px; }.intro-grid { grid-template-columns:1fr; gap:0; }.section-heading { align-items:start; flex-direction:column; gap:14px; }.solution-grid { grid-template-columns:1fr; }.solution-card { min-height:280px; }.card-icon { margin:25px 0 18px; }.about-art { height:320px; }.location-grid { gap:35px; }.map-card { height:280px; }.contact-grid { gap:29px; }.contact h2 { margin-bottom:16px; }.form-row { grid-template-columns:1fr; gap:18px; }.footer-top,.footer-bottom { align-items:flex-start; flex-direction:column; gap:15px; }.footer-bottom { padding-top:19px; }.reveal { opacity:1; transform:none; } }
@media (max-width:560px) { .bms-tablist { overflow-x:auto; scrollbar-width:thin; }.bms-tablist button { flex:0 0 142px; }.bms-panel { min-height:0; }.bms-panel h3 { font-size:1.42rem; } }
@media (max-width:430px) { .brand img { width:142px; }.hero h1 { font-size:3.15rem; }.hero-visual { min-height:350px; transform:scale(.91); transform-origin:top center; width:110%; margin-bottom:-35px; }.trust-row { font-size:.57rem; }.button { width:100%; justify-content:space-between; }.button-quiet { justify-content:flex-start; }.about-art { height:270px; }.map-card { height:230px; }.map-pin { left:37%; top:47%; }.contact { padding-bottom:65px; } }
@media (max-width:800px) { .bms-heading,.bms-grid { grid-template-columns:1fr; gap:28px; }.bms-heading { margin-bottom:35px; }.bms-image,.bms-image img { min-height:320px; }.bms-image figcaption { font-size:.64rem; }.bms-services article { padding:17px 0; } }
@media (max-width:800px) { .bms-overlay { grid-template-columns:1fr; }.bms-hub { grid-template-columns:8px auto; padding:10px 14px; border-right:0; border-bottom:1px solid rgba(157,230,248,.22); }.bms-systems > div { padding:10px 9px; } }
@media (max-width:800px) { .intro-detail { grid-template-columns:1fr; gap:38px; margin-top:45px; padding-top:32px; } }
.about-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:5%; }.about-photo { position:relative; height:430px; margin:0; overflow:hidden; border-radius:3px; background:var(--ink); }.about-photo::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(7,11,45,.05) 42%,rgba(7,11,45,.76)); pointer-events:none; }.about-photo img { width:100%; height:100%; object-fit:cover; object-position:center; }.about-photo figcaption { position:absolute; z-index:1; left:25px; bottom:23px; display:flex; flex-direction:column; gap:4px; color:#fff; text-transform:uppercase; }.about-photo figcaption strong { color:#78e0f5; font-size:1.15rem; letter-spacing:.13em; }.about-photo figcaption span { font-size:.57rem; font-weight:800; letter-spacing:.13em; }.about-copy { padding-left:2%; } @media (max-width:800px) { .about-photo { height:320px; }.about-copy { padding-left:0; } } @media (max-width:430px) { .about-photo { height:270px; } }
@media (max-width:430px) { .bms-systems { grid-template-columns:repeat(2,1fr); }.bms-systems > div:nth-child(2) { border-right:0; }.bms-systems > div:nth-child(-n+2) { border-bottom:1px solid rgba(157,230,248,.16); }.bms-systems small { font-size:.5rem; }.bms-systems strong { font-size:.62rem; } }
/* Hero BMS overlay: keep all four systems visible across the image width. */
.hero-visual .bms-overlay { display:block; }.hero-visual .bms-hub { display:flex; align-items:center; gap:7px; padding:9px 14px; border-right:0; border-bottom:1px solid rgba(157,230,248,.22); }.hero-visual .bms-hub strong { margin-right:2px; }.hero-visual .bms-systems { grid-template-columns:repeat(4,minmax(0,1fr)); }.hero-visual .bms-systems > div { min-width:0; padding:9px 10px; }.hero-visual .bms-systems small { white-space:nowrap; font-size:.53rem; }.hero-visual .bms-systems strong { font-size:.65rem; }
@media (max-width:430px) { .hero-visual .bms-systems { grid-template-columns:repeat(2,minmax(0,1fr)); }.hero-visual .bms-systems > div { padding:8px 9px; }.hero-visual .bms-systems small { font-size:.5rem; }.hero-visual .bms-systems strong { font-size:.62rem; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*:before,*:after { transition-duration:.01ms!important; animation-duration:.01ms!important; } }
/* Compact visual pairing for the About section. */
.about-grid { gap:3%; }.about-copy { padding-left:0; }
/* The hero building belongs to the page field, not to a separate card. */
.hero-visual { overflow:visible; border-radius:0; background:transparent; box-shadow:none; }.hero-building-image { -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 17%,#000 100%),linear-gradient(180deg,transparent 0%,#000 10%,#000 92%,transparent 100%); -webkit-mask-composite:source-in; mask-image:linear-gradient(90deg,transparent 0%,#000 17%,#000 100%),linear-gradient(180deg,transparent 0%,#000 10%,#000 92%,transparent 100%); mask-composite:intersect; }.hero-image-shade { background:linear-gradient(90deg,rgba(241,249,252,.8),rgba(10,18,63,.06) 58%,rgba(10,16,50,.12)); }.hero-visual .bms-overlay { overflow:hidden; border-radius:0; }
@media (max-width:800px) { .hero-visual { overflow:hidden; }.hero-building-image { -webkit-mask-image:none; mask-image:none; }.hero-image-shade { background:linear-gradient(90deg,rgba(7,9,41,.45),rgba(10,18,63,.08) 68%,rgba(10,16,50,.24)); } }
/* Alternative: the building is a panoramic background, while BMS stays as its interface layer. */
.hero { position:relative; isolation:isolate; }.hero::before { content:""; position:absolute; z-index:0; top:0; right:0; bottom:0; width:67%; background:url("assets/bms-building.png") right center/cover no-repeat; opacity:.94; -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 30%,#000 100%),linear-gradient(180deg,transparent 0%,#000 9%,#000 93%,transparent 100%); -webkit-mask-composite:source-in; mask-image:linear-gradient(90deg,transparent 0%,#000 30%,#000 100%),linear-gradient(180deg,transparent 0%,#000 9%,#000 93%,transparent 100%); mask-composite:intersect; pointer-events:none; }.hero .container { position:relative; z-index:1; }.hero-visual { min-height:420px; }.hero-visual > .hero-building-image,.hero-visual > .hero-image-shade { display:none; }.hero-visual .bms-overlay { left:4%; right:0; bottom:5%; background:linear-gradient(90deg,rgba(7,11,43,.92),rgba(7,18,55,.77)); }
@media (max-width:800px) { .hero::before { display:none; }.hero-visual > .hero-building-image,.hero-visual > .hero-image-shade { display:block; }.hero-visual .bms-overlay { left:0; bottom:0; } }
/* Legibility pass for the BMS legend. */
.hero-visual .bms-hub { gap:8px; padding:11px 15px; }.hero-visual .bms-hub strong { font-size:.9rem; letter-spacing:.09em; }.hero-visual .bms-hub small { color:#c8f3ff; font-size:.6rem; letter-spacing:.09em; }.hero-visual .bms-systems > div { grid-template-columns:31px minmax(0,1fr); column-gap:9px; padding:11px 12px; }.hero-visual .bms-systems span { width:29px; height:29px; font-size:1.06rem; }.hero-visual .bms-systems small { color:#c9eff9; font-size:.63rem; font-weight:700; line-height:1.15; letter-spacing:.01em; white-space:normal; }.hero-visual .bms-systems strong { color:#fff; font-size:.75rem; font-weight:850; line-height:1.18; letter-spacing:.01em; }
@media (max-width:430px) { .hero-visual .bms-systems > div { padding:9px 10px; }.hero-visual .bms-systems small { font-size:.59rem; }.hero-visual .bms-systems strong { font-size:.69rem; } }
.bms-mark { flex:0 0 42px; width:42px; height:42px; display:grid; place-items:center; border-radius:50%; background:#eaf8e8; color:#3c8f31; font-size:1.5rem; }.schneider-logo img { padding:9px 0; object-position:left center; }
.radar { overflow:hidden; background:var(--mist); }.radar-heading { display:flex; align-items:end; justify-content:space-between; gap:60px; margin-bottom:46px; }.radar-heading h2 { max-width:640px; margin-bottom:0; }.radar-heading > p { max-width:350px; margin:0 0 5px; color:var(--muted); }.news-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }.news-card { min-height:315px; display:flex; flex-direction:column; padding:28px; border:1px solid #dce8ed; background:#fff; transition:transform .25s,box-shadow .25s; }.news-card:hover { transform:translateY(-5px); box-shadow:0 18px 35px rgba(20,50,92,.1); }.news-card-top { display:flex; justify-content:space-between; gap:12px; margin-bottom:41px; color:var(--violet); font-size:.65rem; font-weight:850; letter-spacing:.09em; text-transform:uppercase; }.news-card-top time { color:#7c8d98; white-space:nowrap; }.news-card h3 { margin:0 0 13px; color:var(--ink); font-size:1.33rem; line-height:1.12; }.news-card p { margin:0; color:var(--muted); font-size:.88rem; line-height:1.52; }.news-card a { display:inline-flex; gap:8px; margin-top:auto; padding-top:24px; color:var(--violet); font-size:.78rem; font-weight:850; }.news-card a span { color:var(--cyan); font-size:1rem; }.featured-news { border-color:var(--ink); background:var(--ink); }.featured-news .news-card-top,.featured-news h3,.featured-news a { color:#fff; }.featured-news .news-card-top time { color:#b8d9e9; }.featured-news p { color:#c5d5e2; }.featured-news a span { color:#75e1f6; }.radar-footer { display:flex; align-items:center; justify-content:space-between; gap:25px; margin-top:26px; }.radar-footer > span { display:flex; align-items:center; gap:9px; color:#607480; font-size:.72rem; font-weight:750; }.radar-footer i { width:7px; height:7px; border-radius:50%; background:var(--cyan); box-shadow:0 0 0 5px rgba(0,168,224,.1); }
@media (max-width:800px) { .radar-heading { align-items:start; flex-direction:column; gap:15px; }.news-grid { grid-template-columns:1fr; }.news-card { min-height:270px; }.radar-footer { align-items:flex-start; flex-direction:column; } }
.trm-card { max-width:405px; display:grid; gap:5px; margin-top:30px; padding:17px 18px; border:1px solid rgba(181,234,247,.31); background:rgba(255,255,255,.07); backdrop-filter:blur(8px); }.trm-card-top { display:flex; align-items:center; justify-content:space-between; gap:12px; color:#c7eef9; font-size:.63rem; font-weight:850; letter-spacing:.09em; text-transform:uppercase; }.trm-card-top span:last-child { display:flex; align-items:center; gap:6px; color:#76e3f7; white-space:nowrap; }.trm-card-top span:last-child::before { content:""; width:6px; height:6px; border-radius:50%; background:currentColor; box-shadow:0 0 0 4px rgba(118,227,247,.12); }.trm-card strong { color:#fff; font-size:1.75rem; line-height:1.1; letter-spacing:-.03em; }.trm-card .trm-unit { color:#c4d7e7; font-size:.72rem; font-weight:750; }.trm-card p { margin:5px 0 0!important; color:#b9cede!important; font-size:.72rem!important; line-height:1.35; }.trm-card a { margin-top:5px; color:#fff; font-size:.72rem; font-weight:800; }.trm-card a span { color:#7be1f5; padding-left:5px; }
.clients { overflow:hidden; background:linear-gradient(116deg,#0a0730,#171258 64%,#086c9d); color:#fff; }.clients-layout { display:grid; grid-template-columns:.92fr 1.08fr; gap:10%; align-items:center; }.clients h2 { max-width:520px; color:#fff; }.clients-copy > p:not(.eyebrow) { max-width:470px; color:#c2d1e1; }.client-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); padding:0; margin:0; border-top:1px solid rgba(185,231,247,.3); border-left:1px solid rgba(185,231,247,.3); list-style:none; }.client-list li { position:relative; isolation:isolate; min-height:154px; display:flex; flex-direction:column; justify-content:space-between; gap:20px; overflow:hidden; padding:20px; border-right:1px solid rgba(185,231,247,.3); border-bottom:1px solid rgba(185,231,247,.3); background:var(--client-image) center / cover no-repeat; transition:transform .25s,filter .25s; }.client-list li::before { position:absolute; z-index:0; inset:0; content:""; background:linear-gradient(135deg,rgba(7,7,41,.92) 5%,rgba(10,24,73,.72) 62%,rgba(0,113,157,.45)); transition:background .25s; }.client-list li > * { position:relative; z-index:1; }.client-list li:hover { z-index:2; transform:scale(1.025); filter:saturate(1.08); }.client-list li:hover::before { background:linear-gradient(135deg,rgba(7,7,41,.84) 5%,rgba(10,24,73,.58) 62%,rgba(0,143,187,.35)); }.client-ciclotron { --client-image:url("assets/client-ciclotron.jpg"); background-position:center; }.client-clinica { --client-image:url("assets/client-clinica-las-americas.jpg"); background-position:center 52%; }.client-sena { --client-image:url("assets/client-sena.jpg"); background-position:center; }.client-alma-mater { --client-image:url("assets/client-hospital-alma-mater.png"); background-position:center 42%; }.client-list span { color:#8ceafa; font-size:.65rem; font-weight:900; letter-spacing:.09em; text-shadow:0 1px 8px rgba(0,0,0,.7); }.client-list strong { max-width:220px; color:#fff; font-size:1.25rem; line-height:1.1; text-shadow:0 2px 13px rgba(0,0,0,.88); }.client-list li:nth-child(3) strong { letter-spacing:.08em; }
@media (max-width:800px) { .clients-layout { grid-template-columns:1fr; gap:42px; }.client-list { grid-template-columns:1fr; }.client-list li { min-height:102px; flex-direction:row; align-items:center; } }