/* Card geometry sampled from GitBook's blog: 20px padding, 16px outer radius, 8px covers. */
.home-articles{width:100%;max-width:1160px;margin:0 auto;padding:32px 0 80px;box-sizing:border-box;color:#1c1917;scroll-margin-top:80px;font-family:"General Sans","Microsoft YaHei",sans-serif}
.guide-heading{margin-bottom:32px}.guide-eyebrow{font-size:13px;color:#79716b;margin:0 0 16px;letter-spacing:1px}.guide-heading h2{font-size:36px;font-weight:500;line-height:1.35;margin:0 0 16px;letter-spacing:-1px}.guide-heading>p:last-child{color:#79716b;font-size:16px;line-height:1.7;margin:0}
.guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.guide-card{display:flex;flex-direction:column;gap:20px;padding:20px;border:1px solid #efeeed;border-radius:16px;text-decoration:none;color:inherit;background:#fff;transition:border-color .2s,box-shadow .2s;min-width:0}.guide-card:hover{border-color:#d6d3d1;box-shadow:0 8px 24px #1c191708}.guide-card:focus-visible{outline:2px solid #2563eb;outline-offset:4px}.guide-cover{overflow:hidden;border-radius:8px;aspect-ratio:1.9}.guide-cover img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}.guide-card:hover .guide-cover img{transform:scale(1.025)}.guide-card-body{display:flex;flex:1;flex-direction:column;gap:14px}.guide-meta{display:flex;justify-content:space-between;gap:16px;color:#79716b;font-size:12px;line-height:1.5;margin:0}.guide-card h3{font-size:22px;line-height:1.5;font-weight:500;letter-spacing:-.5px;margin:0}.guide-excerpt{font-size:14px;color:#79716b;line-height:1.8;margin:0 0 8px}.guide-read{display:flex;align-items:center;gap:8px;font-size:14px;margin-top:auto;padding-top:8px}.guide-read svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;transition:transform .2s}.guide-card:hover .guide-read{color:#2563eb}.guide-card:hover .guide-read svg{transform:translateX(3px)}
.guide-page{margin:0;color:#1c1917;background:#fff;font-family:"General Sans","Microsoft YaHei",sans-serif}.guide-top{max-width:1160px;margin:auto;padding:24px;display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid #efeeed}.guide-top a{color:inherit;text-decoration:none;font-size:14px}.guide-top a:first-child{font-size:20px;font-weight:600}.guide-article{max-width:800px;padding:72px 24px;margin:auto}.guide-article h1{font-size:42px;line-height:1.3;letter-spacing:-1px;font-weight:500;margin:20px 0}.guide-lead{font-size:18px;line-height:1.8;color:#79716b}.guide-hero{width:100%;height:auto;border-radius:16px;margin:24px 0 16px}.guide-prose section{margin:36px 0}.guide-prose h2,.guide-related h2{font-size:24px;line-height:1.5;font-weight:500;margin:0 0 16px}.guide-prose p{font-size:16px;line-height:2;color:#57534e;margin:0}.guide-related{border-top:1px solid #efeeed;margin-top:48px;padding-top:32px}.guide-related a{display:block;padding:12px 0;color:#57534e;text-decoration:none;line-height:1.6}.guide-related a:hover{color:#2563eb}.guide-bottom{padding:32px;text-align:center;color:#79716b;font-size:13px;border-top:1px solid #efeeed}
@media(max-width:1199px){.home-articles{padding-left:32px;padding-right:32px}.guide-grid{gap:20px}.guide-card h3{font-size:20px}}
@media(max-width:809px){.home-articles{padding:24px 20px 48px}.guide-heading h2{font-size:28px;letter-spacing:-.5px}.guide-grid{grid-template-columns:1fr}.guide-heading{margin-bottom:24px}.guide-card h3{font-size:22px}.guide-article{padding-top:40px}.guide-article h1{font-size:30px}.guide-top{padding:20px}}
@media(prefers-reduced-motion:reduce){.guide-card,.guide-cover img,.guide-read svg{transition:none}}

.home-articles__more { display: flex; width: fit-content; align-items: center; justify-content: center; margin: 32px auto 0; padding: 12px 22px; border-radius: 999px; background: #2563eb; color: #fff; font-size: 14px; font-weight: 600; text-decoration: none; transition: background-color .2s; }
.home-articles__more:hover { background: #1d4ed8; }
.home-articles__more:focus-visible { outline: 2px solid #2563eb; outline-offset: 4px; }
.guide-empty { color: #64748b; }
.guide-card:not(:has(.guide-cover)) { min-height: 220px; }

.feature-switcher__heading h2, .home-articles .guide-heading h2 { text-align: center; font-weight: 700; }
.feature-switcher__heading .home-section-subtitle, .home-articles .home-section-subtitle { margin: 0; color: #a8a29e; text-align: center; font-size: 16px; font-weight: 400; line-height: 1.7; }

/* Homepage feature cards. */
.home-benefits { box-sizing: border-box; flex: none; width: 100vw; margin: 0; padding: 96px 0 80px; overflow: hidden; color: #1c1917; }
.home-benefits__heading { padding: 0 24px; margin: 0 auto 54px; text-align: center; }
.home-benefits__heading h2 { margin: 0; font-size: 36px; line-height: 1.35; letter-spacing: -1px; font-weight: 700; }
.home-benefits__rows { display: grid; gap: 40px; }
.home-benefits__row { display: flex; align-items: center; gap: 20px; overflow-x: auto; padding: 0; scrollbar-width: none; cursor: grab; user-select: none; touch-action: pan-x pan-y; }
.home-benefits__row::-webkit-scrollbar { display: none; }
.home-benefits__row:active { cursor: grabbing; }
.home-benefits__row:focus-visible { outline: 2px solid #2563eb; outline-offset: -2px; }
.home-benefits__card { box-sizing: border-box; flex: 0 0 360px; min-height: 155px; display: flex; flex-direction: column; justify-content: space-between; padding: 20px; border: 1px solid #efeeed; border-radius: 12px; background: #fff; }
.home-benefits__card p { margin: 0 0 22px; font-size: 16px; font-weight: 500; line-height: 1.5; }
.home-benefits__identity { display: flex; align-items: center; gap: 10px; }
.home-benefits__avatar { display: grid; flex: none; width: 30px; height: 30px; place-items: center; border-radius: 50%; background: #e7e5e4; color: #44403c; font-size: 13px; font-weight: 700; }
.home-benefits__identity h3 { margin: 0 0 3px; font-size: 12px; line-height: 1.2; font-weight: 700; }
.home-benefits__identity div > span { color: #a8a29e; font-size: 11px; line-height: 1.3; }
.home-benefits__card--light { background: #faf6ef; border-color: #faf6ef; }
.home-benefits__card--blue { background: #6d8df9; border-color: #6d8df9; color: #fff; }
.home-benefits__card--dark { background: #080808; border-color: #080808; color: #fff; }
.home-benefits__card--blue .home-benefits__identity div > span, .home-benefits__card--dark .home-benefits__identity div > span { color: #d6d9e5; }
@media (max-width: 809px) { .home-benefits { padding: 64px 0 48px; } .home-benefits__heading { margin-bottom: 36px; } .home-benefits__heading h2 { font-size: 28px; letter-spacing: -.5px; } .home-benefits__rows { gap: 20px; } .home-benefits__row { padding: 0; gap: 12px; } .home-benefits__card { flex-basis: 270px; } }

/* Keep the carousel close to the adjacent homepage sections. */
.home-benefits { margin-top: -64px; }
.home-benefits + .home-articles { margin-top: -80px; }
@media (max-width: 1199px) { .home-benefits { margin-top: -32px; } .home-benefits + .home-articles { margin-top: -40px; } }

/* Gradient cards for the three-step workflow. */
.home-steps { box-sizing: border-box; width: 100%; max-width: 1160px; padding: 64px 0 48px; color: #1c1917; }
.home-steps__heading { margin-bottom: 40px; text-align: center; }
.home-steps__heading h2 { margin: 0 0 16px; font-size: 36px; line-height: 1.35; letter-spacing: -1px; font-weight: 700; }
.home-steps__heading p { margin: 0; color: #a8a29e; font-size: 16px; line-height: 1.7; }
.home-steps__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.home-steps__item { position: relative; box-sizing: border-box; min-height: 310px; overflow: hidden; padding: 32px; border-radius: 16px; box-shadow: 0 1px 3px #1c19170d; transition: transform .3s, box-shadow .3s; }
.home-steps__item:hover { transform: translateY(-4px) scale(1.03); box-shadow: 0 14px 28px #1c19171c; }
.home-steps__item--scan { background: linear-gradient(135deg, #ffedd5, #fde3ae); }
.home-steps__item--ai { background: linear-gradient(135deg, #f3e8ff, #dddafe); }
.home-steps__item--clean { background: linear-gradient(135deg, #d1fae5, #c9eee8); }
.home-steps__image { position: absolute; right: -12%; bottom: -8%; width: 76%; height: auto; opacity: .95; pointer-events: none; transform: rotate(0); transition: transform .4s; }
.home-steps__item:hover .home-steps__image { transform: rotate(3deg) scale(1.1); }
.home-steps__content { position: relative; z-index: 1; display: flex; flex-direction: column; min-height: 246px; align-items: flex-start; }
.home-steps__badge { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 16px; padding: 5px 12px; border-radius: 999px; background: #ffffff80; color: #57534e; font-size: 14px; font-weight: 500; backdrop-filter: blur(8px); }
.home-steps__badge i { width: 8px; height: 8px; border-radius: 50%; background: #f59e0b; }
.home-steps__item--ai .home-steps__badge i { background: #8b5cf6; }
.home-steps__item--clean .home-steps__badge i { background: #10b981; }
.home-steps__item h3 { margin: 0 0 8px; font-size: 24px; line-height: 1.3; font-weight: 700; }
.home-steps__item p { max-width: 235px; margin: 0; color: #57534e; font-size: 15px; line-height: 1.7; }
.home-steps__item a { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 24px; color: #1c1917; font-size: 14px; font-weight: 600; text-decoration: none; }
.home-steps__item a span { transition: transform .3s; }
.home-steps__item a:hover span { transform: translateX(4px); }
.home-steps__item a:focus-visible { outline: 2px solid #2563eb; outline-offset: 4px; }
.home-steps + .feature-switcher { margin-top: -64px; }
@media (max-width: 1199px) { .home-steps + .feature-switcher { margin-top: -32px; } }
@media (max-width: 809px) { .home-steps { padding: 40px 0 32px; } .home-steps__heading { margin-bottom: 28px; } .home-steps__heading h2 { font-size: 28px; letter-spacing: -.5px; } .home-steps__list { grid-template-columns: 1fr; gap: 16px; } .home-steps__item { min-height: 260px; padding: 24px; } .home-steps__content { min-height: 212px; } .home-steps__image { width: 60%; right: -8%; bottom: -6%; } .home-steps__item p { max-width: 70%; } }
@media (prefers-reduced-motion: reduce) { .home-steps__item, .home-steps__image, .home-steps__item a span { transition: none; } .home-steps__item:hover, .home-steps__item:hover .home-steps__image { transform: none; } }