.material-modal-open { overflow: hidden; }
.material-dialog { box-sizing: border-box; width: min(680px, calc(100% - 32px)); max-height: calc(100dvh - 40px); padding: 36px; border: 0; border-radius: 26px; background: #fffdf7; color: #174c43; box-shadow: 0 24px 80px #0003; }
.material-dialog::backdrop { background: rgb(13 44 38 / 55%); }
.material-close { position: absolute; top: 12px; right: 12px; width: 44px; height: 44px; border: 0; background: transparent; color: #63756e; font-size: 30px; cursor: pointer; }
.material-dialog h2 { margin: 18px 28px 10px 0; font-size: 1.9rem; line-height: 1.3; }
.material-description { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.65; }
.material-preview { display: block; max-width: 100%; max-height: 240px; margin: 16px auto; object-fit: contain; }
.material-downloads { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 20px 0 28px; }
.material-download { display: flex; flex-direction: column; justify-content: center; min-height: 112px; padding: 16px; box-sizing: border-box; border-radius: 20px; background: #27594f; color: white; text-align: center; text-decoration: none; overflow-wrap: anywhere; gap: 8px; }
.material-download:nth-child(even) { background: #365f97; }
.material-download strong { font-size: 1.5rem; }
.material-download span { opacity: .9; }
.material-download:focus-visible, .material-close:focus-visible { outline: 3px solid #d49b25; outline-offset: 3px; }
.material-products, .material-lessons { border-top: 1px solid #dce4dc; padding-top: 18px; margin-top: 22px; }
.material-product { display: flex; gap: 18px; margin: 18px 0; }
.material-product img { width: 90px; height: 100px; object-fit: contain; flex: 0 0 auto; }
.material-product h4 { margin: 0 0 6px; font-size: 1.1rem; }
.material-product p { margin: 8px 0; line-height: 1.6; }
.material-disclosure { font-size: .8rem; color: #68766d; }
@media (max-width: 480px) { .material-dialog { padding: 28px 20px; border-radius: 20px; } .material-downloads { gap: 10px; } .material-download { padding: 12px; } .material-download strong { font-size: 1.2rem; } .material-product img { width: 64px; height: 80px; } }

.material-video { display: block; width: 100%; max-height: 320px; background: #000; border-radius: 12px; }