/* Homepage styles — 高端科技感，响应式 */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700;800&display=swap');

:root{
  --bg:#0b1020;
  --bg-2:#071022;
  --primary:#00d1ff;
  --accent:#6f5cff;
  --glass:rgba(255,255,255,0.06);
  --muted:rgba(255,255,255,0.6);
  --card:linear-gradient(135deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01));
  --radius:12px;
  --max-width:1200px;
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft Yahei", Arial;
}
  /* header 响应式基础样式，覆盖并修复移动端变形问题 */
  .brand{color:#fff;font-weight:700;font-size:1.1rem;display:flex;align-items:center;gap:12px}
  .brand-logo{height:40px;width:auto}
  .nav-toggle{display:none;background:transparent;border:0;color:#dff4ff;font-size:22px;padding:8px;border-radius:6px}
  .main-nav{position:relative}
  .main-nav .nav-list{list-style:none;margin:0;padding:0;display:flex;gap:18px;align-items:center}
  .main-nav a{color:rgba(255,255,255,0.92);text-decoration:none}
  .dropdown{position:relative}
  .dropdown-menu{display:none;position:absolute;top:100%;left:0;background:rgba(2,6,23,0.95);padding:8px;border-radius:8px;min-width:160px;box-shadow:0 6px 18px rgba(2,6,23,0.6)}
  .dropdown:hover .dropdown-menu{display:block}

  /* 手机与窄屏调整：将导航改为隐藏的垂直抽屉，可通过 .nav-open 展示 */
  @media (max-width: 900px){
      .nav-toggle{display:inline-flex;align-items:center;justify-content:center}
      .header-inner{display:flex;align-items:center;gap:12px}
      .main-nav{position:absolute;left:0;right:0;top:64px;background:linear-gradient(180deg,rgba(4,8,16,0.98),rgba(2,4,10,0.98));padding:12px;border-bottom:1px solid rgba(255,255,255,0.03);transform:translateY(-8px);opacity:0;visibility:hidden;transition:all .25s ease}
      header.nav-open .main-nav{transform:translateY(0);opacity:1;visibility:visible}
      .main-nav .nav-list{flex-direction:column;gap:10px}
      .main-nav .nav-list .nav-item{width:100%}
      .main-nav .nav-list a{display:block;padding:10px 12px;border-radius:8px}
      .dropdown-menu{position:static;margin-top:6px;padding:6px 8px;border-radius:6px;box-shadow:none}
      .dropdown.open > .dropdown-menu{display:block}
      .dropdown .caret{float:right;transform:rotate(0);transition:transform .18s}
      .dropdown.open .caret{transform:rotate(90deg)}
      .header-actions{margin-left:auto}
  }
*{box-sizing:border-box}
.html,body{height:100%;margin:0;font-family:var(--font-sans);background: radial-gradient(1200px 600px at 10% 10%, rgba(16,22,40,0.6), transparent), var(--bg); color:#fff; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale}
.container{max-width:var(--max-width);margin:0 auto;padding:0 20px}

.hero{position:relative;overflow:hidden;min-height:64vh;display:flex;align-items:center}
.particle-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;display:block}
.hero-inner{position:relative;z-index:5;padding:80px 0;max-width:1000px}
.hero-title{font-size:2.8rem;letter-spacing:0.6px;margin:0 0 14px;font-weight:800;line-height:1.05;background:linear-gradient(90deg,var(--primary),var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-sub{color:var(--muted);font-size:1.05rem;margin:0 0 20px}
.hero-ctas{display:flex;gap:12px}
.btn{display:inline-block;padding:12px 20px;border-radius:8px;text-decoration:none;font-weight:600;border:1px solid transparent;backdrop-filter:blur(6px)}
.btn.primary{background:linear-gradient(90deg,var(--primary),var(--accent));color:#041024}
.btn.ghost{background:transparent;border:1px solid rgba(255,255,255,0.08);color:var(--muted)}

/* Features grid */
.features{padding:40px 0}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.feature-card{background:var(--card);padding:22px;border-radius:var(--radius);box-shadow:0 6px 18px rgba(2,6,23,0.6);transition:transform .28s ease;display:flex;flex-direction:column;justify-content:center}
.feature-card:hover{transform:translateY(-6px)}
.feature-card .icon{font-size:30px;margin-bottom:12px}
.feature-card h3{margin:0 0 8px;font-weight:700}
.feature-card h3 a{color:#fff;text-decoration:none}
.feature-card p{margin:0;color:var(--muted)}

.showcase{padding:40px 0}
.section-title{margin:0 0 18px;font-size:1.4rem;font-weight:700;letter-spacing:0.2px}

/* 区分公司简介与最新资讯的标题样式 */
.company .section-title{
  font-size:2rem;
  font-weight:800;
  letter-spacing:0.6px;
  margin-bottom:18px;
  background:linear-gradient(90deg,var(--primary),var(--accent));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  position:relative;
  padding-bottom:8px;
}
.company .section-title::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:72px;
  height:4px;
  background:linear-gradient(90deg,var(--primary),var(--accent));
  border-radius:3px;
  opacity:0.95;
}

.news .section-title{
  font-size:2rem;
  font-weight:800;
  letter-spacing:0.6px;
  margin-bottom:18px;
  background:linear-gradient(90deg,var(--primary),var(--accent));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  position:relative;
  padding-bottom:8px;
}
.news .section-title::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:72px;
  height:4px;
  background:linear-gradient(90deg,var(--primary),var(--accent));
  border-radius:3px;
  opacity:0.95;
}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));border-radius:12px;overflow:hidden;box-shadow:0 8px 30px rgba(2,6,23,0.6)}
.card-media{height:140px;background:linear-gradient(90deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));}
.card-body{padding:16px}
.card-body h4{margin:0 0 8px}
.card-body p{margin:0;color:var(--muted)}

/* 公司简介模块样式 */
.company-block{display:grid;grid-template-columns:1fr 420px;gap:24px;align-items:center;padding:18px 0}
.company-text p{margin:0 0 12px}
.company-media{height:220px;border-radius:12px;background:linear-gradient(90deg, rgba(0,209,255,0.06), rgba(111,92,255,0.04));box-shadow:inset 0 -20px 60px rgba(0,0,0,0.25)}

@media (max-width:1024px){
  .company-block{grid-template-columns:1fr}
}

.contact{padding:40px 0}
.contact-inner{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center}
.contact-info h3{margin:0 0 8px}
.contact-info h3{
  /* 保持字号不变，仅应用公司/新闻标题的样式和装饰 */
  font-weight:800;
  letter-spacing:0.6px;
  background:linear-gradient(90deg,var(--primary),var(--accent));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  position:relative;
  padding-bottom:8px;
}
.contact-info h3::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:72px;
  height:4px;
  background:linear-gradient(90deg,var(--primary),var(--accent));
  border-radius:3px;
  opacity:0.95;
}
.contact-info p{margin:0 0 8px;color:var(--muted)}
.contact-form{display:flex;flex-direction:column;gap:10px}
.contact-form input,.contact-form textarea{padding:12px;border-radius:8px;border:1px solid rgba(255,255,255,0.06);background:transparent;color:#fff}
.contact-form button{align-self:flex-start}
.muted{color:var(--muted);font-size:0.95rem}

/* Navigation: 单列布局，悬停或 .open 展示子菜单 */
.site-header{padding:14px 0}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{font-size:1.15rem;display:flex;align-items:center;gap:12px;background-color: #fff;padding:10px 16px;border-radius:8px}
.brand-logo{height:44px;width:auto;display:inline-block}
.brand-text{display:none;font-weight:700;color:#fff}
.main-nav{position:relative}
.main-nav .nav-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:row;gap:20px;align-items:center}
.main-nav .nav-item{position:relative;padding:6px 10px;border-radius:6px}
.main-nav .nav-item > a{color:#fff;display:inline-flex;justify-content:flex-start;align-items:center;gap:8px}
.main-nav .nav-item:hover{background:rgba(255,255,255,0.02)}
.main-nav .caret{opacity:0.6;font-size:0.85rem}

/* footer links match main page primary links (also used elsewhere as .footer-link) */
.site-footer .footer-link,
.footer-link{color:#fff;text-decoration:none;font-weight:600;transition:all .18s ease}
.site-footer .footer-link:hover,
.footer-link:hover{background:linear-gradient(90deg,var(--primary),var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent}

/* make contact info links consistent */
.contact-info a.footer-link{display:inline-block;padding:2px 6px;border-radius:6px;background:transparent}
.contact-info a.footer-link:hover{transform:translateY(-3px)}

/* Sub-links / 子栏目 样式，用于 about/services/news 顶部 */
.sub-links{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 8px}
.sub-link{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,0.02);color:var(--muted);text-decoration:none;font-weight:600;transition:all .18s ease}
.sub-link:hover{background:linear-gradient(90deg, rgba(0,209,255,0.08), rgba(111,92,255,0.06));color:#fff;transform:translateY(-4px)}
.sub-link.active{background:linear-gradient(90deg,var(--primary),var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent;box-shadow:0 8px 30px rgba(0,209,255,0.06)}

@media (max-width:640px){
  .sub-links{gap:8px}
  .sub-link{padding:8px 10px;font-size:0.95rem}
}
.dropdown-menu{position:absolute;left:0;top:100%;min-width:220px;background:rgba(2,6,23,0.95);padding:8px;border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,0.6);z-index:40;
  /* hidden by default */
  opacity:0;visibility:hidden;transform:translateY(8px);pointer-events:none;transition:transform .18s ease,opacity .18s ease,visibility .18s}
/* show on hover or when JS toggles .open */
.dropdown:hover .dropdown-menu,.dropdown.open .dropdown-menu{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto}
.dropdown-menu{margin:0;padding:8px;list-style:none}
.dropdown-menu li{list-style:none;padding:8px 10px}
.dropdown-menu li a{color:var(--muted);display:block}

/* header actions (right side) */
.header-actions{display:flex;align-items:center;gap:12px}
.header-phone{background:linear-gradient(90deg,var(--primary),var(--accent));padding:8px 12px;border-radius:999px;color:#041024;font-weight:700}
.header-phone a{color:inherit;text-decoration:none}

/* 重设计最新资讯为卡片列表 */
.news-list ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.news-list li{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:14px;border-radius:12px;display:flex;flex-direction:column;gap:8px;box-shadow:0 8px 24px rgba(2,6,23,0.6);transition:transform .18s ease,box-shadow .18s ease}
.news-list li:hover{transform:translateY(-6px);box-shadow:0 18px 36px rgba(2,6,23,0.7)}
.news-list li a{font-weight:600;color:#fff;text-decoration:none}
.news-list .muted{color:var(--muted);font-size:0.9rem}
.news-list li::after{content:"";height:1px;background:rgba(255,255,255,0.03);display:block;margin-top:8px}

.news-more a.btn{padding:8px 14px}

/* Responsive */
@media (max-width:1024px){
  .grid{grid-template-columns:repeat(2,1fr)}
  .cards{grid-template-columns:repeat(2,1fr)}
  .contact-inner{grid-template-columns:1fr}
  .news-list ul{grid-template-columns:repeat(2,1fr)}
  .brand-text{display:none}
  .header-phone{padding:6px 10px;font-size:0.95rem}
}
@media (max-width:640px){
  .hero-inner{padding:40px 0}
  .hero-title{font-size:1.6rem}
  .grid{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr}
  .contact-inner{grid-template-columns:1fr}
  .hero{min-height:56vh}
  .main-nav .nav-list{flex-direction:column}
  .news-list ul{grid-template-columns:1fr}
  .header-inner{flex-direction:row;align-items:center}
  .brand-text{display:none}
  .header-phone{display:inline-block}
}

/* Small visual polish */
.homepage-root header{position:relative;z-index:10}
.hero-inner{padding-left:20px}

/* accessibility */
.btn:focus{outline:2px solid rgba(0,208,255,0.25);outline-offset:2px}

/* Footer styles */
.site-footer{background:linear-gradient(180deg, rgba(3,6,18,0.9), rgba(6,10,20,0.95));color:rgba(255,255,255,0.9);padding:40px 0 18px;margin-top:40px}
.site-footer .footer-top{display:grid;grid-template-columns:1fr 1fr 320px;gap:28px;align-items:start;padding-bottom:18px}
.site-footer .footer-col h4{margin:0 0 10px;font-size:1.05rem;font-weight:700}
.site-footer .footer-logo img{height:44px;background-color: #fff;border-radius: 6px;padding: 8px 12px}
.site-footer .footer-desc{color:var(--muted);margin-top:10px;max-width:360px}
.site-footer .links-col ul{list-style:none;padding:0;margin:0}
.site-footer .links-col li{margin:8px 0}
.site-footer .links-col a{color:var(--muted);text-decoration:none}
.site-footer .contact-col .muted{color:var(--muted);margin:6px 0}
.site-footer .social a{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;background:rgba(255,255,255,0.03);color:var(--muted);margin-right:8px;text-decoration:none}
.site-footer .social a{transition:transform .22s cubic-bezier(.2,.9,.2,1),background .22s ease,color .22s ease,box-shadow .22s ease}
.site-footer .social a i{transition:transform .28s ease,color .22s ease;display:inline-block}
.site-footer .social a:focus{outline:2px solid rgba(0,208,255,0.18);outline-offset:3px}
.site-footer .social a:hover,.site-footer .social a:focus{transform:translateY(-6px);background:linear-gradient(90deg,var(--primary),var(--accent));box-shadow:0 10px 30px rgba(15,30,60,0.45);color:#041024}
.site-footer .social a:hover i{transform:rotate(-12deg) scale(1.08);color:#041024}
.site-footer .social a:active{transform:translateY(-2px) scale(.98)}
.site-footer .footer-bottom{border-top:1px solid rgba(255,255,255,0.03);padding:12px 0;margin-top:12px}
.site-footer .footer-bottom .container{display:flex;align-items:center;justify-content:space-between;gap:12px}
.site-footer .copy{color:var(--muted);font-size:0.95rem}
.site-footer .back-to-top{background:rgba(255,255,255,0.04);border:0;color:var(--muted);padding:8px 10px;border-radius:6px;cursor:pointer}
.site-footer .back-to-top:hover{background:linear-gradient(90deg,var(--primary),var(--accent));color:#041024}

@media (max-width:900px){
  .site-footer .footer-top{grid-template-columns:1fr;gap:18px}
  .site-footer .footer-bottom .container{flex-direction:column;align-items:flex-start}
}

/* Header: migrated from header template inline styles */
.brand{color:#fff;font-weight:700;font-size:1.1rem;display:flex;align-items:center;gap:12px}
.brand-logo{height:40px;width:auto}
.nav-toggle{display:none;background:transparent;border:0;color:#dff4ff;font-size:22px;padding:8px;border-radius:6px}
.main-nav{position:relative}
.main-nav .nav-list{list-style:none;margin:0;padding:0;display:flex;gap:18px;align-items:center}
.main-nav a{color:rgba(255,255,255,0.92);text-decoration:none}
.dropdown{position:relative}
.dropdown-menu{display:none;position:absolute;top:100%;left:0;background:rgba(2,6,23,0.95);padding:8px;border-radius:8px;min-width:160px;box-shadow:0 6px 18px rgba(2,6,23,0.6)}
.dropdown:hover .dropdown-menu{display:block}

@media (max-width: 900px){
  .nav-toggle{display:inline-flex;align-items:center;justify-content:center}
  .header-inner{display:flex;align-items:center;gap:12px}
  .main-nav{position:absolute;left:0;right:0;top:64px;background:linear-gradient(180deg,rgba(4,8,16,0.98),rgba(2,4,10,0.98));padding:12px;border-bottom:1px solid rgba(255,255,255,0.03);transform:translateY(-8px);opacity:0;visibility:hidden;transition:all .25s ease}
  header.nav-open .main-nav{transform:translateY(0);opacity:1;visibility:visible}
  .main-nav .nav-list{flex-direction:column;gap:10px}
  .main-nav .nav-list .nav-item{width:100%}
  .main-nav .nav-list a{display:block;padding:10px 12px;border-radius:8px}
  .dropdown-menu{position:static;margin-top:6px;padding:6px 8px;border-radius:6px;box-shadow:none}
  .dropdown.open > .dropdown-menu{display:block}
  .dropdown .caret{float:right;transform:rotate(0);transition:transform .18s}
  .dropdown.open .caret{transform:rotate(90deg)}
  .header-actions{margin-left:auto}
}

/* back-to-top 可视状态控制 */
.site-footer .back-to-top{opacity:0.0;transition:opacity .28s ease,transform .28s ease}
@keyframes backToTopFadeIn{
  from{opacity:0;transform:translateY(6px)}
  to{opacity:1;transform:translateY(-2px)}
}
.site-footer .back-to-top.visible{opacity:1;animation:backToTopFadeIn .32s ease both}

/* Migrated template-specific styles (was inline in contact.html & news_detail.html) */
/* Contact page */
.contact-hero{max-width:1100px;margin:18px auto 40px;display:grid;grid-template-columns:1fr 420px;gap:28px;align-items:start}
.contact-card{background:linear-gradient(180deg,#071021,#05101a);padding:24px;border-radius:12px;box-shadow:0 12px 40px rgba(3,8,20,0.6);color:#e7f6ff}
.contact-card h2{margin:0 0 10px;color:#fff;font-size:22px}
.contact-info p{margin:8px 0;color:#bfe7ff}
.contact-info p .label{color:#7fb0d6;margin-right:8px}
.contact-map{background:linear-gradient(180deg,#0b1726,#06121a);border-radius:12px;height:100%;min-height:280px;padding:12px;color:#bcdff6;display:flex;flex-direction:column}
.contact-form{display:flex;flex-direction:column;gap:10px}
.contact-form input,.contact-form textarea{width:100%;padding:10px;border-radius:8px;border:1px solid rgba(255,255,255,0.06);background:rgba(255,255,255,0.02);color:#eaf6ff}
.contact-form button{align-self:flex-start;padding:10px 16px;border-radius:8px;border:0;background:#00d1ff;color:#022034;font-weight:700}
.muted-small{font-size:13px;color:#8fa9c6}
@media (max-width:980px){.contact-hero{grid-template-columns:1fr;gap:16px}.contact-map{order:2}}

/* News detail */
.news-detail{max-width:960px;margin:28px auto;padding:28px;background:linear-gradient(180deg,#0f1724 0%, #071021 100%);box-shadow:0 10px 30px rgba(2,6,23,0.6);border-radius:12px;color:#e6eef8}
.news-detail h2{font-size:24px;margin:0 0 12px;color:#fff;font-weight:700;letter-spacing:0.4px}
.news-detail .muted{color:#9fb3d6;font-size:13px;margin-bottom:18px}
.news-detail .content{line-height:1.9;color:#dbeefc;font-size:15px}
.news-detail img{max-width:100%;height:auto;border-radius:6px}
.article-footer{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:22px}
.article-footer .btn{display:inline-block;padding:10px 14px;border-radius:8px;border:1px solid rgba(255,255,255,0.08);color:#cfe7ff;background:transparent;text-decoration:none}
.article-footer .btn.btn-outline{background:transparent}
.detail-nav{display:flex;flex:1;justify-content:flex-end;gap:18px}
.detail-nav .prev,.detail-nav .next{background:rgba(255,255,255,0.03);padding:10px 14px;border-radius:8px;min-width:220px}
.detail-nav a{color:#bfe0ff;text-decoration:none;display:inline-block;max-width:100%}
.detail-nav .none{color:#6e8296}
@media (max-width:780px){.news-detail{padding:18px;margin:16px}.detail-nav{flex-direction:column;align-items:stretch}.detail-nav .prev,.detail-nav .next{min-width:auto}}

    /* 分页容器：强制单行显示 */
    .pagination {
        display: flex;
        flex-wrap: nowrap; /* 防止换行 */
        justify-content: center;
        gap: 10px;
        padding: 24px 0;
        align-items: center;
        font-size: 14px;
        overflow-x: auto; /* 如果内容超出屏幕宽度，允许横向滚动 */
    }
    .pagination ul {
        display: flex;
        flex-wrap: nowrap; /* 防止换行 */
        gap: 10px;
    }
    .pagination li a{
        color: #4a5568;
    }
    /* 分页按钮基础样式 */
    .pagination a,
    .pagination span {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 44px;
        height: 44px;
        padding: 0 12px;
        border-radius: 10px;
        background: #f5f7fa; /* 轻微加深背景色 */
        border: 1px solid #d1d9e6; /* 加深边框颜色 */
        color: #4a5568; /* 加深文字颜色 */
        text-decoration: none;
        box-shadow: 0 6px 20px rgba(19, 35, 47, 0.06);
        transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
    }

    /* 悬停效果 */
    .pagination a:hover {
        transform: translateY(-3px);
        box-shadow: 0 14px 30px rgba(19, 35, 47, 0.09);
        background: #fbfdff;
    }

    /* 当前页/激活状态 */
    .pagination .current,
    .pagination a.active {
        background: linear-gradient(90deg, #0066cc, #0099ff);
        color: #fff;
        border-color: transparent;
        box-shadow: 0 10px 30px rgba(0, 123, 255, 0.18);
        transform: translateY(-2px);
    }

    /* 禁用状态 */
    .pagination .disabled {
        opacity: 0.5;
        cursor: not-allowed;
        transform: none;
        box-shadow: none;
    }

    /* 焦点样式 */
    .pagination a:focus,
    .pagination a:focus-visible {
        outline: 3px solid rgba(0, 150, 255, 0.14);
        outline-offset: 3px;
        border-radius: 12px;
    }

    /* 移动端适配 */
    @media (max-width: 640px) {
        .pagination a,
        .pagination span {
            min-width: 36px;
            height: 36px;
            padding: 0 8px;
            border-radius: 8px;
        }
        .pagination {
            gap: 6px;
            padding: 16px 0;
        }
    }

    /* 箭头样式 */
    .pagination a[rel="prev"]:before,
    .pagination a[aria-label*="上一"]:before {
        content: "‹";
        margin-right: 8px;
        font-size: 18px;
    }
    .pagination a[rel="next"]:after,
    .pagination a[aria-label*="下一"]:after {
        content: "›";
        margin-left: 8px;
        font-size: 18px;
    }

    /* 省略号样式 */
    .pagination span {
        background: transparent;
        border: none;
        box-shadow: none;
        color: #657786;
        padding: 0 8px;
        height: auto;
        min-width: 0;
    }