/* ===== Base ===== */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;color:var(--color-text);background:var(--color-bg);line-height:1.8;font-size:16px}
img{display:block;max-width:100%;height:auto}
a{text-decoration:none;color:inherit;transition:color .2s ease}
ul{list-style:none}
button{font-family:inherit;border:none;cursor:pointer}
input,textarea{font-family:inherit}

/* ===== Variables ===== */
:root{
  --color-primary:#1B6A8C;
  --color-primary-dark:#0D3B4D;
  --color-primary-light:#2A8FB8;
  --color-accent:#E87530;
  --color-accent-dark:#C95E20;
  --color-accent-light:#F5A855;
  --color-text:#1A1A1A;
  --color-text-muted:#5A6A73;
  --color-text-light:#8A9AA3;
  --color-bg:#FFFFFF;
  --color-bg-soft:#F4F7FA;
  --color-bg-dark:#0D3B4D;
  --color-border:#E0E5EA;
  --color-border-strong:#C0C8D0;
  --radius-sm:.375rem;
  --radius-md:.75rem;
  --radius-lg:1rem;
  --radius-full:9999px;
  --shadow-sm:0 1px 3px rgba(13,59,77,.06);
  --shadow-md:0 4px 16px rgba(13,59,77,.08);
  --shadow-lg:0 12px 40px rgba(13,59,77,.12);
  --transition-fast:.2s cubic-bezier(.4,0,.2,1);
  --transition-normal:.3s cubic-bezier(.4,0,.2,1);
  --transition-slow:.5s cubic-bezier(.4,0,.2,1);
  --max-width:1200px;
  --header-height:72px;
}

/* ===== Utilities ===== */
.container{max-width:var(--max-width);margin:0 auto;padding:0 1.5rem;width:100%}
.container-narrow{max-width:860px;margin:0 auto;padding:0 1.5rem;width:100%}
.section{padding:4rem 0}
.section-sm{padding:2.5rem 0}
.section-title{text-align:center;margin-bottom:.5rem}
.section-eyebrow{display:block;text-align:center;font-size:.875rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent);margin-bottom:.75rem}
.section-subtitle{text-align:center;color:var(--color-text-muted);max-width:640px;margin:0 auto 3rem;font-size:1rem}
.text-center{text-align:center}
.mt-1{margin-top:.5rem}.mt-2{margin-top:1rem}.mt-3{margin-top:1.5rem}.mt-4{margin-top:2rem}
.mb-1{margin-bottom:.5rem}.mb-2{margin-bottom:1rem}.mb-3{margin-bottom:1.5rem}.mb-4{margin-bottom:2rem}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}

/* ===== Buttons ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.875rem 2rem;font-size:.95rem;font-weight:600;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;border:none}
.btn-primary{background:var(--color-accent);color:#fff}
.btn-primary:hover{background:var(--color-accent-dark);transform:translateY(-1px);box-shadow:var(--shadow-md)}
.btn-outline{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.5)}
.btn-outline:hover{background:rgba(255,255,255,.1);border-color:#fff}
.btn-dark{background:var(--color-primary);color:#fff}
.btn-dark:hover{background:var(--color-primary-dark);transform:translateY(-1px);box-shadow:var(--shadow-md)}
.btn-block{width:100%}
.btn-lg{padding:1.125rem 2.5rem;font-size:1.05rem}

/* ===== Topbar ===== */
.topbar{background:var(--color-primary-dark);color:rgba(255,255,255,.85);font-size:.8125rem;padding:.375rem 0}
.topbar .container{display:flex;justify-content:space-between;align-items:center;gap:1rem}
.topbar-info{display:flex;align-items:center;gap:1.5rem}
.topbar-info a,.topbar-info span{display:inline-flex;align-items:center;gap:.375rem;color:rgba(255,255,255,.85);transition:color var(--transition-fast)}
.topbar-info a:hover{color:#fff}
@media(max-width:768px){.topbar-info{display:none}}

/* ===== Header ===== */
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.95);backdrop-filter:blur(12px);box-shadow:0 1px 0 rgba(0,0,0,.06),0 2px 8px rgba(0,0,0,.04)}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:var(--header-height)}
.brand{display:flex;align-items:center;gap:.75rem}
.brand-logo{width:48px;height:48px;border-radius:var(--radius-sm);overflow:hidden;flex-shrink:0}
.brand-logo img{width:100%;height:100%;object-fit:cover}
.brand-name{display:flex;flex-direction:column;line-height:1.2}
.brand-name-cn{font-size:1rem;font-weight:700;color:var(--color-primary-dark)}
.brand-name-en{font-size:.6875rem;letter-spacing:.1em;color:var(--color-text-light);text-transform:uppercase}

/* ===== Nav ===== */
.main-nav{display:flex;align-items:center;gap:.25rem}
.main-nav a{padding:.5rem .875rem;font-size:.9375rem;font-weight:500;color:var(--color-text);border-radius:var(--radius-sm);transition:all var(--transition-fast)}
.main-nav a:hover,.main-nav a.active{color:var(--color-primary);background:rgba(27,106,140,.06)}
.nav-cta{margin-left:.5rem}
@media(max-width:900px){.main-nav{display:none}.nav-toggle{display:flex}.nav-cta{display:none}}

/* ===== Mobile Nav ===== */
.nav-toggle{display:none;flex-direction:column;justify-content:center;width:40px;height:40px;gap:5px;cursor:pointer}
.nav-toggle span{display:block;height:2px;width:24px;background:var(--color-primary-dark);border-radius:2px;transition:all var(--transition-fast)}
.nav-toggle.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.active span:nth-child(2){opacity:0}
.nav-toggle.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-nav{display:none;position:fixed;top:calc(var(--header-height) + 37px);left:0;right:0;background:#fff;box-shadow:var(--shadow-lg);padding:1rem 1.5rem;z-index:99}
.mobile-nav.active{display:block}
.mobile-nav a{display:block;padding:.875rem 0;font-size:1rem;font-weight:500;color:var(--color-text);border-bottom:1px solid var(--color-border)}
.mobile-nav a:hover{color:var(--color-primary)}
.mobile-nav .btn{margin-top:1rem}

/* ===== Hero ===== */
.hero{position:relative;min-height:600px;display:flex;align-items:center;color:#fff;overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:0}
.hero-bg img{width:100%;height:100%;object-fit:cover}
.hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(13,59,77,.88) 0%,rgba(27,106,140,.78) 50%,rgba(13,59,77,.85) 100%)}
.hero-content{position:relative;z-index:1;padding:4rem 0}
.hero-eyebrow{display:inline-flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:600;letter-spacing:.05em;color:var(--color-accent-light);margin-bottom:1rem;text-transform:uppercase}
.hero-eyebrow::before{content:"";display:inline-block;width:2rem;height:2px;background:var(--color-accent)}
.hero-title{font-size:clamp(2rem,5vw,3.5rem);font-weight:800;line-height:1.2;margin-bottom:1.25rem;letter-spacing:-.02em}
.hero-desc{font-size:1.0625rem;max-width:580px;margin-bottom:2rem;color:rgba(255,255,255,.9);line-height:1.8}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:3rem}
.hero-stat{text-align:center;display:flex;flex-direction:column;align-items:center;min-width:120px}
.hero-stats{display:flex;gap:2.5rem;flex-wrap:wrap}
.hero-stat-num{font-size:2rem;font-weight:800;color:#fff;line-height:1}
.hero-stat-label{font-size:.8125rem;color:rgba(255,255,255,.7);margin-top:.375rem}
@media(max-width:640px){.hero-stats{gap:1.5rem}.hero-stat-num{font-size:1.5rem}}

/* ===== Page Hero (inner pages) ===== */
.page-hero{background:linear-gradient(135deg,var(--color-primary-dark),var(--color-primary));color:#fff;padding:3rem 0 2.5rem;text-align:center}
.page-hero h1{font-size:clamp(1.75rem,4vw,2.5rem);font-weight:800;margin-bottom:.5rem}
.page-hero p{color:rgba(255,255,255,.85);max-width:640px;margin:0 auto}

/* ===== About ===== */
.about{background:var(--color-bg-soft)}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.about-image{border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-md)}
.about-image img{width:100%;height:400px;object-fit:cover;transition:transform .6s ease}
.about-image:hover img{transform:scale(1.03)}
.about-eyebrow{font-size:.8125rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent);margin-bottom:.75rem}
.about-title{font-size:clamp(1.5rem,3vw,2rem);font-weight:700;margin-bottom:1rem;line-height:1.3}
.about-text{color:var(--color-text-muted);margin-bottom:1.5rem;font-size:.9375rem}
.about-list{display:grid;gap:.75rem;margin-bottom:1.5rem}
.about-list li{display:flex;align-items:flex-start;gap:.625rem;font-size:.9375rem}
.about-list li::before{content:"✓";color:var(--color-accent);font-weight:700;flex-shrink:0;margin-top:.125rem}
@media(max-width:768px){.about-grid{grid-template-columns:1fr;gap:2rem}.about-image img{height:280px}}

/* ===== Services ===== */
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.service-card{background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:2rem 1.75rem;transition:all var(--transition-normal)}
.service-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:transparent}
.service-card-image{width:100%;height:180px;border-radius:var(--radius-md);overflow:hidden;margin-bottom:1.5rem}
.service-card-image img{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-normal)}
.service-card:hover .service-card-image img{transform:scale(1.05)}
.service-card h3{font-size:1.25rem;font-weight:700;margin-bottom:.75rem;color:var(--color-primary-dark)}
.service-card p{color:var(--color-text-muted);font-size:.9375rem;margin-bottom:1.25rem}
.service-card ul{display:grid;gap:.5rem}
.service-card ul li{font-size:.875rem;color:var(--color-text-muted);padding-left:1.25rem;position:relative}
.service-card ul li::before{content:"";position:absolute;left:0;top:.5rem;width:6px;height:6px;border-radius:50%;background:var(--color-accent)}
@media(max-width:900px){.service-grid{grid-template-columns:1fr;max-width:480px;margin:0 auto}}

/* ===== Gallery ===== */
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.gallery-item{border-radius:var(--radius-md);overflow:hidden;position:relative;cursor:pointer;aspect-ratio:1}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-normal)}
.gallery-item::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(13,59,77,.7),transparent 50%);opacity:0;transition:opacity var(--transition-normal)}
.gallery-item:hover img{transform:scale(1.08)}
.gallery-item:hover::after{opacity:1}
.gallery-caption{position:absolute;bottom:.75rem;left:.75rem;right:.75rem;color:#fff;font-size:.8125rem;font-weight:500;z-index:1;opacity:0;transform:translateY(8px);transition:all var(--transition-normal)}
.gallery-item:hover .gallery-caption{opacity:1;transform:translateY(0)}
@media(max-width:900px){.gallery-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:600px){.gallery-grid{grid-template-columns:repeat(2,1fr);gap:.75rem}}

/* ===== Mold Showcase ===== */
.mold-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.mold-card{background:#fff;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);transition:all var(--transition-normal)}
.mold-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.mold-card-image{width:100%;height:220px;overflow:hidden}
.mold-card-image img{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-normal)}
.mold-card:hover .mold-card-image img{transform:scale(1.05)}
.mold-card-body{padding:1.25rem}
.mold-card-body h3{font-size:1.0625rem;font-weight:700;margin-bottom:.5rem;color:var(--color-primary-dark)}
.mold-card-body p{font-size:.875rem;color:var(--color-text-muted)}
@media(max-width:900px){.mold-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.mold-grid{grid-template-columns:1fr;max-width:400px;margin:0 auto}}

/* ===== Process ===== */
.process{background:var(--color-bg-soft)}
.process-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem}
.process-step{text-align:center;position:relative}
.process-step:not(:last-child)::after{content:"";position:absolute;top:32px;right:-50%;width:100%;height:2px;background:var(--color-border);z-index:0}
.process-num{width:64px;height:64px;border-radius:50%;background:#fff;border:2px solid var(--color-primary);display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:800;color:var(--color-primary);margin:0 auto 1rem;position:relative;z-index:1;transition:all var(--transition-normal)}
.process-step:hover .process-num{transform:scale(1.1);box-shadow:0 0 0 8px rgba(27,106,140,.1)}
.process-step h3{font-size:.9375rem;font-weight:700;margin-bottom:.375rem;color:var(--color-primary-dark)}
.process-step p{font-size:.8125rem;color:var(--color-text-muted)}
@media(max-width:900px){.process-grid{grid-template-columns:repeat(3,1fr);gap:1.5rem}.process-step:nth-child(3n)::after{display:none}}
@media(max-width:600px){.process-grid{grid-template-columns:repeat(2,1fr)}.process-step::after{display:none!important}}

/* ===== Advantages ===== */
.advantage-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.advantage-card{text-align:center;padding:2rem 1.5rem;border-radius:var(--radius-lg);background:#fff;border:1px solid var(--color-border);transition:all var(--transition-normal)}
.advantage-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:transparent}
.advantage-icon{width:56px;height:56px;border-radius:50%;background:rgba(27,106,140,.08);display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;color:var(--color-primary)}
.advantage-card h3{font-size:1.125rem;font-weight:700;margin-bottom:.5rem;color:var(--color-primary-dark)}
.advantage-card p{font-size:.875rem;color:var(--color-text-muted)}
@media(max-width:900px){.advantage-grid{grid-template-columns:1fr;max-width:420px;margin:0 auto}}

/* ===== Contact ===== */
.contact{background:var(--color-bg-soft)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:start}
.contact-info-list{display:grid;gap:1.5rem;margin-bottom:2rem}
.contact-info-item{display:flex;align-items:flex-start;gap:1rem}
.contact-info-icon{width:48px;height:48px;border-radius:var(--radius-md);background:var(--color-primary);color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.contact-info-item h4{font-size:.9375rem;font-weight:700;margin-bottom:.25rem;color:var(--color-primary-dark)}
.contact-info-item p,.contact-info-item a{font-size:.9375rem;color:var(--color-text-muted);transition:color var(--transition-fast)}
.contact-info-item a:hover{color:var(--color-primary)}
.contact-form{background:#fff;border-radius:var(--radius-lg);padding:2rem;box-shadow:var(--shadow-sm)}
.form-group{margin-bottom:1.25rem}
.form-group label{display:block;font-size:.875rem;font-weight:600;margin-bottom:.5rem;color:var(--color-text)}
.form-group input,.form-group textarea,.form-group select{width:100%;padding:.75rem 1rem;border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);font-size:.9375rem;transition:border-color var(--transition-fast);background:#fff;color:var(--color-text)}
.form-group input:focus,.form-group textarea:focus,.form-group select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(27,106,140,.1)}
.form-group textarea{min-height:120px;resize:vertical}
@media(max-width:768px){.contact-grid{grid-template-columns:1fr;gap:2rem}}

/* ===== Map ===== */
.map-section{padding:0}
.map-section iframe{width:100%;height:400px;border:0;display:block}
@media(max-width:768px){.map-section iframe{height:300px}}

/* ===== CTA Banner ===== */
.cta-banner{background:linear-gradient(135deg,var(--color-primary-dark),var(--color-primary));color:#fff;padding:3.5rem 0;text-align:center}
.cta-banner h2{font-size:clamp(1.5rem,3vw,2.25rem);font-weight:800;margin-bottom:.75rem}
.cta-banner p{font-size:1.0625rem;color:rgba(255,255,255,.85);margin-bottom:2rem;max-width:600px;margin-left:auto;margin-right:auto}

/* ===== Footer ===== */
.site-footer{background:var(--color-bg-dark);color:rgba(255,255,255,.7);padding:3rem 0 1.5rem}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr;gap:2rem;margin-bottom:2.5rem}
.footer-brand{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}
.footer-brand img{width:44px;height:44px;border-radius:var(--radius-sm)}
.footer-brand-name{font-size:1rem;font-weight:700;color:#fff}
.footer-brand-sub{font-size:.6875rem;letter-spacing:.1em;color:rgba(255,255,255,.5);text-transform:uppercase}
.footer-about{font-size:.875rem;line-height:1.7;margin-bottom:1.5rem;max-width:320px}
.footer-col h4{font-size:.9375rem;font-weight:600;color:#fff;margin-bottom:1rem}
.footer-col ul{display:grid;gap:.625rem}
.footer-col ul a{font-size:.875rem;color:rgba(255,255,255,.6);transition:color var(--transition-fast)}
.footer-col ul a:hover{color:#fff}
.footer-contact-item{display:flex;align-items:flex-start;gap:.625rem;font-size:.875rem;margin-bottom:.75rem}
.footer-contact-item span{color:rgba(255,255,255,.5);flex-shrink:0;margin-top:.125rem}
.footer-contact-item a,.footer-contact-item p{color:rgba(255,255,255,.8);transition:color var(--transition-fast)}
.footer-contact-item a:hover{color:#fff}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:1.5rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem}
.footer-bottom p{font-size:.8125rem;color:rgba(255,255,255,.5)}
.footer-bottom a{font-size:.8125rem;color:rgba(255,255,255,.5);transition:color var(--transition-fast)}
.footer-bottom a:hover{color:#fff}
@media(max-width:768px){.footer-grid{grid-template-columns:1fr 1fr;gap:2rem}}
@media(max-width:500px){.footer-grid{grid-template-columns:1fr}.footer-bottom{flex-direction:column;text-align:center}}

/* ===== Floating Button ===== */
.float-contact{position:fixed;bottom:1.5rem;right:1.5rem;z-index:50;display:flex;flex-direction:column;gap:.75rem}
.float-btn{width:56px;height:56px;border-radius:50%;background:var(--color-accent);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-lg);transition:all var(--transition-normal);position:relative}
.float-btn:hover{transform:scale(1.1);background:var(--color-accent-dark)}
.float-btn-phone{animation:pulse-ring 2s infinite}
@keyframes pulse-ring{0%{box-shadow:0 0 0 0 rgba(232,117,48,.4)}70%{box-shadow:0 0 0 12px rgba(232,117,48,0)}100%{box-shadow:0 0 0 0 rgba(232,117,48,0)}}

/* ===== Animations ===== */
@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeInLeft{from{opacity:0;transform:translateX(-40px)}to{opacity:1;transform:translateX(0)}}
@keyframes fadeInRight{from{opacity:0;transform:translateX(40px)}to{opacity:1;transform:translateX(0)}}
@keyframes scaleIn{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}
.reveal{opacity:0;transform:translateY(30px);transition:opacity .6s ease,transform .6s ease}
.reveal.active{opacity:1;transform:translateY(0)}
.reveal-left{opacity:0;transform:translateX(-40px);transition:opacity .6s ease,transform .6s ease}
.reveal-left.active{opacity:1;transform:translateX(0)}
.reveal-right{opacity:0;transform:translateX(40px);transition:opacity .6s ease,transform .6s ease}
.reveal-right.active{opacity:1;transform:translateX(0)}
.reveal-scale{opacity:0;transform:scale(.9);transition:opacity .6s ease,transform .6s ease}
.reveal-scale.active{opacity:1;transform:scale(1)}
.hero-eyebrow{animation:fadeInUp .6s ease both;animation-delay:.1s}
.hero-title{animation:fadeInUp .6s ease both;animation-delay:.3s}
.hero-desc{animation:fadeInUp .6s ease both;animation-delay:.5s}
.hero-actions{animation:fadeInUp .6s ease both;animation-delay:.7s}
.hero-stats{animation:fadeInUp .6s ease both;animation-delay:.9s}
.brand-logo img{transition:transform .6s ease}
.brand:hover .brand-logo img{transform:rotate(360deg)}

@media(max-width:900px){.main-nav{display:none!important}.nav-toggle{display:flex!important}.nav-cta{display:none!important}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.reveal,.reveal-left,.reveal-right,.reveal-scale{opacity:1!important;transform:none!important}}


/* Material tags */
.material-tag {
  display: inline-block;
  padding: .45rem 1rem;
  background: #fff;
  border: 1px solid var(--color-border, #e5e7eb);
  border-radius: var(--radius-full, 9999px);
  font-size: .8125rem;
  font-weight: 500;
  color: var(--color-text-muted, #6b7280);
  transition: all .25s ease;
  cursor: default;
}
.material-tag:hover {
  border-color: var(--color-primary, #0f766e);
  color: var(--color-primary, #0f766e);
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(15,118,110,0.1);
}

/* Subtle entrance animations */
@keyframes fadeSlideUp {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
.material-tag {
  animation: fadeSlideUp .5s ease both;
}
.material-tag:nth-child(1) { animation-delay: .05s; }
.material-tag:nth-child(2) { animation-delay: .1s; }
.material-tag:nth-child(3) { animation-delay: .15s; }
.material-tag:nth-child(4) { animation-delay: .2s; }
.material-tag:nth-child(5) { animation-delay: .25s; }
.material-tag:nth-child(6) { animation-delay: .3s; }
.material-tag:nth-child(7) { animation-delay: .35s; }
.material-tag:nth-child(8) { animation-delay: .4s; }
.material-tag:nth-child(9) { animation-delay: .45s; }


/* Hero capability stats */
.about-capabilities {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin: 1.5rem 0;
  max-width: 520px;
}
.capability-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: .75rem .5rem;
  background: var(--color-bg-soft, #f8fafc);
  border-radius: var(--radius-md, 8px);
  border: 1px solid var(--color-border, #e5e7eb);
}
.capability-value {
  font-size: 1rem;
  font-weight: 700;
  color: var(--color-primary, #0f766e);
  line-height: 1.2;
}
.capability-label {
  font-size: .75rem;
  color: var(--color-text-muted, #6b7280);
  margin-top: .25rem;
}
@media (max-width: 640px) {
  .about-capabilities {
    grid-template-columns: repeat(2, 1fr);
  }
}