/* =====================================
   千售OPC社区 - 风格复刻 opcstore.com
   ===================================== */

/* ===== RESET & VARIABLES ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;background:#060d1f}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans SC",sans-serif;color:#171717;background:#f6f8f9;line-height:1.6;-webkit-font-smoothing:antialiased}
a{text-decoration:none;color:inherit}
ul{list-style:none}
img{max-width:100%;display:block}
button{cursor:pointer;border:none;background:none;font-family:inherit}

:root {
  --color-primary: #ff8500;
  --color-primary-light: #ff9a00;
  --color-primary-dark: #e07400;
  --color-hero-bg: #0a0c10;
  --color-footer-bg: #1a1a2e;
  --container-width: 1320px;
  --container-padding: 24px;
}

/* ===== CONTAINER ===== */
.container{width:100%;max-width:var(--container-width);margin:0 auto;padding:0 var(--container-padding)}

/* ===== HEADER ===== */
.qheader{position:fixed;top:20px;left:0;right:0;z-index:1000;line-height:1}
.qheader.scrolled{top:0}
.qnav.scrolled{background:#fff !important;backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);box-shadow:0 2px 20px rgba(0,0,0,.06);border-radius:0}
.qnav.scrolled .nav-links a{color:#333;text-shadow:none}
.qnav.scrolled .nav-links a.active{color:#ff8500}
.qnav.scrolled .logo-a span{color:#171717;background:none;-webkit-text-fill-color:currentColor}
.qnav.scrolled .mobile-menu{color:#ff8500}

.qnav{display:flex;align-items:center;justify-content:center;position:relative;padding:10px 24px;border-radius:20px;background:transparent;box-shadow:none;transition:background .35s ease,box-shadow .35s ease,backdrop-filter .35s ease,border-radius .35s}

/* Logo */
.logo{position:absolute;left:24px;font-size:24px;font-weight:700;cursor:pointer;z-index:2}
.logo-a{display:flex;align-items:center}
.logo-a span{background:linear-gradient(45deg,#ff9a00,#ff8500,#ff4d00);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.logo-img{width:22px;margin-right:10px;border-radius:4px;overflow:hidden}
.logo-img img{width:100%;height:auto;display:block;object-fit:cover}

/* Nav Links */
.nav-links{display:flex;align-items:center;gap:25px;list-style:none}
.nav-links li{position:relative}
.nav-links a{display:inline-block;padding:0;font-size:15px;font-weight:400;color:rgba(255,255,255,.85);text-decoration:none;position:relative;transition:color .35s,text-shadow .35s}
.nav-links a:hover{color:#ff8500;text-shadow:none}
.nav-links a:hover:after{width:100%}
.nav-links a:after{content:"";position:absolute;bottom:-10px;left:0;width:0;height:2px;background:#ff8500;transition:width .3s}
.nav-links a.active{color:#ff8500;font-weight:bolder;text-shadow:none}
.nav-links a.active:after{width:100%}

/* User Area */
.user-area{display:flex;align-items:center;gap:12px;position:absolute;right:24px}
.btn-login{background:transparent;border:1px solid #ff8500;color:#ff8500;font-weight:500;font-size:13px;padding:6px 14px;border-radius:6px;transition:background .3s}
.btn-login:hover{background:rgba(255,133,0,.078);transform:none}

/* Mobile menu */
.mobile-menu{display:none;font-size:24px;cursor:pointer;color:#ff8500;position:absolute;right:12px}

/* ===== HERO ===== */
.hero{position:relative;height:100vh;min-height:640px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#060d1f}

/* Background layer */
.slide-bg{position:absolute;inset:0;z-index:0}
.slide-bg-1{background:radial-gradient(at 35% 30%,rgba(65,83,255,.18) 0%,transparent 50%),radial-gradient(at 65% 60%,rgba(10,50,140,.15) 0%,transparent 45%),radial-gradient(at 50% 80%,rgba(5,30,80,.2) 0%,transparent 50%),linear-gradient(170deg,rgba(6,13,31,.25) 0%,rgba(9,22,46,.25) 20%,rgba(13,31,68,.25) 45%,rgba(11,26,56,.25) 65%,rgba(6,16,37,.25) 100%)}
.slide-bg-2{background:radial-gradient(at 60% 25%,rgba(65,83,255,.16) 0%,transparent 50%),radial-gradient(at 30% 55%,rgba(15,60,160,.14) 0%,transparent 48%),radial-gradient(at 55% 75%,rgba(8,40,100,.18) 0%,transparent 50%),linear-gradient(170deg,rgba(7,14,34,.25) 0%,rgba(12,26,58,.25) 25%,rgba(19,42,82,.25) 50%,rgba(10,31,60,.25) 70%,rgba(7,14,34,.25) 100%)}
.slide-bg-3{background:radial-gradient(at 40% 35%,rgba(65,83,255,.17) 0%,transparent 52%),radial-gradient(at 70% 65%,rgba(12,45,130,.13) 0%,transparent 45%),radial-gradient(at 45% 85%,rgba(6,35,90,.19) 0%,transparent 48%),linear-gradient(170deg,rgba(6,16,34,.25) 0%,rgba(13,28,60,.25) 30%,rgba(10,22,40,.25) 55%,rgba(15,42,70,.25) 78%,rgba(6,16,34,.25) 100%)}

/* Particle canvas */
.hero-canvas{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;pointer-events:none}

/* Swiper */
.hero-swiper{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center}
.hero-swiper .swiper-wrapper{height:100%}
.hero-swiper .swiper-slide{display:flex;align-items:center;justify-content:center;position:relative}

/* Slide content */
.slide-content{position:relative;z-index:2;text-align:center;padding:0 32px;max-width:1000px;margin:0 auto}

/* s-line: entrance animation base */
.s-line{opacity:0;transform:translateY(24px);animation:sLineIn .6s ease forwards}
.s-line:nth-child(1){animation-delay:.1s}
.s-line:nth-child(2){animation-delay:.2s}
.s-line:nth-child(3){animation-delay:.3s}
.s-line:nth-child(4){animation-delay:.4s}
.s-line:nth-child(5){animation-delay:.5s}
.s-line:nth-child(6){animation-delay:.6s}
@keyframes sLineIn{to{opacity:1;transform:translateY(0)}}

/* Badge / tag */
.s-badge{display:inline-block;font-size:13px;font-weight:600;letter-spacing:2px;margin-bottom:20px;color:#5b9bff;text-transform:uppercase}

/* Secondary line (subtitle above h1) */
.hero-secondary{font-size:16px;line-height:27.2px;margin-bottom:20px;color:#c9c9d0}

/* h1 title */
.hero-title{font-size:56px;font-weight:700;line-height:70px;letter-spacing:normal;margin:0 0 20px;color:#fff}
.hero-title .text-gradient{background:linear-gradient(90deg,#5b9bff,#34cdfe);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}

/* Tagline (large description) */
.hero-tagline{font-size:22px;line-height:37.4px;margin-bottom:24px;color:#eeeef0}

/* Subtitle (small description) */
.hero-subtitle{font-size:16px;line-height:28.8px;margin-bottom:36px;color:#c9c9d0;max-width:720px;margin-left:auto;margin-right:auto}

/* Cursor blink */
.cursor-blink{display:inline-block;color:#5b9bff;font-weight:400;animation:blink 1s step-end infinite;margin-left:2px}
@keyframes blink{0%,to{opacity:1}50%{opacity:0}}

/* Buttons container */
.hero-buttons{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:0}

/* Primary button */
.btn-primary-lg{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:62.6px;padding:0 36px;border-radius:10px;font-size:16px;font-weight:600;background:linear-gradient(135deg,#4153ff,#6b7dff);color:#fff;transition:all .3s ease;text-decoration:none}
.btn-primary-lg:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(65,83,255,.4);color:#fff}
.btn-primary-lg .btn-arrow{font-size:18px;transition:transform .3s}
.btn-primary-lg:hover .btn-arrow{transform:translateX(3px)}

/* Scroll hint (secondary button/link) */
.hero-scroll-hint{font-size:14px;color:#888892;text-decoration:none;transition:color .3s;display:inline-flex;align-items:center;gap:4px}
.hero-scroll-hint:hover{color:#fff}

/* Hero responsive */
@media (max-width:1024px){
  .hero-title{font-size:42px;line-height:52px}
  .hero-tagline{font-size:18px;line-height:30px}
  .hero-subtitle{font-size:15px;max-width:560px}
  .hero-secondary{font-size:14px}
  .btn-primary-lg{height:56px;padding:0 30px;font-size:15px}
}
@media (max-width:768px){
  .hero{height:auto;min-height:520px}
  .slide-content{padding:80px 20px 60px}
  .s-badge{font-size:11px;margin-bottom:14px}
  .hero-secondary{font-size:13px;margin-bottom:14px;line-height:22px}
  .hero-title{font-size:30px;line-height:38px;margin-bottom:16px}
  .hero-tagline{font-size:15px;line-height:26px;margin-bottom:18px}
  .hero-subtitle{font-size:14px;line-height:24px;margin-bottom:28px;max-width:100%}
  .hero-buttons{flex-direction:column;gap:12px}
  .btn-primary-lg{height:50px;padding:0 28px;font-size:15px;width:100%;max-width:260px}
  .hero-scroll-hint{font-size:13px}
}

/* ===== SECTION HEADER ===== */
.sec-head{text-align:center;margin-bottom:48px}
.sec-head h2{font-size:clamp(1.75rem,3vw,3rem);font-weight:700;color:#171717;letter-spacing:-.02em;margin:0;line-height:1.65}
.sec-head-sub{font-size:1rem;color:#737373;max-width:640px;margin:12px auto 0;line-height:1.7}
.sec-eyebrow{display:inline-block;padding:6px 16px;border-radius:20px;background:rgba(255,133,0,.07);color:#ff8500;font-size:14px;font-weight:700;margin:0 0 16px;letter-spacing:.5px}

/* ===== CORE FEATURES (ftr-stream 2-column) ===== */
.sec-core{padding:100px 0 90px;background:#fff}
.ftr-stream{display:grid;grid-template-columns:1fr 1fr;gap:0 64px;position:relative;padding:30px 0 0;max-width:1240px;margin:0 auto}
.ftr-column{display:flex;flex-direction:column;gap:56px}
.ftr-node{display:flex;gap:28px;padding:20px 24px;border-radius:20px;background:transparent;transition:background .4s,box-shadow .4s;cursor:pointer}
.ftr-node:hover{background:rgba(255,133,0,.03);box-shadow:0 4px 24px rgba(0,0,0,.04)}
.ftr-hub{position:relative;width:96px;height:96px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.ftr-sigil{position:absolute;inset:0;width:96px;height:96px;color:rgba(255,133,0,.06);transition:color .4s}
.ftr-node:hover .ftr-sigil{color:rgba(255,133,0,.16)}
.ftr-hub-core{position:relative;z-index:1;color:#ff8500;font-size:20px;display:flex;align-items:center;justify-content:center}
.ftr-body{flex:1;display:flex;flex-direction:column;justify-content:center}
.ftr-tag-row{margin-bottom:6px}
.ftr-tag{display:block;padding:0;border-radius:0;background:transparent;color:#171717;font-size:23px;font-weight:700;line-height:1.3}
.ftr-body p{font-size:15px;color:#737373;line-height:1.65;margin:0 0 14px}
.ftr-link{color:#a3a3a3;font-size:17px;display:inline-flex;align-items:center;gap:6px;cursor:pointer;transition:color .25s,gap .25s}
.ftr-link i{font-size:13px}
.ftr-node:hover .ftr-link{color:#ff8500;gap:12px}
/* Vertical pipes */
.ftr-vpipe{position:absolute;width:1.5px;top:0;bottom:0;pointer-events:none;z-index:0}
.ftr-vpipe--left{left:50%;transform:translateX(calc(-50% - 20px))}
.ftr-vpipe--right{left:50%;transform:translateX(calc(-50% + 20px))}
.ftr-vpipe::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(255,133,0,.15) 10%,rgba(255,133,0,.08) 90%,transparent)}
.fvp-dot{position:absolute;left:50%;transform:translate(-50%,-50%);width:6px;height:6px;border-radius:50%;background:#ff8500;box-shadow:0 0 8px rgba(255,133,0,.3)}
.fvp-dot--1{top:12%}
.fvp-dot--2{top:44%}
.fvp-dot--3{top:78%}
/* Horizontal bridge */
.ftr-bridge{position:absolute;left:50%;bottom:-20px;transform:translateX(-50%);width:120px;height:1.5px;pointer-events:none;z-index:0}
.fb-line{display:block;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,133,0,.12),rgba(255,133,0,.18),rgba(255,133,0,.12),transparent)}
/* Reveal animations */
.reveal-fade-left{opacity:0;transform:translateX(-30px)}
.reveal-fade-right{opacity:0;transform:translateX(30px)}
.reveal-fade-up{opacity:0;transform:translateY(30px)}
.reveal-scale-up{opacity:0;transform:scale(.9)}
.reveal-visible{opacity:1;transform:translate(0) scale(1)}

/* ===== ECO (constellation) ===== */
.eco-sec{padding:110px 0 100px;background:#fff;position:relative;overflow:hidden}
.eco-bg-grid{position:absolute;inset:0;pointer-events:none;z-index:0;background-image:radial-gradient(circle,rgba(255,133,0,.03) 1px,transparent 1px);background-size:24px 24px;mask-image:linear-gradient(180deg,black 30%,transparent 100%);-webkit-mask-image:linear-gradient(180deg,black 30%,transparent 100%)}
.eco-constellation{position:relative;z-index:1;display:flex;justify-content:center;align-items:flex-start;gap:0;max-width:1100px;margin:0 auto;padding:30px 0 0}
.eco-pipeline{position:absolute;top:85px;left:15%;right:15%;height:1.5px;background:linear-gradient(90deg,transparent,rgba(255,133,0,.1) 15%,rgba(255,133,0,.18) 50%,rgba(255,133,0,.1) 85%,transparent);z-index:0;pointer-events:none}
.eco-node{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 32px;cursor:pointer}
/* Hub - concentric rings */
.eco-hub{position:relative;width:170px;height:170px;display:flex;align-items:center;justify-content:center;margin-bottom:32px;transition:transform .4s}
.eco-node:hover .eco-hub{transform:scale(1.04)}
.eco-num{position:absolute;font-size:130px;font-weight:900;color:rgba(0,0,0,.024);line-height:1;z-index:0;pointer-events:none}
.eco-hub-outer{position:absolute;width:170px;height:170px;border-radius:50%;border:1.5px solid rgba(255,133,0,.08);transition:border-color .4s}
.eco-node:hover .eco-hub-outer{border-color:rgba(255,133,0,.2)}
.eco-hub-ring{position:absolute;width:130px;height:130px;border-radius:50%;border:2px solid rgba(255,133,0,.12);transition:border-color .4s}
.eco-node:hover .eco-hub-ring{border-color:rgba(255,133,0,.25)}
.eco-hub-core{position:relative;z-index:1;width:62px;height:62px;border-radius:50%;background:linear-gradient(135deg,rgba(255,133,0,.06),rgba(255,133,0,.02));display:flex;align-items:center;justify-content:center;transition:background .4s}
.eco-node:hover .eco-hub-core{background:linear-gradient(135deg,rgba(255,133,0,.12),rgba(255,133,0,.04))}
.eco-hub-core::after{content:"";width:16px;height:16px;border-radius:50%;background:#ff8500;opacity:.35;transition:opacity .4s}
.eco-node:hover .eco-hub-core::after{opacity:.6}
/* Orbiting dots */
.eco-orbit{position:absolute;inset:-18px;border-radius:50%;pointer-events:none}
.eco-dot{position:absolute;width:6px;height:6px;border-radius:50%;background:#ff8500;opacity:.4}
.eco-dot--1{top:8%;left:50%;animation:ecoOrbit1 5s ease-in-out infinite}
.eco-dot--2{top:55%;left:88%;animation:ecoOrbit2 7s ease-in-out infinite}
.eco-dot--3{top:85%;left:20%;animation:ecoOrbit3 6s ease-in-out infinite}
.eco-node:nth-child(2) .eco-dot--1{animation-delay:-1.5s}
.eco-node:nth-child(2) .eco-dot--2{animation-delay:-2.5s}
.eco-node:nth-child(3) .eco-dot--1{animation-delay:-3s}
.eco-node:nth-child(3) .eco-dot--2{animation-delay:-1s}
@keyframes ecoOrbit1{0%,to{transform:translate(0,0)}50%{transform:translate(4px,-8px)}}
@keyframes ecoOrbit2{0%,to{transform:translate(0,0)}50%{transform:translate(-6px,4px)}}
@keyframes ecoOrbit3{0%,to{transform:translate(0,0)}50%{transform:translate(4px,6px)}}
/* Body below hub */
.eco-body{display:flex;flex-direction:column;align-items:center}
.eco-meta{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.eco-pin{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.eco-pin--orange{background:#ff8500}
.eco-pin--green{background:#4caf50}
.eco-pin--blue{background:#2196f3}
.eco-tag{font-size:14px;font-weight:700;color:#525252;letter-spacing:.5px}
.eco-body h3{font-size:1.35rem;font-weight:700;color:#171717;margin:0 0 10px;transition:color .3s}
.eco-node:hover .eco-body h3{color:#ff8500}
.eco-body p{font-size:.9rem;color:#737373;line-height:1.75;max-width:280px;margin:0}

/* ===== ABOUT ===== */
.sec-about{position:relative;overflow:hidden;padding:0;min-height:580px;display:flex;align-items:center}
.about-bg{position:absolute;inset:0;z-index:0;background:linear-gradient(135deg,#14142a,#0f0f23,#14142a)}
.about-overlay{position:absolute;inset:0;z-index:1;background:radial-gradient(ellipse 70% 50% at 50% 50%,rgba(255,133,0,.05),transparent 70%);pointer-events:none}
.about-wrap{position:relative;z-index:2;padding:90px 24px;width:100%}
.about-content{max-width:880px;margin:0 auto;text-align:center}
.about-content .sec-eyebrow{display:inline-block;font-size:14px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#ffb366;background:rgba(255,133,0,.15);border:1px solid rgba(255,133,0,.18);padding:6px 16px;border-radius:20px;margin-bottom:20px;backdrop-filter:blur(4px)}
.about-content h2{font-size:clamp(28px,3.2vw,42px);font-weight:700;letter-spacing:-.5px;margin:0 0 20px;line-height:1.25;color:#fff}
.about-divider{width:48px;height:3px;border-radius:2px;background:linear-gradient(90deg,#ff8500,#ffb366,transparent);margin:0 auto 22px}
.about-desc{font-size:17px;color:rgba(255,255,255,.78);line-height:1.85;margin:0 auto 40px;max-width:640px}
.about-drive-group{display:flex;align-items:center;justify-content:center;gap:32px;margin-bottom:36px;flex-wrap:wrap}
.adg-item{display:flex;align-items:center;gap:8px;font-size:15px;color:rgba(255,255,255,.7);transition:color .3s ease,transform .3s ease;cursor:pointer}
.adg-item:hover{color:#fff;transform:translateY(-2px)}
.adg-item-title{font-weight:700;color:rgba(255,255,255,.92);white-space:nowrap}
.adg-item-dot{color:#ff8500;font-weight:400;opacity:.5}
.adg-item-desc{opacity:.7}
.about-badges{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.about-badge{display:inline-flex;align-items:center;padding:10px 20px;background:rgba(255,255,255,.06);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.06);border-radius:12px;font-size:14px;font-weight:600;color:rgba(255,255,255,.93);transition:background .3s,box-shadow .3s,transform .3s,border-color .3s;cursor:pointer}
.about-badge:hover{background:rgba(255,255,255,.12);border-color:rgba(255,133,0,.3);box-shadow:0 2px 16px rgba(255,133,0,.12);transform:translateY(-2px)}

/* ===== ADVANTAGES (strength-split 3-column) ===== */
.sec-adv{padding:100px 0 90px;background:#fafaf9}
.strength-split{display:grid;grid-template-columns:1fr auto 1fr;gap:0;align-items:start}
.strength-col{padding:0 20px}
.strength-divider{width:1px;background:linear-gradient(180deg,transparent,rgba(255,133,0,.15),rgba(255,133,0,.08),transparent);align-self:stretch;min-height:200px}
.adv-col-header{margin-bottom:32px}
.adv-col-title{font-size:1.75rem;font-weight:700;color:#171717;margin:0 0 12px}
.adv-col-desc{font-size:.95rem;color:#737373;line-height:1.7;margin:12px 0 0}
.adv-list{display:flex;flex-direction:column;gap:0}
.adv-item{display:flex;align-items:flex-start;gap:16px;padding:18px 0;border-bottom:1px solid rgba(255,133,0,.06)}
.adv-item:last-child{border-bottom:none}
.adv-item-num{font-size:13px;font-weight:800;color:#ff8500;line-height:1.6;flex-shrink:0;width:34px;text-align:left}
.adv-item-text{font-size:16px;font-weight:400;color:#525252;line-height:1.6}
/* Center — vision */
.strength-col--center{text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:10px}
.strength-col--center .adv-col-title{font-size:2rem;margin:0 0 8px}
.strength-col--center .adv-col-desc{max-width:280px}
.strength-col--center .sec-eyebrow{margin-bottom:12px}

/* ===== ADVANTAGES (2-column) - legacy ===== */
.sec-adv{padding:100px 0 90px;background:#fafaf9}
.adv-split{display:grid;grid-template-columns:1fr 1fr;gap:80px}
.adv-col-header{margin-bottom:32px}
.adv-col-title{font-size:1.75rem;font-weight:700;color:#171717;margin:0 0 12px}
.adv-col-desc{font-size:.95rem;color:#737373;line-height:1.7;margin:12px 0 0}
.adv-list{display:flex;flex-direction:column;gap:0}
.adv-item{display:flex;align-items:flex-start;gap:16px;padding:18px 0;border-bottom:1px solid rgba(255,133,0,.06)}
.adv-item:last-child{border-bottom:none}
.adv-item-num{font-size:13px;font-weight:800;color:#ff8500;line-height:1.6;flex-shrink:0;width:34px;text-align:left}
.adv-item-text{font-size:16px;font-weight:400;color:#525252;line-height:1.6}

/* ===== NEWS ===== */
.sec-news{padding:80px 0;background:#fafaf9}
/* Split header */
.sec-head--split{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:48px}
.sec-head--split .sec-head-left{flex:1}
.sec-head--split .sec-eyebrow{margin:0 0 16px;display:block}
.sec-head--split h2{font-size:clamp(1.75rem,3vw,3rem);font-weight:700;color:#171717;letter-spacing:-.02em;margin:0;line-height:1.65}
.btn-view-all{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:500;color:#ff8500;white-space:nowrap;transition:gap .25s}
.btn-view-all::after{content:'→';font-size:14px;display:inline-block}
.btn-view-all:hover{gap:12px}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.news-card{border-radius:16px;overflow:hidden;background:#fff;border:1px solid #f0f0f0;cursor:pointer;transition:transform .3s ease,box-shadow .3s ease}
.news-card:hover{transform:translateY(-6px);box-shadow:0 12px 36px rgba(0,0,0,.08),0 2px 6px rgba(255,133,0,.06)}
.nc-visual{position:relative;height:210px;overflow:hidden;background:linear-gradient(135deg,#f5f5f5,#eee)}
.nc-visual img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.news-card:hover .nc-visual img{transform:scale(1.08)}
.nc-body{padding:20px 22px 22px}
.nc-cat{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.8px;color:#ff8500;margin-bottom:10px}
.nc-title{font-size:18px;font-weight:700;color:#171717;margin:0 0 8px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;transition:color .25s}
.news-card:hover .nc-title{color:#ff8500}
.nc-excerpt{font-size:14px;color:#a3a3a3;line-height:1.65;margin:0 0 16px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nc-footer{display:flex;align-items:center;justify-content:space-between;padding-top:14px;border-top:1px solid #f0f0f0}
.nc-date-line{font-size:13px;color:#a3a3a3}
.nc-readmore{font-size:13px;font-weight:600;color:#525252;transition:color .25s}
.news-card:hover .nc-readmore{color:#ff8500}
.nc-readmore i{font-size:10px}
.news-card:hover .nc-readmore{color:#ff8500;gap:8px}

/* ===== CTA ===== */
.sec-cta{padding:80px 0 0;position:relative;overflow:hidden;background:#fafaf9;padding-bottom:0}
.cta-card{position:relative;text-align:center;padding:72px 48px;background:linear-gradient(135deg,#ff8500,#e67700);overflow:hidden}
.cta-card::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(circle,rgba(255,255,255,.08) 1px,transparent 1px);background-size:20px 20px;mask-image:linear-gradient(180deg,black 60%,transparent 100%);-webkit-mask-image:linear-gradient(180deg,black 60%,transparent 100%)}
.cta-deco-ring{position:absolute;top:-60px;right:-60px;width:200px;height:200px;border-radius:50%;border:2px solid rgba(255,255,255,.08);pointer-events:none;z-index:0}
.cta-deco-dots{position:absolute;bottom:20px;left:40px;pointer-events:none;z-index:0}
.cta-deco-dots::before,.cta-deco-dots::after{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.15);margin:4px}
.cta-card h2{position:relative;z-index:1;font-size:clamp(30px,4vw,44px);font-weight:700;color:#fff;letter-spacing:-.5px;margin:0 0 16px}
.cta-card p{position:relative;z-index:1;font-size:18px;color:rgba(255,255,255,.75);max-width:520px;margin:0 auto 40px;line-height:1.7}
.btn-cta{position:relative;z-index:1;display:inline-flex;align-items:center;gap:10px;padding:17px 44px;background:#fff;color:#ff8500;border:none;border-radius:50px;font-size:18px;font-weight:700;cursor:pointer;transition:transform .22s,box-shadow .22s;box-shadow:0 4px 16px rgba(0,0,0,.12)}
.btn-cta:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.18)}

/* ===== FOOTER ===== */
.qfooter{background:var(--color-footer-bg);color:#fff;padding:60px 0 40px}
.footer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;margin-bottom:40px}
.footer-brand h4{font-size:1.25rem;font-weight:700;margin-bottom:12px}
.footer-brand p{font-size:.9rem;color:rgba(255,255,255,.55);line-height:1.6}
.footer-col h4{font-size:1rem;font-weight:700;margin-bottom:16px}
.footer-col ul{display:flex;flex-direction:column;gap:10px}
.footer-col a{font-size:.9rem;color:rgba(255,255,255,.55);transition:color .25s}
.footer-col a:hover{color:#ff8500}
.footer-contact p{font-size:.875rem;color:rgba(255,255,255,.55);margin-bottom:8px;line-height:1.8}
.footer-contact a{font-size:.875rem;color:rgba(255,255,255,.55);transition:color .25s}
.footer-contact a:hover{color:#ff8500}
.footer-bottom{padding-top:24px;border-top:1px solid #2a2a4a;text-align:center;font-size:14px;color:#b0b0b0}

/* ===== MOBILE DRAWER ===== */
.mobile-drawer{display:none}
.mobile-drawer.open{display:block}
.mobile-drawer-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:2000}
.mobile-drawer.open .mobile-drawer-overlay{display:block}
.mobile-drawer-panel{position:fixed;top:0;right:0;bottom:0;width:280px;background:#fff;z-index:2001;padding:48px 24px 24px;overflow-y:auto;transform:translateX(100%);transition:transform .3s ease}
.mobile-drawer.open .mobile-drawer-panel{transform:translateX(0)}
.mobile-drawer-close{position:absolute;top:16px;right:16px;font-size:20px;color:#737373;background:none;border:none;cursor:pointer}
.mobile-nav{display:flex;flex-direction:column;gap:4px}
.mobile-nav a{display:block;padding:12px 16px;font-size:15px;font-weight:500;color:#171717;border-radius:8px;transition:all .2s}
.mobile-nav a:hover,.mobile-nav a.active{color:#ff8500;background:rgba(255,133,0,.06)}
.mobile-nav .mobile-login-btn{margin-top:16px;text-align:center;color:#ff8500;background:transparent;border:1px solid #ff8500;font-weight:600;border-radius:6px}

/* ===== ANIMATIONS ===== */
@keyframes fadeUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}

/* ===== RESPONSIVE ===== */
@media (max-width:1024px){
  .nav-links{display:none}
  .mobile-menu{display:block}
  .user-area{right:48px}
  .ftr-stream{grid-template-columns:1fr;gap:24px 0;padding:16px 0 0}
  .ftr-vpipe{display:none}
  .ftr-node{flex-direction:column;align-items:flex-start;text-align:left}
  .ftr-hub{width:64px;height:64px}
  .ftr-sigil{width:64px;height:64px}
  .ftr-column{gap:20px}
  .ftr-tag{font-size:19px}
  .eco-constellation{flex-direction:column;gap:48px;padding:16px 0}
  .eco-pipeline{display:none}
  .eco-hub{width:150px;height:150px;margin-bottom:24px}
  .eco-hub-outer{width:150px;height:150px}
  .eco-hub-ring{width:110px;height:110px}
  .eco-hub-core{width:54px;height:54px}
  .eco-num{font-size:110px}
  .eco-node{padding:0}
  .news-grid{grid-template-columns:repeat(2,1fr);gap:16px}
  .about-drive-group{gap:20px}
  .adg-item{font-size:14px}
  .strength-split{grid-template-columns:1fr;gap:40px}
  .strength-divider{display:none}
  .strength-col--center{text-align:left;align-items:flex-start}
  .footer-grid{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:768px){
  .qnav{padding:10px 16px}
  .ftr-stream{grid-template-columns:1fr}
  .ftr-node{padding:16px}
  .eco-constellation{gap:32px}
  .eco-hub{width:130px;height:130px}
  .eco-hub-outer{width:130px;height:130px}
  .eco-hub-ring{width:96px;height:96px}
  .eco-hub-core{width:46px;height:46px}
  .eco-num{font-size:96px}
  .news-grid{grid-template-columns:1fr}
  .sec-core{padding:60px 0}
  .sec-about{min-height:auto}
  .about-wrap{padding:56px 24px}
  .about-content .about-desc{font-size:15px;max-width:520px}
  .about-drive-group{flex-direction:column;align-items:center;gap:14px}
  .adg-item{font-size:14px}
  .about-badges{gap:10px}
  .about-badge{font-size:13px;padding:8px 14px}
  .eco-sec,.sec-adv,.sec-news{padding:60px 0}
  .sec-cta{padding:48px 0 0}
  .cta-card{padding:48px 24px;max-width:100%}
  .cta-card h2{font-size:1.5rem}
  .cta-card p{font-size:1rem}
  .footer-grid{grid-template-columns:1fr;gap:32px}
  .sec-head{margin-bottom:32px}
  .sec-head h2{font-size:1.5rem}
}

/* ===== SUB-PAGE STYLES ===== */
.page-hero{background:linear-gradient(135deg,#0a0c10,#1a1030,#0a0c10);padding:140px 0 60px;text-align:center;position:relative;overflow:hidden}
.page-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 60% 40% at 50% 50%,rgba(65,83,255,.08),transparent 70%);pointer-events:none}
.page-hero .sec-eyebrow--white{display:inline-block;font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#5b9bff;background:rgba(65,83,255,.1);border:1px solid rgba(65,83,255,.15);padding:6px 16px;border-radius:20px;margin-bottom:20px}
.page-hero h1{font-size:2.5rem;font-weight:800;color:#fff;margin-bottom:12px;position:relative;z-index:1}
.page-hero p{font-size:1.125rem;color:#a3a3a3;margin:0;position:relative;z-index:1}
.page-content{padding:80px 0 60px;min-height:50vh;background:#fff}
.page-placeholder{text-align:center;padding:60px 20px}
.page-placeholder h2{font-size:1.5rem;font-weight:700;color:#171717;margin-bottom:12px}
.page-placeholder p{font-size:1rem;color:#525252;margin:0}

/* ===== AGENT PAGE ===== */
.agent-categories{display:flex;justify-content:center;flex-wrap:wrap;gap:10px}
.agent-cat{padding:8px 20px;border-radius:20px;border:1px solid #e0e0e0;background:#fff;color:#525252;font-size:14px;font-weight:500;cursor:pointer;transition:all .25s}
.agent-cat:hover,.agent-cat.active{background:#ff8500;color:#fff;border-color:#ff8500}
.agent-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.agent-card{position:relative;background:#fff;border-radius:16px;padding:32px 28px 24px;border:1px solid #f0f0f0;transition:transform .3s,box-shadow .3s;cursor:pointer}
.agent-card:hover{transform:translateY(-6px);box-shadow:0 12px 36px rgba(0,0,0,.08)}
.agent-card-badge{position:absolute;top:12px;right:12px;padding:3px 10px;border-radius:10px;font-size:11px;font-weight:700;color:#fff}
.agent-card-badge.hot{background:linear-gradient(135deg,#ff8500,#ff9a00)}
.agent-card-badge.new{background:linear-gradient(135deg,#4153ff,#6b7dff)}
.agent-card-icon{width:56px;height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:18px;color:#fff;font-size:22px}
.agent-card h3{font-size:1.2rem;font-weight:700;color:#171717;margin:0 0 10px}
.agent-card p{font-size:.9rem;color:#737373;line-height:1.65;margin:0 0 16px}
.agent-card-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:18px}
.agent-card-tags span{font-size:12px;padding:3px 10px;border-radius:6px;background:rgba(255,133,0,.06);color:#ff8500}
.agent-card-footer{display:flex;align-items:center;justify-content:space-between;padding-top:16px;border-top:1px solid #f0f0f0}
.agent-usage{font-size:13px;color:#a3a3a3}
.agent-cta{font-size:14px;font-weight:600;color:#ff8500;text-decoration:none;display:inline-flex;align-items:center;gap:4px;transition:gap .25s}
.agent-cta:hover{gap:8px}
.cta-card--agent{background:linear-gradient(135deg,#4153ff,#6b7dff)}

/* ===== MARKET PAGE ===== */
.market-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.market-stat{text-align:center;padding:28px 20px;background:#fff;border-radius:12px;border:1px solid #f0f0f0;transition:transform .3s}
.market-stat:hover{transform:translateY(-3px)}
.market-stat-icon{font-size:28px;color:#ff8500;margin-bottom:10px}
.market-stat-num{font-size:2rem;font-weight:800;color:#171717;margin-bottom:4px}
.market-stat-label{font-size:14px;color:#a3a3a3}
.market-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.market-item{display:flex;background:#fff;border-radius:16px;overflow:hidden;border:1px solid #f0f0f0;transition:transform .3s,box-shadow .3s;cursor:pointer}
.market-item:hover{transform:translateY(-4px);box-shadow:0 12px 36px rgba(0,0,0,.06)}
.market-item-thumb{width:180px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;min-height:180px}
.market-item-thumb-inner{display:flex;align-items:center;justify-content:center}
.market-item-cat{position:absolute;bottom:12px;left:12px;font-size:11px;padding:3px 10px;border-radius:10px;background:rgba(255,255,255,.15);color:#fff;font-weight:500}
.market-item-body{flex:1;padding:24px;display:flex;flex-direction:column}
.market-item-body h3{font-size:1.1rem;font-weight:700;color:#171717;margin:0 0 8px;line-height:1.4}
.market-item-body p{font-size:.875rem;color:#737373;line-height:1.6;margin:0 0 16px;flex:1}
.market-item-meta{display:flex;justify-content:space-between;margin-bottom:14px}
.market-price{font-size:1.1rem;font-weight:700;color:#ff8500}
.market-sales{font-size:13px;color:#a3a3a3}
.market-item-footer{display:flex;align-items:center;justify-content:space-between}
.market-rating{font-size:13px;color:#f59e0b}
.market-rating span{margin-left:4px;color:#a3a3a3}
.market-buy-btn{font-size:13px;font-weight:600;color:#ff8500;text-decoration:none;padding:6px 14px;border:1px solid #ff8500;border-radius:6px;transition:all .25s}
.market-buy-btn:hover{background:#ff8500;color:#fff}

/* ===== COLLEGE PAGE ===== */
.college-paths{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.college-path{position:relative;background:#fff;border-radius:20px;padding:36px 28px 28px;border:1px solid #f0f0f0;transition:transform .3s,box-shadow .3s}
.college-path:hover{transform:translateY(-6px);box-shadow:0 12px 36px rgba(0,0,0,.08)}
.college-path--featured{border-color:#ff8500;box-shadow:0 4px 24px rgba(255,133,0,.08)}
.college-path-badge{position:absolute;top:14px;right:14px;padding:4px 12px;border-radius:10px;font-size:12px;font-weight:700;color:#fff;background:linear-gradient(135deg,#ff8500,#ff9a00)}
.college-path-icon{width:60px;height:60px;border-radius:16px;display:flex;align-items:center;justify-content:center;margin-bottom:20px;font-size:24px}
.college-path h3{font-size:1.25rem;font-weight:700;color:#171717;margin:0 0 10px}
.college-path p{font-size:.9rem;color:#737373;line-height:1.6;margin:0 0 18px}
.college-path-list{list-style:none;padding:0;margin:0 0 20px;display:flex;flex-direction:column;gap:8px}
.college-path-list li{font-size:.875rem;color:#525252;display:flex;align-items:center;gap:8px}
.college-path-list li i{color:#2ecc71;font-size:14px}
.college-path-footer{display:flex;align-items:center;justify-content:space-between;padding-top:16px;border-top:1px solid #f0f0f0}
.college-path-footer span{font-size:13px;color:#a3a3a3}
.college-path-footer a{font-size:14px;font-weight:600;color:#ff8500;text-decoration:none}

/* ===== STAR PLAN PAGE (shared with pricing tiers) ===== */
.star-tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;max-width:1100px;margin:0 auto}
.star-tier{position:relative;background:#fff;border-radius:20px;padding:0;overflow:hidden;border:1px solid #f0f0f0;transition:transform .3s,box-shadow .3s}
.star-tier:hover{transform:translateY(-6px);box-shadow:0 12px 36px rgba(0,0,0,.08)}
.star-tier--featured{border-color:#ff8500;box-shadow:0 4px 24px rgba(255,133,0,.1);transform:scale(1.03)}
.star-tier--featured:hover{transform:scale(1.03) translateY(-6px)}
.star-tier-ribbon{position:absolute;top:16px;right:-30px;padding:4px 36px;background:linear-gradient(135deg,#ff8500,#ff9a00);color:#fff;font-size:12px;font-weight:700;transform:rotate(45deg);z-index:2}
.star-tier-header{padding:36px 28px 24px;text-align:center;border-bottom:1px solid #f0f0f0}
.star-tier-star{width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,#e0e0e0,#f5f5f5);display:flex;align-items:center;justify-content:center;margin:0 auto 14px;font-size:22px;color:#a3a3a3}
.star-tier-star--gold{background:linear-gradient(135deg,#ff8500,#ff9a00);color:#fff}
.star-tier-header h3{font-size:1.4rem;font-weight:700;color:#171717;margin:0 0 6px}
.star-tier-subtitle{font-size:.85rem;color:#a3a3a3;margin:0 0 16px}
.star-tier-price{margin-top:4px}
.star-tier-num{font-size:2.5rem;font-weight:800;color:#171717}
.star-tier-period{font-size:.9rem;color:#a3a3a3}
.star-tier-body{padding:28px}
.star-tier-body ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}
.star-tier-body li{font-size:.9rem;color:#525252;display:flex;align-items:center;gap:10px}
.star-tier-body li i.fa-check{color:#2ecc71;font-size:13px}
.star-tier-body li i.fa-times{color:#e0e0e0;font-size:13px}
.star-tier-disabled{opacity:.4}
.star-tier-cta{padding:0 28px 28px;text-align:center}

/* ===== COMMUNITY PAGE ===== */
.community-forums{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.community-forum{display:flex;align-items:center;gap:20px;background:#fff;border-radius:16px;padding:24px 28px;border:1px solid #f0f0f0;transition:transform .25s,box-shadow .25s}
.community-forum:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.06)}
.forum-icon{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff;font-size:20px}
.forum-info{flex:1}
.forum-info h3{font-size:1.1rem;font-weight:700;color:#171717;margin:0 0 4px}
.forum-info p{font-size:.85rem;color:#737373;margin:0 0 6px;line-height:1.4}
.forum-info span{font-size:12px;color:#a3a3a3}
.forum-enter{font-size:14px;font-weight:600;color:#ff8500;text-decoration:none;display:inline-flex;align-items:center;gap:4px;white-space:nowrap;transition:gap .25s}
.forum-enter:hover{gap:8px}

/* ===== WORKSPACE PAGE ===== */
.workspace-tools{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ws-tool{background:#fff;border-radius:16px;padding:28px 24px;border:1px solid #f0f0f0;text-align:center;transition:transform .3s,box-shadow .3s}
.ws-tool:hover{transform:translateY(-4px);box-shadow:0 8px 28px rgba(0,0,0,.06)}
.ws-tool-icon{width:56px;height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;color:#fff;font-size:22px}
.ws-tool h3{font-size:1.1rem;font-weight:700;color:#171717;margin:0 0 8px}
.ws-tool p{font-size:.85rem;color:#737373;line-height:1.5;margin:0 0 14px}
.ws-tool-link{font-size:14px;font-weight:600;color:#ff8500;text-decoration:none;transition:color .25s}
.ws-tool-link:hover{color:#ff9a00}

/* ===== GPU PAGE ===== */
.gpu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.gpu-card{position:relative;background:#fff;border-radius:16px;overflow:hidden;border:1px solid #f0f0f0;transition:transform .3s,box-shadow .3s;display:flex;flex-direction:column}
.gpu-card:hover{transform:translateY(-6px);box-shadow:0 12px 36px rgba(0,0,0,.08)}
.gpu-card--featured{border-color:#ff8500;box-shadow:0 4px 20px rgba(255,133,0,.08)}
.gpu-card-ribbon{position:absolute;top:12px;right:-28px;padding:3px 34px;background:linear-gradient(135deg,#ff8500,#ff9a00);color:#fff;font-size:11px;font-weight:700;transform:rotate(45deg);z-index:2}
.gpu-card-header{padding:24px 24px 16px;display:flex;align-items:center;justify-content:space-between}
.gpu-model{font-size:1.25rem;font-weight:800;color:#171717}
.gpu-badge{font-size:11px;padding:3px 10px;border-radius:8px;background:rgba(255,133,0,.08);color:#ff8500;font-weight:600}
.gpu-card-body{padding:0 24px 20px;flex:1}
.gpu-specs{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}
.gpu-spec{display:flex;justify-content:space-between;font-size:.85rem}
.gpu-spec-label{color:#a3a3a3}
.gpu-spec-value{color:#525252;font-weight:500}
.gpu-price{margin-bottom:10px}
.gpu-price-num{font-size:1.75rem;font-weight:800;color:#171717}
.gpu-availability{font-size:13px;font-weight:500}
.gpu-avail-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px}
.gpu-avail--green{background:#2ecc71}
.gpu-avail--yellow{background:#f59e0b}
.gpu-avail--red{background:#e74c3c}
.gpu-card-footer{padding:0 24px 24px}

/* ===== COMPUTE TABLE (policies) ===== */
.compute-table-wrap{overflow-x:auto}
.compute-table{width:100%;border-collapse:collapse;background:#fff;border-radius:12px;overflow:hidden}
.compute-table th,.compute-table td{padding:14px 18px;text-align:left;border-bottom:1px solid #f0f0f0;font-size:.9rem}
.compute-table th{background:#fafaf9;font-weight:600;color:#525252;font-size:.8rem;text-transform:uppercase;letter-spacing:.5px}
.compute-table td{color:#171717}
.compute-recommend{display:inline-block;padding:2px 8px;border-radius:6px;background:rgba(255,133,0,.1);color:#ff8500;font-size:11px;font-weight:700;margin-left:6px}

/* ===== RESPONSIVE (sub-pages) ===== */
@media(max-width:1024px){
  .agent-grid{grid-template-columns:repeat(2,1fr)}
  .market-grid{grid-template-columns:1fr}
  .college-paths{grid-template-columns:1fr;max-width:480px;margin:0 auto}
  .star-tiers{grid-template-columns:1fr;max-width:420px}
  .star-tier--featured{transform:scale(1)}
  .star-tier--featured:hover{transform:translateY(-6px)}
  .community-forums{grid-template-columns:1fr}
  .workspace-tools{grid-template-columns:repeat(2,1fr)}
  .gpu-grid{grid-template-columns:repeat(2,1fr)}
  .market-stats-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .page-hero{padding:120px 0 40px}
  .page-hero h1{font-size:1.75rem}
  .agent-grid{grid-template-columns:1fr}
  .agent-categories{gap:6px}
  .agent-cat{font-size:12px;padding:6px 14px}
  .market-item{flex-direction:column}
  .market-item-thumb{width:100%;min-height:140px}
  .market-stats-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .market-stat-num{font-size:1.5rem}
  .college-paths{max-width:100%}
  .star-tiers{max-width:100%}
  .workspace-tools{grid-template-columns:1fr}
  .gpu-grid{grid-template-columns:1fr}
  .compute-table-wrap{margin:0 -20px}
  .compute-table th,.compute-table td{padding:10px 12px;font-size:.78rem}
  .community-forum{flex-direction:column;text-align:center}
}
