.area-hero{background:linear-gradient(135deg,#07111f 0%,#172554 62%,#0f766e 100%)} .area-intro,.area-actions-section,.area-faq-section{background:#f6f8fc} .area-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px} .area-card{padding:28px;background:#fff;border:1px solid #e2e8f0;border-radius:8px;box-shadow:0 10px 30px rgba(15,23,42,.06)} .area-card h2{margin:4px 0 12px;font-size:30px;line-height:1.16} .area-card p{color:#64748b} .area-card ul{margin:16px 0 22px;padding-left:20px;color:#475569} .area-card .btn{color:#101827} .area-boundary{background:#101827;color:#fff} .area-boundary-inner{max-width:900px;margin:0 auto} .area-boundary h2{font-size:38px;line-height:1.15;margin:0 0 14px} .area-boundary p{color:#cbd5e1} .area-principles{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px} .area-principles span,.area-tags span{display:inline-flex;align-items:center;padding:9px 12px;border:1px solid rgba(240,184,71,.42);border-radius:6px;color:#f0b847;font-size:14px;font-weight:800} .area-detail{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,.8fr);gap:20px;background:#fff} .area-detail-main,.area-detail-side{padding:30px;border:1px solid #e2e8f0;border-radius:8px;background:#fff;box-shadow:0 10px 30px rgba(15,23,42,.05)} .area-detail-main h2{font-size:38px;line-height:1.15;margin:0 0 18px} .area-detail-main p{color:#475569} .area-detail-side{background:#101827;border-color:#1f2a44;color:#fff} .area-detail-side h3{font-size:28px;margin:0 0 18px} .area-tags{display:flex;flex-wrap:wrap;gap:9px} .area-callout{display:grid;gap:6px;margin-top:24px;padding:16px;background:#fff7ed;border-left:3px solid #f0b847;color:#6b4e16} .area-action-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px} .area-action{padding:22px;background:#fff;border:1px solid #e2e8f0;border-radius:8px} .area-action>span{color:#d18b1c;font-size:12px;font-weight:900;letter-spacing:.14em} .area-action h3{font-size:21px;line-height:1.25;margin:12px 0 8px} .area-action p{color:#64748b;font-size:14px;margin:0} .area-faq-list{max-width:980px} .area-faq{border-bottom:1px solid #dbe4ee;padding:18px 0} .area-faq summary{cursor:pointer;font-weight:800;font-size:18px} .area-faq p{color:#64748b;max-width:860px} .area-related{background:#fff} .area-related>div{display:flex;flex-wrap:wrap;gap:12px} .area-related a{display:inline-flex;padding:12px 16px;border:1px solid #dbe4ee;border-radius:6px;color:#1d4ed8;font-weight:800} @media(max-width:900px){.area-grid,.area-action-grid,.area-detail{grid-template-columns:1fr}.area-detail-main h2,.area-boundary h2{font-size:30px}} @media(max-width:820px){.area-card,.area-detail-main,.area-detail-side{padding:22px}.area-hero h1{font-size:38px}.area-principles{display:grid;grid-template-columns:1fr 1fr}}