.doc__container{max-width:720px;padding:var(--space-8) var(--space-8) var(--space-16);margin:0 auto}.doc__header{margin-bottom:var(--space-10)}.doc__header h1{letter-spacing:-.04em;margin:0 0 var(--space-4);align-items:center;gap:var(--space-3);font-size:clamp(2.5rem,7vw,3.5rem);font-weight:700;line-height:1.1;display:flex}.doc__header p{font-size:var(--text-lg);color:var(--color-text-muted);line-height:var(--leading-relaxed)}.doc__header-icon{color:var(--color-primary);flex-shrink:0}.doc__grid{gap:var(--space-6);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));display:grid}.card{padding:var(--space-6) var(--space-7);background:var(--card-bg);border:var(--border-width) solid var(--color-border);border-radius:var(--radius-xl);transition:all var(--transition-normal);align-items:flex-start;text-decoration:none;display:flex}.card:hover{border-color:var(--color-primary);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.card__content{flex:1}.card__title{font-size:var(--text-base);letter-spacing:-.01em;color:var(--color-text);margin-bottom:var(--space-2);justify-content:space-between;align-items:center;font-weight:700;display:flex}.card__title-text{flex:1;align-items:center;display:flex}.card__title-text svg,.card__title-text i{margin-right:var(--space-3);color:var(--color-primary);flex-shrink:0}.card__description{font-size:var(--text-sm);color:var(--color-text-muted);margin-bottom:var(--space-3);line-height:var(--leading-relaxed)}.card__features{margin:0;padding:0;list-style:none}.card__features-item{font-size:var(--text-sm);color:var(--color-text-subtle);line-height:var(--leading-relaxed);margin-top:var(--space-1);padding-left:1rem;position:relative}.card__features-item:before{content:"·";color:var(--color-text-subtle);font-weight:700;position:absolute;left:0}.card__arrow{color:var(--color-text-subtle);transition:all var(--transition-normal);opacity:.4;margin-left:var(--space-3);flex-shrink:0;align-items:center;display:flex}.card:hover .card__arrow{color:var(--color-primary);opacity:1;transform:translate(3px)}@media (width<=650px){.doc__container{padding:var(--space-6) var(--space-6) var(--space-12)}.doc__header h1{font-size:2.25rem}.doc__grid{gap:var(--space-4);grid-template-columns:1fr}.card{padding:var(--space-5) var(--space-6)}}
