.pbf-resources { padding-bottom: 56px; }
.pbf-resources__tutorial { margin-top: 32px; }
.pbf-resources__tutorial h2 { font-size: clamp(1.3rem,2.5vw,1.8rem); line-height: 1.4; margin: 10px 0 12px; }
.pbf-resources__hero { display: grid; grid-template-columns: 1.4fr 1fr; gap: 56px; align-items: center; padding: 44px; margin: 20px 0 48px; border: 1px solid var(--pbf-border); border-radius: 24px; background: linear-gradient(120deg,var(--pbf-accent-soft),var(--pbf-surface) 75%); }
.pbf-resources__hero h1 { font-size: clamp(2rem,4vw,3.2rem); line-height: 1.16; letter-spacing: -.045em; margin: 0 0 20px; }
.pbf-resources__hero h1 span { display: block; }
.pbf-resources__intro { color: var(--pbf-text-2); margin-bottom: 24px; }
.pbf-resources__start { background: var(--pbf-surface); border: 1px solid var(--pbf-border); border-radius: 16px; padding: 28px; box-shadow: var(--pbf-shadow-sm); }
.pbf-resources__start h2 { font-size: 1.3rem; line-height: 1.45; margin: 0 0 20px; }
.pbf-resources__start ol { padding-left: 22px; margin: 0; color: var(--pbf-text-2); font-size: .9rem; }
.pbf-resources__start li { padding: 8px 0 8px 6px; }
.pbf-resources__start li::marker { color: var(--pbf-accent); font-weight: 700; }
.pbf-resources__heading h2 { font-size: clamp(1.4rem,2.5vw,1.8rem); letter-spacing: -.025em; margin: 0 0 10px; }
.pbf-resources__heading p { margin: 0; color: var(--pbf-text-2); line-height: 1.75; }
.pbf-resources__grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; margin-top: 24px; }
.pbf-resources__card { display: flex; flex-direction: column; align-items: flex-start; padding: 28px; border: 1px solid var(--pbf-border); border-radius: 18px; background: var(--pbf-surface); transition: border-color .2s,box-shadow .2s; }
.pbf-resources__card:hover { border-color: var(--pbf-accent); box-shadow: var(--pbf-shadow); }
.pbf-resources__icon { display: inline-flex; padding: 13px; color: var(--pbf-accent); background: var(--pbf-accent-soft); border-radius: 13px; margin-bottom: 22px; }
.pbf-resources__card h3 { margin: 0 0 10px; font-size: 1.15rem; }
.pbf-resources__card p { margin: 0 0 24px; color: var(--pbf-text-2); font-size: .9rem; line-height: 1.75; }
.pbf-resources__action { display: flex; align-items: center; justify-content: space-between; width: 100%; gap: 10px; border-top: 1px solid var(--pbf-border); padding-top: 18px; margin-top: auto; font-size: .85rem; color: var(--pbf-accent); font-weight: 600; }
.pbf-resources__guides { display: grid; grid-template-columns: 1fr 1.65fr; gap: 56px; margin-block: 56px; scroll-margin-top: 100px; }
.pbf-resources__accordions details { border: 1px solid var(--pbf-border); border-radius: 12px; background: var(--pbf-surface); margin-bottom: 12px; overflow: hidden; }
.pbf-resources__accordions summary { padding: 20px 24px; cursor: pointer; font-weight: 600; font-size: .95rem; }
.pbf-resources__accordions summary::marker { color: var(--pbf-accent); }
.pbf-resources__accordions details[open] summary { border-bottom: 1px solid var(--pbf-border); }
.pbf-resources__accordions details > div { padding: 4px 24px 12px; color: var(--pbf-text-2); font-size: .9rem; line-height: 1.8; }
.pbf-resources__help { display: flex; align-items: center; justify-content: space-between; gap: 24px; border: 1px solid var(--pbf-border); border-radius: 18px; padding: 32px; background: var(--pbf-accent-soft); }
.pbf-resources__help h2 { font-size: 1.35rem; margin: 0 0 8px; }
.pbf-resources__help p { margin: 0; color: var(--pbf-text-2); }
.pbf-resources__help .pbf-btn { flex-shrink: 0; }
.pbf-resources a:focus-visible,.pbf-resources summary:focus-visible { outline: 2px solid var(--pbf-accent); outline-offset: 4px; }
@media(max-width:900px) { .pbf-resources__hero { gap: 24px; padding: 28px; } .pbf-resources__grid { gap: 14px; } .pbf-resources__card { padding: 20px; } .pbf-resources__guides { gap: 28px; } }
@media(max-width:680px) { .pbf-resources__hero,.pbf-resources__grid,.pbf-resources__guides { grid-template-columns: minmax(0,1fr); } .pbf-resources__hero { padding: 24px; margin-bottom: 32px; } .pbf-resources__start { padding: 22px; } .pbf-resources__guides { margin-block: 36px; } .pbf-resources__help { flex-direction: column; align-items: flex-start; padding: 24px; } }
@media(prefers-reduced-motion:reduce) { .pbf-resources__card { transition: none; } }