/* A warm switchboard at the edge of the After hours scene. */
#switchboard { --brass:#e5bb64; --receiver:#ff886b; --case:#203b43; background:#f8f8ed; color:#182c45; padding-top:64px; font-family:Bricolage,Arial,sans-serif; overflow:clip; }
.switchboard-scene { display:grid; grid-template-columns:1fr 1fr; gap:7%; align-items:center; max-width:1280px; margin:auto; }
.gg-name { font-size:20px; font-weight:650; margin-bottom:24px; }
#switchboard #gg-title { margin:0 0 28px; font:800 clamp(54px,6.2vw,90px)/.94 Bricolage,Arial,sans-serif; letter-spacing:-.035em; }
#gg-title em { font:italic 400 1.08em/.9 Georgia,serif; }
.gg-intro .lede { font-size:clamp(22px,2vw,28px); line-height:1.25; max-width:380px; }
.gg-intro>p:not(.lede,.gg-name,.gg-aside) { max-width:370px; font-size:18px; }
.gg-intro .gg-aside { margin:35px 0 0; font:italic 23px/1.3 Georgia,serif; transform:rotate(-4deg); }
#switchboard .phone { position:relative; max-width:510px; width:100%; padding:22px 28px 26px; margin:0 0 42px; color:#fff7e2; background:var(--case); border:2px solid #152b32; border-radius:36px 36px 52px 52px; box-shadow:inset 0 3px #6b8586,inset 0 -9px #122b34,8px 12px 0 #c0aa7c,16px 25px 30px #182c4520; transform:rotate(2deg); text-align:center; }
.phone-top { display:flex; align-items:center; gap:9px; margin:0 3px 14px; }
.phone-top #phone-state { font-size:15px; margin:0; }
.phone-lamp { width:9px; height:9px; border-radius:50%; background:#e5bb64; box-shadow:0 0 9px #e5bb6440; }
.phone-maker { margin-left:auto; font:700 12px/1.3 Bricolage,sans-serif; color:#bed0cf; }
.gg-portrait { position:relative; width:min(100%,290px); aspect-ratio:1; margin:0 auto; }
.gg-still,#gg-animation { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
#gg-animation { visibility:hidden; }
.gg-portrait.is-animated .gg-still { visibility:hidden; }
.gg-portrait.is-animated #gg-animation { visibility:visible; }
.phone-dialogue { min-height:112px; display:grid; align-items:center; margin:0 auto 18px; max-width:390px; }
.incoming-note { font:italic 39px/1.1 Georgia,serif; margin:0; }
#gg-invitation { margin:0; }
#gg-transcript p { margin:0; font:500 clamp(23px,2.1vw,29px)/1.22 Bricolage,Arial,sans-serif; letter-spacing:-.025em; text-wrap:pretty; }
#phone-controls { margin:0; display:block; }
#answer-phone { display:flex; align-items:center; justify-content:center; gap:15px; width:100%; min-height:65px; padding:14px 18px; border:1px solid #ffa691; border-radius:15px; background:var(--receiver); color:#172f38; box-shadow:0 6px 0 #994e3b,inset 0 2px #ffd2b9; font:750 clamp(18px,1.8vw,24px)/1.2 Bricolage,Arial,sans-serif; transition:transform .15s,box-shadow .15s; }
#answer-phone:hover { background:#ff9d82; transform:translateY(-2px); box-shadow:0 8px 0 #994e3b,inset 0 2px #ffd2b9; }
#answer-phone:active { transform:translateY(4px); box-shadow:0 2px 0 #994e3b; }
#answer-phone .phone-handle { width:26px; height:26px; flex:none; color:inherit; }
.phone[data-call="playing"] #answer-phone .phone-handle { transform:rotate(135deg); }
.phone[data-call="playing"] .phone-lamp { background:#bde5c7; box-shadow:0 0 10px #bde5c7; }
.phone #phone-disclosure { margin:20px auto 0; color:#c1d2d0; font:12px/1.4 Bricolage,Arial,sans-serif; }
.phone #voice-status { margin:20px auto 0; max-width:330px; }
.phone .phone-next { margin:20px 0 0; }
.phone-next .project-link { display:flex; justify-content:center; gap:25px; margin:0; font:650 24px/1.3 Bricolage,Arial,sans-serif; color:var(--brass); text-decoration-thickness:1px; }
.phone-cord { position:absolute; width:60%; height:100px; bottom:-92px; right:-20px; fill:none; stroke:#203b43; stroke-width:7px; stroke-linecap:round; pointer-events:none; }
#switchboard :focus-visible { outline-color:#9a321b; }
#switchboard .phone :focus-visible { outline-color:#fff7e2; }
.gg-beyond { display:grid; grid-template-columns:1fr 1fr; gap:7%; margin:65px auto 0; max-width:1280px; align-items:start; }
.gg-beyond>p { font-size:18px; max-width:450px; }
.phone-routes { margin:0; border-top:0; padding:0; }
.phone-routes>summary { font:500 17px/1.4 Bricolage,Arial,sans-serif; padding:0 0 12px; text-decoration:underline; text-underline-offset:5px; }
.phone-routes p { font-size:16px; }
.phone-routes .phone-buttons { gap:7px; margin:18px 0; }
.phone-routes .phone-buttons button { border:1px solid #182c4533; border-radius:6px; background:transparent; color:#182c45; font:500 16px/1.3 Bricolage,Arial,sans-serif; padding:12px; }
.phone-routes .phone-buttons button:hover,.phone-routes .phone-buttons button[aria-pressed="true"] { background:#e5bb64; border-color:#182c45; }
.phone-routes #gg-destination { font-size:17px; }
#switchboard .guru-story { margin-top:35px; border-color:#182c4540; }
#switchboard .guru-story>summary { font:600 21px/1.3 Bricolage,Arial,sans-serif; }
#switchboard .organisation-transition { margin-top:40px; }
.sr-only { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.phone.ringing .phone-handle { animation:receiver-ring .7s ease-in-out 4; transform-origin:center; }
@keyframes receiver-ring { 0%,60%,100%{transform:rotate(0)} 15%,45%{transform:rotate(-13deg)} 30%{transform:rotate(13deg)} }
@media (max-width:1000px) { .switchboard-scene { gap:5%; } #switchboard .phone { padding:18px 20px 24px; } .gg-portrait { width:min(100%,245px); } #gg-transcript p { font-size:24px; } }
@media (max-width:700px) {
 #switchboard { padding-top:32px; }
 .switchboard-scene { grid-template-columns:1fr; gap:28px; }
 .gg-name { margin-bottom:15px; font-size:17px; }
 #switchboard #gg-title { font-size:clamp(38px,11.7vw,76px); margin-bottom:20px; }
 #gg-title br:nth-of-type(2) { display:none; }
 #gg-title em::before { content:' '; }
 .gg-intro .lede { max-width:350px; font-size:22px; margin-bottom:14px; }
 .gg-intro>p:not(.lede,.gg-name,.gg-aside) { font-size:16px; max-width:360px; }
 .gg-intro .gg-aside { display:none; }
 #switchboard .phone { transform:none; max-width:460px; justify-self:center; margin:0 5px 40px 0; padding:18px 20px 25px; border-radius:30px 30px 42px 42px; box-shadow:inset 0 3px #6b8586,inset 0 -7px #122b34,6px 9px 0 #c0aa7c,10px 16px 24px #182c4520; }
 .gg-portrait { width:230px; max-width:100%; }
 .phone-dialogue { min-height:100px; margin-bottom:18px; }
 #gg-transcript p { font-size:24px; }
 .phone-top #phone-state { font-size:14px; }
 #answer-phone { min-height:59px; font-size:clamp(17px,5.3vw,21px); gap:12px; }
 .phone-cord { right:5px; height:90px; bottom:-81px; }
 .gg-beyond { grid-template-columns:1fr; gap:10px; margin-top:35px; }
 .gg-beyond>p { font-size:16px; }
 #switchboard .guru-story>summary { font-size:19px; }
}
@media (prefers-reduced-motion:reduce) { .phone.ringing .phone-handle { animation:none; } #answer-phone { transition:none; } }

@media (max-width:350px) { .gg-portrait { width:190px; } .gg-intro .lede { font-size:20px; } }
/* Once GG has spoken, the invitation onward takes priority over replay. */
.phone[data-call="answered"] #answer-phone { background:transparent; color:#c1d2d0; border-color:transparent; box-shadow:none; font-size:16px; text-decoration:underline; text-underline-offset:4px; }
.phone[data-call="answered"] #answer-phone:hover { color:#fff7e2; transform:none; }
.phone[data-call="answered"] #answer-phone .phone-handle { width:19px; height:19px; }
.phone[data-call="answered"] .phone-next { margin-top:16px; }
.phone[data-call="answered"] .phone-next .project-link { background:var(--brass); color:#172f38; padding:14px; border-radius:14px; text-decoration:none; box-shadow:0 4px #927849; }
.phone[data-call="answered"] .phone-next .project-link:hover { background:#f0cd86; }