:root {
--qt-primary: #1976D2;
--qt-secondary: #42A5F5;
--qt-accent: #F4511E;
--qt-text: #1A2332;
--qt-text-secondary: #607088;
--qt-bg: #F7F9FC;
--qt-bg-dark: #0F1E36;
--qt-border: #DDE5F0;
--qt-shadow: rgba(15, 30, 54, 0.08);
--qt-gradient-start: #1976D2;
--qt-gradient-end: #42A5F5;
}
*,*::before,*::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
color: var(--qt-text);
background: var(--qt-bg);
line-height: 1.7;
overflow-x: hidden;
-webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--qt-primary); text-decoration: none; transition: color 0.3s ease; }
a:hover { color: var(--qt-accent); }
h1,h2,h3,h4,h5,h6 { color: var(--qt-text); font-weight: 700; line-height: 1.3; }
h1 { font-size: clamp(1.8rem, 4vw, 2.8rem); }
h2 { font-size: clamp(1.5rem, 3vw, 2.2rem); }
h3 { font-size: clamp(1.1rem, 2vw, 1.4rem); }
.qt-header {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 1000;
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.qt-glass-nav {
background: rgba(255, 255, 255, 0.85);
backdrop-filter: blur(20px) saturate(150%);
-webkit-backdrop-filter: blur(20px) saturate(150%);
border-bottom: 1px solid rgba(221, 229, 240, 0.5);
}
.qt-header-scrolled {
box-shadow: 0 4px 20px var(--qt-shadow);
background: rgba(255, 255, 255, 0.95);
}
.qt-nav-upper {
height: 64px;
display: flex;
align-items: center;
}
.qt-nav-upper-inner {
display: flex;
align-items: center;
justify-content: space-between;
}
.qt-logo-link {
display: flex;
align-items: center;
gap: 10px;
text-decoration: none;
}
.qt-logo-img {
height: 40px;
width: auto;
}
.qt-logo-text {
font-size: 1.1rem;
font-weight: 700;
color: var(--qt-primary);
white-space: nowrap;
}
.qt-search-wrapper {
flex: 0 0 auto;
display: flex;
justify-content: center;
}
.qt-search-box {
display: flex;
align-items: center;
background: rgba(247, 249, 252, 0.8);
border: 1px solid var(--qt-border);
border-radius: 24px;
padding: 6px 16px;
width: 200px;
transition: width 0.4s ease, box-shadow 0.3s ease;
}
.qt-search-expanded {
width: 320px;
box-shadow: 0 0 0 3px rgba(25, 118, 210, 0.15);
border-color: var(--qt-primary);
}
.qt-search-icon {
color: var(--qt-text-secondary);
margin-right: 8px;
font-size: 0.9rem;
}
.qt-search-input {
border: none;
background: transparent;
outline: none;
width: 100%;
font-size: 0.875rem;
color: var(--qt-text);
}
.qt-nav-cta-area {
display: flex;
align-items: center;
gap: 16px;
}
.qt-phone-link {
display: flex;
align-items: center;
gap: 6px;
color: var(--qt-text);
font-weight: 600;
font-size: 0.9rem;
white-space: nowrap;
}
.qt-phone-link:hover { color: var(--qt-primary); }
.qt-cta-btn {
display: inline-flex;
align-items: center;
gap: 6px;
background: linear-gradient(135deg, var(--qt-gradient-start), var(--qt-gradient-end));
color: #fff;
padding: 8px 20px;
border-radius: 24px;
font-size: 0.875rem;
font-weight: 600;
transition: all 0.3s ease;
position: relative;
overflow: hidden;
}
.qt-cta-btn:hover {
transform: translateY(-1px);
box-shadow: 0 4px 15px rgba(25, 118, 210, 0.3);
color: #fff;
}
.qt-nav-lower {
height: 48px;
background: rgba(247, 249, 252, 0.9);
border-top: 1px solid var(--qt-border);
transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.qt-nav-lower-hidden {
transform: translateY(-100%);
pointer-events: none;
}
.qt-nav-lower-inner {
display: flex;
justify-content: center;
}
.qt-nav-list {
display: flex;
list-style: none;
gap: 2rem;
margin: 0;
padding: 0;
align-items: center;
}
.qt-nav-item { position: relative; }
.qt-nav-link {
font-size: 0.875rem;
color: var(--qt-text-secondary);
font-weight: 500;
padding: 12px 0;
display: block;
transition: color 0.3s ease;
position: relative;
}
.qt-nav-link::after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
width: 0;
height: 2px;
background: var(--qt-primary);
transition: all 0.3s ease;
transform: translateX(-50%);
}
.qt-nav-link:hover,
.qt-active .qt-nav-link {
color: var(--qt-primary);
}
.qt-nav-link:hover::after,
.qt-active .qt-nav-link::after {
width: 100%;
}
.qt-hamburger {
display: none;
flex-direction: column;
gap: 5px;
background: none;
border: none;
cursor: pointer;
padding: 8px;
z-index: 1001;
}
.qt-hamburger span {
display: block;
width: 24px;
height: 2px;
background: var(--qt-text);
transition: all 0.3s ease;
border-radius: 2px;
}
.qt-hamburger-active span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
.qt-hamburger-active span:nth-child(2) { opacity: 0; }
.qt-hamburger-active span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); }
.qt-mobile-menu {
position: fixed;
top: 0;
right: -100%;
width: 300px;
height: 100vh;
background: #fff;
z-index: 999;
transition: right 0.4s cubic-bezier(0.4, 0, 0.2, 1);
box-shadow: -4px 0 20px rgba(0,0,0,0.1);
overflow-y: auto;
padding-top: 80px;
}
.qt-mobile-menu-open { right: 0; }
.qt-mobile-menu-inner { padding: 20px; }
.qt-mobile-search input {
width: 100%;
padding: 12px 16px;
border: 1px solid var(--qt-border);
border-radius: 12px;
font-size: 0.9rem;
margin-bottom: 20px;
}
.qt-mobile-nav-list {
list-style: none;
padding: 0;
margin: 0;
}
.qt-mobile-nav-list li a {
display: block;
padding: 14px 0;
color: var(--qt-text);
font-weight: 500;
border-bottom: 1px solid var(--qt-border);
}
.qt-mobile-nav-list li.qt-active a { color: var(--qt-primary); }
.qt-mobile-cta {
display: block;
text-align: center;
background: linear-gradient(135deg, var(--qt-gradient-start), var(--qt-gradient-end));
color: #fff;
padding: 14px;
border-radius: 12px;
margin-top: 20px;
font-weight: 600;
}
.qt-mobile-phone {
display: block;
text-align: center;
padding: 14px;
margin-top: 10px;
color: var(--qt-primary);
font-weight: 600;
}
.qt-no-scroll { overflow: hidden; }
.qt-hero {
position: relative;
min-height: 100vh;
display: flex;
align-items: center;
overflow: hidden;
padding-top: 112px;
}
.qt-hero-parallax-layer {
position: absolute;
inset: 0;
background-size: cover;
background-position: center;
background-attachment: fixed;
z-index: 0;
}
.qt-hero-overlay {
position: absolute;
inset: 0;
background: linear-gradient(135deg, rgba(15, 30, 54, 0.75) 0%, rgba(25, 118, 210, 0.5) 100%);
z-index: 1;
}
.qt-hero-container {
position: relative;
z-index: 2;
}
.qt-hero-carousel {
border-radius: 16px;
overflow: hidden;
box-shadow: 0 8px 32px rgba(0,0,0,0.2);
margin-bottom: 30px;
}
.qt-slide-img {
width: 100%;
height: 400px;
object-fit: cover;
}
.qt-carousel-indicators button {
width: 12px;
height: 12px;
border-radius: 50%;
border: 2px solid #fff;
background: transparent;
opacity: 0.6;
}
.qt-carousel-indicators button.active {
background: #fff;
opacity: 1;
}
.qt-hero-content {
text-align: center;
padding: 40px;
}
.qt-glass-card-hero {
background: rgba(255, 255, 255, 0.12);
backdrop-filter: blur(20px) saturate(150%);
-webkit-backdrop-filter: blur(20px) saturate(150%);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 20px;
box-shadow: 0 8px 32px rgba(0,0,0,0.15);
}
.qt-hero-title {
color: #fff;
font-size: clamp(1.8rem, 4vw, 3rem);
font-weight: 800;
margin-bottom: 16px;
text-shadow: 0 2px 4px rgba(0,0,0,0.2);
}
.qt-hero-subtitle {
color: rgba(255,255,255,0.9);
font-size: clamp(0.95rem, 1.5vw, 1.15rem);
margin-bottom: 30px;
line-height: 1.8;
}
.qt-hero-actions {
display: flex;
gap: 16px;
justify-content: center;
flex-wrap: wrap;
margin-bottom: 24px;
}
.qt-btn-primary {
display: inline-flex;
align-items: center;
gap: 8px;
background: linear-gradient(135deg, var(--qt-accent), #FF7043);
color: #fff;
padding: 12px 28px;
border-radius: 30px;
font-weight: 600;
font-size: 1rem;
border: none;
cursor: pointer;
transition: all 0.3s ease;
position: relative;
overflow: hidden;
}
.qt-btn-primary:hover {
transform: translateY(-2px);
box-shadow: 0 6px 20px rgba(244, 81, 30, 0.35);
color: #fff;
}
.qt-btn-outline {
display: inline-flex;
align-items: center;
gap: 8px;
background: transparent;
color: #fff;
padding: 12px 28px;
border-radius: 30px;
font-weight: 600;
border: 2px solid rgba(255,255,255,0.6);
cursor: pointer;
transition: all 0.3s ease;
}
.qt-btn-outline:hover {
background: rgba(255,255,255,0.15);
border-color: #fff;
color: #fff;
}
.qt-btn-outline-light {
display: inline-flex;
align-items: center;
gap: 8px;
background: transparent;
color: #fff;
padding: 14px 32px;
border-radius: 30px;
font-weight: 600;
border: 2px solid rgba(255,255,255,0.5);
cursor: pointer;
transition: all 0.3s ease;
}
.qt-btn-outline-light:hover {
background: rgba(255,255,255,0.15);
color: #fff;
}
.qt-btn-lg { padding: 16px 36px; font-size: 1.05rem; }
.qt-btn-sm {
display: inline-flex;
align-items: center;
gap: 6px;
background: var(--qt-primary);
color: #fff;
padding: 8px 20px;
border-radius: 20px;
font-size: 0.85rem;
font-weight: 600;
transition: all 0.3s ease;
}
.qt-btn-sm:hover { background: var(--qt-accent); color: #fff; }
.qt-hero-badges {
display: flex;
gap: 16px;
justify-content: center;
flex-wrap: wrap;
}
.qt-badge {
display: inline-flex;
align-items: center;
gap: 6px;
background: rgba(255,255,255,0.15);
color: rgba(255,255,255,0.9);
padding: 6px 14px;
border-radius: 20px;
font-size: 0.8rem;
font-weight: 500;
}
.qt-section {
position: relative;
padding: 80px 0;
}
.qt-breathe-lg { padding: 15vh 0; }
.qt-breathe-md { padding: 10vh 0; }
.qt-breathe-sm { padding: 5vh 0; }
.qt-section-header {
text-align: center;
margin-bottom: 50px;
}
.qt-section-header-light .qt-section-title,
.qt-section-header-light .qt-section-desc { color: #fff; }
.qt-section-header-light .qt-section-desc { color: rgba(255,255,255,0.8); }
.qt-section-title {
margin-bottom: 12px;
position: relative;
display: inline-block;
}
.qt-section-title::after {
content: '';
display: block;
width: 60px;
height: 3px;
background: linear-gradient(90deg, var(--qt-primary), var(--qt-accent));
margin: 12px auto 0;
border-radius: 2px;
}
.qt-section-desc {
color: var(--qt-text-secondary);
font-size: 1.05rem;
max-width: 600px;
margin: 0 auto;
}
.qt-vertical-title {
position: absolute;
left: 20px;
top: 50%;
transform: translateY(-50%);
writing-mode: vertical-rl;
text-orientation: mixed;
font-family: "Noto Serif SC", "STSong", serif;
font-size: 0.875rem;
color: #c0c8d4;
letter-spacing: 0.2em;
max-height: 60vh;
overflow: hidden;
z-index: 1;
user-select: none;
}
.qt-services { background: var(--qt-bg); }
.qt-services-grid { margin: 0 -12px; }
.qt-service-col { padding: 0 12px; margin-bottom: 24px; }
.qt-flip-card {
perspective: 1000px;
height: 320px;
cursor: pointer;
}
.qt-flip-card-inner {
position: relative;
width: 100%;
height: 100%;
transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
transform-style: preserve-3d;
}
.qt-flip-card:hover .qt-flip-card-inner,
.qt-flip-card.qt-flipped .qt-flip-card-inner {
transform: rotateY(180deg);
}
.qt-flip-front,
.qt-flip-back {
position: absolute;
inset: 0;
backface-visibility: hidden;
-webkit-backface-visibility: hidden;
border-radius: 16px;
padding: 30px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
}
.qt-flip-front {
background: #fff;
border: 1px solid var(--qt-border);
box-shadow: 0 4px 20px var(--qt-shadow);
z-index: 2;
}
.qt-flip-back {
background: linear-gradient(135deg, var(--qt-gradient-start), var(--qt-gradient-end));
color: #fff;
transform: rotateY(180deg);
}
.qt-flip-back h4 { color: #fff; margin-bottom: 16px; }
.qt-service-icon {
width: 70px;
height: 70px;
border-radius: 50%;
background: linear-gradient(135deg, rgba(25, 118, 210, 0.1), rgba(66, 165, 245, 0.1));
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 20px;
}
.qt-service-icon i {
font-size: 1.8rem;
color: var(--qt-primary);
}
.qt-flip-front h3 { margin-bottom: 10px; font-size: 1.2rem; }
.qt-flip-front p { color: var(--qt-text-secondary); font-size: 0.9rem; }
.qt-flip-hint {
margin-top: 16px;
color: var(--qt-primary);
font-size: 0.8rem;
opacity: 0.7;
}
.qt-flip-list {
list-style: none;
padding: 0;
margin: 0 0 20px;
text-align: left;
}
.qt-flip-list li {
padding: 5px 0;
font-size: 0.9rem;
position: relative;
padding-left: 18px;
}
.qt-flip-list li::before {
content: '✓';
position: absolute;
left: 0;
color: rgba(255,255,255,0.8);
font-weight: bold;
}
.qt-stats-bg {
background: linear-gradient(135deg, var(--qt-bg-dark) 0%, #1a3a5c 100%);
background-attachment: fixed;
position: relative;
}
.qt-stats-overlay {
position: absolute;
inset: 0;
background: url('{:rand_imgs($site_config.rand_imgs, 1)}') center/cover fixed no-repeat;
opacity: 0.15;
}
.qt-stats-grid { margin: 0 -12px; }
.qt-stat-col { padding: 0 12px; margin-bottom: 24px; }
.qt-stat-item {
text-align: center;
padding: 36px 20px;
border-radius: 16px;
background: rgba(255,255,255,0.08);
backdrop-filter: blur(20px) saturate(150%);
-webkit-backdrop-filter: blur(20px) saturate(150%);
border: 1px solid rgba(255,255,255,0.15);
transition: transform 0.3s ease;
opacity: 0;
transform: translateY(30px);
}
.qt-stat-item.qt-visible {
opacity: 1;
transform: translateY(0);
transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.qt-stat-item:hover { transform: translateY(-5px); }
.qt-stat-icon {
margin-bottom: 12px;
}
.qt-stat-icon i {
font-size: 2rem;
color: var(--qt-secondary);
}
.qt-stat-number {
font-size: clamp(2rem, 5vw, 3.5rem);
font-weight: 800;
color: #fff;
line-height: 1.2;
margin-bottom: 8px;
}
.qt-stat-label {
color: rgba(255,255,255,0.7);
font-size: 0.95rem;
}
.qt-network { background: var(--qt-bg); }
.qt-network-wrapper {
position: relative;
margin-bottom: 40px;
}
.qt-network-canvas {
width: 100%;
height: 450px;
border-radius: 16px;
background: linear-gradient(135deg, #f0f4f8, #e8edf5);
}
.qt-network-legend {
display: flex;
gap: 24px;
justify-content: center;
margin-top: 16px;
flex-wrap: wrap;
}
.qt-legend-item {
display: flex;
align-items: center;
gap: 8px;
font-size: 0.85rem;
color: var(--qt-text-secondary);
}
.qt-legend-dot {
width: 12px;
height: 12px;
border-radius: 50%;
display: inline-block;
}
.qt-legend-center { background: var(--qt-primary); }
.qt-legend-hospital { background: var(--qt-secondary); }
.qt-legend-line {
width: 24px;
height: 2px;
background: var(--qt-primary);
display: inline-block;
}
.qt-network-hospitals { margin-top: 20px; }
.qt-hospital-item { margin-bottom: 16px; }
.qt-hospital-card {
display: flex;
align-items: center;
gap: 10px;
padding: 14px 18px;
border-radius: 12px;
background: rgba(255,255,255,0.7);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border: 1px solid var(--qt-border);
transition: all 0.3s ease;
cursor: pointer;
}
.qt-hospital-card:hover {
transform: translateY(-3px);
box-shadow: 0 6px 20px var(--qt-shadow);
border-color: var(--qt-primary);
}
.qt-hospital-card i {
color: var(--qt-primary);
font-size: 1.2rem;
}
.qt-hospital-card span {
font-size: 0.9rem;
font-weight: 500;
}
.qt-process { background: #fff; }
.qt-process-canvas-wrapper {
margin-bottom: 40px;
}
.qt-process-canvas {
width: 100%;
height: 100px;
border-radius: 12px;
}
.qt-process-steps {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
gap: 20px;
}
.qt-process-step {
flex: 1;
min-width: 150px;
text-align: center;
padding: 20px;
opacity: 0;
transform: translateY(20px);
transition: all 0.5s ease;
}
.qt-process-step.qt-visible {
opacity: 1;
transform: translateY(0);
}
.qt-step-number {
font-size: 2rem;
font-weight: 800;
color: var(--qt-primary);
opacity: 0.3;
margin-bottom: 8px;
}
.qt-step-content h4 {
font-size: 1rem;
margin-bottom: 6px;
color: var(--qt-text);
}
.qt-step-content p {
font-size: 0.85rem;
color: var(--qt-text-secondary);
}
.qt-features-bg {
background: linear-gradient(135deg, var(--qt-bg-dark), #1a3a5c);
background-attachment: fixed;
position: relative;
}
.qt-features-parallax {
position: absolute;
inset: 0;
background: url('{:rand_imgs($site_config.rand_imgs, 2)}') center/cover fixed no-repeat;
opacity: 0.1;
}
.qt-features-grid { margin: 0 -12px; }
.qt-feature-col { padding: 0 12px; margin-bottom: 24px; }
.qt-feature-card {
padding: 36px 28px;
border-radius: 16px;
background: rgba(255,255,255,0.08);
backdrop-filter: blur(20px) saturate(150%);
-webkit-backdrop-filter: blur(20px) saturate(150%);
border: 1px solid rgba(255,255,255,0.15);
text-align: center;
transition: all 0.3s ease;
opacity: 0;
transform: translateY(30px);
}
.qt-feature-card.qt-visible {
opacity: 1;
transform: translateY(0);
transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.qt-feature-card:hover {
transform: translateY(-5px);
background: rgba(255,255,255,0.12);
}
.qt-feature-icon {
width: 64px;
height: 64px;
border-radius: 50%;
background: rgba(255,255,255,0.1);
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 20px;
}
.qt-feature-icon i {
font-size: 1.6rem;
color: var(--qt-secondary);
}
.qt-feature-card h3 {
color: #fff;
margin-bottom: 12px;
font-size: 1.15rem;
}
.qt-feature-card p {
color: rgba(255,255,255,0.7);
font-size: 0.9rem;
line-height: 1.7;
}
.qt-city { background: var(--qt-bg); }
.qt-city-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
gap: 10px;
}
.qt-city-card {
display: flex;
flex-direction: column;
align-items: center;
gap: 4px;
padding: 12px 8px;
border-radius: 10px;
background: #fff;
border: 1px solid var(--qt-border);
transition: all 0.3s ease;
text-align: center;
position: relative;
overflow: hidden;
}
.qt-city-card i {
font-size: 0.9rem;
color: var(--qt-primary);
}
.qt-city-card h5 {
font-size: 0.8rem;
margin: 0;
font-weight: 500;
color: var(--qt-text);
}
.qt-city-card:hover {
transform: translateY(-3px);
box-shadow: 0 4px 15px var(--qt-shadow);
border-color: var(--qt-primary);
}
.qt-city-card:hover h5 { color: var(--qt-primary); }
.qt-news { background: #fff; }
.qt-news-grid { margin: 0 -12px; }
.qt-news-col { padding: 0 12px; margin-bottom: 24px; }
.qt-news-card {
border-radius: 16px;
overflow: hidden;
background: #fff;
border: 1px solid var(--qt-border);
transition: all 0.3s ease;
opacity: 0;
transform: translateY(30px);
}
.qt-news-card.qt-visible {
opacity: 1;
transform: translateY(0);
transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.qt-news-card:hover {
transform: translateY(-5px);
box-shadow: 0 8px 30px var(--qt-shadow);
}
.qt-news-img-wrapper {
position: relative;
overflow: hidden;
}
.qt-news-img {
width: 100%;
height: 200px;
object-fit: cover;
transition: transform 0.4s ease;
}
.qt-news-card:hover .qt-news-img { transform: scale(1.05); }
.qt-news-date-badge {
position: absolute;
top: 12px;
right: 12px;
background: var(--qt-primary);
color: #fff;
padding: 4px 12px;
border-radius: 20px;
font-size: 0.75rem;
font-weight: 600;
}
.qt-news-body { padding: 20px; }
.qt-news-tags { margin-bottom: 10px; display: flex; gap: 6px; flex-wrap: wrap; }
.qt-news-tag {
display: inline-block;
background: rgba(25, 118, 210, 0.08);
color: var(--qt-primary);
padding: 3px 10px;
border-radius: 12px;
font-size: 0.75rem;
font-weight: 500;
}
.qt-news-title {
font-size: 1.05rem;
margin-bottom: 8px;
line-height: 1.5;
}
.qt-news-title a { color: var(--qt-text); }
.qt-news-title a:hover { color: var(--qt-primary); }
.qt-news-desc {
color: var(--qt-text-secondary);
font-size: 0.88rem;
margin-bottom: 12px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.qt-news-link {
display: inline-flex;
align-items: center;
gap: 4px;
color: var(--qt-primary);
font-size: 0.85rem;
font-weight: 600;
}
.qt-news-more {
text-align: center;
margin-top: 40px;
}
.qt-testimonials { background: var(--qt-bg); }
.qt-testimonials-grid { margin: 0 -12px; }
.qt-testimonial-col { padding: 0 12px; margin-bottom: 24px; }
.qt-testimonial-card {
padding: 30px;
border-radius: 16px;
background: #fff;
border: 1px solid var(--qt-border);
transition: all 0.3s ease;
}
.qt-testimonial-card:hover {
transform: translateY(-3px);
box-shadow: 0 8px 25px var(--qt-shadow);
}
.qt-testimonial-stars {
margin-bottom: 16px;
color: #FFC107;
font-size: 1rem;
}
.qt-testimonial-text {
color: var(--qt-text);
font-size: 0.95rem;
line-height: 1.8;
margin-bottom: 20px;
font-style: italic;
}
.qt-testimonial-author {
display: flex;
align-items: center;
gap: 12px;
}
.qt-testimonial-avatar {
width: 44px;
height: 44px;
border-radius: 50%;
background: linear-gradient(135deg, var(--qt-primary), var(--qt-secondary));
display: flex;
align-items: center;
justify-content: center;
color: #fff;
}
.qt-testimonial-author strong { display: block; font-size: 0.9rem; }
.qt-testimonial-author span { font-size: 0.8rem; color: var(--qt-text-secondary); }
.qt-core-industry { background: #fff; }
.qt-industry-grid { margin: 0 -12px; }
.qt-industry-col { padding: 0 12px; margin-bottom: 24px; }
.qt-industry-card {
padding: 30px;
border-radius: 16px;
background: rgba(247, 249, 252, 0.8);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border: 1px solid var(--qt-border);
height: 100%;
transition: all 0.3s ease;
}
.qt-industry-card:hover {
transform: translateY(-3px);
box-shadow: 0 6px 20px var(--qt-shadow);
}
.qt-industry-card h3 {
font-size: 1.1rem;
margin-bottom: 12px;
color: var(--qt-primary);
}
.qt-industry-card h3 i { margin-right: 8px; }
.qt-industry-card p {
color: var(--qt-text-secondary);
font-size: 0.92rem;
line-height: 1.8;
}
.qt-cta-bg {
background: linear-gradient(135deg, var(--qt-primary), var(--qt-secondary));
background-attachment: fixed;
position: relative;
}
.qt-cta-parallax {
position: absolute;
inset: 0;
background: url('{:rand_imgs($site_config.rand_imgs, 3)}') center/cover fixed no-repeat;
opacity: 0.15;
}
.qt-cta-overlay {
position: absolute;
inset: 0;
background: linear-gradient(135deg, rgba(25, 118, 210, 0.85), rgba(66, 165, 245, 0.85));
}
.qt-cta-container { position: relative; z-index: 2; }
.qt-cta-content {
text-align: center;
padding: 50px 40px;
}
.qt-cta-content h2 {
color: #fff;
margin-bottom: 16px;
}
.qt-cta-content p {
color: rgba(255,255,255,0.85);
margin-bottom: 30px;
font-size: 1.05rem;
}
.qt-cta-actions {
display: flex;
gap: 16px;
justify-content: center;
flex-wrap: wrap;
}
.qt-glass-card {
background: rgba(255,255,255,0.7);
backdrop-filter: blur(20px) saturate(150%);
-webkit-backdrop-filter: blur(20px) saturate(150%);
border: 1px solid rgba(255,255,255,0.3);
border-radius: 16px;
box-shadow: 0 8px 32px var(--qt-shadow);
}
.qt-ripple-effect {
position: absolute;
border-radius: 50%;
background: rgba(255,255,255,0.35);
transform: scale(0);
animation: qtRipple 0.6s ease-out forwards;
pointer-events: none;
}
@keyframes qtRipple {
to { transform: scale(4); opacity: 0; }
}
.qt-page-banner {
position: relative;
padding: 140px 0 60px;
background: linear-gradient(135deg, var(--qt-bg-dark), #1a3a5c);
overflow: hidden;
}
.qt-page-banner-overlay {
position: absolute;
inset: 0;
background: url('{:rand_imgs($site_config.rand_imgs, 4)}') center/cover no-repeat;
opacity: 0.12;
}
.qt-page-banner-content {
position: relative;
z-index: 2;
text-align: center;
}
.qt-page-banner-content h1 {
color: #fff;
margin-bottom: 12px;
}
.qt-page-banner-content p {
color: rgba(255,255,255,0.8);
font-size: 1.05rem;
}
.qt-breadcrumb {
display: flex;
justify-content: center;
gap: 8px;
list-style: none;
padding: 0;
margin: 16px 0 0;
}
.qt-breadcrumb-item a { color: rgba(255,255,255,0.7); }
.qt-breadcrumb-item a:hover { color: #fff; }
.qt-breadcrumb-item.active { color: rgba(255,255,255,0.5); }
.qt-breadcrumb-item + .qt-breadcrumb-item::before {
content: '/';
color: rgba(255,255,255,0.4);
margin-right: 8px;
}
.qt-news-list-section { background: var(--qt-bg); }
.qt-news-list-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 24px;
}
.qt-news-list-header h2 { margin: 0; }
.qt-news-count {
color: var(--qt-text-secondary);
font-size: 0.9rem;
}
.qt-news-list-item {
display: flex;
gap: 24px;
padding: 24px;
border-radius: 16px;
background: #fff;
border: 1px solid var(--qt-border);
margin-bottom: 20px;
transition: all 0.3s ease;
}
.qt-news-list-item:hover {
transform: translateY(-3px);
box-shadow: 0 8px 25px var(--qt-shadow);
}
.qt-news-list-img { flex: 0 0 240px; }
.qt-list-img {
width: 240px;
height: 160px;
object-fit: cover;
border-radius: 12px;
}
.qt-news-list-body { flex: 1; }
.qt-news-list-meta {
display: flex;
gap: 16px;
margin-bottom: 8px;
font-size: 0.82rem;
color: var(--qt-text-secondary);
}
.qt-list-title {
font-size: 1.15rem;
margin-bottom: 8px;
}
.qt-list-title a { color: var(--qt-text); }
.qt-list-title a:hover { color: var(--qt-primary); }
.qt-list-desc {
color: var(--qt-text-secondary);
font-size: 0.9rem;
margin-bottom: 12px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.qt-list-tags {
display: flex;
gap: 6px;
flex-wrap: wrap;
margin-bottom: 12px;
}
.qt-list-link {
display: inline-flex;
align-items: center;
gap: 4px;
color: var(--qt-primary);
font-weight: 600;
font-size: 0.88rem;
}
.qt-news-sidebar { position: sticky; top: 130px; }
.qt-sidebar-card {
padding: 24px;
border-radius: 16px;
margin-bottom: 20px;
}
.qt-sidebar-title {
font-size: 1.1rem;
margin-bottom: 16px;
padding-bottom: 12px;
border-bottom: 1px solid var(--qt-border);
}
.qt-sidebar-title i { color: var(--qt-accent); margin-right: 6px; }
.qt-sidebar-item {
display: flex;
gap: 12px;
padding: 10px 0;
border-bottom: 1px solid rgba(221,229,240,0.5);
transition: all 0.3s ease;
}
.qt-sidebar-item:last-child { border-bottom: none; }
.qt-sidebar-item:hover { padding-left: 6px; }
.qt-sidebar-item-img {
flex: 0 0 70px;
height: 50px;
border-radius: 8px;
overflow: hidden;
}
.qt-sidebar-item-img img {
width: 100%;
height: 100%;
object-fit: cover;
}
.qt-sidebar-item-info h5 {
font-size: 0.85rem;
margin: 0 0 4px;
line-height: 1.4;
}
.qt-sidebar-item-info h5:hover { color: var(--qt-primary); }
.qt-sidebar-item-info span {
font-size: 0.75rem;
color: var(--qt-text-secondary);
}
.qt-sidebar-cta {
background: linear-gradient(135deg, var(--qt-primary), var(--qt-secondary));
text-align: center;
border: none;
}
.qt-sidebar-cta h4 { color: #fff; margin-bottom: 8px; }
.qt-sidebar-cta p { color: rgba(255,255,255,0.8); font-size: 0.88rem; margin-bottom: 16px; }
.qt-sidebar-cta .qt-btn-primary {
background: rgba(255,255,255,0.2);
border: 1px solid rgba(255,255,255,0.4);
}
.qt-sidebar-phone {
display: block;
color: #fff;
margin-top: 12px;
font-weight: 600;
font-size: 1.1rem;
}
.qt-sidebar-tags {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.qt-sidebar-tags a { font-size: 0.82rem; }
.qt-detail-section { background: var(--qt-bg); }
.qt-detail-article {
padding: 40px;
border-radius: 16px;
margin-bottom: 40px;
}
.qt-detail-header { margin-bottom: 30px; }
.qt-detail-title {
font-size: 1.6rem;
margin-bottom: 16px;
line-height: 1.5;
}
.qt-detail-meta {
display: flex;
gap: 20px;
flex-wrap: wrap;
margin-bottom: 12px;
}
.qt-meta-item {
font-size: 0.85rem;
color: var(--qt-text-secondary);
}
.qt-meta-item i { margin-right: 4px; color: var(--qt-primary); }
.qt-detail-tags {
display: flex;
gap: 8px;
flex-wrap: wrap;
}
.qt-detail-content {
font-size: 1rem;
line-height: 2;
color: var(--qt-text);
}
.qt-detail-content img {
border-radius: 12px;
margin: 20px 0;
}
.qt-detail-content p { margin-bottom: 16px; }
.qt-detail-footer {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 30px;
padding-top: 20px;
border-top: 1px solid var(--qt-border);
flex-wrap: wrap;
gap: 16px;
}
.qt-detail-share {
display: flex;
align-items: center;
gap: 8px;
}
.qt-share-btn {
width: 36px;
height: 36px;
border-radius: 50%;
background: rgba(25, 118, 210, 0.08);
display: flex;
align-items: center;
justify-content: center;
color: var(--qt-primary);
transition: all 0.3s ease;
}
.qt-share-btn:hover {
background: var(--qt-primary);
color: #fff;
}
.qt-related-section { margin-top: 40px; }
.qt-related-title {
font-size: 1.2rem;
margin-bottom: 20px;
}
.qt-related-title i { color: var(--qt-primary); margin-right: 6px; }
.qt-related-col { margin-bottom: 16px; }
.qt-related-card {
display: flex;
gap: 16px;
padding: 16px;
border-radius: 12px;
transition: all 0.3s ease;
}
.qt-related-card:hover {
transform: translateY(-2px);
box-shadow: 0 4px 15px var(--qt-shadow);
}
.qt-related-img {
flex: 0 0 100px;
height: 70px;
border-radius: 8px;
overflow: hidden;
}
.qt-related-img img { width: 100%; height: 100%; object-fit: cover; }
.qt-related-info h4 { font-size: 0.9rem; margin-bottom: 4px; line-height: 1.4; }
.qt-related-info span { font-size: 0.78rem; color: var(--qt-text-secondary); }
.qt-detail-sidebar { position: sticky; top: 130px; }
.qt-about-intro { background: var(--qt-bg); }
.qt-about-intro-grid { align-items: center; }
.qt-about-heading {
margin-bottom: 16px;
color: var(--qt-primary);
}
.qt-about-lead {
font-size: 1.1rem;
color: var(--qt-text);
margin-bottom: 16px;
font-weight: 500;
}
.qt-about-text-col p {
color: var(--qt-text-secondary);
margin-bottom: 12px;
line-height: 1.9;
}
.qt-about-img-wrapper {
position: relative;
border-radius: 16px;
overflow: hidden;
}
.qt-about-img {
width: 100%;
height: 400px;
object-fit: cover;
border-radius: 16px;
}
.qt-about-img-badge {
position: absolute;
bottom: 20px;
right: 20px;
padding: 16px 24px;
text-align: center;
border-radius: 12px;
background: rgba(255,255,255,0.9);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
}
.qt-badge-number {
font-size: 2rem;
font-weight: 800;
color: var(--qt-primary);
line-height: 1;
}
.qt-badge-text {
font-size: 0.8rem;
color: var(--qt-text-secondary);
}
.qt-values-bg {
background: linear-gradient(135deg, var(--qt-bg-dark), #1a3a5c);
position: relative;
}
.qt-values-overlay {
position: absolute;
inset: 0;
background: url('{:rand_imgs($site_config.rand_imgs, 7)}') center/cover no-repeat;
opacity: 0.1;
}
.qt-values-grid { margin: 0 -12px; }
.qt-value-col { padding: 0 12px; margin-bottom: 24px; }
.qt-value-card {
padding: 30px;
border-radius: 16px;
text-align: center;
background: rgba(255,255,255,0.08);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
border: 1px solid rgba(255,255,255,0.15);
transition: all 0.3s ease;
}
.qt-value-card:hover {
transform: translateY(-5px);
background: rgba(255,255,255,0.12);
}
.qt-value-icon {
width: 60px;
height: 60px;
border-radius: 50%;
background: rgba(255,255,255,0.1);
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 16px;
}
.qt-value-icon i { font-size: 1.5rem; color: var(--qt-secondary); }
.qt-value-card h3 { color: #fff; margin-bottom: 10px; }
.qt-value-card p { color: rgba(255,255,255,0.7); font-size: 0.9rem; }
.qt-about-timeline { background: #fff; }
.qt-timeline {
position: relative;
max-width: 800px;
margin: 0 auto;
padding: 20px 0;
}
.qt-timeline::before {
content: '';
position: absolute;
left: 50%;
top: 0;
bottom: 0;
width: 2px;
background: var(--qt-border);
transform: translateX(-50%);
}
.qt-timeline-item {
position: relative;
width: 50%;
padding: 20px 40px;
opacity: 0;
transform: translateX(-20px);
transition: all 0.6s ease;
}
.qt-timeline-item.qt-visible {
opacity: 1;
transform: translateX(0);
}
.qt-timeline-left { left: 0; text-align: right; }
.qt-timeline-right { left: 50%; text-align: left; transform: translateX(20px); }
.qt-timeline-right.qt-visible { transform: translateX(0); }
.qt-timeline-dot {
position: absolute;
width: 16px;
height: 16px;
border-radius: 50%;
background: var(--qt-primary);
top: 30px;
border: 3px solid #fff;
box-shadow: 0 0 0 3px var(--qt-primary);
}
.qt-timeline-left .qt-timeline-dot { right: -8px; }
.qt-timeline-right .qt-timeline-dot { left: -8px; }
.qt-timeline-card {
padding: 20px;
border-radius: 12px;
}
.qt-timeline-card h4 { color: var(--qt-primary); margin-bottom: 6px; }
.qt-timeline-card p { color: var(--qt-text-secondary); font-size: 0.9rem; margin: 0; }
.qt-about-address { background: var(--qt-bg); }
.qt-about-contact-grid { align-items: start; }
.qt-about-contact-card {
padding: 36px;
border-radius: 16px;
}
.qt-about-contact-card h3 { margin-bottom: 24px; }
.qt-contact-info-list { margin-bottom: 24px; }
.qt-contact-info-item {
display: flex;
gap: 16px;
padding: 16px 0;
border-bottom: 1px solid var(--qt-border);
}
.qt-contact-info-item:last-child { border-bottom: none; }
.qt-contact-info-item i {
font-size: 1.3rem;
color: var(--qt-primary);
margin-top: 2px;
}
.qt-contact-info-item strong {
display: block;
margin-bottom: 4px;
font-size: 0.9rem;
}
.qt-contact-info-item p {
color: var(--qt-text-secondary);
font-size: 0.9rem;
margin: 0;
}
.qt-about-map-wrapper {
border-radius: 16px;
overflow: hidden;
}
.qt-about-map-img {
width: 100%;
height: 400px;
object-fit: cover;
}
.qt-contact-section { background: var(--qt-bg); }
.qt-contact-lead {
color: var(--qt-text-secondary);
font-size: 1.05rem;
margin-bottom: 30px;
}
.qt-contact-methods { margin-bottom: 30px; }
.qt-contact-method {
display: flex;
gap: 16px;
padding: 20px;
border-radius: 12px;
margin-bottom: 12px;
background: rgba(255,255,255,0.7);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border: 1px solid var(--qt-border);
transition: all 0.3s ease;
}
.qt-contact-method:hover {
transform: translateX(5px);
box-shadow: 0 4px 15px var(--qt-shadow);
}
.qt-method-icon {
width: 48px;
height: 48px;
border-radius: 12px;
background: rgba(25, 118, 210, 0.08);
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.qt-method-icon i { font-size: 1.3rem; color: var(--qt-primary); }
.qt-contact-method h4 { font-size: 0.95rem; margin-bottom: 2px; }
.qt-contact-method p { color: var(--qt-primary); font-weight: 600; margin: 0 0 2px; font-size: 0.95rem; }
.qt-contact-method span { font-size: 0.8rem; color: var(--qt-text-secondary); }
.qt-contact-wechat-qr {
text-align: center;
padding: 20px;
background: #fff;
border-radius: 16px;
border: 1px solid var(--qt-border);
}
.qt-qr-img {
width: 160px;
height: 160px;
object-fit: contain;
margin: 0 auto 12px;
}
.qt-contact-wechat-qr p {
color: var(--qt-text-secondary);
font-size: 0.88rem;
margin: 0;
}
.qt-contact-form-wrapper {
padding: 40px;
border-radius: 16px;
}
.qt-contact-form-wrapper h3 { margin-bottom: 8px; }
.qt-form-desc {
color: var(--qt-text-secondary);
margin-bottom: 24px;
font-size: 0.92rem;
}
.qt-form-group {
margin-bottom: 20px;
}
.qt-form-group label {
display: block;
font-weight: 600;
font-size: 0.9rem;
margin-bottom: 6px;
color: var(--qt-text);
}
.qt-required { color: var(--qt-accent); }
.qt-form-input {
width: 100%;
padding: 12px 16px;
border: 1px solid var(--qt-border);
border-radius: 10px;
font-size: 0.95rem;
color: var(--qt-text);
background: var(--qt-bg);
transition: all 0.3s ease;
outline: none;
font-family: inherit;
}
.qt-form-input:focus {
border-color: var(--qt-primary);
box-shadow: 0 0 0 3px rgba(25, 118, 210, 0.12);
}
textarea.qt-form-input { resize: vertical; min-height: 120px; }
select.qt-form-input { cursor: pointer; }
.qt-form-submit { text-align: center; }
.qt-form-tip {
color: var(--qt-text-secondary);
font-size: 0.8rem;
margin-top: 12px;
}
.qt-form-result { margin-top: 16px; }
.qt-alert {
padding: 12px 20px;
border-radius: 10px;
font-size: 0.9rem;
}
.qt-alert-success {
background: rgba(76, 175, 80, 0.1);
color: #2E7D32;
border: 1px solid rgba(76, 175, 80, 0.2);
}
.qt-alert-error {
background: rgba(244, 81, 30, 0.1);
color: #C62828;
border: 1px solid rgba(244, 81, 30, 0.2);
}
.qt-faq { background: #fff; }
.qt-faq-list { max-width: 800px; margin: 0 auto; }
.qt-faq-item {
border-radius: 12px;
margin-bottom: 12px;
overflow: hidden;
border: 1px solid var(--qt-border);
}
.qt-faq-question {
display: flex;
justify-content: space-between;
align-items: center;
padding: 18px 24px;
cursor: pointer;
margin: 0;
font-size: 1rem;
transition: all 0.3s ease;
}
.qt-faq-question:hover { color: var(--qt-primary); }
.qt-faq-question i {
transition: transform 0.3s ease;
color: var(--qt-text-secondary);
}
.qt-faq-open .qt-faq-question i { transform: rotate(180deg); }
.qt-faq-answer {
display: none;
padding: 0 24px 18px;
}
.qt-faq-answer p {
color: var(--qt-text-secondary);
font-size: 0.92rem;
line-height: 1.8;
margin: 0;
}
.qt-footer {
background: var(--qt-bg-dark);
color: rgba(255,255,255,0.8);
}
.qt-footer-top {
padding: 60px 0 40px;
}
.qt-footer-col { margin-bottom: 30px; }
.qt-footer-brand { margin-bottom: 20px; }
.qt-footer-logo {
height: 40px;
width: auto;
margin-bottom: 12px;
}
.qt-footer-brand h4 {
color: #fff;
margin-bottom: 8px;
}
.qt-footer-desc {
font-size: 0.88rem;
color: rgba(255,255,255,0.6);
line-height: 1.7;
}
.qt-footer-contact p {
font-size: 0.88rem;
margin-bottom: 6px;
}
.qt-footer-contact i {
color: var(--qt-secondary);
margin-right: 8px;
}
.qt-footer-col h5 {
color: #fff;
font-size: 1rem;
margin-bottom: 16px;
position: relative;
padding-bottom: 10px;
}
.qt-footer-col h5::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 30px;
height: 2px;
background: var(--qt-primary);
}
.qt-footer-links {
list-style: none;
padding: 0;
margin: 0;
}
.qt-footer-links li { margin-bottom: 8px; }
.qt-footer-links a {
color: rgba(255,255,255,0.6);
font-size: 0.88rem;
transition: all 0.3s ease;
}
.qt-footer-links a:hover {
color: #fff;
padding-left: 4px;
}
.qt-footer-wechat { margin-bottom: 16px; }
.qt-wechat-qr {
width: 120px;
height: 120px;
object-fit: contain;
border-radius: 8px;
margin-bottom: 8px;
background: #fff;
padding: 4px;
}
.qt-footer-wechat p {
font-size: 0.85rem;
color: rgba(255,255,255,0.6);
}
.qt-footer-social {
display: flex;
gap: 10px;
}
.qt-footer-social a {
width: 36px;
height: 36px;
border-radius: 50%;
background: rgba(255,255,255,0.1);
display: flex;
align-items: center;
justify-content: center;
color: rgba(255,255,255,0.7);
transition: all 0.3s ease;
}
.qt-footer-social a:hover {
background: var(--qt-primary);
color: #fff;
}
.qt-footer-friends {
padding: 20px 0;
border-top: 1px solid rgba(255,255,255,0.08);
border-bottom: 1px solid rgba(255,255,255,0.08);
}
.qt-footer-friends h6 {
color: rgba(255,255,255,0.5);
font-size: 0.82rem;
margin-bottom: 10px;
font-weight: 500;
}
.qt-friend-links {
display: flex;
flex-wrap: wrap;
gap: 12px;
}
.qt-friend-links a {
color: rgba(255,255,255,0.5);
font-size: 0.82rem;
transition: color 0.3s ease;
}
.qt-friend-links a:hover { color: rgba(255,255,255,0.8); }
.qt-footer-bottom {
padding: 20px 0;
}
.qt-footer-bottom-inner {
text-align: center;
}
.qt-footer-bottom p {
font-size: 0.82rem;
color: rgba(255,255,255,0.4);
margin-bottom: 4px;
}
.qt-weather-widget {
position: fixed;
bottom: 20px;
right: 20px;
z-index: 900;
opacity: 0;
pointer-events: none;
transition: opacity 0.3s ease;
}
.qt-weather-active {
opacity: 1;
pointer-events: auto;
}
.qt-weather-toggle {
position: absolute;
top: -8px;
right: -8px;
width: 24px;
height: 24px;
border-radius: 50%;
background: rgba(0,0,0,0.5);
color: #fff;
border: none;
cursor: pointer;
font-size: 0.7rem;
display: flex;
align-items: center;
justify-content: center;
z-index: 2;
}
.qt-weather-info {
text-align: center;
font-size: 0.75rem;
color: rgba(255,255,255,0.8);
margin-top: 4px;
text-shadow: 0 1px 3px rgba(0,0,0,0.5);
}
.qt-pagination-wrapper {
display: flex;
justify-content: center;
margin-top: 40px;
}
.qt-pagination-wrapper .pagination { gap: 4px; }
.qt-pagination-wrapper .page-link {
border-radius: 8px;
border: 1px solid var(--qt-border);
color: var(--qt-text);
padding: 8px 14px;
font-size: 0.88rem;
}
.qt-pagination-wrapper .page-item.active .page-link {
background: var(--qt-primary);
border-color: var(--qt-primary);
color: #fff;
}
@media (max-width: 991.98px) {
.qt-search-wrapper { display: none; }
.qt-nav-cta-area .qt-phone-link span { display: none; }
.qt-hamburger { display: flex; }
.qt-nav-lower { display: none; }
.qt-hero { min-height: auto; padding: 120px 0 60px; }
.qt-slide-img { height: 250px; }
.qt-hero-content { padding: 24px 16px; }
.qt-vertical-title { display: none; }
.qt-section { padding: 50px 0; }
.qt-breathe-lg { padding: 8vh 0; }
.qt-breathe-md { padding: 6vh 0; }
.qt-breathe-sm { padding: 4vh 0; }
.qt-network-canvas { height: 300px; }
.qt-process-canvas { height: 80px; }
.qt-process-steps { flex-direction: column; gap: 10px; }
.qt-process-step { min-width: auto; }
.qt-timeline::before { left: 20px; }
.qt-timeline-item { width: 100%; left: 0 !important; padding: 15px 15px 15px 50px; text-align: left !important; }
.qt-timeline-dot { left: 12px !important; right: auto !important; }
.qt-about-img { height: 280px; }
.qt-news-list-item { flex-direction: column; }
.qt-news-list-img { flex: none; }
.qt-list-img { width: 100%; height: 200px; }
.qt-detail-article { padding: 24px; }
.qt-contact-form-wrapper { padding: 24px; }
.qt-news-sidebar,
.qt-detail-sidebar { position: static; margin-top: 30px; }
}
@media (max-width: 767.98px) {
.qt-hero-parallax-layer { background-attachment: scroll; }
.qt-stats-bg { background-attachment: scroll; }
.qt-features-bg { background-attachment: scroll; }
.qt-cta-bg { background-attachment: scroll; }
.qt-city-grid { grid-template-columns: repeat(auto-fill, minmax(80px, 1fr)); gap: 8px; }
.qt-stat-item { padding: 24px 16px; }
.qt-flip-card { height: 280px; }
.qt-news-col,
.qt-testimonial-col { flex: 0 0 100%; max-width: 100%; }
.qt-footer-top { padding: 40px 0 20px; }
}
@media (prefers-reduced-motion: reduce) {
*,*::before,*::after {
animation-duration: 0.01ms !important;
transition-duration: 0.01ms !important;
}
.qt-hero-parallax-layer,
.qt-stats-bg,
.qt-features-parallax,
.qt-cta-parallax {
background-attachment: scroll;
}
}