/* General position: the approved TOP visual system, mobile finish v10. */
:root{--u:min(calc(100vw / 1440),1.25px);--mint:#e4f2f1;--body:clamp(16px,1.25vw,20px)}
html{scroll-behavior:smooth}body{font-weight:500;line-height:1.8}button,input,summary{font:inherit;color:inherit}button,a,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{text-decoration:none}h1,h2,h3,h4,p,figure,blockquote{margin:0}h1,h2,h3,h4{font-weight:700}em{font-style:normal;color:var(--teal)}img{max-width:100%;height:auto}[hidden]{display:none!important}:focus-visible{outline:3px solid var(--teal);outline-offset:6px}.wrap{width:min(var(--content-width),calc(100% - 2*var(--page-gutter)));margin-inline:auto}main{overflow:clip}section[id],article[id]{scroll-margin-top:110px}
/* The photo and JOBS chapter share one diagonal, below the independent opening. */
:root{--flow-angle:-6deg;--flow-rise:calc(-100vw * tan(var(--flow-angle)))}
.general-hero{position:relative;z-index:1;padding-bottom:80px;isolation:isolate}
.hero-copy{position:relative;z-index:3;padding-top:calc(235*var(--tu));pointer-events:none}
.hero-role{font-weight:700;margin-bottom:var(--space-2);letter-spacing:.08em}
/* Trial 2026-10-06: the two roles are capsule tags, as 正社員 on the energy hero. */
.hero-role{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.hero-tags{display:flex;gap:6px}.hero-tags span{font-size:var(--font-note);letter-spacing:.04em;padding:1px 14px;border:1px solid var(--navy);border-radius:999px;background:#fff}
.hero-copy .hero-catch{display:flex;flex-direction:column;align-items:flex-start;gap:18px;line-height:1.27;font-weight:700}
.hero-copy .hero-catch span{display:block;padding:.12em .19em .16em;border:2px solid var(--navy);border-radius:3px;background:#fff;white-space:nowrap}
.hero-copy .hero-catch span+span{color:var(--teal)}
.hero-lead{font-weight:700;margin-top:var(--space-4);letter-spacing:.03em;line-height:1.8}
.hero-hand{position:absolute;z-index:2;right:6%;top:calc(100*var(--tu));width:calc(280*var(--tu))}
.hero-art{position:absolute;z-index:1;top:calc(180*var(--tu));right:3%;width:calc(740*var(--tu));max-width:53%;pointer-events:none;transform-origin:50% 65%}
.hero-art img{display:block;width:100%}
.hero-disc{position:relative;display:grid;place-items:center;width:clamp(120px,calc(152*var(--tu)),190px);aspect-ratio:1;margin-top:calc(30*var(--tu));border:1.2px solid var(--navy);border-radius:50%;background:var(--page);color:var(--teal);pointer-events:auto;transition:transform .3s}
.hero-disc-ring{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;animation:general-orbit 30s linear infinite;transform-origin:50% 50%}
.hero-disc-ring text{fill:currentColor;font:700 13px Arial,sans-serif;letter-spacing:2.2px}
.hero-disc-arrow{width:22%;height:30%;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s}
.hero-disc:hover{transform:scale(1.04)}.hero-disc:hover .hero-disc-arrow{transform:translateY(4px)}
@keyframes general-orbit{to{transform:rotate(360deg)}}
/* The top stays clear for the concept photo's faded tail (shared/career-concept.css --concept-tail). */
.roles{position:relative;display:flow-root;padding:0 0 var(--section-gap);background:linear-gradient(180deg,transparent var(--concept-tail),var(--page) var(--concept-tail),#eff8f6 52%,var(--mint));isolation:isolate}
.roles[id]{scroll-margin-top:calc(300*var(--u))}
.roles-heading{position:relative;z-index:3;height:calc(240*var(--u));margin-top:calc(-80*var(--u));pointer-events:none}
.roles-title-group{position:absolute;left:0;top:0;width:calc(680*var(--u));height:calc(235*var(--u));transform:rotate(var(--flow-angle));transform-origin:0 100%}
.jobs-word{font-family:Arial,sans-serif;line-height:1;font-weight:700;letter-spacing:.03em;color:var(--page);-webkit-text-stroke:1.7px var(--navy)}
.roles-heading h2{position:absolute;left:calc(190*var(--u));top:calc(155*var(--u));padding:7px 25px 12px;border:2px solid var(--navy);background:#fff;line-height:1.3;letter-spacing:.04em;white-space:nowrap}
.roles-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:var(--space-6);align-items:start;isolation:isolate}
.role{display:contents;--role-column:1;--detail-row:4;--role-fold:calc(28*var(--u))}
.role:before{content:"";grid-column:var(--role-column);grid-row:2 / 4;align-self:stretch;position:relative;z-index:0;background:#fff;border:1.5px solid var(--navy);border-radius:4px;clip-path:polygon(0 0,calc(100% - var(--role-fold)) 0,100% var(--role-fold),100% 100%,0 100%);pointer-events:none}
.role:after{content:"";grid-column:var(--role-column);grid-row:2;justify-self:end;align-self:start;position:relative;z-index:1;width:var(--role-fold);height:var(--role-fold);background:var(--navy);clip-path:polygon(0 0,0 100%,100% 100%);pointer-events:none}
.role-office{--role-column:2}
.role-main{display:contents}
.role-art{grid-column:var(--role-column);grid-row:1;position:relative;z-index:2;width:86%;max-width:calc(480*var(--u));margin:0 auto calc(-14*var(--u));align-self:end}
.art-float{transform-origin:50% 80%}
.role-art img{display:block;width:100%}
.role-copy{grid-column:var(--role-column);grid-row:2;position:relative;z-index:1;align-self:stretch;padding:var(--card-inset) var(--card-inset) var(--space-3)}
.role-name{font-weight:700;letter-spacing:.04em;margin-bottom:var(--space-2)}
.role-copy h3{line-height:1.5;letter-spacing:.01em;color:var(--teal)}
.role-copy>p:last-child{line-height:1.9;margin-top:var(--space-3);text-wrap:pretty}
.role-detail{display:contents}
.disclosure summary{list-style:none;cursor:pointer}
.disclosure summary::-webkit-details-marker{display:none}
.role-detail>summary{grid-column:var(--role-column);grid-row:3;position:relative;z-index:1;align-self:stretch;justify-self:stretch;display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);min-height:48px;margin:0 var(--card-inset) var(--space-2);padding:var(--space-2) 0;border-top:1px solid #8ba7ad;font-weight:700;transition:color .2s,border-color .2s}
.summary-label{padding:0}
.role-detail[open]>summary{color:var(--teal);border-top-color:var(--teal)}
.role-detail[open]>summary .role-detail-toggle{background:var(--teal);color:#fff}
.role-detail-toggle{display:grid;place-items:center;width:40px;height:40px;flex:none;border-radius:50%;background:var(--yellow);transition:transform .25s,background .25s}
.role-detail>summary:hover .role-detail-toggle{transform:scale(1.08);background:#ffec83;color:var(--navy)}
.disclosure summary:hover{color:var(--teal)}
.plus{position:relative;flex:none;display:block;width:18px;height:18px;transition:transform .35s}
.plus:before,.plus:after{content:"";position:absolute;left:0;top:8px;width:18px;height:1.5px;background:currentColor}
.plus:after{transform:rotate(90deg);transition:transform .35s}
details[open]>.disclosure-body{display:block}
details[open]>summary .plus:after{transform:rotate(0)}
.role-detail::details-content{grid-column:1 / -1;grid-row:var(--detail-row)}
.role-detail>.disclosure-body{grid-column:1 / -1;grid-row:var(--detail-row)}
.disclosure-body{overflow:hidden}
.detail-inner{padding:45px 0 12px;line-height:1.9}
.role-detail .detail-inner{display:block;margin-top:var(--space-4);padding:0 0 var(--space-2);border:0}
.detail-sheet{--notch:38px;position:relative;isolation:isolate;padding:var(--sheet-inset);background:var(--navy);clip-path:polygon(0 0,calc(100% - var(--notch)) 0,100% var(--notch),100% 100%,0 100%)}
.detail-sheet:before{content:"";position:absolute;inset:1.5px;z-index:-1;background:#fff;clip-path:polygon(0 0,calc(100% - var(--notch) + 1px) 0,100% calc(var(--notch) - 1px),100% 100%,0 100%)}
.detail-sheet-heading{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-3);font-weight:700}
.detail-dismiss{display:grid;place-items:center;flex:none;width:44px;height:44px;border:0;border-radius:50%;background:var(--yellow);font:24px/1 Arial,sans-serif;transition:transform .25s,background .25s}
.detail-dismiss:hover{transform:scale(1.08);background:#ffec83}
.detail-lead{display:grid;grid-template-columns:minmax(0,43fr) minmax(0,57fr);gap:var(--space-5);align-items:center}
.detail-lead h4{line-height:1.5;letter-spacing:0}
.detail-lead p{line-height:1.95;text-wrap:pretty}
.detail-lead p+p{margin-top:var(--space-3)}
.duty-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:var(--space-5) 0 0}
.duty-list section{display:block;padding:0 var(--space-3);border:0}
.duty-list section:first-child{padding-left:0}
.duty-list section:last-child{padding-right:0}
.duty-art{width:100%;max-width:calc(250*var(--u));height:calc(190*var(--u));margin:0 auto 24px}
.duty-art svg{display:block;width:100%;height:100%;overflow:hidden}
.duty-list h4{color:var(--teal);line-height:1.5}
.duty-list p{line-height:1.9;margin-top:var(--space-2);text-wrap:pretty}
.experience{display:grid;grid-template-columns:calc(174*var(--tu)) 1fr;gap:var(--space-3);align-items:start;margin-top:var(--space-4);padding:var(--panel-inset);background:#edf7f5}
.experience h4{line-height:1.65;white-space:nowrap;margin-bottom:var(--space-2)}
.experience ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3);list-style:none;padding:0;margin:0}
.experience li{position:relative;padding-left:18px;line-height:1.9}
.experience li:before{content:"";position:absolute;left:0;top:.72em;width:6px;height:6px;border-radius:50%;background:var(--teal)}
.detail-close{display:flex;align-items:center;justify-content:center;gap:24px;min-height:52px;margin:var(--space-3) auto 0;padding:10px 30px;border:1.5px solid var(--navy);border-radius:40px;background:transparent;font-weight:700;transition:background .2s,transform .25s}
.detail-close:hover{background:#fff;transform:scale(1.03)}
.role-detail[open] .summary-label:after{content:"を閉じる"}
.no-js [data-close-detail]{display:none}
.people{position:relative;background:var(--mint);padding:0;isolation:isolate}.interview-marquee{overflow:hidden;padding:0 0 var(--space-3);pointer-events:none}.marquee-track{display:flex;width:max-content;font-family:Arial,sans-serif;line-height:1.06;font-weight:700;letter-spacing:.05em;color:transparent;-webkit-text-stroke:1.5px var(--navy);animation:marquee-travel 48s linear infinite}.marquee-track span{flex:none;white-space:nowrap}@keyframes marquee-travel{to{transform:translateX(-50%)}}.people-heading{display:flex;justify-content:center;position:relative;z-index:3;margin:var(--space-3) 0 var(--space-5)}.paper-title{position:relative;isolation:isolate;padding:10px 50px 14px;line-height:1.4;background:var(--navy);clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,0 100%)}.paper-title:before{content:"";position:absolute;inset:2px;z-index:-1;background:#fff;clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,0 100%)}.paper-title:after{content:"";position:absolute;right:0;top:0;width:28px;height:28px;border-left:2px solid var(--navy);border-bottom:2px solid var(--navy);background:#fff}.people-line{position:absolute;z-index:0;width:28%;height:auto;fill:none;stroke:var(--navy);stroke-width:1.4;pointer-events:none}.line-left{left:-4%;top:35%}.line-right{right:-4%;bottom:2%}.people-viewport{position:relative;z-index:1;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x mandatory;scroll-padding-inline:calc((100vw - min(720px,64vw)) / 2);overscroll-behavior-x:contain;outline-offset:-3px}.people-viewport::-webkit-scrollbar{display:none}.people-track{display:flex;align-items:flex-start;gap:86px;width:max-content;padding:22px max(calc((100vw - min(720px,64vw)) / 2),24px) 18px}.person{flex:none;position:relative;width:min(720px,64vw);scroll-snap-align:center;color:var(--navy)}.person-image{position:relative;margin:0 16px;aspect-ratio:1.65;isolation:isolate}.person-image:before{content:"";position:absolute;inset:0;background:var(--teal);transform:rotate(3deg);z-index:-1;transition:transform .4s}.person:nth-child(2) .person-image:before{transform:rotate(-3deg)}.person-image img{width:100%;height:100%;object-fit:cover;object-position:50% 45%}.person:nth-child(2) .person-image img{object-position:50% 45%}.person-paper{position:relative;isolation:isolate;margin-top:-4px;padding:var(--card-inset);background:var(--navy);clip-path:polygon(0 0,calc(100% - 34px) 0,100% 34px,100% 100%,0 100%);border-radius:7px}.person-paper:before{content:"";position:absolute;z-index:-1;inset:2px;background:#fff;clip-path:polygon(0 0,calc(100% - 33px) 0,100% 33px,100% 100%,0 100%);border-radius:5px}.person-paper:after{content:"";position:absolute;right:0;top:0;width:34px;height:34px;background:var(--navy);clip-path:polygon(0 0,0 100%,100% 100%)}.person-paper blockquote{font-weight:700;line-height:1.55;letter-spacing:.01em}.person-meta{display:flex;align-items:center;justify-content:space-between;margin-top:var(--space-3);gap:10px}.person-meta>span:first-child{display:flex;align-items:center;gap:20px}.person-meta strong{font-weight:700}.person-meta small{font-weight:700}.circle-arrow{width:58px;height:58px;flex:none;border-radius:50%;background:var(--teal);color:#fff;font-family:Arial,sans-serif;line-height:1;display:grid;place-items:center;transition:transform .3s,background .3s}.circle-arrow svg,.people-controls svg{display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.circle-arrow svg{width:28px;height:28px}.people-controls svg{width:24px;height:24px}.people-controls [data-people-prev] svg{transform:rotate(180deg)}.person:hover .circle-arrow{transform:scale(1.08);background:var(--navy)}.person:hover .person-image:before{transform:rotate(1deg) scale(1.02)}.people-controls{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:38px;margin:22px auto 0;width:max-content;padding:12px 26px;border-radius:50px;background:var(--mint)}.people-controls button{display:grid;place-items:center;background:#fff;width:50px;height:50px;border:1.5px solid var(--navy);border-radius:50%;font-family:Arial,sans-serif;transition:background .2s,transform .2s}.people-controls button:hover:not(:disabled){background:var(--yellow);transform:scale(1.06)}.people-controls button:disabled{opacity:.35;cursor:default}.people-controls p{font-weight:700;letter-spacing:.08em}.count-divider{opacity:.45;padding-inline:5px}.staff-library{width:min(880px,calc(100% - 48px));margin:30px auto}.staff-library details{padding:20px 0;border-bottom:1px solid}
.recruit{position:relative;z-index:2;display:block;padding:calc(var(--section-gap) + var(--recruit-tab-space)) 0 var(--section-gap)}.recruit:before{content:"";position:absolute;inset:0 calc((100vw - 100%) / -2) 0;background:linear-gradient(var(--mint),var(--page) 72%);z-index:-1}
.recruit-sheet{--recruit-fold:32px;position:relative;isolation:isolate;max-width:var(--reading-width);margin:auto;padding:var(--sheet-inset) var(--sheet-inset) 0}
.recruit-sheet:before{content:"";position:absolute;inset:0;z-index:-1;background:#fff;border:1.5px solid var(--navy);border-radius:4px;clip-path:polygon(0 0,calc(100% - var(--recruit-fold)) 0,100% var(--recruit-fold),100% 100%,0 100%)}
.recruit-sheet:after{content:"";position:absolute;right:0;top:0;width:var(--recruit-fold);height:var(--recruit-fold);background:var(--navy);clip-path:polygon(0 0,0 100%,100% 100%);pointer-events:none}
.recruit-heading{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding-bottom:var(--space-4)}
.recruit h2{position:absolute;top:1.5px;transform:translateY(-100%);left:calc(40*var(--u));isolation:isolate;margin:0;padding:calc(8*var(--u)) calc(30*var(--u)) calc(6*var(--u));line-height:1.4;letter-spacing:0;white-space:nowrap;background:var(--navy);clip-path:polygon(16px 0,calc(100% - 16px) 0,100% 100%,0 100%)}
.recruit h2:before{content:"";position:absolute;inset:1.5px 1.5px -2px;z-index:-1;background:#fff;clip-path:polygon(15px 0,calc(100% - 15px) 0,100% 100%,0 100%)}
.recruit-heading p{line-height:1.85;font-weight:700}.recruit-mobile-break{display:none}
.recruit-detail{border-top:1px solid #8ba7ad}.recruit-detail>summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:var(--space-3) 0;line-height:1.5;font-weight:700;outline-offset:-3px}.recruit-summary-copy{display:flex;flex-direction:column;gap:7px}.recruit-summary-copy strong{font-weight:700}.recruit-toggle{display:grid;place-items:center;flex:none;width:44px;height:44px;border:0;border-radius:50%;background:var(--yellow);transition:background .25s,transform .25s}.recruit-detail[open] .recruit-toggle,.recruit-detail>summary:hover .recruit-toggle{background:var(--yellow)}.recruit-detail>summary:hover .recruit-toggle{transform:scale(1.06)}.recruit-toggle .plus{width:16px;height:16px}.recruit-toggle .plus:before,.recruit-toggle .plus:after{width:16px;top:7px}.recruit-detail[open]>summary .plus:after{transform:rotate(0)}
.recruit-detail .detail-inner{padding:0 0 var(--space-4)}
.recruit-intro{line-height:1.9;text-wrap:pretty;margin-bottom:var(--space-3)}
.role-requirements{margin:0;border-top:1px solid #b5cdd0}
.role-requirements>div,.facts>div{display:grid;grid-template-columns:calc(152*var(--tu)) minmax(0,1fr);gap:24px}
.role-requirements>div{padding:var(--space-3) 0;border-bottom:1px solid #b5cdd0}
.role-requirements>div:last-child{border-bottom:0}
.role-requirements dt,.facts dt{font-weight:700}
.role-requirements dt{padding-top:3px}
.role-requirements dd,.facts dd{margin:0;min-width:0}
.role-requirement{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:var(--space-2);align-items:start;line-height:1.9}
.role-requirement+.role-requirement{margin-top:var(--space-2)}
.role-tag{display:inline-flex;align-items:center;justify-content:center;min-width:6.8em;min-height:2em;padding:.2em .85em;border-radius:999px;background:var(--navy);color:#fff;font-weight:700;line-height:1.6;white-space:nowrap}
.role-tag-office{background:var(--teal)}
.recruit-common-heading{padding:12px 18px;background:var(--mint);font-weight:700;line-height:1.7}
.facts{margin:0 0 var(--space-3)}
.facts>div{padding:var(--space-2) 0;border-bottom:1px solid #d0dddf}
.recruit-assessment{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:24px;align-items:start}
.recruit-assessment h3{font-weight:700;line-height:1.9}
.recruit-assessment p,.recruit-note{line-height:1.9;text-wrap:pretty}
.selection-flow{counter-reset:flow;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;padding:var(--space-1) 0 var(--space-4);margin:0;list-style:none;isolation:isolate}
.selection-flow li{position:relative;counter-increment:flow;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 8px}
.selection-flow li:before{content:counter(flow,decimal-leading-zero);display:grid;place-items:center;flex:none;width:48px;height:48px;margin-bottom:18px;border:1.5px solid var(--navy);border-radius:50%;background:#fff;color:var(--navy);font-family:Arial,sans-serif;line-height:1;letter-spacing:.03em}
.selection-flow li:not(:last-child):after{content:"";position:absolute;z-index:-1;left:50%;top:24px;width:100%;border-top:1px solid var(--navy)}
.selection-flow strong{display:block;line-height:1.5}
.selection-flow p{margin-top:8px;line-height:1.8;text-wrap:balance}
.selection-entry{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}
.selection-cta{display:flex;align-items:center;justify-content:center;gap:20px;flex:none;min-width:190px;min-height:50px;padding:12px 24px;border:1.5px solid var(--navy);border-radius:999px;background:var(--yellow);transition:background .2s}
.selection-cta svg{width:24px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s}
.selection-cta:hover{background:#ffec83}.selection-cta:hover svg{transform:translateX(4px)}
.entry-scene{position:relative;isolation:isolate;padding:calc(260*var(--u)) 0 calc(100*var(--u));min-height:calc(720*var(--u));background:var(--teal)}.entry-photo{position:absolute;inset:0;z-index:-1;overflow:hidden}.entry-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 56%}.entry-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--page) 0%,rgba(245,245,245,.87) 5%,rgba(245,245,245,.36) 17%,rgba(245,245,245,0) 30%,rgba(8,127,131,.08) 47%,rgba(8,127,131,.64) 74%,var(--teal) 100%),linear-gradient(90deg,rgba(0,49,67,.18),rgba(0,49,67,0))}.entry-content{display:grid;grid-template-columns:1.1fr 1fr;gap:7%;align-items:center;color:#fff}.entry-message h2{line-height:1.5;letter-spacing:.04em;text-shadow:0 2px 20px rgba(0,45,58,.22)}.entry-message>img{width:94%;margin-top:var(--space-4);filter:brightness(0) invert(1);transform:rotate(-3deg)}.entry-choice{align-self:center;padding-top:0}.entry-choice fieldset{padding:0;margin:0 0 18px;border:0}.entry-choice legend{letter-spacing:.05em;margin-bottom:12px;font-weight:700}.role-options{display:flex;gap:8px}.role-options label{flex:1;position:relative;cursor:pointer}.role-options input{position:absolute;width:1px;height:1px;opacity:0}.role-options span{display:flex;align-items:center;justify-content:center;min-height:46px;text-align:center;padding:9px 12px;border:1px solid rgba(255,255,255,.8);border-radius:30px;font-weight:700;transition:background .2s,color .2s;background:rgba(7,80,88,.2)}.role-options input:checked+span{background:#fff;color:var(--navy)}.role-options input:focus-visible+span{outline:3px solid var(--yellow);outline-offset:3px}.entry-cta{width:100%;display:flex;align-items:center;justify-content:center;position:relative;gap:50px;min-height:92px;border:2px solid var(--navy);border-radius:999px;background:var(--yellow);color:var(--navy);transition:background .25s,transform .3s}.entry-cta span[lang]{font:800 34px/1 Arial,sans-serif;letter-spacing:.1em}.entry-cta span:last-child{font:400 42px/1 Arial,sans-serif;transition:transform .3s}.entry-cta:hover{background:#ffec83;transform:scale(1.025)}.entry-cta:hover span:last-child{transform:translateX(5px)}.entry-choice>p{font-weight:700;margin-top:14px;text-align:center;letter-spacing:.02em}.site-footer:before{display:none}.site-footer{--u:min(calc(100vw / 1440),calc(100svh / 800))}.footer-frame{padding-top:var(--space-4)}
.reader{position:fixed;inset:0;width:min(1180px,calc(100% - 64px));max-height:92dvh;margin:auto;padding:0;border:0;border-radius:8px;background:var(--page);color:var(--navy);overscroll-behavior:contain;box-shadow:0 20px 100px #092b4340}
.reader::backdrop{background:rgba(5,30,45,.68)}.reader-close{position:sticky;top:18px;z-index:5;display:block;margin:18px 18px -68px auto;width:50px;height:50px;border:1.5px solid var(--navy);background:var(--yellow);border-radius:50%;font:32px/1 Arial,sans-serif}
.reader-content{padding:calc(var(--sheet-inset) + var(--space-5)) var(--sheet-inset) var(--sheet-inset)}.reader-heading{display:grid;grid-template-columns:1.15fr 1fr;gap:var(--space-5);align-items:center;margin-bottom:var(--space-6)}.reader-photo{width:100%;aspect-ratio:1.12;object-fit:cover;object-position:65% 40%;border-radius:4px 4px 36px 4px}.reader-quote{line-height:1.65;font-weight:700;letter-spacing:.01em}.reader-title{margin-top:28px;line-height:1.4}.reader-title small{display:block;margin-top:9px;font-weight:500}.reader .interview-person{display:none}.reader .interview-answer{display:grid;grid-template-columns:1fr 2fr;gap:var(--space-5);padding:var(--space-5) 0;border-top:1px solid #b5cbcf}.reader .interview-answer h4{color:var(--teal);line-height:1.7}.reader .interview-answer p{line-height:2}.reader .interview-answer p+p{margin-top:var(--space-3)}.reader-end{display:block;margin:30px auto 0;padding:14px 36px;border:1.5px solid var(--navy);border-radius:50px;background:#fff;font-weight:700}
body.overlay-open{overflow:hidden}.no-js .people-controls{display:none}
@media(min-width:1024px){.recruit:before{bottom:calc(220*var(--u))}.entry-photo{top:calc(-220*var(--u))}}

@media(max-width:1023px){
:root{--u:1px;--body:16px}

html{scroll-padding-top:80px}
section[id],article[id]{scroll-margin-top:88px}
.general-hero{max-width:none;margin:auto;padding-bottom:36px}
.hero-copy{padding-top:116px}
.hero-role{gap:8px}.hero-tags span{font-size:12px;padding:1px 9px}

.hero-copy .hero-catch{gap:12px;letter-spacing:0}
.hero-copy .hero-catch span{border-width:1.5px;padding:.14em .17em .18em}
.hero-lead{line-height:1.85;letter-spacing:0}
.hero-disc{width:120px;margin-top:26px}
.hero-hand{position:relative;display:block;width:160px;right:auto;top:auto;margin:-110px 24px 42px auto}
.hero-art{position:relative;top:auto;right:auto;width:100%;max-width:600px;margin:0 auto}
.hero-art img{max-width:none}


.roles[id]{scroll-margin-top:180px}
.roles-heading{height:165px;margin-top:-70px}
.roles-title-group{width:100%;height:145px}
.jobs-word{-webkit-text-stroke-width:1px}
.roles-heading h2{left:90px;top:101px;padding:6px 14px 9px;border-width:1.5px}
.roles-grid{display:block}
.role{display:grid;grid-template-columns:minmax(0,1fr);--role-column:1;--role-fold:24px}
.role-main{display:contents}
.role+.role{margin-top:72px}
.role-art,.role-office .role-art{width:94%;max-width:480px;margin:0 auto -12px;transform:none}


.role-copy h3{line-height:1.5}
.role-copy>p:last-child{line-height:1.95}.role-copy>p:last-child br{display:none}
.role-detail{display:contents}
.role-detail>summary{width:auto;min-height:48px}
.role-detail-toggle{width:36px;height:36px}

.detail-sheet{--notch:25px}

.detail-dismiss{width:44px;height:44px;font-size:22px}
.detail-lead{display:block}
.detail-lead h4{line-height:1.5;margin-bottom:22px}

.duty-list{display:block}
.duty-list section,.duty-list section:first-child,.duty-list section:last-child{display:block;padding:var(--space-3) 0;border:0;border-top:1px solid #c7dcdc}
.duty-art{max-width:190px;height:150px;margin:0 auto 20px}
.duty-list p{line-height:1.9}
.experience{display:block}

.experience ul{display:block}
.experience li{padding-left:16px;line-height:1.85}
.experience li+li{margin-top:12px}
.detail-close{min-height:48px;padding:9px 24px;gap:20px}
.marquee-track{-webkit-text-stroke-width:1px;letter-spacing:.07em}.paper-title{padding:9px 29px 12px}.people-viewport{scroll-padding-inline:24px}.people-track{gap:24px;padding:16px 24px 10px}.person{width:calc(100vw - 60px);max-width:620px}.person-image{margin:0 10px;aspect-ratio:1.25}.person-image img{object-position:70% 40%}.person:nth-child(2) .person-image img{object-position:60% 40%}.person-paper blockquote{line-height:1.65;letter-spacing:0}.person-meta>span:first-child{display:block}.person-meta strong{display:block;}.person-meta small{display:block;margin-top:3px}.circle-arrow{width:44px;height:44px;}.circle-arrow svg{width:22px;height:22px}.people-controls svg{width:22px;height:22px}.people-controls{gap:25px;margin-top:20px;padding:8px 20px}.people-controls button{width:44px;height:44px;}.people-line{width:130px;stroke-width:1.5}.line-left{left:-28px;top:175px}.line-right{right:-35px;bottom:8px;transform:rotate(12deg)}.recruit-sheet{--recruit-fold:24px}.recruit h2{top:1.5px;left:16px;padding:7px 20px 6px;clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 100%,0 100%)}.recruit h2:before{clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 100%,0 100%)}.recruit-mobile-break{display:block}
.recruit-detail>summary{gap:14px}
.recruit-summary-copy{gap:6px}.recruit-toggle{width:36px;height:36px}.recruit-toggle .plus,.recruit-toggle .plus:before,.recruit-toggle .plus:after{width:14px}.recruit-toggle .plus{height:14px}.recruit-toggle .plus:before,.recruit-toggle .plus:after{top:6px}


.role-requirements>div,.facts>div{grid-template-columns:1fr;gap:6px}
.role-requirements>div{gap:14px}
.role-requirements dt{padding-top:0}
.role-requirement{display:block;line-height:1.85}
.role-requirement .role-tag{display:table;margin-bottom:8px;text-align:center}

.recruit-common-heading{padding:12px 10px}

.recruit-assessment{display:block}
.recruit-assessment h3{margin-bottom:8px}
.selection-flow{display:block}
.selection-flow li{display:block;text-align:left;padding:0 0 28px 60px;min-height:94px}
.selection-flow li:last-child{padding-bottom:0}
.selection-flow li:before{position:absolute;left:0;top:0;width:38px;height:38px;margin:0}
.selection-flow li:not(:last-child):after{left:19px;top:38px;bottom:0;width:auto;border-top:0;border-left:1px solid var(--navy)}
.selection-flow strong{padding-top:3px}
.selection-flow p{margin-top:6px;text-wrap:pretty}
.selection-entry{display:block}
.selection-cta{width:100%;margin-top:20px;min-height:48px}

.entry-scene{padding:170px 0 65px;min-height:0}.entry-content{grid-template-columns:1fr;gap:32px}.entry-message h2{line-height:1.5;color:var(--navy);text-shadow:none}.entry-message>img{width:min(380px,100%)}.role-options span{padding:9px 3px}.entry-cta{min-height:72px;gap:40px}.entry-choice>p{margin-top:12px}.entry-photo img{object-position:78% 50%}.entry-photo:after{background:linear-gradient(180deg,var(--page),rgba(245,245,245,.86) 18%,rgba(245,245,245,.72) 34%,rgba(245,245,245,.08) 43%,rgba(8,127,131,.44) 62%,rgba(8,127,131,.86) 80%,var(--teal) 100%)}.site-footer{--u:1px}.reader{width:calc(100% - 20px);max-height:94dvh}.reader-heading{grid-template-columns:1fr}.reader-photo{aspect-ratio:1.25}.reader-title{margin-top:22px}.reader-title small{margin:6px 0 0}.reader .interview-answer{grid-template-columns:1fr}

}
@media(min-width:600px) and (max-width:1023px){
 .hero-hand{position:absolute;top:180px;right:24px;width:clamp(180px,24vw,240px);margin:0}
 .hero-art{width:76%;max-width:680px;margin:-68px 24px 0 auto}
 .general-hero{padding-bottom:60px}
 .roles-grid{max-width:650px}
 .role-art,.role-office .role-art{width:76%;margin:0 auto -14px}
 .person{width:600px}
 .entry-content{grid-template-columns:1fr;max-width:560px;gap:32px}
 .role-options{flex-wrap:wrap}.role-options label{flex:1 0 40%}
}
/* Trial 2026-10-08: on phones the illustration follows the heading, so it is on the first screen (it sat below the
   copy and the disc). The copy, disc and handwriting keep their order after it. */
@media(max-width:599px){.general-hero{display:flex;flex-direction:column;padding-top:116px}.general-hero>.hero-copy{display:contents}.hero-role,.hero-copy .hero-catch,.hero-lead,.hero-disc{margin-inline:24px}.hero-role{order:1}.hero-copy .hero-catch{order:2}.hero-art{order:3;margin-top:22px}.hero-lead{order:4;margin-top:18px}.hero-disc{order:5;align-self:flex-start}.hero-hand{order:6}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.art-float,.hero-art{transform:none!important}}

/* Trial 2026-10-08 phone check: on the narrowest phones the role heading of the opened sheet stays on one line. */
@media(max-width:374px){.detail-sheet-heading p{font-size:19px}}