*{box-sizing:border-box}html,body{margin:0;width:100%;min-height:100%;background:#fff;color:#0060fd}body{font-family:"Helvetica Neue",Arial,sans-serif}::selection{background:#0060fd;color:white}header{position:absolute;top:0;left:0;right:0;z-index:2;padding:42px 4.5%;display:flex;align-items:center;justify-content:space-between}.brand{display:block;width:112px}.brand img{width:100%;display:block}.contact{font-size:15px;color:#0060fd;text-decoration:none;padding:12px 0}.contact:hover{text-decoration:underline;text-underline-offset:5px}a:focus-visible{outline:2px solid #0060fd;outline-offset:8px}main{height:100svh;min-height:500px;display:grid;place-items:center}canvas{width:min(76vw,790px);height:min(78svh,790px);display:block;cursor:grab;touch-action:pan-y}canvas:active{cursor:grabbing}.preloader{position:fixed;inset:0;z-index:100;background:#fff;display:flex;align-items:center;justify-content:center;transform:translateY(0);transition:transform .85s cubic-bezier(.76,0,.24,1)}.preloader svg{opacity:0;flex-shrink:0;width:40%;max-width:432px;height:auto}.preloader.is-finished{transform:translateY(-101%);pointer-events:none}.preloader.is-resetting{transition:none}@media(max-width:600px){header{padding:28px 7%}.brand{width:90px}.contact{font-size:14px}canvas{width:96vw;height:65svh;min-height:360px}.preloader svg{width:64%}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
main{position:relative;isolation:isolate}main::after{content:"";position:absolute;z-index:-1;top:calc(50% + min(78svh,790px)*.34);left:50%;transform:translateX(-50%);width:min(32vw,320px);height:35px;background:radial-gradient(ellipse,rgba(25,44,80,.16),rgba(25,44,80,.035) 45%,transparent 72%);pointer-events:none}@media(max-width:600px){main::after{top:calc(50% + max(65svh,360px)*.34);width:44vw;height:25px}}

canvas{transform:translateY(-6svh)}main::after{margin-top:-6svh}.coming-soon{position:absolute;bottom:5.5svh;left:5%;right:5%;margin:0;text-align:center;font-family:Georgia,"Times New Roman",serif;font-size:clamp(56px,9.8vw,120px);font-weight:400;letter-spacing:-.045em;line-height:.94;color:#0060fd;pointer-events:none}.coming-soon span,.coming-soon em{display:block}.coming-soon em{font-weight:400;letter-spacing:-.055em}@media(max-width:600px){.coming-soon{bottom:6svh;font-size:clamp(48px,12vw,72px)}canvas{transform:translateY(-7svh)}main::after{margin-top:-7svh}}@media(max-height:650px) and (min-width:601px){.coming-soon{font-size:clamp(44px,8vh,68px);bottom:4svh}canvas{width:min(65vw,620px);height:64svh;transform:translateY(-7svh)}main::after{top:72%;margin-top:0}}

/* Reserve separate rows for the artwork and heading at every viewport size. */
main{height:100svh;min-height:650px;padding:120px 4.5% 42px;display:grid;grid-template-rows:minmax(0,1fr) auto;justify-items:center;align-items:stretch;gap:28px}
main::after{display:none}
.sculpture-stage{position:relative;width:min(80vw,790px);height:100%;min-height:0;isolation:isolate}
.sculpture-stage canvas{position:absolute;inset:0;width:100%;height:100%;min-height:0;transform:none}
.sculpture-stage::after{content:"";position:absolute;z-index:-1;top:84%;left:50%;transform:translateX(-50%);width:40%;height:24px;background:radial-gradient(ellipse,rgba(25,44,80,.16),rgba(25,44,80,.035) 45%,transparent 72%);pointer-events:none}
.coming-soon{position:static;margin:0;width:100%;font-size:clamp(56px,9.8vw,120px);align-self:end}
@media(max-width:600px){main{padding:100px 7% 38px;gap:24px;min-height:650px}.sculpture-stage{width:96vw}.coming-soon{font-size:clamp(48px,12vw,72px)}}
@media(max-height:650px) and (min-width:601px){main{min-height:540px;padding-top:105px;padding-bottom:26px;gap:18px}.coming-soon{font-size:clamp(44px,8vh,68px)}}
/* Keep the mobile experience fixed to the screen; gestures affect the sculpture. */
@media (max-width:600px){
 html,body{width:100%;height:100%;overflow:hidden;overscroll-behavior:none}
 body{position:fixed;inset:0;touch-action:none}
 main{height:100svh;min-height:0;padding:100px 7% max(24px,env(safe-area-inset-bottom));gap:20px}
 .sculpture-stage canvas{touch-action:none}
}
@media (max-width:600px) and (max-height:650px){
 header{padding-top:20px;padding-bottom:20px}
 main{padding-top:82px;gap:12px}
 .coming-soon{font-size:clamp(40px,11vw,56px)}
}
/* The artwork may extend into the margins without widening the text's grid track. */
main{grid-template-columns:minmax(0,1fr)}
.sculpture-stage{min-width:0;justify-self:center}
.coming-soon{min-width:0;justify-self:center}
/* A minimal, full-bleed contact surface with custom inline validation. */
button.contact{border:0;background:none;font-family:inherit;cursor:pointer}button.contact:focus-visible{outline:2px solid #0060fd;outline-offset:6px}
#contact-dialog{position:fixed;inset:0;width:100%;height:100svh;max-width:none;max-height:none;margin:0;padding:38px 4.5% 36px;border:0;background:#0060fd;color:#fff;overflow-y:auto;overflow-x:hidden;outline:none;overscroll-behavior:none;touch-action:pan-y}
#contact-dialog[open]{display:flex;flex-direction:column}#contact-dialog::backdrop{background:transparent}
.contact-top{display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.contact-logo{display:block;width:112px;filter:brightness(0) invert(1)}
.contact-close{width:44px;height:44px;border:1px solid #ffffff55;border-radius:50%;background:transparent;color:white;position:relative;cursor:pointer;transition:background .3s}
.contact-close span{position:absolute;left:13px;top:21px;width:16px;height:1px;background:currentColor;transform:rotate(45deg)}.contact-close span+span{transform:rotate(-45deg)}.contact-close:hover{background:#ffffff1a}
#contact-dialog :focus-visible{outline:2px solid white;outline-offset:5px}
#contact-dialog .contact-message{flex:1 0 auto;width:min(620px,100%);margin:auto;display:flex;flex-direction:column;justify-content:center;padding:32px 0;opacity:0;transform:translateY(18px);transition:opacity .45s,transform .7s cubic-bezier(.16,1,.3,1)}
#contact-dialog.is-revealed .contact-message{opacity:1;transform:translateY(0);transition-delay:.25s}
#contact-title{font:400 34px/1.1 "Helvetica Neue",Arial,sans-serif;letter-spacing:-.04em;margin:0 0 40px}
#contact-form{width:100%;margin:0;background:none;color:inherit;border:0;padding:0;box-shadow:none}
.form-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px}
.form-field{min-width:0;margin-bottom:16px}
#contact-form label,.contact-reasons legend{font:400 12px/1.4 "Helvetica Neue",Arial,sans-serif;color:#ffffffd9}
#contact-form input:not([type="radio"]),#contact-form textarea{display:block;width:100%;margin-top:8px;padding:12px 0;border:0;border-bottom:1px solid #ffffff5c;border-radius:0;background:transparent;color:#fff;box-shadow:none;outline:none;font:400 17px/1.5 "Helvetica Neue",Arial,sans-serif;-webkit-appearance:none;transition:border-color .2s,background .2s}
#contact-form input::placeholder,#contact-form textarea::placeholder{color:#ffffff80;opacity:1}
#contact-form textarea{height:86px;resize:none}
#contact-form input:not([type="radio"]):focus,#contact-form textarea:focus{border-bottom-color:white}
#contact-form input:not([type="radio"]):focus-visible,#contact-form textarea:focus-visible{outline:none;box-shadow:0 1px 0 white}
.field-error{display:block;min-height:21px;padding-top:6px;color:#ffe1db;font:400 11px/1.4 "Helvetica Neue",Arial,sans-serif}
#contact-form [aria-invalid="true"]{border-bottom-color:#ffb4a3!important;background:linear-gradient(transparent,#ffb4a308)}
#contact-form [aria-invalid="true"]:focus-visible{box-shadow:0 1px 0 #ffb4a3!important}
.contact-reasons{border:0;padding:0;margin:0 0 30px;display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.contact-reasons legend{margin-bottom:14px}
.contact-reasons label{position:relative;cursor:pointer;margin:0}
.contact-reasons input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.contact-reasons span{display:block;padding:10px 16px;border:1px solid #ffffff50;border-radius:24px;font:400 12px/1.2 "Helvetica Neue",Arial,sans-serif;transition:color .2s,background .2s,border-color .2s}
.contact-reasons label:hover span{border-color:white}.contact-reasons input:checked+span{background:#fff;border-color:#fff;color:#0060fd}.contact-reasons input:focus-visible+span{outline:2px solid white;outline-offset:4px}
.form-actions{display:flex;align-items:center;justify-content:flex-end;gap:24px;margin-top:8px}
.form-submit{border:1px solid white;background:white;color:#0060fd;border-radius:30px;padding:15px 26px;font:500 13px/1.3 "Helvetica Neue",Arial,sans-serif;white-space:nowrap;cursor:pointer;transition:background .2s,color .2s;flex-shrink:0;min-width:150px}
.form-submit:hover{background:transparent;color:white}.form-submit:disabled{opacity:.65;cursor:wait}
.form-status{flex:1;margin:0;font:400 12px/1.5 "Helvetica Neue",Arial,sans-serif;color:#fff}.form-status.is-error{color:#ffe1db}
@media(max-width:600px){#contact-dialog{padding:25px 7% max(24px,env(safe-area-inset-bottom))}.contact-logo{width:90px}.contact-close{width:40px;height:40px}.contact-close span{left:11px;top:19px}#contact-dialog .contact-message{padding:30px 0}#contact-title{font-size:29px;margin-bottom:32px}.form-row{gap:22px}#contact-form input:not([type="radio"]),#contact-form textarea{font-size:16px}.contact-reasons{gap:7px;margin-bottom:26px}.contact-reasons span{font-size:11px;padding:10px 13px}.form-actions{gap:14px}.form-status{font-size:11px}.form-submit{padding:14px 22px;min-width:135px}}
@media(max-width:360px){.form-row{grid-template-columns:1fr;gap:0}#contact-title{margin-bottom:24px}.contact-reasons span{padding:9px 11px}.form-actions{align-items:flex-start;flex-direction:column}.form-submit{align-self:flex-end}}
@media(max-height:700px){#contact-title{font-size:28px;margin-bottom:24px}#contact-dialog .contact-message{padding:24px 0}.form-field{margin-bottom:10px}.contact-reasons{margin-bottom:22px}#contact-form textarea{height:72px}}
body:has(#contact-dialog[open]){touch-action:pan-y}
@media(prefers-reduced-motion:reduce){#contact-dialog *{transition:none!important}}
/* Restore the earlier rounded contact buttons. */
.contact-reasons span{border-radius:24px;padding:10px 16px}
.form-submit{border-radius:30px;padding:15px 26px;border:1px solid #fff}
.form-submit:hover{background:transparent;color:#fff}
@media(max-width:600px){.contact-reasons span{padding:10px 13px}.form-submit{padding:14px 22px}}

.field-error,.form-status.is-error{color:#ff7777}#contact-form [aria-invalid="true"]{border-bottom-color:#ff7777!important}#contact-form [aria-invalid="true"]:focus-visible{box-shadow:0 1px 0 #ff7777!important}
/* Square reason buttons, preserving the selected and keyboard-focus states. */
.contact-reasons span{border-radius:0}

.contact-close{transition:transform .4s cubic-bezier(.25,.8,.25,1),background .3s}.contact-close:hover{transform:rotate(90deg)}

/* A sculptural thank-you screen: the same continuous form, in porcelain. */
#contact-dialog [hidden]{display:none!important}
#contact-dialog .contact-message.is-sent{width:100%;padding:0;flex:1;min-height:0}
.contact-sent{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;flex:1;min-height:0;padding:18px 0 24px}
.sent-art{position:relative;width:min(48vw,430px);height:min(48vh,430px);min-height:180px;opacity:0;transform:translateY(18px) scale(.90);transition:opacity .75s,transform 1.3s cubic-bezier(.16,1,.3,1)}
.sent-art .sculpture-stage{width:100%;height:100%;min-height:0}
.sent-art canvas{pointer-events:none}
.sent-art .sculpture-stage::after{background:radial-gradient(ellipse,rgba(0,24,111,.24),transparent 70%);height:25px;width:50%;top:86%}
.sent-copy{text-align:center;opacity:0;transform:translateY(14px);transition:opacity .65s,transform .85s cubic-bezier(.16,1,.3,1);transition-delay:.22s}
#sent-title{font:400 clamp(32px,4vw,48px)/1.12 Arial,Helvetica,sans-serif;letter-spacing:-.035em;margin:0 0 28px;outline:none}
#sent-title:focus-visible{outline:none}
#sent-back{font:400 12px/1.4 Arial,Helvetica,sans-serif;padding:12px 23px;min-width:0;background:transparent;color:white;border-color:#ffffff70;transition:background .25s,color .25s,border-color .25s}
#sent-back:hover{background:white;color:#0060fd;border-color:#fff}
.contact-sent.has-arrived .sent-art,.contact-sent.has-arrived .sent-copy{opacity:1;transform:translateY(0) scale(1)}
@media(max-width:600px){.contact-sent{gap:12px;padding:18px 0 22px}.sent-art{width:min(88vw,360px);height:min(44svh,360px)}#sent-title{font-size:34px;margin-bottom:26px}}
@media(max-height:600px){.contact-sent{gap:0;padding:8px 0}.sent-art{height:36svh;min-height:130px;width:min(60vw,300px)}#sent-title{font-size:30px;margin-bottom:20px}}
@media(prefers-reduced-motion:reduce){.sent-art,.sent-copy{opacity:1;transform:none}}

/* The loading cover must never trap a visitor, including when a script fails. */
.preloader{animation:loader-safety-exit 0s 7s forwards}
@keyframes loader-safety-exit{to{visibility:hidden;pointer-events:none}}
html.contact-open,html.contact-open body{background:#0060fd}
#contact-dialog{height:100dvh;min-height:100%;padding-bottom:max(36px,env(safe-area-inset-bottom))}
#contact-dialog .contact-close:focus-visible{outline:none;box-shadow:none}
html.keyboard-focus #contact-dialog .contact-close:focus-visible{outline:2px solid white;outline-offset:5px}
@media(max-width:600px){#contact-dialog{padding-top:max(26px,calc(env(safe-area-inset-top) + 18px));padding-bottom:max(28px,calc(env(safe-area-inset-bottom) + 20px))}}
@media(prefers-reduced-motion:reduce){.preloader{display:none}}

.contact-captcha{margin:22px 0;min-height:78px}.contact-captcha>div{max-width:100%}

.contact-captcha{margin:0;min-height:0;height:0}.captcha-disclosure{font-size:11px;line-height:1.5;opacity:.65;margin-top:16px}.captcha-disclosure a{color:inherit;text-decoration:underline}
