/* ============================================
   YX Labs — 信任优先设计系统
   DESIGN SYSTEM: trust-first · warm · professional
   ============================================ */
:root {
  --brand-50: #f0fdfa;   --brand-100: #ccfbf1;  --brand-200: #99f6e4;
  --brand-400: #2dd4bf;  --brand-500: #14b8a6;  --brand-600: #0d9488;
  --brand-700: #0f766e;  --brand-800: #115e59;  --brand-900: #134e4a;
  --accent-50: #fff7ed;  --accent-100: #ffedd5; --accent-400: #fb923c;
  --accent-500: #f97316; --accent-600: #ea580c;
  --neutral-50: #fafaf9; --neutral-100: #f5f5f4;--neutral-200: #e7e5e4;
  --neutral-300: #d6d3d1;--neutral-400: #a8a29e;--neutral-500: #78716c;
  --neutral-600: #57534e;--neutral-700: #44403c;--neutral-800: #292524;
  --neutral-900: #1c1917;
  --success: #16a34a;     --warning: #ca8a04;    --error: #dc2626;
  --bg: var(--neutral-50); --bg-card: #fff;     --bg-section: var(--neutral-100);
  --bg-dark: var(--neutral-900);
  --text-primary: var(--neutral-900); --text-secondary: var(--neutral-600);
  --text-muted: var(--neutral-400);
  --border: var(--neutral-200);        --border-strong: var(--neutral-300);
  --font-display: 'Noto Sans SC', 'DM Sans', system-ui, sans-serif;
  --font-body: 'Noto Sans SC', system-ui, sans-serif;
  --text-xs: .75rem;  --text-sm: .875rem; --text-base: 1rem;
  --text-lg: 1.125rem; --text-xl: 1.25rem; --text-2xl: 1.5rem;
  --text-3xl: 1.875rem; --text-4xl: 2.25rem; --text-5xl: 3rem;
  --text-6xl: 3.75rem;
  --space-1: .25rem;  --space-2: .5rem;   --space-3: .75rem;
  --space-4: 1rem;    --space-5: 1.25rem; --space-6: 1.5rem;
  --space-8: 2rem;    --space-10: 2.5rem; --space-12: 3rem;
  --space-16: 4rem;   --space-20: 5rem;   --space-24: 6rem;
  --radius-sm: .375rem;  --radius-md: .5rem;  --radius-lg: .75rem;
  --radius-xl: 1rem;     --radius-2xl: 1.5rem;--radius-full: 9999px;
  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / .07), 0 2px 4px -2px rgb(0 0 0 / .05);
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .08), 0 4px 6px -4px rgb(0 0 0 / .04);
  --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .08), 0 8px 10px -6px rgb(0 0 0 / .04);
  --transition-fast: 150ms ease; --transition-base: 250ms ease; --transition-slow: 400ms ease;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
body{font-family:var(--font-body);font-size:var(--text-base);line-height:1.7;color:var(--text-primary);background:var(--bg);overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 var(--space-6)}

/* Animations */
@media(prefers-reduced-motion:no-preference){
  .reveal{opacity:0;transform:translateY(24px);transition:opacity .7s var(--transition-base),transform .7s cubic-bezier(.16,1,.3,1)}
  .reveal.visible{opacity:1;transform:translateY(0)}
}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}}

/* Section header (shared) */
.section-header{text-align:center;max-width:640px;margin:0 auto var(--space-12)}
.section-label{display:inline-block;padding:var(--space-1) var(--space-3);background:var(--brand-50);color:var(--brand-700);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:600;margin-bottom:var(--space-4)}
.section-title{font-family:var(--font-display);font-size:clamp(var(--text-2xl),3vw,var(--text-4xl));font-weight:700;color:var(--neutral-900);margin-bottom:var(--space-4);line-height:1.2}
.section-desc{font-size:var(--text-base);color:var(--text-secondary);line-height:1.8}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);font-family:var(--font-body);font-weight:600;border:none;cursor:pointer;transition:all var(--transition-fast);border-radius:var(--radius-full)}
.btn-lg{padding:var(--space-3) var(--space-8);font-size:var(--text-base)}
.btn-primary{background:var(--brand-600);color:#fff;box-shadow:0 4px 14px rgb(13 148 136 / 30%)}
.btn-primary:hover{background:var(--brand-700);box-shadow:0 6px 20px rgb(13 148 136 / 40%);transform:translateY(-1px)}
.btn-outline{background:#fff;color:var(--brand-700);border:1.5px solid var(--brand-200);box-shadow:var(--shadow-sm)}
.btn-outline:hover{background:var(--brand-50);border-color:var(--brand-400)}
.btn-warm{background:var(--accent-500);color:#fff;box-shadow:0 4px 14px rgb(249 115 22 / 30%)}
.btn-warm:hover{background:var(--accent-600);box-shadow:0 6px 20px rgb(249 115 22 / 40%);transform:translateY(-1px)}

/* ===== NAV ===== */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;background:rgb(255 255 255 / 85%);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border);transition:var(--transition-base)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:72px}
.nav-logo{display:flex;align-items:center;gap:var(--space-2);font-family:var(--font-display);font-weight:700;font-size:var(--text-xl);color:var(--brand-700)}
.nav-logo-icon{width:36px;height:36px;background:linear-gradient(135deg,var(--brand-500),var(--brand-700));border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;color:#fff;font-size:var(--text-sm);font-weight:700;flex-shrink:0}
.nav-links{display:flex;align-items:center;gap:var(--space-1)}
.nav-link{padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:500;color:var(--text-secondary);transition:var(--transition-fast)}
.nav-link:hover{color:var(--brand-700);background:var(--brand-50)}
.nav-cta{margin-left:var(--space-4);padding:var(--space-2) var(--space-5);background:var(--brand-600);color:#fff;border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:600;transition:var(--transition-fast);box-shadow:0 2px 8px rgb(13 148 136 / 25%)}
.nav-cta:hover{background:var(--brand-700);box-shadow:0 4px 16px rgb(13 148 136 / 35%);transform:translateY(-1px)}
.nav-mobile-toggle{display:none;background:none;border:none;cursor:pointer;padding:var(--space-2);color:var(--text-primary)}
@media(max-width:768px){
  .nav-links{display:none;position:absolute;top:72px;left:0;right:0;background:#fff;flex-direction:column;padding:var(--space-4);border-bottom:1px solid var(--border);box-shadow:var(--shadow-lg)}
  .nav-links.open{display:flex}
  .nav-link{width:100%;padding:var(--space-3) var(--space-4)}
  .nav-cta{margin-left:0;margin-top:var(--space-2);text-align:center}
  .nav-mobile-toggle{display:block}
}

/* ===== HERO ===== */
.hero{position:relative;padding:calc(72px + var(--space-24)) 0 var(--space-24);background:linear-gradient(180deg,var(--brand-50) 0%,var(--bg) 100%);overflow:hidden}
.hero::before{content:'';position:absolute;top:-200px;right:-200px;width:600px;height:600px;background:radial-gradient(circle,rgb(13 148 136 / 8%) 0%,transparent 70%);pointer-events:none}
.hero-content{max-width:720px;position:relative;z-index:1}
.hero-badge{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-4) var(--space-1) var(--space-2);background:#fff;border:1px solid var(--brand-200);border-radius:var(--radius-full);font-size:var(--text-sm);color:var(--brand-700);font-weight:500;margin-bottom:var(--space-6);box-shadow:var(--shadow-sm)}
.hero-badge-dot{width:8px;height:8px;background:var(--success);border-radius:50%;animation:pulse-dot 2s infinite}
@keyframes pulse-dot{0%,100%{opacity:1}50%{opacity:.5}}
.hero h1{font-family:var(--font-display);font-size:clamp(var(--text-4xl),5vw,var(--text-6xl));font-weight:700;line-height:1.1;letter-spacing:-.02em;color:var(--neutral-900);margin-bottom:var(--space-6)}
.hero h1 .highlight{background:linear-gradient(135deg,var(--brand-600),var(--brand-800));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero-desc{font-size:var(--text-lg);color:var(--text-secondary);line-height:1.8;margin-bottom:var(--space-8);max-width:600px}
.hero-actions{display:flex;gap:var(--space-4);flex-wrap:wrap;margin-bottom:var(--space-12)}
.hero-trust-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-6);padding-top:var(--space-8);border-top:1px solid var(--border)}
.trust-item{text-align:center}
.trust-number{font-family:var(--font-display);font-size:var(--text-3xl);font-weight:700;color:var(--brand-700);line-height:1.2}
.trust-label{font-size:var(--text-sm);color:var(--text-secondary);margin-top:var(--space-1)}
@media(max-width:640px){
  .hero{padding:calc(72px + var(--space-16)) 0 var(--space-16)}
  .hero-trust-bar{grid-template-columns:repeat(2,1fr);gap:var(--space-4)}
  .hero h1{font-size:var(--text-3xl)}
  .hero-actions{flex-direction:column}
  .hero-actions .btn{width:100%}
}

/* ===== GUARANTEE ===== */
.guarantee{padding:var(--space-16) 0;background:#fff}
.guarantee-inner{background:linear-gradient(135deg,var(--brand-50),var(--brand-100));border:1px solid var(--brand-200);border-radius:var(--radius-2xl);padding:var(--space-10) var(--space-8)}
.guarantee-header{text-align:center;margin-bottom:var(--space-10)}
.guarantee-icon{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-md);font-size:24px;margin-bottom:var(--space-4)}
.guarantee-title{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:700;color:var(--brand-800);margin-bottom:var(--space-2)}
.guarantee-subtitle{font-size:var(--text-base);color:var(--brand-700);opacity:.8}
.guarantee-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--space-4)}
.guarantee-card{text-align:center;padding:var(--space-6) var(--space-4);background:#fff;border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);transition:var(--transition-base)}
.guarantee-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}
.guarantee-card-icon{font-size:28px;margin-bottom:var(--space-3)}
.guarantee-card-title{font-weight:600;font-size:var(--text-sm);color:var(--neutral-800);margin-bottom:var(--space-1)}
.guarantee-card-desc{font-size:var(--text-xs);color:var(--text-secondary);line-height:1.6}
@media(max-width:768px){.guarantee-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.guarantee-grid{grid-template-columns:1fr}}

/* ===== FOUNDER ===== */
.founder{padding:var(--space-20) 0}
.founder-grid{display:grid;grid-template-columns:280px 1fr;gap:var(--space-12);align-items:start}
.founder-photo{width:100%;aspect-ratio:3/4;background:linear-gradient(135deg,var(--brand-100),var(--brand-200));border-radius:var(--radius-2xl);display:flex;align-items:center;justify-content:center;font-size:80px;box-shadow:var(--shadow-lg);overflow:hidden}
.founder-photo-placeholder{text-align:center}
.founder-photo-placeholder span{display:block;font-size:var(--text-xs);color:var(--brand-600);margin-top:var(--space-2)}
.founder-info h2{font-family:var(--font-display);font-size:var(--text-3xl);font-weight:700;color:var(--neutral-900);margin-bottom:var(--space-2)}
.founder-role{font-size:var(--text-lg);color:var(--brand-600);font-weight:600;margin-bottom:var(--space-6)}
.founder-bio{font-size:var(--text-base);color:var(--text-secondary);line-height:1.8;margin-bottom:var(--space-8)}
.founder-bio p+p{margin-top:var(--space-4)}
.founder-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4);margin-bottom:var(--space-8)}
.founder-stat{padding:var(--space-4);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);text-align:center}
.founder-stat-value{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:700;color:var(--brand-700)}
.founder-stat-label{font-size:var(--text-xs);color:var(--text-secondary);margin-top:var(--space-1)}
.founder-contact{display:flex;gap:var(--space-4);flex-wrap:wrap}
.founder-contact-item{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:var(--brand-50);border-radius:var(--radius-full);font-size:var(--text-sm);color:var(--brand-700);font-weight:500}
@media(max-width:768px){.founder-grid{grid-template-columns:1fr}.founder-photo{max-width:200px;margin:0 auto}}

/* ===== COMPARISON ===== */
.comparison{padding:var(--space-20) 0;background:#fff}
.comparison-table-wrap{overflow-x:auto;border-radius:var(--radius-xl);box-shadow:var(--shadow-lg)}
.comparison-table{width:100%;border-collapse:collapse;background:#fff;font-size:var(--text-sm)}
.comparison-table thead th{padding:var(--space-4) var(--space-6);text-align:left;font-weight:600;border-bottom:2px solid var(--border)}
.comparison-table thead th:first-child{color:var(--text-secondary);width:140px}
.comparison-table thead th:nth-child(2){color:var(--text-muted);background:var(--neutral-50)}
.comparison-table thead th:last-child{color:var(--brand-700);background:var(--brand-50)}
.comparison-table tbody td{padding:var(--space-4) var(--space-6);border-bottom:1px solid var(--border);line-height:1.6;vertical-align:middle}
.comparison-table tbody td:first-child{font-weight:600;color:var(--text-primary);background:var(--neutral-50)}
.comparison-table tbody td:last-child{background:var(--brand-50);color:var(--brand-800);font-weight:500}
.tag-win{display:inline-block;padding:0 var(--space-2);background:var(--brand-100);color:var(--brand-700);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:600;margin-left:var(--space-2)}
.tag-lose{display:inline-block;padding:0 var(--space-2);background:var(--neutral-100);color:var(--text-muted);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:600;margin-left:var(--space-2)}
@media(max-width:640px){.comparison-table{font-size:var(--text-xs)}.comparison-table thead th,.comparison-table tbody td{padding:var(--space-3) var(--space-4)}}

/* ===== SERVICES ===== */
.services{padding:var(--space-20) 0}
.services-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-6)}
.service-card{padding:var(--space-8);background:#fff;border:1px solid var(--border);border-radius:var(--radius-2xl);transition:var(--transition-base)}
.service-card:hover{border-color:var(--brand-200);box-shadow:var(--shadow-lg);transform:translateY(-2px)}
.service-card-header{display:flex;align-items:flex-start;gap:var(--space-4);margin-bottom:var(--space-4)}
.service-card-icon{width:48px;height:48px;background:var(--brand-50);border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--brand-600)}
.service-card-title{font-family:var(--font-display);font-size:var(--text-xl);font-weight:700;color:var(--neutral-900)}
.service-card-desc{font-size:var(--text-sm);color:var(--text-secondary);line-height:1.7;margin-bottom:var(--space-4)}
.service-card-features{display:grid;gap:var(--space-2)}
.service-card-feature{display:flex;align-items:flex-start;gap:var(--space-2);font-size:var(--text-sm);color:var(--text-secondary)}
.service-card-feature svg{width:16px;height:16px;flex-shrink:0;margin-top:3px;color:var(--brand-500)}
.service-card-ai{grid-column:span 2;background:linear-gradient(135deg,var(--brand-600),var(--brand-800));border-color:transparent;color:#fff}
.service-card-ai .service-card-title{color:#fff}
.service-card-ai .service-card-desc,.service-card-ai .service-card-feature{color:rgb(255 255 255 / 80%)}
.service-card-ai .service-card-feature svg{color:rgb(255 255 255 / 60%)}
.service-card-ai .service-card-icon{background:rgb(255 255 255 / 15%);color:#fff}
@media(max-width:768px){.services-grid{grid-template-columns:1fr}.service-card-ai{grid-column:span 1}}

/* ===== PROCESS ===== */
.process{padding:var(--space-20) 0;background:#fff}
.process-timeline{max-width:640px;margin:0 auto;display:grid;gap:var(--space-8);list-style:none;padding:0;counter-reset:none}
.process-step{display:flex;gap:var(--space-6);padding:var(--space-6);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-xl);transition:var(--transition-base)}
.process-step:hover{border-color:var(--brand-200);box-shadow:var(--shadow-md)}
.process-step-num{font-family:var(--font-display);font-size:var(--text-3xl);font-weight:700;color:var(--brand-200);line-height:1;flex-shrink:0;width:48px}
.process-step-title{font-weight:600;font-size:var(--text-lg);color:var(--neutral-900);margin-bottom:var(--space-1)}
.process-step-time{display:inline-block;padding:0 var(--space-2);background:var(--brand-50);color:var(--brand-700);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:600;margin-bottom:var(--space-2)}
.process-step-desc{font-size:var(--text-sm);color:var(--text-secondary);line-height:1.7}
@media(max-width:640px){.process-step{gap:var(--space-4);padding:var(--space-4)}}

/* ===== PRICING ===== */
.pricing{padding:var(--space-20) 0}
.pricing-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4)}
.pricing-card{padding:var(--space-8) var(--space-6);background:#fff;border:1px solid var(--border);border-radius:var(--radius-2xl);transition:var(--transition-base);display:flex;flex-direction:column}
.pricing-card.featured{border:2px solid var(--brand-400);box-shadow:0 0 0 1px var(--brand-400),var(--shadow-lg);position:relative;transform:scale(1.03)}
.pricing-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}
.pricing-card.featured:hover{transform:scale(1.03) translateY(-2px)}
.pricing-type{font-size:var(--text-xs);font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-1)}
.pricing-name{font-family:var(--font-display);font-size:var(--text-xl);font-weight:700;color:var(--neutral-900);margin-bottom:var(--space-3)}
.pricing-price{font-family:var(--font-display);font-size:var(--text-3xl);font-weight:700;color:var(--brand-700);margin-bottom:var(--space-1)}
.pricing-price-note{font-size:var(--text-xs);color:var(--text-muted);margin-bottom:var(--space-6)}
.pricing-features{flex:1;display:grid;gap:var(--space-3)}
.pricing-feature{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--text-secondary)}
.pricing-feature-icon{color:var(--brand-500);font-weight:700}
.pricing-note{padding:var(--space-4) var(--space-6);background:var(--brand-50);border-radius:var(--radius-xl);font-size:var(--text-sm);color:var(--text-secondary);line-height:1.8}
@media(max-width:768px){.pricing-grid{grid-template-columns:repeat(2,1fr)}.pricing-card.featured{transform:none}.pricing-card.featured:hover{transform:translateY(-2px)}}
@media(max-width:480px){.pricing-grid{grid-template-columns:1fr}}

/* ===== CASES ===== */
.cases{padding:var(--space-20) 0;background:#fff}
.cases-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-6)}
.case-card{padding:var(--space-6);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-2xl);transition:var(--transition-base)}
.case-card:hover{border-color:var(--brand-200);box-shadow:var(--shadow-lg);transform:translateY(-2px)}
.case-card-tag{display:inline-block;padding:var(--space-1) var(--space-3);background:var(--brand-50);color:var(--brand-700);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:600;margin-bottom:var(--space-3)}
.case-card-title{font-family:var(--font-display);font-size:var(--text-xl);font-weight:700;color:var(--neutral-900);margin-bottom:var(--space-2)}
.case-card-desc{font-size:var(--text-sm);color:var(--text-secondary);line-height:1.6;margin-bottom:var(--space-5)}
.case-card-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);margin-bottom:var(--space-5)}
.case-metric{text-align:center;padding:var(--space-3);background:var(--brand-50);border-radius:var(--radius-lg)}
.case-metric-value{font-family:var(--font-display);font-size:var(--text-lg);font-weight:700;color:var(--brand-700)}
.case-metric-label{font-size:var(--text-xs);color:var(--text-secondary);margin-top:var(--space-1)}
.case-card-testimonial{padding:var(--space-4);background:var(--neutral-50);border-radius:var(--radius-lg);margin-bottom:var(--space-4)}
.case-testimonial-text{font-size:var(--text-sm);color:var(--text-secondary);font-style:italic;line-height:1.7;margin-bottom:var(--space-3)}
.case-testimonial-author{display:flex;align-items:center;gap:var(--space-3)}
.case-testimonial-avatar{width:32px;height:32px;border-radius:50%;background:var(--brand-100);color:var(--brand-700);display:flex;align-items:center;justify-content:center;font-size:var(--text-sm);font-weight:600;flex-shrink:0}
.case-testimonial-name{font-size:var(--text-sm);font-weight:600;color:var(--neutral-800)}
.case-testimonial-role{font-size:var(--text-xs);color:var(--text-muted)}
.case-card-tech{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.tech-tag{padding:var(--space-1) var(--space-3);background:var(--neutral-100);color:var(--text-secondary);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:500}
@media(max-width:768px){.cases-grid{grid-template-columns:1fr}}

/* ===== TESTIMONIALS ===== */
.testimonials{padding:var(--space-20) 0}
.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-6)}
.testimonial-card{padding:var(--space-8);background:#fff;border:1px solid var(--border);border-radius:var(--radius-2xl);transition:var(--transition-base)}
.testimonial-card:hover{border-color:var(--brand-200);box-shadow:var(--shadow-md)}
.testimonial-quote{font-size:var(--text-base);color:var(--text-secondary);line-height:1.8;margin-bottom:var(--space-6);position:relative;padding-left:var(--space-6)}
.testimonial-quote::before{content:'"';position:absolute;left:0;top:-4px;font-size:32px;color:var(--brand-200);font-family:Georgia,serif;line-height:1}
.testimonial-author{display:flex;align-items:center;gap:var(--space-3)}
.testimonial-avatar{width:40px;height:40px;border-radius:50%;background:var(--brand-100);color:var(--brand-700);display:flex;align-items:center;justify-content:center;font-size:var(--text-base);font-weight:600;flex-shrink:0}
.testimonial-name{font-weight:600;font-size:var(--text-sm);color:var(--neutral-800)}
.testimonial-title{font-size:var(--text-xs);color:var(--text-muted)}
.testimonial-verified{display:inline-block;margin-top:var(--space-3);font-size:var(--text-xs);color:var(--success);font-weight:500}
@media(max-width:768px){.testimonials-grid{grid-template-columns:1fr}}

/* ===== FAQ ===== */
.faq{padding:var(--space-20) 0;background:#fff}
.faq-list{max-width:640px;margin:0 auto;display:grid;gap:var(--space-4)}
.faq-item{border:1px solid var(--border);border-radius:var(--radius-xl);overflow:hidden;transition:var(--transition-base)}
.faq-item.active{border-color:var(--brand-200);box-shadow:var(--shadow-md)}
.faq-question{width:100%;display:flex;justify-content:space-between;align-items:center;padding:var(--space-5) var(--space-6);background:none;border:none;cursor:pointer;font-family:var(--font-body);font-size:var(--text-base);font-weight:600;color:var(--neutral-800);text-align:left;transition:var(--transition-fast)}
.faq-question:hover{color:var(--brand-700)}
.faq-icon{font-size:var(--text-xl);color:var(--text-muted);transition:var(--transition-base);flex-shrink:0;margin-left:var(--space-4)}
.faq-item.active .faq-icon{transform:rotate(45deg);color:var(--brand-500)}
.faq-answer{max-height:0;overflow:hidden;transition:max-height .3s ease}
.faq-item.active .faq-answer{max-height:300px}
.faq-answer-inner{padding:0 var(--space-6) var(--space-5);font-size:var(--text-sm);color:var(--text-secondary);line-height:1.8}

/* ===== CTA ===== */
.cta{padding:var(--space-20) 0;background:linear-gradient(135deg,var(--brand-800),var(--brand-900))}
.cta-inner{text-align:center;max-width:640px;margin:0 auto}
.cta-badge{display:inline-block;padding:var(--space-1) var(--space-4);background:rgb(255 255 255 / 10%);border:1px solid rgb(255 255 255 / 15%);border-radius:var(--radius-full);font-size:var(--text-sm);color:rgb(255 255 255 / 80%);margin-bottom:var(--space-6)}
.cta-title{font-family:var(--font-display);font-size:clamp(var(--text-3xl),4vw,var(--text-5xl));font-weight:700;color:#fff;margin-bottom:var(--space-4);line-height:1.2}
.cta-desc{font-size:var(--text-lg);color:rgb(255 255 255 / 70%);line-height:1.8;margin-bottom:var(--space-8)}
.cta-actions{display:flex;justify-content:center;gap:var(--space-4);flex-wrap:wrap;margin-bottom:var(--space-8)}
.cta-contact-row{display:flex;justify-content:center;gap:var(--space-6);flex-wrap:wrap}
.cta-contact-item{font-size:var(--text-sm);color:rgb(255 255 255 / 60%)}
.cta-contact-item strong{color:rgb(255 255 255 / 90%);font-weight:600}
@media(max-width:640px){.cta-actions{flex-direction:column;align-items:center}}

/* ===== FOOTER ===== */
.footer{padding:var(--space-16) 0 var(--space-8);background:var(--bg-dark)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:var(--space-12);margin-bottom:var(--space-12)}
.footer-brand-desc{font-size:var(--text-sm);color:var(--text-muted);line-height:1.7;margin-top:var(--space-3);max-width:300px}
.footer-col-title{font-size:var(--text-sm);font-weight:600;color:var(--neutral-300);margin-bottom:var(--space-4)}
.footer-col a{display:block;font-size:var(--text-sm);color:var(--text-muted);padding:var(--space-1) 0;transition:var(--transition-fast)}
.footer-col a:hover{color:var(--brand-200)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:var(--space-8);border-top:1px solid var(--neutral-800);font-size:var(--text-sm);color:var(--text-muted)}
.footer-icp{display:flex;gap:var(--space-6)}
.footer-icp a:hover{color:var(--brand-200)}
@media(max-width:768px){.footer-grid{grid-template-columns:1fr 1fr;gap:var(--space-8)}.footer-bottom{flex-direction:column;gap:var(--space-4);text-align:center}}

/* ===== CONTACT FORM (added) ===== */
.contact-form-section{padding:var(--space-20) 0;background:var(--bg)}
.contact-form-wrap{max-width:600px;margin:0 auto;background:#fff;padding:var(--space-10);border-radius:var(--radius-2xl);box-shadow:var(--shadow-lg);border:1px solid var(--border)}
.form-group{margin-bottom:var(--space-5)}
.form-label{display:block;font-size:var(--text-sm);font-weight:600;color:var(--neutral-700);margin-bottom:var(--space-2)}
.form-input{width:100%;padding:var(--space-3) var(--space-4);border:1.5px solid var(--border);border-radius:var(--radius-lg);font-family:var(--font-body);font-size:var(--text-base);color:var(--text-primary);transition:var(--transition-fast);background:#fff}
.form-input:focus{outline:none;border-color:var(--brand-400);box-shadow:0 0 0 3px rgb(45 212 191 / 15%)}
.form-input::placeholder{color:var(--text-muted)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5)}
.form-success{padding:var(--space-4);background:var(--brand-50);border:1px solid var(--brand-200);border-radius:var(--radius-lg);color:var(--brand-700);font-size:var(--text-sm);margin-bottom:var(--space-6);text-align:center}
@media(max-width:640px){.form-row{grid-template-columns:1fr}.contact-form-wrap{padding:var(--space-6)}}

/* ===== ARTICLE LIST & DETAIL ===== */
.article-page{padding:calc(72px + var(--space-16)) 0 var(--space-16)}
.article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-6)}
.article-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--border);border-radius:var(--radius-2xl);overflow:hidden;transition:var(--transition-base);text-decoration:none;box-shadow:0 1px 3px rgb(0 0 0 / .06)}
.article-card:hover{border-color:var(--brand-200);box-shadow:var(--shadow-lg);transform:translateY(-2px)}
.article-card-body{padding:var(--space-6)}
.article-card-meta{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3)}
.article-card-category{padding:var(--space-1) var(--space-3);background:var(--brand-50);color:var(--brand-700);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:600}
.article-card-date{font-size:var(--text-xs);color:var(--text-muted)}
.article-card-title{font-size:var(--text-lg);font-weight:700;color:var(--neutral-900);margin-bottom:var(--space-2);line-height:1.4}
.article-card-summary{font-size:var(--text-sm);color:var(--text-secondary);line-height:1.7}
.article-detail{padding:calc(72px + var(--space-16)) 0 var(--space-8)}
.article-detail-wrap{max-width:720px;margin:0 auto}
.article-detail-header{margin-bottom:var(--space-10)}
.article-detail-body{font-size:var(--text-base);color:var(--text-secondary);line-height:1.9}
.article-detail-body h2{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:700;color:var(--neutral-900);margin:var(--space-8) 0 var(--space-4);padding-bottom:var(--space-2);border-bottom:1px solid var(--border)}
.article-detail-body h3{font-size:var(--text-xl);font-weight:600;color:var(--neutral-800);margin:var(--space-6) 0 var(--space-3)}
.article-detail-body p{margin-bottom:var(--space-4)}
.article-detail-body ul,.article-detail-body ol{padding-left:var(--space-6);margin-bottom:var(--space-4)}
.article-detail-body ul{list-style:disc}
.article-detail-body ol{list-style:decimal}
.article-detail-body li{margin-bottom:var(--space-2)}
.article-detail-body strong{color:var(--neutral-800)}
.article-detail-body blockquote{border-left:3px solid var(--brand-400);padding:var(--space-4);margin:var(--space-4) 0;background:var(--neutral-50);border-radius:var(--radius-lg);color:var(--text-secondary)}
.article-detail-body code{background:var(--neutral-100);padding:2px 6px;border-radius:var(--radius-sm);font-size:.875em;color:var(--error)}
.article-detail-body pre{background:var(--neutral-900);color:var(--neutral-100);padding:var(--space-4);border-radius:var(--radius-lg);overflow-x:auto;margin-bottom:var(--space-4)}
.article-detail-body pre code{background:none;color:inherit;padding:0}
.article-detail-body img{max-width:100%;border-radius:var(--radius-lg);margin:var(--space-4) 0}
.article-detail-body table{width:100%;border-collapse:collapse;margin-bottom:var(--space-4)}
.article-detail-body th,.article-detail-body td{padding:var(--space-3) var(--space-4);border:1px solid var(--border);text-align:left;font-size:var(--text-sm)}
.article-detail-body th{background:var(--neutral-50);font-weight:600;color:var(--neutral-800)}
.article-related{padding:var(--space-16) 0;background:#fff}
.article-tags{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-4)}
.article-tag{padding:var(--space-1) var(--space-3);background:var(--neutral-100);color:var(--text-secondary);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:500}
@media(max-width:768px){.article-grid{grid-template-columns:1fr}}

/* ===== PAGINATION ===== */
.pagination{display:flex;justify-content:center;gap:var(--space-2);margin-top:var(--space-10)}
.pagination a,.pagination span{padding:var(--space-2) var(--space-4);border:1px solid var(--border);border-radius:var(--radius-md);font-size:var(--text-sm);color:var(--text-secondary);transition:var(--transition-fast)}
.pagination a:hover{background:var(--brand-50);border-color:var(--brand-200);color:var(--brand-700)}
.pagination .active{background:var(--brand-600);border-color:var(--brand-600);color:#fff}

/* ===== BREADCRUMB ===== */
.breadcrumb{margin-bottom:var(--space-2);font-size:var(--text-sm);color:var(--text-muted)}
.breadcrumb-list{display:flex;flex-wrap:wrap;align-items:center;list-style:none;padding:0;margin:0}
.breadcrumb-list li a{color:var(--brand-600);transition:color var(--transition-fast)}
.breadcrumb-list li a:hover{color:var(--brand-700)}
.breadcrumb-sep{margin:0 var(--space-2);color:var(--text-muted);user-select:none}
.breadcrumb-current{color:var(--neutral-800);font-weight:500}