.line-diy-entry { display:grid; grid-template-columns:1fr 1.2fr; align-items:center; gap:48px; padding-top:76px; padding-bottom:76px; border-top:1px solid #e4e9f0; }
.line-diy-entry h2 { font-size:clamp(30px,3.5vw,52px); line-height:1.2; letter-spacing:-.03em; margin:20px 0; }
.line-diy-entry p:not(.section-number) { color:var(--muted); font-size:16px; margin:0 0 28px; line-height:1.8; }
.line-diy-preview { display:flex; align-items:center; gap:16px; position:relative; padding:40px 20px; background:linear-gradient(180deg,#fff,#f1f4fa); border-radius:8px; }
.line-diy-preview figure { flex:1; min-width:0; margin:0; text-align:center; }
.line-diy-preview .equipment-visual { width:100%; height:180px; }
.line-diy-preview figcaption { color:var(--blue); font-size:13px; margin-top:16px; }
.line-diy-preview > span { color:#8a9bc1; }
.line-diy-entry:hover .line-diy-preview figure { animation:line-entry-arrive .6s ease-out both; }
.line-diy-entry:hover .line-diy-preview figure:nth-of-type(2) { animation-delay:.08s; }
.line-diy-entry:hover .line-diy-preview figure:nth-of-type(3) { animation-delay:.16s; }
@keyframes line-entry-arrive { from { transform:translateY(8px); } to { transform:translateY(0); } }
@media(max-width:800px) { .line-diy-entry { grid-template-columns:1fr; gap:24px; padding-top:48px; padding-bottom:48px; } .line-diy-preview { padding:24px 12px; gap:8px; } .line-diy-preview .equipment-visual { height:130px; } }
@media(prefers-reduced-motion:reduce) { .line-diy-entry * { animation:none !important; } }