/* Reference-led composition: people cross color boundaries, large chevrons
   lead to framed messages, and paper panels sit over two-tone fields. */
/* Replace peripheral circles with meaningful, full-width planes. */
.swipe-section:not(.dots):not(.contact-section)::after { display:none; }
#work::before,#salary::before,#hours::before,#holidays::before,#benefits::before {
 content:''; display:block; position:absolute; inset:auto 0 0; width:100%; height:44%;
 background:var(--brand-base); opacity:1; transform:none;
 clip-path:polygon(0 0,50% 42px,100% 0,100% 100%,0 100%);
}
#work .slide-content,#salary .slide-content,#hours .slide-content,#holidays .slide-content,#benefits .slide-content {
 min-height:72%; display:flex; flex-direction:column; justify-content:center;
}
#work .slide-title,#hours .slide-title,#holidays .slide-title,#benefits .slide-title { margin-bottom:32px; }
.recruit-page .recruit-card { box-shadow:8px 8px 0 rgba(0,0,0,.24); }
.recruit-card h3 { position:relative; }
.recruit-card h3::after { content:''; display:block; width:38px; height:3px; background:var(--brand-orange); margin:10px auto 0; }
/* The reference's orange (originally yellow) framed conclusion panel. */
#career .statement.light,#team .copy,#learning .copy {
 border:2px solid #000; background:var(--brand-orange); color:#000;
 box-shadow:5px 5px 0 rgba(0,0,0,.22); padding:16px 12px;
}
#team .copy strong { text-decoration:none; }
#team .copy,#learning .copy { position:relative; margin:0 5px 5px 0; font-weight:700; flex:none; }
/* Illustration-led scenes: heading in blue, people straddling the diagonal. */
#team,#learning { background:var(--brand-base); }
#team::before,#learning::before {
 inset:0 0 auto; width:100%; height:53%; background:var(--brand-blue);
 transform:none; opacity:1; clip-path:polygon(0 0,100% 0,100% 82%,50% 100%,0 82%);
}
#team .slide-content,#learning .slide-content { height:100%; max-height:690px; display:flex; flex-direction:column; }
#team .slide-title,#learning .slide-title { color:var(--brand-base); flex:none; }
#team .speech-label,#learning .speech-label { flex:none; }
#team .work-scene-art,#learning .mentoring-art {
 flex:1; min-height:70px; height:0; max-height:360px; width:100%; object-fit:contain; margin:8px auto 12px;
}
/* Show the career prospect as a conclusion followed by the person leading. */
#career .slide-content { height:100%; max-height:680px; display:flex; flex-direction:column; }
#career .section-label,#career .slide-title,#career .copy,#career .statement { flex:none; }
#career .statement.light { margin:16px 5px 10px 0; }
.career-art { display:block; flex:1; min-height:70px; width:100%; height:0; max-height:300px; object-fit:contain; }
#career::before { inset:auto 0 0; width:100%; height:28%; background:var(--brand-base); opacity:1; transform:none; clip-path:polygon(0 0,50% 28px,100% 0,100% 100%,0 100%); }
/* Give the 6-person scene a broad picture strip, instead of a floating image. */
#six .team-art { width:calc(100% + 32px); max-width:none; margin:12px -16px; }
#six .emphasis { border-top:2px solid #000; border-bottom:2px solid #000; padding:12px 0; }
#six::before { inset:0 0 auto; height:14px; width:100%; transform:none; background:var(--brand-orange); opacity:1; }
/* Portraits connect to a strong color base without crossing their copy. */
#experienced::before,#beginner::before {
 inset:auto 0 0; width:100%; height:25%; transform:none; opacity:1;
 background:var(--brand-blue); clip-path:polygon(0 32px,100% 0,100% 100%,0 100%);
}
#beginner::before { clip-path:polygon(0 0,100% 32px,100% 100%,0 100%); }
.leader-art-wrap::before,.newcomer-art-wrap::before { display:none; }
/* Inline important words receive the reference's rule-based emphasis. */
#honest .copy:last-child { border-top:1px dashed rgba(255,246,229,.7); border-bottom:1px dashed rgba(255,246,229,.7); padding:18px 0; }
#honest .statement { border:2px solid #000; background:var(--brand-orange); color:#000; box-shadow:6px 6px 0 rgba(0,0,0,.22); }
@media(max-height:700px) {
 #work .slide-title,#hours .slide-title,#holidays .slide-title,#benefits .slide-title { margin-bottom:18px; }
 .recruit-card h3::after { margin-top:6px; }
 #team .copy,#learning .copy { padding:10px 8px; font-size:14px; line-height:1.7; }
 #team .work-scene-art,#learning .mentoring-art { margin:6px auto 10px; }
 #career .statement.light { padding:12px 8px; margin:10px 5px 8px 0; font-size:17px; }
 #six .emphasis { padding:8px 0; }
 #honest .copy:last-child { padding:12px 0; }
}
@media(max-height:580px) {
 #career .slide-title { font-size:19px; }
 #career .copy { margin:8px 0; }
 #six .team-art { max-height:105px; margin-top:8px; margin-bottom:8px; }
 #six .slide-title { font-size:19px; }
 #learning .slide-title { font-size:19px; }
}
