/* Product Page Styles */
/* Consolidated from PT product pages inline styles */

/* ── Layout & Hero ── */
.prod-hero { display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-bottom:40px;align-items:center; }
.prod-hero-img { position:relative;border-radius:12px;overflow:hidden;aspect-ratio:4/3;background:#f0f4f8;display:flex;align-items:center;justify-content:center; }
.prod-hero-img i { font-size:80px;color:#f39c12;opacity:0.4 }
.prod-hero-img img { width:100%;height:100%;object-fit:cover; }
.prod-hero-badge { position:absolute;top:16px;left:16px;background:#00a8e8;color:#fff;font-size:13px;font-weight:700;padding:4px 14px;border-radius:20px; }
.prod-hero-eyebrow { font-size:13px;color:#00a8e8;font-weight:600;margin-bottom:8px;text-transform:uppercase;letter-spacing:1px; }
.prod-hero-info h1 { font-size:32px;margin:0 0 10px;color:#1a1a1a;line-height:1.2; }
.prod-hero-sub { font-size:15px;color:#777;margin:0 0 20px;line-height:1.6; }
.prod-hero-specs { display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:24px; }
.prod-hero-cta { display:flex;gap:12px;flex-wrap:wrap; }
.prod-hero-cta .button { padding:12px 24px;font-size:15px }

/* ── Tabs ── */
.prod-tabs { display:flex;gap:4px;border-bottom:2px solid #eee;margin-bottom:36px }
.tab-btn { padding:12px 22px;border:none;background:none;font-size:15px;font-weight:500;color:#999;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-2px;transition:all .2s }
.prod-tab-content .tab-pane { display:none }
.tab-pane.active { display:block }
.tab-btn:hover { color:#00a8e8 }
.tab-btn.active { color:#00a8e8;border-bottom-color:#00a8e8 }
.reco-card:hover { box-shadow:0 6px 24px rgba(0,0,0,0.1);transform:translateY(-2px);border-color:#00a8e8 }

/* ── Tab Content ── */
.tab-pane h2 { font-size:24px;margin:0 0 20px;color:#1a1a1a }
.tab-pane h3 { font-size:18px;margin:24px 0 12px;color:#222 }
.tab-pane p { font-size:15px;color:#555;line-height:1.8;margin-bottom:16px }

/* ── Specs ── */
.spec-item { background:#f8f9fa;border-radius:8px;padding:10px 14px; }
.spec-label { display:block;font-size:11px;color:#aaa;text-transform:uppercase; }
.spec-value { display:block;font-size:15px;font-weight:700;color:#1a1a1a; }
.specs-table { width:100%;border-collapse:collapse;margin-bottom:28px }
.specs-table th { background:#f8f9fa;font-size:13px;color:#888;font-weight:600;text-transform:uppercase }
.specs-table td { padding:12px 16px;border-bottom:1px solid #eee;text-align:left }
.specs-table td strong { color:#00a8e8 }
.prod-specs-table { width:100%;border-collapse:collapse;margin-bottom:28px }
.prod-specs-table th { background:#f8f9fa;font-size:13px;color:#888;font-weight:600 }
.prod-specs-table td { padding:12px 16px;border-bottom:1px solid #eee;text-align:left }
.prod-specs-table td strong { color:#00a8e8 }

/* ── Advantages ── */
.advantage-grid { display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin:20px 0 28px; }
.advantage-item { background:#f8f9fa;border-radius:10px;padding:20px; }
.advantage-item h4 { font-size:15px;margin:0 0 6px;color:#1a1a1a; }
.advantage-item i { font-size:28px;color:#00a8e8;margin-bottom:10px;display:block; }
.advantage-item p { font-size:13px;color:#777;margin:0;line-height:1.5; }

/* ── Applications ── */
.app-section { margin-bottom:32px }
.app-section h3 { font-size:17px;margin:0 0 16px;color:#222 }
.app-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:20px }
.app-item { background:#f8f9fa;border-radius:10px;padding:20px;text-align:center }
.app-item h4 { font-size:14px;margin:0 0 6px;color:#1a1a1a }
.app-item i { font-size:28px;color:#00a8e8;margin-bottom:10px;display:block }
.app-item p { font-size:12px;color:#777;margin:0;line-height:1.5 }

/* ── Recommendations ── */
.recommended-models { margin-top:40px;padding-top:40px;border-top:1px solid #eee }
.recommended-models h2 { font-size:24px;margin:0 0 20px;color:#1a1a1a }
.reco-grid { display:grid;grid-template-columns:1fr 1fr;gap:20px }
.reco-card { background:#fff;border:1px solid #e8e8e8;border-radius:12px;overflow:hidden;text-decoration:none;color:inherit;display:flex;flex-direction:column;transition:all .25s }
.reco-card-img { width:100%;height:160px;object-fit:cover;display:block;background:#f8f9fa }
.reco-card img { width:100%;height:160px;object-fit:cover }
.reco-body { padding:18px 20px }
.reco-body h3 { font-size:16px;margin:8px 0 6px;color:#1a1a1a }
.reco-body p { font-size:13px;color:#777;margin:0 0 12px;line-height:1.5 }
.reco-badge { font-size:11px;background:rgba(0,168,232,0.1);color:#00a8e8;padding:2px 8px;border-radius:10px;font-weight:600 }
.reco-link { font-size:13px;color:#00a8e8;font-weight:600 }

/* ── Principles ── */
.principle-section { margin:40px 0;padding-top:40px;border-top:1px solid #eee }
.principle-section h2 { font-size:24px;margin:0 0 24px;color:#1a1a1a }
.principle-grid { display:grid;grid-template-columns:1fr 1fr;gap:20px }
.principle-card { background:#f8f9fa;border-radius:12px;padding:24px }
.principle-card h3 { font-size:16px;margin:0 0 10px;color:#1a1a1a }
.principle-card p { font-size:14px;color:#666;line-height:1.7;margin:0 }
.principle-icon { width:48px;height:48px;border-radius:12px;background:rgba(0,168,232,0.1);display:flex;align-items:center;justify-content:center;margin-bottom:14px }
.principle-icon i { font-size:22px;color:#00a8e8 }

/* ── SZH Series ── */
.szh-series { margin-top:40px; }
.szh-series h2 { font-size:24px;margin:0 0 20px;color:#1a1a1a; }
.szh-grid { display:grid;grid-template-columns:1fr 1fr;gap:20px; }
.szh-card { background:#fff;border:1px solid #e8e8e8;border-radius:12px;overflow:hidden;text-decoration:none;color:inherit;display:flex;flex-direction:column;transition:all 0.25s; }
.szh-card:hover { box-shadow: 0 8px 28px rgba(0,0,0,0.12); transform: translateY(-3px); }
.szh-card-img { width:100%;height:160px;object-fit:cover; }
.szh-card img { width:100%;height:200px;object-fit:cover; }
.szh-body { padding:20px;flex:1; }
.szh-body h3 { font-size:18px;margin:0 0 8px;color:#1a1a1a; }
.szh-body p { font-size:13px;color:#777;margin:0 0 14px;line-height:1.5; }
.szh-badge { display:inline-block;background:rgba(0,168,232,0.1);color:#00a8e8;font-size:11px;font-weight:700;padding:3px 10px;border-radius:10px;margin-bottom:8px; }
.szh-link { font-size:13px;color:#00a8e8;font-weight:600; }

/* ── Product Cards ── */
.prod-card { background: #fff; border-radius: 12px; overflow: hidden; border: 1px solid #e8e8e8; box-shadow: 0 2px 12px rgba(0,0,0,0.06); display: flex; flex-direction: column; transition: box-shadow 0.25s, transform 0.25s; }
.prod-card-img { position: relative; height: 200px; overflow: hidden; }
.prod-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s; }
.prod-card:hover { box-shadow: 0 8px 28px rgba(0,0,0,0.12); transform: translateY(-3px); }
.prod-card:hover .prod-card-img img { transform: scale(1.04); }
.prod-card-body { padding: 22px 22px 24px; flex: 1; display: flex; flex-direction: column; }
.prod-card-body h3 { font-size: 18px; margin: 0 0 4px; color: #1a1a1a; }
.prod-card-sub { font-size: 13px; color: #00a8e8; font-weight: 500; margin: 0 0 12px; }
.prod-card-desc { font-size: 14px; color: #555; line-height: 1.6; margin: 0 0 18px; flex: 1; }
.prod-card-specs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.prod-card-specs span { font-size: 12px; color: #666; background: #f5f5f5; padding: 3px 8px; border-radius: 4px; display: flex; align-items: center; gap: 4px; }
.prod-card-specs span i { color: #00a8e8; font-size: 11px; }
.prod-card-badge { position: absolute; top: 12px; right: 12px; background: #00a8e8; color: #fff; font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 20px; }
.prod-card-btn { width: 100%; text-align: center; box-sizing: border-box; margin-top: auto; }

/* ── Product Sections ── */
.prod-section { margin-bottom: 72px; }
.prod-section:last-child { margin-bottom: 0; }
.prod-section-header { text-align: center; margin-bottom: 36px; padding-bottom: 24px; border-bottom: 2px solid rgba(0,168,232,0.15); }
.prod-section-header h2 { font-size: 26px; margin: 0 0 6px; color: #222; }
.prod-section-header p { color: #777; font-size: 15px; margin: 0; }
.prod-section-icon { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; background: rgba(0,168,232,0.1); border-radius: 50%; font-size: 22px; color: #00a8e8; margin-bottom: 10px; }
.prod-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 28px; }
.section-block { margin-bottom:40px; }
.section-block h2 { font-size:24px;margin:0 0 20px;color:#1a1a1a;border-bottom:2px solid #00a8e8;padding-bottom:10px; }
.section-block p { font-size:15px;color:#555;line-height:1.8;margin-bottom:16px; }

/* ── Soon Card ── */
.soon-card { background:linear-gradient(135deg,#f8f9fa,#fff8e8);border:2px dashed #f39c12;border-radius:12px;padding:40px;text-align:center }
.soon-card h3 { font-size:20px;color:#1a1a1a;margin:0 0 10px }
.soon-card i { font-size:48px;color:#f39c12;margin-bottom:16px;display:block }
.soon-card p { font-size:14px;color:#666;margin:0 0 20px }

/* ── Geo List ── */
.geo-list { list-style:none;padding:0;margin:0 0 14px;display:grid;grid-template-columns:1fr 1fr;gap:8px }
.geo-list li { font-size:14px;color:#555;display:flex;align-items:center;gap:8px }
.geo-list li i { color:#27ae60;font-size:13px }

/* ── Quick Nav ── */
.quick-nav { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 48px; justify-content: center; }
.qn-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 18px; background: rgba(0,168,232,0.08); border: 1.5px solid rgba(0,168,232,0.3); border-radius: 24px; color: #00a8e8; text-decoration: none; font-size: 14px; font-weight: 500; transition: all 0.2s; }
.qn-btn i { font-size: 13px; }
.qn-btn:hover { background: #00a8e8; color: #fff; }

/* ── Buttons ── */
.button { padding:12px 24px;font-size:15px }
.btn-soon { display:inline-block;padding:10px 24px;background:#f39c12;color:#fff;border-radius:8px;text-decoration:none;font-weight:600 }

/* ── Modal ── */
.modal { display:none;position:fixed;z-index:99999;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);align-items:center;justify-content:center }
.modal-content { background:#fff;border-radius:12px;padding:24px;text-align:center;max-width:300px }
.modal-content img { max-width:200px;border-radius:8px;margin-bottom:12px }
.modal-content p { font-size:14px;color:#555;margin:0 }
.close-btn { position:absolute;top:12px;right:16px;font-size:24px;cursor:pointer;color:#999 }



/* ── Active ── */
.active { opacity: 1;
			font-weight: bold; }

/* ── Responsive ── */
@media (max-width: 768px) { .prod-hero { grid-template-columns: 1fr !important } .prod-hero-specs { grid-template-columns: 1fr !important } .advantage-grid, .app-grid, .principle-grid, .reco-grid, .szh-grid { grid-template-columns: 1fr } .geo-list { grid-template-columns: 1fr } .prod-grid { grid-template-columns: 1fr } .prod-tabs { overflow-x: auto; white-space: nowrap } .tab-btn { padding: 10px 16px; font-size: 14px } .quick-nav { gap: 8px } .qn-btn { font-size: 13px; padding: 7px 14px } }
@media (max-width: 900px) { .prod-grid { grid-template-columns: repeat(2, 1fr) !important } }