
:root{
  --black:#101312;
  --black2:#171a18;
  --yellow:#f4c400;
  --yellow2:#ffdc42;
  --white:#fff;
  --paper:#f5f6f5;
  --ink:#111417;
  --muted:#616971;
  --line:#dedfdd;
  --dark-line:rgba(255,255,255,.08);
  --shadow:0 14px 44px rgba(0,0,0,.09);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--ink);font-family:Inter,Segoe UI,Microsoft YaHei,PingFang SC,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{text-decoration:none;color:inherit}
button{font:inherit}
img{display:block;max-width:100%}
.shell{width:min(1260px,calc(100% - 40px));margin:auto}

/* ANSYS-inspired header */
.utility{background:#171a18;color:#c9ceca;border-bottom:1px solid rgba(255,255,255,.05)}
.utility-inner{height:36px;display:flex;align-items:center;justify-content:space-between;font-size:11px}
.topbar{position:sticky;top:0;z-index:100;background:#101312;border-bottom:1px solid rgba(255,255,255,.06)}
.nav{height:82px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px;color:#fff}
.brand-mark{width:44px;height:44px;background:linear-gradient(135deg,var(--yellow2),#d9ab00);color:#111;display:grid;place-items:center;font-weight:900;font-size:22px;clip-path:polygon(22% 0,100% 0,78% 100%,0 100%)}
.brand strong{display:block;font-size:17px}
.brand small{display:block;font-size:9px;letter-spacing:.15em;color:#9ea6a1;margin-top:3px}
.navlinks{display:flex;align-items:center;gap:30px;color:#e2e5e2;font-size:14px;font-weight:650}
.navlinks a:hover{color:var(--yellow2)}
.nav-cta{background:var(--yellow);color:#121212;padding:15px 23px;border-radius:999px;font-size:14px;font-weight:850;white-space:nowrap}
.menu-btn{display:none;border:0;background:none;color:#fff;font-size:27px}
.mobile-nav{display:none;padding:0 18px 18px}
.mobile-nav a{display:block;color:#e3e7e4;padding:12px 0;border-top:1px solid rgba(255,255,255,.08)}
.mobile-nav.open{display:block}

/* hero */
.hero{background:#050605;color:#fff}
.hero-wrap{display:grid;grid-template-columns:.92fr 1.08fr;min-height:620px}
.hero-copy{padding:86px 58px 72px 0;display:flex;flex-direction:column;justify-content:center}
.eyebrow,.kicker{font-size:11px;font-weight:850;letter-spacing:.18em;text-transform:uppercase;color:var(--yellow)}
.hero-copy h1{font-size:clamp(47px,5.8vw,82px);line-height:1.01;letter-spacing:-.055em;margin:15px 0 14px}
.hero-cn{font-size:22px;color:#fff;font-weight:650;line-height:1.5;margin:0 0 10px}
.hero-desc{font-size:16px;color:#c2c8c4;line-height:1.8;max-width:590px;margin:0}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:31px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 20px;border-radius:0;border:1px solid #cfd4d0;font-size:13px;font-weight:800;cursor:pointer;transition:.15s}
.btn.primary,.btn.yellow{background:var(--yellow);border-color:var(--yellow);color:#111}
.btn.secondary{color:#fff;border-color:#626762;background:transparent}
.btn:hover{transform:translateY(-1px)}
.hero-card{display:flex;align-items:center;padding:44px 0 44px 24px}
.hero-shot{background:#1a1d1b;border:1px solid rgba(255,255,255,.08);padding:12px;box-shadow:0 26px 60px rgba(0,0,0,.25)}
.hero-shot img{width:100%;aspect-ratio:16/9;object-fit:cover;object-position:top center}

/* ribbon */
.product-ribbon{background:#171a18;color:#fff;border-top:1px solid var(--dark-line);border-bottom:1px solid var(--dark-line)}
.ribbon-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.ribbon-grid div{padding:22px 20px;border-right:1px solid rgba(255,255,255,.08)}
.ribbon-grid div:last-child{border-right:0}
.ribbon-grid span{display:block;color:var(--yellow);font-size:10px;font-weight:800}
.ribbon-grid b{display:block;margin-top:7px;font-size:13px}

/* general */
.section{padding:88px 0}
.section.soft{background:var(--paper)}
.section.dark{background:#111411;color:#fff}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:36px}
.section-head h2{font-size:42px;letter-spacing:-.04em;line-height:1.1;margin:8px 0 0}
.section-head p{max-width:550px;margin:0;color:var(--muted);font-size:14px;line-height:1.8}
.section.dark .section-head p{color:#b9c0bb}

.overview-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:26px}
.overview-media{background:#edf0ed;border:1px solid var(--line)}
.overview-media img{width:100%;height:100%;object-fit:cover;object-position:top center}
.overview-copy{border-top:1px solid var(--line)}
.overview-line{display:grid;grid-template-columns:48px 1fr;gap:12px;padding:20px 0;border-bottom:1px solid var(--line)}
.overview-line>span{font-size:11px;color:#9a7c00;font-weight:800}
.overview-line b{font-size:16px}
.overview-line p{margin:7px 0 0;color:#6b737b;font-size:13px;line-height:1.7}

.cap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.cap-card{background:#fff;border:1px solid var(--line);padding:22px;min-height:170px}
.cap-card .id{font-size:10px;color:#a48300;font-weight:850}
.cap-card h3{margin:16px 0 8px;font-size:19px}
.cap-card p{margin:0;color:#68717a;font-size:13px;line-height:1.75}

.demo-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.demo-card{background:#fff;color:#111;border:1px solid #d7dad7;overflow:hidden}
.demo-card img{width:100%;aspect-ratio:16/9;object-fit:cover;background:#dfe3df}
.demo-card div{padding:16px}
.demo-card strong{display:block;font-size:17px}
.demo-card span{display:block;color:#68717a;margin-top:6px;font-size:13px}
.dark-grid .demo-card{border-color:#2a2e2a}
.center-action{text-align:center;margin-top:28px}

.scenario-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.scenario{border:1px solid var(--line);background:#fff}
.scenario img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top center}
.scenario .copy{padding:17px 18px 20px}
.scenario h3{font-size:22px;margin:0 0 7px}
.scenario p{margin:0;color:#68717a;font-size:13px;line-height:1.7}

/* BSFS detail is embedded in the homepage */
.bsfs-detail{background:#050605;color:#fff}
.bsfs-detail-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:28px;align-items:start}
.bsfs-detail-copy{padding:30px 0}
.bsfs-detail-copy h2{font-size:42px;line-height:1.08;letter-spacing:-.04em;margin:10px 0 14px}
.bsfs-detail-copy p{color:#c0c7c2;line-height:1.8;font-size:14px}
.bsfs-detail-media{background:#191c1a;border:1px solid rgba(255,255,255,.08);padding:10px}
.bsfs-detail-media img{width:100%}
.bsfs-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:28px}

/* supporting tools */
.support-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.support-card{background:#fff;border:1px solid var(--line);cursor:pointer;text-align:left;padding:0}
.support-card img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top center;background:#ecefed}
.support-card div{padding:16px}
.support-card strong{display:block;font-size:17px}
.support-card span{display:block;margin-top:6px;color:#68717a;font-size:12px;line-height:1.65}
.support-card em{display:block;margin-top:12px;font-style:normal;color:#8e7400;font-size:11px;font-weight:800}

/* modal for all auxiliary software: no page navigation */
.modal{position:fixed;inset:0;z-index:1000;background:rgba(5,6,5,.88);display:none;align-items:center;justify-content:center;padding:24px}
.modal.open{display:flex}
.modal-panel{width:min(1100px,96vw);max-height:90vh;overflow:auto;background:#fff;color:#111;border:1px solid #d8dbd8}
.modal-head{position:sticky;top:0;background:#fff;z-index:2;display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--line)}
.modal-head h3{margin:0;font-size:24px}
.modal-close{width:40px;height:40px;border:1px solid #ccc;background:#fff;font-size:23px;cursor:pointer}
.modal-body{padding:20px}
.modal-lead{display:grid;grid-template-columns:.8fr 1.2fr;gap:20px;align-items:center;margin-bottom:22px}
.modal-lead p{color:#68717a;line-height:1.8}
.modal-lead img{width:100%;border:1px solid var(--line)}
.modal-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.modal-gallery figure{margin:0;border:1px solid var(--line)}
.modal-gallery img{width:100%;aspect-ratio:16/10;object-fit:contain;background:#eef1ee}
.modal-gallery figcaption{padding:10px 12px;color:#667078;font-size:12px}

/* image lightbox */
.shot{margin:0;background:#fff;border:1px solid var(--line);cursor:pointer}
.shot img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top center;background:#edf0ed}
.shot figcaption{padding:13px 15px;color:#667078;font-size:12px}
.lb{position:fixed;inset:0;background:rgba(4,5,4,.92);display:none;align-items:center;justify-content:center;padding:24px;z-index:1100}
.lb.open{display:flex}.lb img{max-width:95vw;max-height:88vh}.lb button{position:absolute;right:18px;top:18px;width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);color:#fff;font-size:24px}

.footer{background:#101312;color:#adb5af;padding:31px 0;border-top:1px solid rgba(255,255,255,.07)}
.footer-inner{display:flex;justify-content:space-between;gap:20px;font-size:12px}
.footer strong{color:#fff}

@media(max-width:1050px){
  .hero-wrap,.overview-grid,.bsfs-detail-grid,.modal-lead{grid-template-columns:1fr}
  .hero-copy{padding-right:0;padding-bottom:28px}
  .hero-card{padding:0 0 42px}
  .cap-grid,.support-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:860px){
  .utility{display:none}
  .navlinks,.nav-cta{display:none}
  .menu-btn{display:block}
  .ribbon-grid{grid-template-columns:repeat(2,1fr)}
  .ribbon-grid div:nth-child(2){border-right:0}
  .section-head{flex-direction:column;align-items:flex-start}
  .demo-grid,.scenario-grid,.bsfs-gallery,.modal-gallery{grid-template-columns:1fr}
}
@media(max-width:620px){
  .shell{width:calc(100% - 24px)}
  .nav{height:70px}
  .brand-mark{width:39px;height:39px}
  .brand strong{font-size:14px}
  .brand small{font-size:8px}
  .hero-copy{padding:42px 0 24px}
  .hero-copy h1{font-size:40px}
  .hero-cn{font-size:18px}
  .hero-desc{font-size:14px}
  .hero-actions{gap:9px}
  .btn{width:100%}
  .hero-card{padding-bottom:24px}
  .hero-shot{padding:8px}
  .ribbon-grid,.cap-grid,.support-grid{grid-template-columns:1fr}
  .ribbon-grid div{border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}
  .ribbon-grid div:last-child{border-bottom:0}
  .section{padding:64px 0}
  .section-head h2,.bsfs-detail-copy h2{font-size:30px}
  .overview-line{grid-template-columns:36px 1fr}
  .scenario h3{font-size:19px}
  .footer-inner{flex-direction:column}
  .modal{padding:8px}
  .modal-panel{max-height:96vh}
}

/* V9.3 independent product pages */
.product-page-hero{background:#050605;color:#fff;padding:72px 0 62px}
.product-page-grid{display:grid;grid-template-columns:.78fr 1.22fr;gap:42px;align-items:center}
.product-page-copy h1{font-size:clamp(42px,5.5vw,72px);line-height:1.03;letter-spacing:-.05em;margin:14px 0 12px}
.product-page-copy .lead{font-size:19px;line-height:1.6;color:#fff;font-weight:650;margin:0 0 14px}
.product-page-copy .desc{font-size:14px;line-height:1.85;color:#c0c8c2;margin:0}
.product-page-shot{background:#191c1a;border:1px solid rgba(255,255,255,.08);padding:10px}
.product-page-shot img{width:100%}
.product-page-back{display:inline-block;color:#b9c0bb;font-size:12px;margin-bottom:22px}

.product-feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.product-feature{border:1px solid var(--line);background:#fff;padding:22px;min-height:165px}
.product-feature span{font-size:10px;color:#987900;font-weight:850}
.product-feature h3{margin:14px 0 8px;font-size:18px}
.product-feature p{margin:0;color:#68717a;font-size:13px;line-height:1.75}

.product-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}
.product-gallery figure{margin:0;background:#fff;border:1px solid var(--line)}
.product-gallery img{width:100%;aspect-ratio:16/10;object-fit:contain;object-position:center;background:#eef1ee}
.product-gallery figcaption{padding:12px 14px;color:#667078;font-size:12px}

.tool-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.tool-summary a{display:block;background:#fff;border:1px solid var(--line)}
.tool-summary img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top center}
.tool-summary div{padding:16px}
.tool-summary strong{display:block;font-size:17px}
.tool-summary span{display:block;color:#68717a;font-size:12px;line-height:1.65;margin-top:6px}
.tool-summary em{display:block;color:#8d7100;font-style:normal;font-size:11px;font-weight:800;margin-top:10px}

@media(max-width:950px){
  .product-page-grid{grid-template-columns:1fr}
  .product-feature-grid,.tool-summary{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:650px){
  .product-page-hero{padding:42px 0 36px}
  .product-page-copy h1{font-size:38px}
  .product-page-copy .lead{font-size:17px}
  .product-feature-grid,.tool-summary,.product-gallery{grid-template-columns:1fr}
}
