
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Manrope:wght@600;700;800&display=swap');

:root{
  --bg:#fbfbff;
  --surface:#ffffff;
  --surface-2:#f4f3ff;
  --primary:#7774f2;
  --primary-dark:#5d59d9;
  --lavender:#e8e6ff;
  --blue:#dff3ff;
  --mint:#def8ee;
  --peach:#fff0e6;
  --text:#27283a;
  --muted:#77798d;
  --line:#e9e9f1;
  --shadow:0 20px 60px rgba(80,77,150,.10);
  --radius:24px;
  --container:1160px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif;line-height:1.65}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.container{width:min(calc(100% - 40px),var(--container));margin:auto}
.site-header{position:sticky;top:0;z-index:50;background:rgba(251,251,255,.86);backdrop-filter:blur(18px);border-bottom:1px solid rgba(233,233,241,.75)}
.nav{height:78px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.logo{display:flex;align-items:center;gap:11px;font-family:Manrope;font-weight:800;font-size:20px}
.logo-mark{width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,#8e8af8,#8dd6f7);display:grid;place-items:center;color:white;font-weight:800;box-shadow:0 8px 20px rgba(119,116,242,.25)}
.nav-links{display:flex;align-items:center;gap:30px;color:#5e6072;font-size:14px;font-weight:600}
.nav-links a{transition:.2s}
.nav-links a:hover,.nav-links a.active{color:var(--primary)}
.nav-cta,.btn-primary{background:var(--primary);color:white;padding:12px 19px;border-radius:13px;font-weight:700;box-shadow:0 10px 25px rgba(119,116,242,.20);transition:.2s}
.nav-cta:hover,.btn-primary:hover{background:var(--primary-dark);transform:translateY(-1px)}
.menu-btn{display:none;border:0;background:var(--surface-2);width:42px;height:42px;border-radius:12px;font-size:20px;color:var(--text)}
.hero{padding:92px 0 78px;position:relative;overflow:hidden}
.hero:before,.hero:after{content:"";position:absolute;border-radius:50%;filter:blur(2px);z-index:-1}
.hero:before{width:360px;height:360px;background:#e9e7ff;top:-130px;left:-180px}
.hero:after{width:320px;height:320px;background:#e1f5ff;right:-130px;bottom:-120px}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 11px;border-radius:99px;background:var(--lavender);color:#6561dc;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.hero h1{font-family:Manrope;font-size:clamp(42px,5vw,70px);line-height:1.04;letter-spacing:-.045em;margin:20px 0}
.hero h1 span{color:var(--primary)}
.hero p.lead{font-size:18px;color:var(--muted);max-width:610px;margin:0 0 30px}
.actions{display:flex;gap:13px;flex-wrap:wrap}
.btn-secondary{padding:12px 19px;border:1px solid var(--line);border-radius:13px;background:white;font-weight:700;color:#55576b}
.hero-art{min-height:430px;position:relative}
.art-card{position:absolute;background:rgba(255,255,255,.84);border:1px solid rgba(255,255,255,.95);box-shadow:var(--shadow);border-radius:28px}
.dashboard{inset:40px 20px 35px 30px;padding:22px;transform:rotate(-2deg)}
.dash-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}
.dots{display:flex;gap:6px}.dots i{width:7px;height:7px;border-radius:50%;background:#ddd}
.mini-chart{height:130px;border-radius:20px;background:linear-gradient(180deg,#f2f1ff,#fbfbff);position:relative;overflow:hidden}
.mini-chart:after{content:"";position:absolute;left:12%;right:8%;bottom:25px;height:75px;border-bottom:3px solid #8b88f6;border-radius:50%;transform:skewY(-10deg)}
.metric-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.metric{padding:13px;border-radius:16px;background:#f8f8fc}.metric b{display:block;font-size:19px}.metric small{color:var(--muted)}
.float-card{padding:18px 20px}.float-one{top:15px;right:0;background:#e1f7ef}.float-two{bottom:0;left:0;background:#fff0e7}.float-card b{font-family:Manrope;font-size:21px;display:block}.float-card span{font-size:12px;color:#6f7182}
.section{padding:90px 0}.section.alt{background:white}
.section-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:42px}.section-head h2{margin:0;font-family:Manrope;font-size:38px;line-height:1.15;letter-spacing:-.035em}.section-head p{max-width:510px;color:var(--muted);margin:0}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:30px;box-shadow:0 8px 30px rgba(50,50,90,.035)}
.service-card{transition:.25s}.service-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;font-size:23px;margin-bottom:23px}
.icon.lav{background:var(--lavender)}.icon.blue{background:var(--blue)}.icon.mint{background:var(--mint)}.icon.peach{background:var(--peach)}
.card h3{font-family:Manrope;margin:0 0 10px;font-size:21px}.card p{color:var(--muted);margin:0}
.text-link{display:inline-flex;margin-top:20px;color:var(--primary);font-weight:700;font-size:14px}
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.step{padding:25px;border-radius:22px;background:var(--surface-2)}.step-num{font-family:Manrope;font-size:13px;color:var(--primary);font-weight:800}.step h3{font-size:17px;margin:10px 0 7px}.step p{font-size:13px;color:var(--muted);margin:0}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:24px;overflow:hidden}.stat{background:white;text-align:center;padding:30px}.stat b{font-family:Manrope;font-size:32px;display:block}.stat span{font-size:13px;color:var(--muted)}
.quote{background:linear-gradient(135deg,#f1efff,#eef9ff);border-radius:30px;padding:45px;text-align:center}.quote p{font-family:Manrope;font-size:25px;line-height:1.45;max-width:760px;margin:0 auto 18px}.quote small{color:var(--muted)}
.page-hero{padding:75px 0 65px;background:linear-gradient(135deg,#f2f0ff,#f3fbff)}.page-hero h1{font-family:Manrope;font-size:52px;letter-spacing:-.04em;margin:15px 0 10px}.page-hero p{color:var(--muted);max-width:650px}
.about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:65px;align-items:center}.about-visual{min-height:420px;border-radius:30px;background:linear-gradient(145deg,#e9e7ff,#e0f6ff);position:relative;overflow:hidden}.about-visual:before{content:"";position:absolute;width:230px;height:230px;background:#fff;border-radius:50%;left:50px;top:70px;box-shadow:var(--shadow)}.about-visual:after{content:"✦";position:absolute;font-size:100px;color:#7774f2;right:70px;bottom:60px}.check-list{display:grid;gap:13px;margin-top:25px}.check{display:flex;gap:12px;align-items:flex-start}.check i{width:23px;height:23px;border-radius:50%;background:var(--mint);display:grid;place-items:center;color:#3f9d7c;font-style:normal;font-size:13px;flex:none}
.contact-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:24px}.contact-info{display:grid;gap:14px}.contact-item{padding:24px;border-radius:22px;background:white;border:1px solid var(--line)}.contact-item b{display:block;margin-bottom:5px}.contact-item span{color:var(--muted);font-size:14px}
.form{background:white;border:1px solid var(--line);border-radius:26px;padding:30px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field{display:grid;gap:7px}.field.full{grid-column:1/-1}.field label{font-size:13px;font-weight:700}.field input,.field textarea,.field select{width:100%;border:1px solid var(--line);background:#fbfbfe;border-radius:13px;padding:13px 14px;font:inherit;color:var(--text);outline:none}.field textarea{min-height:150px;resize:vertical}.field input:focus,.field textarea:focus,.field select:focus{border-color:#aaa7fa;box-shadow:0 0 0 4px rgba(119,116,242,.09)}
.site-footer{padding:58px 0 26px;background:#525260;color:#fff;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.site-footer .footer-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr 1fr;gap:42px;align-items:start}
.site-footer .footer-brand .logo{margin-bottom:17px}
.site-footer .footer-brand p{margin:0;color:#b9bac8;max-width:360px;font-size:14px;line-height:1.7;font-weight:400}
.site-footer h4{margin:3px 0 17px;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:15px;line-height:1.3;font-weight:700;color:#fff}
.site-footer .footer-links{display:flex;flex-direction:column;align-items:flex-start;gap:11px}
.site-footer .footer-links a,.site-footer .footer-links span{display:block;margin:0;padding:0;color:#b9bac8;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:14px;line-height:1.5;font-weight:400;text-decoration:none;transition:color .2s ease}
.site-footer .footer-links a:hover{color:#fff}
.site-footer .footer-bottom{margin-top:46px;padding-top:21px;border-top:1px solid #414252;color:#9294a4;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:12px;line-height:1.5;font-weight:400;display:flex;justify-content:space-between;gap:20px}

.portfolio{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.project{min-height:300px;border-radius:28px;padding:30px;position:relative;overflow:hidden;display:flex;align-items:end}.project.one{background:linear-gradient(135deg,#e8e6ff,#d9f4ff)}.project.two{background:linear-gradient(135deg,#fff0e6,#e3f8ef)}.project.three{background:linear-gradient(135deg,#e3f8ef,#e8e6ff)}.project.four{background:linear-gradient(135deg,#dff3ff,#fff0e6)}.project .label{background:rgba(255,255,255,.8);backdrop-filter:blur(8px);padding:18px 20px;border-radius:18px;width:100%}.project h3{margin:0 0 4px;font-family:Manrope}.project p{margin:0;color:var(--muted);font-size:13px}
.toast{position:fixed;right:20px;bottom:20px;background:#27283a;color:white;padding:14px 18px;border-radius:14px;box-shadow:var(--shadow);display:none;z-index:100;font-size:14px}
.reveal{opacity:0;transform:translateY(16px);transition:.6s}.reveal.show{opacity:1;transform:none}
@media(max-width:900px){
  .nav-links{display:none;position:absolute;top:78px;left:20px;right:20px;background:white;border:1px solid var(--line);border-radius:18px;padding:14px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch;gap:4px}.nav-links.open{display:flex}.nav-links a{padding:11px 13px}.nav-cta{display:none}.menu-btn{display:block}
  .hero-grid,.about-grid,.contact-grid{grid-template-columns:1fr}.hero{padding-top:60px}.hero-art{min-height:360px}.grid-3{grid-template-columns:1fr}.process{grid-template-columns:1fr 1fr}.stats{grid-template-columns:1fr 1fr}.site-footer .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:600px){
  .container{width:min(calc(100% - 28px),var(--container))}.hero h1{font-size:44px}.section{padding:65px 0}.section-head{display:block}.section-head h2{font-size:31px;margin-bottom:12px}.page-hero h1{font-size:40px}.hero-art{min-height:320px}.dashboard{inset:35px 10px 25px 10px}.float-one{right:-5px}.float-two{left:-5px}.process,.stats,.portfolio,.form-grid,.site-footer .footer-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.site-footer .footer-bottom{display:block}.site-footer .footer-bottom span{display:block;margin-top:8px}
}

.blog-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.blog-card{overflow:hidden;padding:0;transition:.25s}
.blog-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.blog-cover{height:220px;padding:25px;display:flex;align-items:flex-end;position:relative;overflow:hidden}
.blog-cover:before{content:"";position:absolute;width:180px;height:180px;border-radius:50%;background:rgba(255,255,255,.65);right:-45px;top:-50px}
.blog-cover:after{content:"";position:absolute;width:95px;height:95px;border-radius:28px;background:rgba(255,255,255,.55);left:38px;top:40px;transform:rotate(25deg)}
.blog-cover.lav{background:linear-gradient(135deg,#e8e6ff,#dff3ff)}
.blog-cover.mint{background:linear-gradient(135deg,#def8ee,#fff0e6)}
.blog-cover-label{position:relative;z-index:2;padding:8px 11px;border-radius:10px;background:rgba(255,255,255,.78);font-size:11px;font-weight:800;color:#6561dc;letter-spacing:.07em;text-transform:uppercase}
.blog-body{padding:27px 30px 30px}
.blog-meta{display:flex;gap:12px;color:var(--muted);font-size:12px;margin-bottom:10px}
.blog-body h2{font-family:Manrope;font-size:23px;line-height:1.25;margin:0 0 10px;letter-spacing:-.02em}
.blog-body p{color:var(--muted);margin:0}
.article{max-width:820px;margin:auto}
.article-intro{font-size:19px;color:var(--muted);line-height:1.75}
.article h2{font-family:Manrope;font-size:30px;line-height:1.25;margin:42px 0 13px;letter-spacing:-.025em}
.article h3{font-family:Manrope;font-size:21px;margin:30px 0 9px}
.article p{font-size:16px;color:#55576b}
.article ul{color:#55576b;padding-left:22px}
.article-callout{background:linear-gradient(135deg,#f1efff,#eef9ff);padding:27px 30px;border-radius:22px;margin:32px 0}
.article-callout p{font-family:Manrope;font-size:20px;color:var(--text);margin:0}
.article-cover{height:330px;border-radius:30px;margin:35px 0 45px;position:relative;overflow:hidden}
.article-cover.one{background:linear-gradient(135deg,#e8e6ff,#dff3ff)}
.article-cover.two{background:linear-gradient(135deg,#def8ee,#fff0e6)}
.article-cover:before{content:"";position:absolute;width:260px;height:260px;background:rgba(255,255,255,.58);border-radius:50%;right:80px;top:35px}
.article-cover:after{content:"✦";position:absolute;font-size:110px;color:#7774f2;left:120px;bottom:60px}
.article-back{display:inline-flex;color:var(--primary);font-weight:700;font-size:14px;margin-bottom:22px}
@media(max-width:700px){
 .blog-grid{grid-template-columns:1fr}.blog-cover{height:190px}.article-cover{height:230px}.article-cover:before{right:-50px}.article-cover:after{left:55px;bottom:35px}
}

/* Footer icon system */
.site-footer{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.site-footer .footer-grid{align-items:start}
.site-footer .footer-column h4{font-family:Inter,system-ui,sans-serif;font-weight:700;letter-spacing:-.01em}
.site-footer .footer-links{display:flex;flex-direction:column;gap:10px}
.site-footer .footer-links a,.site-footer .footer-links span{font-family:Inter,system-ui,sans-serif;font-size:15px;line-height:1.55;display:block}
.site-footer .footer-links a{color:inherit;text-decoration:none;transition:color .2s ease,transform .2s ease}
.site-footer .footer-links a:hover{color:#9fcfff;transform:translateX(2px)}


.footer-socials a:hover{transform:translateY(-2px);background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.25)}

.footer-contact{display:flex;flex-direction:column;gap:12px}
.footer-contact-item{display:flex!important;align-items:flex-start;gap:10px;color:inherit;text-decoration:none;font-family:Inter,system-ui,sans-serif;font-size:15px;line-height:1.55}
.footer-contact-item svg{width:17px;height:17px;min-width:17px;margin-top:3px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;opacity:.82}
.footer-contact-item:hover{color:#9fcfff}
@media(max-width:900px){.site-footer .footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.site-footer .footer-grid{grid-template-columns:1fr}.footer-contact{gap:10px}}

/* Final unified footer icon treatment */
.site-footer .footer-links a, .site-footer .footer-links > span {display:flex;align-items:center;gap:10px;}
.site-footer .footer-links svg {width:17px;height:17px;min-width:17px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;opacity:.78;}
.site-footer .footer-links a span, .site-footer .footer-links > span span {display:block;}
.site-footer .footer-contact-item {align-items:center!important;}
.site-footer .footer-contact-item svg {width:17px;height:17px;min-width:17px;}
.site-footer .footer-socials a {border-radius:50%;}


.footer-social{display:flex;align-items:center;gap:10px;margin-top:20px}
.footer-social a{width:36px;height:36px;border:1px solid rgba(255,255,255,.14);border-radius:11px;display:flex;align-items:center;justify-content:center;color:inherit;transition:all .2s ease}
.footer-social a:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.07)}
.footer-social svg{width:17px;height:17px;fill:currentColor;display:block}

.footer-socials{display:flex;align-items:center;gap:10px;margin-top:20px}
.footer-socials a{width:36px;height:36px;border:1px solid rgba(255,255,255,.14);border-radius:11px;display:flex;align-items:center;justify-content:center;color:inherit;transition:all .2s ease}
.footer-socials a:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.07)}
.footer-socials svg{width:17px;height:17px;fill:currentColor;display:block}

.alpha-eyebrow{letter-spacing:.12em;text-transform:uppercase;font-size:.76rem;font-weight:700;color:#7776e8}
.alpha-gradient-text{background:linear-gradient(90deg,#7776e8,#76b7e8);-webkit-background-clip:text;background-clip:text;color:transparent}
.alpha-products{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:32px}
.alpha-product{padding:26px;border-radius:22px;border:1px solid rgba(119,118,232,.12);background:rgba(255,255,255,.72);box-shadow:0 12px 35px rgba(74,72,130,.07)}
.alpha-product p{color:#77798c;line-height:1.7}.alpha-product h3{margin-bottom:9px}
.alpha-icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:#f1f0ff;margin-bottom:18px}
.alpha-icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7}
.alpha-tech{display:inline-block;padding:8px 12px;margin:4px;border-radius:999px;background:#f4f3ff;color:#6968a9;font-size:.78rem;font-weight:600}
.alpha-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:30px}
.alpha-flow div{padding:18px;border-radius:18px;background:#fafaff;border:1px solid rgba(119,118,232,.1)}
@media(max-width:900px){.alpha-products{grid-template-columns:1fr}.alpha-flow{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.alpha-flow{grid-template-columns:1fr}}


/* =========================================================
   AlphaSysLab — smooth static-page navigation
   Keeps the existing UI unchanged; only improves transitions.
   ========================================================= */

/* Chromium/Edge/Safari-style cross-document transition when supported. */
@view-transition {
  navigation: auto;
}

::view-transition-old(root) {
  animation: alpha-page-out 180ms ease both;
}

::view-transition-new(root) {
  animation: alpha-page-in 220ms ease both;
}

@keyframes alpha-page-out {
  from { opacity: 1; transform: translateY(0); }
  to   { opacity: 0; transform: translateY(-4px); }
}

@keyframes alpha-page-in {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Fallback for browsers without cross-document View Transitions. */
html.alpha-page-leaving body {
  opacity: 0;
  transform: translateY(-4px);
  transition: opacity 180ms ease, transform 180ms ease;
}

html.alpha-page-entering body {
  animation: alpha-page-enter 220ms ease both;
}

@keyframes alpha-page-enter {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Do not animate when the user requests reduced motion. */
@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root),
  ::view-transition-new(root) {
    animation: none;
  }

  html.alpha-page-leaving body,
  html.alpha-page-entering body {
    animation: none;
    transition: none;
  }
}

/* AlphaSysLab horizontal transparent logo — header-only brand asset. */
.site-header .logo {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  width: 190px;
  height: 54px;
  text-decoration: none;
  overflow: visible;
  position: relative;
  z-index: 3;
}
.site-header .brand-logo {
  width: 190px;
  height: 54px;
  max-width: none;
  max-height: none;
  display: block;
  object-fit: contain;
  object-position: left center;
  overflow: visible;
}
@media (max-width: 720px) {
  .site-header .logo {
    width: 158px;
    height: 46px;
  }
  .site-header .brand-logo {
    width: 158px;
    height: 46px;
  }
}

/* Header logo visibility fix: reserve space for the horizontal brand mark. */
.site-header .logo + * {
  min-width: 0;
}
@media (min-width: 721px) {
  .site-header nav,
  .site-header .nav,
  .site-header .nav-links {
    position: relative;
    z-index: 2;
  }
}


/* =========================================================
   AlphaSysLab — transparent horizontal logo visibility fix
   Header + Footer
   ========================================================= */

.site-header .logo,
header .logo,
.site-footer .logo,
footer .logo {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex: 0 0 auto !important;
  width: 220px !important;
  min-width: 220px !important;
  height: 58px !important;
  min-height: 58px !important;
  max-width: none !important;
  max-height: none !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  position: relative !important;
  z-index: 20 !important;
  white-space: nowrap !important;
}

.site-header .brand-logo,
header .brand-logo,
.site-footer .brand-logo,
footer .brand-logo {
  display: block !important;
  width: 220px !important;
  min-width: 220px !important;
  height: 58px !important;
  min-height: 58px !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: left center !important;
  overflow: visible !important;
  position: relative !important;
  z-index: 21 !important;
}

/* Reserve horizontal space so nav/content cannot cover the logo. */
.site-header .container,
.site-header .header-inner,
header .container,
header .header-inner,
.site-footer .container,
.site-footer .footer-inner,
footer .container,
footer .footer-inner {
  overflow: visible !important;
}

/* Keep navigation/content beside the logo instead of over it. */
.site-header nav,
.site-header .nav,
.site-header .nav-links,
header nav,
header .nav,
header .nav-links {
  position: relative !important;
  z-index: 10 !important;
  flex-shrink: 0 !important;
}

/* Footer columns must not overlap the brand column. */
.site-footer .footer-brand,
footer .footer-brand {
  position: relative !important;
  z-index: 20 !important;
  min-width: 240px !important;
  overflow: visible !important;
}

@media (max-width: 900px) {
  .site-header .logo,
  header .logo,
  .site-footer .logo,
  footer .logo {
    width: 190px !important;
    min-width: 190px !important;
    height: 50px !important;
    min-height: 50px !important;
  }

  .site-header .brand-logo,
  header .brand-logo,
  .site-footer .brand-logo,
  footer .brand-logo {
    width: 190px !important;
    min-width: 190px !important;
    height: 50px !important;
    min-height: 50px !important;
  }

  .site-footer .footer-brand,
  footer .footer-brand {
    min-width: 210px !important;
  }
}

@media (max-width: 720px) {
  .site-header .logo,
  header .logo {
    width: 160px !important;
    min-width: 160px !important;
    height: 44px !important;
    min-height: 44px !important;
  }

  .site-header .brand-logo,
  header .brand-logo {
    width: 160px !important;
    min-width: 160px !important;
    height: 44px !important;
    min-height: 44px !important;
  }
}


/* =========================================================
   AlphaSysLab Products — additive styles
   Existing design system remains unchanged.
   ========================================================= */

.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.product-card{padding:0 0 28px;overflow:hidden;transition:.25s}
.product-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.product-card h2,.product-card p,.product-card .text-link,.product-card .product-meta{margin-left:30px;margin-right:30px}
.product-card h2{font-family:Manrope;font-size:23px;line-height:1.25;margin-top:13px;margin-bottom:10px;letter-spacing:-.02em}
.product-card p{color:var(--muted);margin-top:0}
.product-meta{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px;margin-top:20px}
.product-status{display:inline-flex;padding:5px 8px;border-radius:99px;background:var(--mint);color:#398d71;font-size:10px;font-weight:800;letter-spacing:.08em}
.product-visual{height:235px;position:relative;overflow:hidden;display:grid;place-items:center}
.product-card-lav .product-visual{background:linear-gradient(135deg,#e8e6ff,#dff3ff)}
.product-card-blue .product-visual{background:linear-gradient(135deg,#dff3ff,#f0edff)}
.product-card-mint .product-visual{background:linear-gradient(135deg,#def8ee,#fff0e6)}
.device{position:relative;background:#292a3b;border:7px solid rgba(255,255,255,.9);box-shadow:0 18px 35px rgba(50,50,90,.16)}
.device-phone{width:105px;height:185px;border-radius:23px;transform:rotate(-7deg)}
.device-phone-ios{transform:rotate(7deg)}
.device-screen{position:absolute;inset:8px;border-radius:15px;background:linear-gradient(145deg,#f7f6ff,#dff3ff);display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text);gap:3px}
.device-screen b{font-family:Manrope;font-size:14px}.device-screen small{color:var(--muted);font-size:11px}
.device-dot{width:34px;height:6px;border-radius:99px;background:#c8c7dc;margin-bottom:15px}
.device-orb{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#8e8af8,#8dd6f7);box-shadow:0 8px 18px rgba(119,116,242,.25);margin-bottom:10px}
.product-bpm{position:relative}
.flow-node{position:absolute;width:48px;height:48px;border-radius:16px;background:rgba(255,255,255,.86);border:1px solid rgba(255,255,255,.95);box-shadow:0 12px 25px rgba(50,50,90,.08)}
.flow-node.n1{left:20%;top:35%}.flow-node.n2{left:43%;top:48%;background:#e8e6ff}.flow-node.n3{right:18%;top:28%;background:#dff3ff}
.flow-line{position:absolute;height:3px;background:#8c88f2;transform-origin:left center;border-radius:99px}
.flow-line.l1{left:29%;top:48%;width:18%;transform:rotate(18deg)}.flow-line.l2{left:51%;top:48%;width:20%;transform:rotate(-18deg)}
.flow-label{position:absolute;bottom:25px;left:30px;font-size:11px;letter-spacing:.08em;font-weight:800;color:#6561dc}

.product-detail-hero{padding:82px 0 75px;position:relative;overflow:hidden;background:linear-gradient(135deg,#f2f0ff,#f3fbff)}
.product-detail-hero:before{content:"";position:absolute;width:330px;height:330px;border-radius:50%;background:#e8e6ff;left:-160px;top:-130px}
.product-detail-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center;position:relative}
.product-detail-hero h1{font-family:Manrope;font-size:clamp(44px,5vw,68px);line-height:1.04;letter-spacing:-.045em;margin:20px 0 16px}
.product-detail-lead{font-size:18px;color:var(--muted);max-width:640px;margin:0 0 30px}
.alpha-gradient-text{background:linear-gradient(90deg,#7774f2,#6b83ee);-webkit-background-clip:text;background-clip:text;color:transparent}
.product-detail-art{height:410px;border-radius:30px;position:relative;overflow:hidden;box-shadow:var(--shadow);display:grid;place-items:center}
.detail-android{background:linear-gradient(145deg,#e8e6ff,#dff3ff)}
.detail-ios{background:linear-gradient(145deg,#dff3ff,#f0edff)}
.detail-bpm{background:linear-gradient(145deg,#def8ee,#fff0e6)}
.detail-art-inner{width:72%;height:70%;border-radius:26px;background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.92);box-shadow:0 20px 50px rgba(50,50,90,.10);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}
.detail-art-inner span{font-family:Manrope;font-size:34px;color:#6561dc}.detail-art-inner b{font-size:11px;letter-spacing:.1em;color:#398d71}.detail-art-inner small{color:var(--muted)}
.detail-ios .detail-art-inner span{color:#6679e8}.detail-bpm .detail-art-inner span{color:#4e9d82}
.product-detail-features{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.product-detail-feature{padding:28px;border:1px solid var(--line);background:white;border-radius:24px;display:flex;gap:18px}
.feature-number{font-family:Manrope;color:var(--primary);font-weight:800;font-size:13px}
.product-detail-feature h3{font-family:Manrope;margin:0 0 8px;font-size:18px}
.product-detail-feature p{color:var(--muted);font-size:14px;margin:0}
.product-legal-card{border-radius:30px;background:linear-gradient(135deg,#f1efff,#eef9ff);padding:42px;display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.product-legal-card h2{font-family:Manrope;font-size:32px;margin:16px 0 10px}.product-legal-card p{color:var(--muted);max-width:520px}
.product-legal-links{display:grid;gap:9px}
.product-legal-links a{display:flex;justify-content:space-between;align-items:center;padding:15px 17px;background:rgba(255,255,255,.75);border:1px solid rgba(255,255,255,.95);border-radius:14px;color:var(--text);font-weight:700;font-size:14px;transition:.2s}
.product-legal-links a:hover{transform:translateX(3px);color:var(--primary)}
.product-legal-links span{color:var(--primary)}
.legal-content{max-width:860px}
.legal-section{padding:28px 0;border-bottom:1px solid var(--line)}
.legal-section:first-child{padding-top:0}.legal-section:last-child{border-bottom:0}
.legal-section h2{font-family:Manrope;font-size:25px;margin:0 0 9px}.legal-section p{color:var(--muted);max-width:780px;margin:0}

@media(max-width:900px){
  .product-grid,.product-detail-features{grid-template-columns:1fr 1fr}
  .product-detail-hero-grid{grid-template-columns:1fr;gap:40px}
  .product-detail-art{height:330px}
  .product-legal-card{grid-template-columns:1fr;gap:25px}
}
@media(max-width:600px){
  .product-grid,.product-detail-features{grid-template-columns:1fr}
  .product-detail-hero{padding:60px 0}
  .product-detail-hero h1{font-size:44px}
  .product-legal-card{padding:30px 24px}
}


/* Product CMS: multi-image gallery and multiple product links */
.product-media-section { overflow: hidden; }
.product-gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}
.product-gallery-item {
    margin: 0;
    overflow: hidden;
    border-radius: 24px;
    background: var(--card, rgba(255,255,255,.72));
    border: 1px solid rgba(108,112,247,.10);
    box-shadow: 0 18px 50px rgba(46,46,58,.07);
}
.product-gallery-item img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}
.product-gallery-item figcaption {
    padding: 14px 18px 17px;
    font-size: .88rem;
    color: var(--text-secondary, #8A8A9D);
}
.product-links-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}
.product-link-card {
    display: flex;
    align-items: center;
    gap: 15px;
    min-height: 92px;
    padding: 15px 17px;
    border-radius: 20px;
    text-decoration: none;
    color: inherit;
    background: rgba(255,255,255,.72);
    border: 1px solid rgba(108,112,247,.10);
    box-shadow: 0 14px 40px rgba(46,46,58,.06);
    transition: transform .25s ease, box-shadow .25s ease;
}
.product-link-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 50px rgba(46,46,58,.10);
}
.product-link-icon {
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: 15px;
    background: rgba(108,112,247,.08);
}
.product-link-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.product-link-fallback {
    font-weight: 700;
    font-size: 1.15rem;
}
.product-link-copy {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.product-link-copy strong { font-size: .98rem; }
.product-link-copy small {
    color: var(--text-secondary, #8A8A9D);
    font-size: .78rem;
}
.product-link-arrow {
    font-size: 1.2rem;
    opacity: .55;
}
@media (max-width: 900px) {
    .product-gallery, .product-links-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
    .product-gallery, .product-links-grid { grid-template-columns: 1fr; }
}


/* =========================================================
   AlphaSysLab — Mobile Menu Geometry Restoration
   Restores the original mobile menu shown in the approved design.
   Does not change desktop navigation or menu JavaScript.
   ========================================================= */
@media (max-width: 900px) {
  .site-header .nav {
    position: relative !important;
    height: 78px;
  }

  .site-header .nav-links {
    display: none;
    position: absolute !important;
    top: 78px !important;
    left: 0 !important;
    right: 0 !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    z-index: 100 !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 4px !important;
    padding: 14px !important;
    background: #ffffff !important;
    border: 1px solid var(--line) !important;
    border-radius: 18px !important;
    box-shadow: var(--shadow) !important;
  }

  .site-header .nav-links.open {
    display: flex !important;
  }

  .site-header .nav-links a {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 11px 13px !important;
    white-space: nowrap !important;
  }

  .site-header .nav-cta {
    display: none !important;
  }

  .site-header .menu-btn {
    display: block !important;
    position: relative !important;
    z-index: 110 !important;
    flex: 0 0 42px !important;
  }
}

@media (max-width: 600px) {
  .site-header .nav {
    height: 68px;
  }

  .site-header .nav-links {
    top: 68px !important;
    left: 0 !important;
    right: 0 !important;
    padding: 14px !important;
  }
}
