/* A personal message within ROLLE's charcoal visual identity. */
.representative{background:#f9f9f7;position:relative;border-top:1px solid #383c4514;border-bottom:1px solid #383c4514}
.representative-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:42px}
.representative-label{font-size:13px;color:#646b77;letter-spacing:.16em}
.representative-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1fr);gap:clamp(35px,7vw,100px);align-items:center}
.representative-portrait{margin:0;position:relative;background:#fff;padding:15px 15px 0;box-shadow:0 15px 45px #383c450a;border:1px solid #383c4514;border-radius:3px}
.representative-portrait:before{content:"";width:45px;height:3px;position:absolute;top:-2px;left:30px;background:#747f92}
.representative-portrait img{width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;background:#d1ced0}
.representative-portrait figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;padding:20px 10px;font-size:10px;color:#646b77;letter-spacing:.07em}
.representative-portrait figcaption strong{color:#383c45;font-weight:500;font-size:14px;margin-left:8px;letter-spacing:.12em}
.representative-line{display:block;width:38px;height:2px;background:#747f92;margin-bottom:24px}
.representative-copy h2{font-size:clamp(30px,3.2vw,43px);line-height:1.65;letter-spacing:.07em}
.representative-message{margin-top:27px;font-size:14px;color:#5b626d;line-height:2.2}
.representative-message p+p{margin-top:18px}
.representative-signature{margin-top:32px;padding-top:23px;border-top:1px solid #383c4526;text-align:right}
.representative-signature span{display:block;font-size:11px;color:#646b77;margin-bottom:6px;letter-spacing:.08em}
.representative-signature strong{font-family:"Noto Serif JP","Yu Mincho",serif;font-size:25px;font-weight:500;letter-spacing:.2em}
.representative-jump{display:inline-flex;align-items:center;gap:30px;color:#424958;font-size:13px;font-weight:600;border-bottom:1px solid #aeb7c5;margin-top:28px;padding:8px 0}
.representative-jump span{display:grid;place-items:center;border-radius:50%;width:28px;height:28px;background:#edf0f5;transition:transform .2s}
.representative-jump:hover span{transform:translate(2px,2px)}
@media(max-width:800px){.representative-grid{gap:35px}.representative-message{font-size:13px}.representative-portrait figcaption{padding:15px 2px}.representative-copy h2{font-size:32px}}
@media(max-width:650px){.representative-heading{align-items:flex-start;flex-direction:column;gap:10px;margin-bottom:28px}.representative-grid{grid-template-columns:1fr;gap:38px}.representative-portrait{padding:10px 10px 0}.representative-copy h2{font-size:32px}.representative-message{font-size:14px}.representative-signature strong{font-size:24px}.representative-line{margin-bottom:20px}.representative-label{font-size:12px}}
@media(prefers-reduced-motion:reduce){.representative-jump span{transition:none}}