.hook-cycle { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.hook-cell { border: 1px solid var(--line-soft); border-radius: var(--r-xl); padding: 28px; background: var(--bg); box-shadow: var(--shadow-card); }
.hook-cell .n { font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ember); display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.hook-cell .n::after { content: "→"; color: var(--faint); }
.hook-cell:last-child .n::after { content: "↺"; }
.hook-cell h3 { font-size: 1.12rem; margin-bottom: 8px; }
.hook-cell p { font-size: 0.92rem; }
.hook-cell .ex { margin-top: 16px; padding: 12px 14px; border-left: 3px solid var(--ember); background: var(--ember-tint-2); font-size: 0.84rem; border-radius: 0 10px 10px 0; }
@media (max-width: 980px) { .hook-cycle { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .hook-cycle { grid-template-columns: 1fr; } }
.ethics { border-left: 4px solid var(--ember); background: var(--bg-warm); border-radius: 0 var(--r-lg) var(--r-lg) 0; padding: clamp(22px, 3vw, 34px); max-width: 840px; }
.ethics strong { color: var(--ink); }
.sec-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: clamp(32px, 4vw, 52px); }
.sec-item { border: 1px solid var(--line-inv); border-radius: var(--r-xl); padding: 26px; background: var(--navy-2); }
.sec-item .k { font-family: var(--font-mono); font-size: 0.64rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ember-on-dark); margin-bottom: 12px; }
.sec-item h3 { font-size: 1.02rem; margin-bottom: 6px; }
.sec-item p { color: var(--inv-body); font-size: 0.9rem; }
@media (max-width: 860px) { .sec-grid { grid-template-columns: 1fr; } }
