@charset "UTF-8";

.lower-sunna { display: block; width: 86px; height: 86px; object-fit: contain; flex-shrink: 0; }
.support-paths { gap: 38px; }
.support-paths > article { background: #fbfcf8; border: 1px solid #dbe2d2; padding: 28px; border-radius: 6px; }
.support-paths > article + article { border: 1px solid #dbe2d2; padding-left: 28px; }
.support-paths h3 { font-size: 22px; }
.support-paths article > p { font-size: 14px; }
.action-examples ul { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin-top: 13px; }
.action-examples li { padding: 0; min-width: 0; }
.action-examples li::before { display: none; }
.action-example-detail { background: #f0f4e9; border: 1px solid #dbe3d1; border-radius: 4px; }
.action-example-detail summary { display: flex; align-items: center; flex-direction: column; list-style: none; cursor: pointer; padding: 11px 6px 9px; min-height: 129px; font-size: 11px; font-weight: 700; line-height: 1.7; }
.action-example-detail summary::-webkit-details-marker { display: none; }
.action-example-detail .lower-sunna { width: 72px; height: 72px; margin-bottom: 4px; }
.action-example-detail summary > i { font-style: normal; font-weight: 400; color: #8c9c7a; line-height: 1.3; margin-top: 4px; }
.action-example-detail[open] summary > i { transform: rotate(45deg); }
.action-example-detail > p { font-size: 11px; color: #69775f; line-height: 1.9; padding: 2px 10px 12px; }
.employee-support-list > div { display: flex; align-items: center; gap: 15px; padding: 11px 13px; background: #f0f4e9; border-radius: 4px; min-height: 96px; }
.employee-support-list > div + div { margin-top: 11px; }
.employee-support-list .lower-sunna { width: 61px; height: 61px; }
.employee-support-list .employee-support-copy { min-width: 0; }
.employee-support-list b { font-size: 12px; }
.employee-support-list b > span { display: inline-block; margin-left: 0; }
.employee-support-list p { font-size: 11px; }
.counseling-feature { margin-top: 43px; }
.counseling-photo img { aspect-ratio: 3 / 2; object-fit: cover; }

.wbc-outputs { gap: 24px; border: 0; }
.wbc-outputs > article, .wbc-outputs > article + article { display: grid; grid-template-columns: 35% 1fr; gap: 22px; padding: 25px; border: 1px solid #d1d9c6; border-radius: 5px; background: #fffefa; align-items: center; }
.wbc-output-preview { min-width: 0; text-align: center; background: #f1f4ed; padding: 11px 9px; border-radius: 3px; }
.wbc-output-preview > img { width: auto; height: auto; max-height: 222px; object-fit: contain; margin: auto; }
.wbc-output-preview > figcaption { font-size: 9px; color: #8a947e; line-height: 1.8; margin-top: 8px; }
.wbc-output-copy { min-width: 0; }
.wbc-output-copy h3 { font-size: 18px; margin-top: 9px; }
.wbc-output-copy > p { font-size: 12px; color: #6b785f; line-height: 1.95; margin-top: 13px; }
.wbc-output-copy ul { display: block; font-size: 10px; line-height: 1.9; margin-top: 12px; }
.wbc-output-copy .text-link { font-size: 11px; line-height: 1.9; gap: 10px; white-space: normal; min-height: 44px; margin-top: 12px; }
.wbc-evidence-grid { gap: 22px; align-items: start; }
.wbc-evidence-grid article { padding: 23px 24px 19px; border: 1px solid #d4dcc9; border-top: 2px solid #8fa17b; background: #fffdf7; border-radius: 4px; }
.wbc-evidence-grid .evidence-sunna { width: 86px; height: 86px; margin-bottom: 16px; }
.wbc-evidence-grid h4 { margin-top: 9px; }
.evidence-card-details { width: 100%; border-top: 1px solid #e0e5d8; border-bottom: 1px solid #e0e5d8; margin-top: 15px; }
.evidence-card-details summary { cursor: pointer; padding: 12px 0; min-height: 44px; font-size: 11px; color: #708063; }
.evidence-card-details > p { font-size: 12px; color: #6b785f; line-height: 1.95; padding-bottom: 16px; }
.wbc-evidence-grid .wbc-cert-scope { font-size: 10px; line-height: 1.9; }
.wbc-evidence-grid a { font-size: 11px; margin-top: 12px; }
.evidence-boundary-note { margin-top: 17px; font-size: 11px; color: #7b826d; line-height: 1.9; }

.privacy-grid { grid-template-columns: .9fr 1.1fr; gap: 35px 64px; align-items: center; }
.privacy-visual { border: 1px solid #d7dfce; border-radius: 7px; padding: 20px 22px 16px; background: #fffef9; text-align: center; }
.privacy-visual-label { font-size: 12px; font-weight: 700; color: #6e805f; border-bottom: 1px solid #d4ddc8; padding-bottom: 17px; }
.privacy-audiences { display: grid; grid-template-columns: 1fr 1fr; gap: 25px; padding-top: 20px; }
.privacy-audiences article { position: relative; }
.privacy-audiences article::before { content: "↓"; position: absolute; top: -24px; left: calc(50% - 7px); background: #fffef9; color: #8c9d7b; font-size: 19px; }
.privacy-audiences article + article { border-left: 1px solid #e0e5d7; padding-left: 25px; }
.privacy-audiences span { font-size: 10px; font-weight: 700; color: #7d8c6e; }
.privacy-audiences .lower-sunna { width: 90px; height: 90px; margin: 8px auto; }
.privacy-audiences h3 { font-size: 13px; line-height: 1.8; }
.privacy-visual > p { font-size: 10px; color: #8b927f; line-height: 1.9; margin-top: 18px; }
.privacy-points { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 30px; border-top: 1px solid #d8dfcf; padding-top: 27px; }
.privacy-points article, .privacy-points article:first-child, .privacy-points article:last-child { border: 0; padding: 0; gap: 14px; }
.privacy-points h3 { font-size: 15px; }
.privacy-points p { font-size: 12px; line-height: 1.95; }

.free-start .lower-sunna { width: 83px; height: 83px; }
.free-start > span { display: none; }
.plans .scope-grid { grid-template-columns: 1.3fr 1fr; border: 0; gap: 35px; }
.scope-grid > div, .scope-grid > div + div { padding: 0; border: 0; }
.scope-grid > div + div { padding: 25px 27px; background: #f7f7f0; border: 1px solid #dce2d3; border-radius: 5px; align-self: start; }
.scope-grid .check-list { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.scope-grid .check-list li { display: flex; align-items: center; gap: 12px; padding: 13px; border: 1px solid #dce3d1; background: #fbfcf7; font-size: 12px; line-height: 1.8; border-radius: 4px; }
.scope-grid .check-list li::before { display: none; }
.scope-grid .check-list .lower-sunna { width: 62px; height: 62px; }
.scope-grid .check-list span { min-width: 0; }
.onboarding { border-top: 1px solid #d7dfcd; padding-top: 32px; margin-top: 35px; }
.onboarding ol { gap: 22px; margin-top: 25px; }
.onboarding li { position: relative; display: flex; flex-direction: column; align-items: center; gap: 0; padding: 16px 12px 19px; background: #f3f5ed; border: 1px solid #dce2d1; border-radius: 4px; text-align: center; }
.onboarding li > span { align-self: flex-start; font-size: 11px; line-height: 1; padding: 4px 8px; background: #e2e9d9; color: #788a67; border-radius: 2px; }
.onboarding li .lower-sunna { width: 95px; height: 95px; margin: 4px auto 13px; }
.onboarding li b { font-size: 12px; line-height: 1.8; }
.onboarding li:not(:last-child)::after { content: "→"; position: absolute; right: -19px; top: 50%; color: #8e9f7c; font-size: 16px; font-weight: 400; }

.faq { display: block; }
.faq .section-heading { position: relative; margin-bottom: 28px; min-height: 130px; padding-right: 170px; }
.faq .faq-sunna { position: absolute; right: 20px; top: -13px; width: 150px; height: 150px; }
.faq-topic-tabs { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 11px; margin-bottom: 24px; }
.faq-topic-tabs button { min-height: 58px; padding: 12px; border: 1px solid #cbd7bd; background: #fafbf6; color: #6f7d60; font-size: 13px; font-weight: 700; border-radius: 4px; }
.faq-topic-tabs button > span { display: inline-grid; place-items: center; font-size: 10px; font-weight: 400; width: 23px; height: 23px; border-radius: 50%; background: #e7eddf; margin-left: 9px; }
.faq-topic-tabs button[aria-selected="true"] { background: #506a41; color: white; border-color: #506a41; }
.faq-topic-tabs button[aria-selected="true"] > span { background: #ffffff28; }
.faq-topic-heading { font-size: 16px; margin: 12px 0 18px; color: #738268; }
.faq-topic-panel[role="tabpanel"] > .faq-topic-heading { display: none; }
.faq .faq-list details { max-width: none; }
.faq summary { min-height: 64px; }

.free-check-photo { margin-top: 28px; }
.free-check-photo img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 5px; }
.free-check-photo figcaption { font-size: 10px; line-height: 1.8; color: #7e8a72; margin-top: 9px; }
.free-check-process-details { margin-top: 24px; border-top: 1px solid #c4d3b8; border-bottom: 1px solid #c4d3b8; }
.free-check-process-details > summary { display: flex; align-items: center; justify-content: space-between; min-height: 58px; padding: 14px 0; cursor: pointer; list-style: none; font-size: 13px; font-weight: 700; }
.free-check-process-details > summary::-webkit-details-marker { display: none; }
.free-check-process-details summary > i { font-style: normal; font-size: 20px; font-weight: 400; color: #839673; }
.free-check-process-details[open] summary > i { transform: rotate(45deg); }
.free-check-process-details .free-check-flow { margin-top: 0; }
.free-check-process-details .free-check-flow li:first-child { border-top: 0; }
.free-check-copy .free-scope-note { border-top: 0; padding-top: 20px; }

@media (max-width: 1100px) {
  .support-paths { gap: 24px; }
  .support-paths > article, .support-paths > article + article { padding: 23px; }
  .support-paths h3 { font-size: 20px; }
  .support-paths article > p { font-size: 13px; }
  .wbc-outputs > article, .wbc-outputs > article + article { grid-template-columns: 32% 1fr; gap: 17px; padding: 20px; }
  .wbc-output-copy h3 { font-size: 16px; }
  .wbc-evidence-grid article { padding-inline: 20px; }
  .privacy-grid { gap: 30px 40px; }
  .scope-grid .check-list li { display: block; padding: 14px; }
  .scope-grid .check-list .lower-sunna { margin-bottom: 11px; }
  .plans .scope-grid { gap: 28px; }
  .conditions > div { gap: 15px; }
}
@media (max-width: 800px) {
  .support-paths > article, .support-paths > article + article { padding: 19px; }
  .support-paths h3 { font-size: 18px; }
  .action-example-detail .lower-sunna { width: 58px; height: 58px; }
  .action-example-detail summary { min-height: 115px; font-size: 10px; }
  .employee-support-list .lower-sunna { width: 44px; height: 44px; }
  .employee-support-list > div { gap: 10px; padding: 10px; }
  .wbc-outputs > article, .wbc-outputs > article + article { display: flex; flex-direction: column; align-items: stretch; }
  .wbc-output-preview > img { max-height: 200px; }
  .wbc-evidence-grid { gap: 16px; }
  .wbc-evidence-grid article { padding-inline: 15px; }
  .privacy-grid { gap: 28px; }
  .privacy-audiences { gap: 14px; }
  .privacy-audiences article + article { padding-left: 14px; }
  .privacy-audiences h3 { font-size: 12px; }
  .privacy-points { gap: 20px; }
  .privacy-points h3 { font-size: 13px; }
  .scope-grid > div + div { padding: 22px; }
  .onboarding li b { font-size: 11px; }
  .faq-topic-tabs button { font-size: 11px; padding-inline: 7px; }
  .faq-topic-tabs button > span { margin-left: 5px; }
}
@media (max-width: 700px) {
  .support-paths { margin-top: 26px; }
  .support-paths > article, .support-paths > article + article { padding: 23px 20px; margin-top: 22px; }
  .support-paths h3 { font-size: 21px; }
  .support-paths article > p { font-size: 13px; }
  .action-examples ul { gap: 9px; }
  .action-example-detail .lower-sunna { width: 66px; height: 66px; }
  .action-example-detail summary { min-height: 123px; }
  .employee-support-list .lower-sunna { width: 58px; height: 58px; }
  .employee-support-list > div { gap: 13px; padding: 12px; }
  .employee-support-list b { font-size: 12px; }
  .employee-support-list p { font-size: 11px; }
  .counseling-feature { margin-top: 32px; }
  .wbc-outputs > article, .wbc-outputs > article + article { display: grid; grid-template-columns: 1fr; gap: 19px; padding: 21px; margin-top: 19px; }
  .wbc-output-preview { padding: 15px; }
  .wbc-output-preview > img { max-height: 235px; }
  .wbc-output-copy h3 { font-size: 18px; }
  .wbc-output-copy > p { font-size: 12px; }
  .wbc-output-copy ul { font-size: 11px; }
  .wbc-output-copy .text-link { font-size: 12px; }
  .wbc-evidence-grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
  .wbc-evidence-grid article { margin: 0; padding: 21px; position: relative; padding-right: 100px; }
  .wbc-evidence-grid .evidence-sunna { position: absolute; top: 18px; right: 13px; width: 77px; height: 77px; margin: 0; }
  .wbc-evidence-grid h4 { font-size: 16px; }
  .evidence-card-details { margin-top: 12px; }
  .evidence-card-details summary { font-size: 11px; }
  .evidence-card-details > p { font-size: 12px; }
  .wbc-evidence-grid .wbc-cert-scope { font-size: 10px; }
  .wbc-evidence-grid a { font-size: 11px; gap: 7px; }
  .evidence-boundary-note { font-size: 10px; }
  .privacy-grid { display: block; }
  .privacy-visual { margin-top: 26px; padding: 20px 18px 15px; }
  .privacy-audiences { gap: 17px; }
  .privacy-audiences article + article { padding-left: 17px; }
  .privacy-audiences .lower-sunna { width: 85px; height: 85px; }
  .privacy-audiences h3 { font-size: 11px; }
  .privacy-visual > p { font-size: 9px; }
  .privacy-points { display: block; margin-top: 27px; padding-top: 0; border-top: 0; }
  .privacy-points article, .privacy-points article:first-child, .privacy-points article:last-child { padding: 20px 0; border-top: 1px solid #d8dfcf; gap: 17px; }
  .privacy-points h3 { font-size: 15px; }
  .privacy-points p { font-size: 12px; }
  .free-start { flex-wrap: nowrap; padding: 18px 14px; gap: 13px; }
  .free-start .lower-sunna { width: 61px; height: 61px; }
  .free-start h3 { font-size: 14px; }
  .free-start p { font-size: 10px; }
  .free-start > strong { font-size: 24px; }
  .plans .scope-grid { display: block; margin-top: 29px; }
  .scope-grid .check-list { gap: 11px; }
  .scope-grid .check-list li { font-size: 11px; padding: 14px; }
  .scope-grid .check-list .lower-sunna { width: 70px; height: 70px; margin: 0 auto 12px; }
  .scope-grid > div + div { margin-top: 26px; padding: 23px 20px; }
  .onboarding { padding-top: 27px; margin-top: 31px; }
  .onboarding ol { gap: 14px; }
  .onboarding li { padding: 13px 11px 17px; }
  .onboarding li .lower-sunna { width: 87px; height: 87px; margin-bottom: 11px; }
  .onboarding li b { font-size: 11px; }
  .onboarding li::after { display: none; }
  .faq .section-heading { min-height: 100px; padding-right: 100px; margin-bottom: 23px; }
  .faq .faq-sunna { width: 96px; height: 96px; right: -2px; top: 4px; }
  .faq .section-heading h2 { font-size: 24px; }
  .faq-topic-tabs { grid-template-columns: 1fr 1fr; gap: 9px; margin-bottom: 20px; }
  .faq-topic-tabs button { min-height: 50px; font-size: 11px; padding: 11px 7px; }
  .faq-topic-tabs button > span { width: 20px; height: 20px; font-size: 9px; }
  .faq summary { min-height: 64px; }
  .free-check-photo { margin-top: 24px; }
  .free-check-photo figcaption { font-size: 9px; }
  .free-check-process-details { margin-top: 19px; }
  .free-check-process-details > summary { font-size: 12px; min-height: 54px; }
}
@media (max-width: 360px) {
  .support-paths > article, .support-paths > article + article { padding: 21px 16px; }
  .support-paths h3 { font-size: 19px; }
  .action-examples ul { gap: 7px; }
  .action-example-detail summary { font-size: 9px; }
  .action-example-detail .lower-sunna { width: 57px; height: 57px; }
  .wbc-outputs > article, .wbc-outputs > article + article { padding: 18px; }
  .wbc-evidence-grid article { padding: 19px 84px 18px 17px; }
  .wbc-evidence-grid .evidence-sunna { width: 66px; height: 66px; right: 9px; }
  .wbc-evidence-grid h4 { font-size: 14px; }
  .free-start .lower-sunna { width: 48px; height: 48px; }
  .free-start { gap: 9px; }
  .free-start h3 { font-size: 13px; }
  .free-start > strong { font-size: 22px; }
  .scope-grid .check-list li { padding: 12px; font-size: 10px; }
  .faq .section-heading h2 { font-size: 21px; }
}
@media print {
  .faq-topic-tabs { display: none; }
  .faq-topic-panel[hidden] { display: block !important; }
  .evidence-card-details > p, .free-check-process-details > ol { display: block; }
}
