/* Updated Photoshop language screen. Shared proportions, live accessible controls. */
.language-dialog{background:var(--wine) url('assets/velvet.webp') center/cover no-repeat}
.language-dialog[open]{display:block}
.language-dialog::before{display:none}
.language-scene{position:relative;width:100%;min-height:100dvh;aspect-ratio:auto;container-type:inline-size;background:none;display:flex;align-items:center;justify-content:center;padding:35px 24px}
.language-card{position:relative;inset:auto;width:min(900px,100%);min-height:0;padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center;container-type:inline-size}
.language-identity{position:relative;top:auto;left:auto;width:37%;padding:0;margin:0 0 8%}
.language-crest{width:14%;margin:auto}
.language-signature{width:100%;height:auto;margin:-8% auto 0}
.language-arches{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4.4%;width:49%;margin:0 auto 6.5%}
.language-arches img{width:100%;height:auto;aspect-ratio:268/375;object-fit:cover;border-radius:50% 50% 0 0 / 35.733% 35.733% 0 0}
.language-card h2{position:relative;top:auto;left:auto;width:100%;font-size:5.2cqw;line-height:1;white-space:nowrap;margin:0 0 3%;text-align:center}
.language-card>p{position:relative;top:auto;left:auto;width:100%;margin:0;font-size:1.9cqw;line-height:1.2;color:var(--cream)}
.language-options{position:relative;top:auto;left:auto;display:grid;grid-template-columns:1fr 1fr;width:43%;gap:3%;margin:4% 0 0}
.language-options button{height:auto;min-height:0;padding:6% 2% 3%;background:var(--gold);color:var(--wine);border:1px solid var(--gold)}
.language-options span{font-size:3.1cqw;margin-bottom:1%}
.language-options small{font-size:1.1cqw;white-space:nowrap}
.language-options i{font-size:2cqw;margin-top:1%;line-height:1}
.language-options button:hover,.language-options button:focus-visible{background:var(--cream);color:var(--wine);outline-color:var(--cream)}
/* Contact follows the exact relationships in the 1942px Photoshop group. */
@media(min-width:701px){
 .contact-section{width:77.68%;max-width:1800px;padding-top:110px}
 .contact-layout{container-type:inline-size;display:grid;grid-template-columns:52.73% 42.07%;gap:5.2%;align-items:start}
 .contact-art{position:relative;padding:0;aspect-ratio:1024/815}
 .contact-art h2{position:absolute;top:0;left:13.67%;width:max-content;margin:0;font-size:11cqw;line-height:.9;z-index:2}
 .contact-painting{position:absolute;top:13.37%;left:0;width:100%;height:auto}
 .contact-art p{position:absolute;top:96.2%;left:19.14%;width:70%;margin:0;font-size:1.6cqw;line-height:1.2;white-space:nowrap}
 .contact-form{padding-top:1.03cqw}
 .contact-form label{font-size:2.6cqw;line-height:1}
 .contact-form input{font-size:1.3cqw;height:3.5cqw;min-height:0;padding:.5cqw 0;margin:0 0 4.6cqw}
 .contact-form textarea{height:17.5cqw;min-height:0;margin-top:1.1cqw;font-size:1.3cqw;padding:1cqw}
 .contact-send{font-size:1.95cqw;line-height:1.1;min-height:0;margin-top:2.6cqw;padding:0}
 .contact-status{font-size:max(12px,.85cqw)}
}
@media(max-width:700px){
 .language-scene{padding:35px 20px}
 .language-card{width:100%;min-height:0}
 .language-identity{width:65%;margin-bottom:12%}
 .language-arches{width:90%;margin-bottom:10%}
 .language-card h2{font-size:7.2cqw;white-space:normal;margin-bottom:6%}
 .language-card>p{font-size:4.1cqw}
 .language-options{width:90%;gap:4%;margin-top:9%}
 .language-options button{padding:14px 5px 10px;min-height:95px}
 .language-options span{font-size:7.8cqw}
 .language-options small{font-size:2.8cqw;white-space:normal}
 .language-options i{font-size:5cqw;margin-top:5px}
 .contact-art h2{margin-bottom:-3.5vw}
}
@media(min-width:701px){.language-card{width:min(72vw,1100px)}}

/* Focus follows the existing gold rules without a browser outline box. */
.contact-form input:focus,.contact-form textarea:focus{outline:none;box-shadow:none;border-color:var(--gold)}
.contact-form input:focus{box-shadow:0 1px 0 0 var(--gold)}
.contact-form textarea:focus{border-width:2px;padding:calc(1cqw - 1px)}
@media(max-width:700px){.contact-form textarea:focus{padding:15px}}


/* Same left-to-right underline for either contact-button language. */
.contact-send{position:relative;text-decoration:none}
.contact-send span{text-decoration:none}
.contact-send::after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.22,.61,.36,1);pointer-events:none}
.contact-send:not(:disabled):hover::after,.contact-send:not(:disabled):focus-visible::after{transform:scaleX(1)}
@media(prefers-reduced-motion:reduce){.contact-send::after{transition:none}}


/* After voting, retain the selected card and soften the other choices. */
.poll-option>*{transition:opacity .35s ease,transform .45s}
.poll-option.vote-muted>*{opacity:.3}
@media(prefers-reduced-motion:reduce){.poll-option>*{transition:none}}


.language-options i{display:flex;align-items:center;justify-content:center}.language-options i svg{display:block;width:1em;height:1em;overflow:visible;flex:none}
@media(max-width:700px){.language-options button:focus,.language-options button:focus-visible,.language-switch:focus,.language-switch:focus-visible{outline:none;box-shadow:none}.language-options button:focus-visible{background:var(--cream);color:var(--wine)}}
.klaus-arrow{display:inline-block;width:.9em;height:.9em;vertical-align:-.08em;flex:none;color:inherit}.business-contact,.contact-send{color:var(--cream)}
