@font-face{font-family:Neue;src:url('./neue.otf');font-display:swap}
@font-face{font-family:Plex;src:url('./mono.ttf');font-display:swap}
.island-journey-ui{position:absolute;inset:0;z-index:3;pointer-events:none;font-family:Neue,Arial,sans-serif;color:#17252c}
.island-journey-ui *{box-sizing:border-box}
.sky-words{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden}
.sky-word{grid-area:1/1;margin:0;font:400 clamp(44px,12vw,180px)/.92 Neue,Arial,sans-serif;letter-spacing:-.055em;opacity:0;color:#fff;text-align:center;will-change:transform,opacity;text-shadow:0 2px 24px #33688915}
.sky-word-long{font-size:clamp(32px,10.4vw,156px)}
.contact-graphic{position:absolute;inset:0;display:flex;align-items:center;overflow:auto;overscroll-behavior:auto;padding:32px 5vw;opacity:0;visibility:hidden;pointer-events:none;scrollbar-width:thin;scrollbar-color:#71848c transparent}
.contact-stack{position:relative;width:min(1160px,100%);margin:auto;display:flex;flex-direction:column;gap:16px;flex:none}
.contact-composition{position:relative;width:100%;margin:0;padding:clamp(28px,3.2vw,44px);display:grid;grid-template-columns:minmax(230px,.8fr) minmax(0,1.4fr);grid-template-areas:"masthead masthead" "mark fields";column-gap:clamp(32px,4.4vw,60px);row-gap:26px;align-items:center;border-radius:30px;border:1px solid #ffffffb3;background:linear-gradient(130deg,#ffffffa8,#ffffff70);-webkit-backdrop-filter:blur(18px) saturate(1.2);backdrop-filter:blur(18px) saturate(1.2);box-shadow:0 24px 70px #1b405426,inset 0 1px 0 #fffffff0,inset 0 -1px 0 #ffffff90}
.island-glass-ready .contact-composition{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
.contact-mark-column{grid-area:mark;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;align-self:stretch}
.contact-mark-slot{width:min(100%,300px);aspect-ratio:1;position:relative;margin:0 auto;flex:none}
.contact-mark-slot>i{position:absolute;width:27%;height:20%;border:1px solid #1a2930b3}
.contact-mark-slot>i:nth-child(1){left:0;top:0;border-right:0;border-bottom:0}
.contact-mark-slot>i:nth-child(2){right:0;top:0;border-left:0;border-bottom:0}
.contact-mark-slot>i:nth-child(3){left:0;bottom:0;border-right:0;border-top:0}
.contact-mark-slot>i:nth-child(4){right:0;bottom:0;border-left:0;border-top:0}
.contact-intention{display:flex;align-items:center;justify-content:center;gap:14px;margin:0;font:12px/1.45 Plex,monospace;white-space:nowrap}
.intention-ellipses{display:flex;gap:5px}.intention-ellipses i{width:14px;height:5px;border-radius:50%;background:#17252c}.intention-ellipses i+i{background:none;border:1px solid #17252c}
.contact-masthead{grid-area:masthead;display:flex;gap:12px;align-items:center;min-width:0;margin:0;padding-bottom:20px;border-bottom:1px solid #263d4a30}
.contact-die{width:25px;height:25px;background:#17252c;display:grid;grid-template-columns:repeat(2,5px);grid-template-rows:repeat(2,5px);gap:4px;place-content:center;flex-shrink:0}
.contact-die i{background:#fff;border-radius:50%}.contact-name{font-size:28px;line-height:1;letter-spacing:-.05em;white-space:nowrap;margin-right:auto}
.contact-vh{display:flex;justify-content:space-around;align-items:center;width:82px;height:28px;border:1px solid #17252c99;font:14px Plex,monospace;margin-left:0;flex-shrink:0}
.contact-wave{display:flex;align-items:center;justify-content:space-between;width:105px;margin-left:3px;height:27px}
.contact-wave i{display:block;background:#17252c;border-radius:50%;height:20px;width:11px}.contact-wave i:nth-child(1),.contact-wave i:nth-child(7){width:3px;height:18px}.contact-wave i:nth-child(2),.contact-wave i:nth-child(6){width:6px}.contact-wave i:nth-child(4){width:16px;height:22px}
.contact-content{grid-area:fields;min-width:0}
.contact-content h2{font:400 clamp(34px,3.4vw,44px)/1.02 Neue,Arial,sans-serif;letter-spacing:-.035em;margin:0 0 24px;color:#17252c}
.contact-form{margin:0}.contact-field{display:flex;flex-direction:column;gap:8px;min-width:0}.contact-field>span{font:14px/1.2 Plex,monospace;letter-spacing:.015em;color:#34474f}
.contact-field input,.contact-field textarea{display:block;width:100%;font:16px/1.45 Neue,Arial,sans-serif;color:#14252d;border:0;border-bottom:1px solid #263d4a70;border-radius:0;padding:0 0 10px;background:transparent;outline:none;box-shadow:none;color-scheme:light}
.contact-field textarea{resize:vertical;min-height:58px;max-height:160px}.contact-field :is(input,textarea):focus{border-bottom-color:#17252c;box-shadow:0 1px 0 #17252c}.contact-field :is(input,textarea)::placeholder{color:#425762;opacity:1}
.contact-person{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:20px}
.contact-action{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:24px;margin-top:24px}.contact-action button{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:12px 16px;background:#17252c;color:#fff;border:1px solid #17252c;border-radius:12px;font:16px Neue,Arial,sans-serif;cursor:pointer;min-height:48px}
.contact-action button:hover{background:#293d47}.contact-action button:focus-visible{outline:2px solid #17252c;outline-offset:5px}.contact-action button span{font-size:22px}
.contact-action p{font:12px/1.5 Plex,monospace;color:#34474f;margin:0}.contact-action p br{display:none}.contact-feedback{font:12px/1.5 Plex,monospace;margin:12px 0 0;color:#17252c}.contact-feedback:empty{display:none}
.contact-signoff{position:relative;flex:none;width:100%;min-height:68px;display:flex;justify-content:space-between;align-items:center;gap:20px;margin:0;padding:18px clamp(28px,3.2vw,44px);border:1px solid #edf3f5a6;border-radius:18px;background:linear-gradient(173deg,#ecf0f2 0%,#a5afb8 17%,#e3e8ed 34%,#b8c1c9 62%,#8d9aa6 92%,#dbe3e8 100%);box-shadow:0 12px 25px #1732402b;isolation:isolate;font:12px/1.4 Plex,monospace;font-weight:500;letter-spacing:.01em;color:#182733;text-shadow:0 1px 0 #ffffff8c}
.island-metal-ready .contact-signoff{background:transparent;border-color:transparent}
@media(min-width:701px) and (max-width:960px){
 .contact-composition{grid-template-columns:minmax(180px,.75fr) minmax(0,1.4fr);column-gap:28px;padding:28px}
 .contact-content h2{font-size:34px}.contact-action{grid-template-columns:1fr;gap:10px}.contact-action button{max-width:none}
 .contact-person{gap:16px}.contact-intention{font-size:11px}
}
@media(max-width:700px){
 .contact-graphic{padding:24px 4vw}.contact-composition{grid-template-columns:136px minmax(0,1fr);grid-template-areas:"mark masthead" "fields fields";gap:24px 20px;padding:24px 20px}
 .contact-mark-column{align-self:center}.contact-mark-slot{width:136px}.contact-intention{display:none}
 .contact-masthead{min-height:136px;flex-wrap:wrap;align-content:center;justify-content:flex-start;gap:8px;padding:0;border:0}
 .contact-name{font-size:23px;margin-right:0}.contact-die{width:22px;height:22px}.contact-vh{width:57px;height:22px;font-size:12px}.contact-wave{width:72px;height:22px;margin-left:0}.contact-wave i{transform:scaleY(.8);width:8px}.contact-wave i:nth-child(4){width:12px}
 .contact-content h2{font-size:36px;margin-bottom:24px}.contact-person{gap:18px;margin-top:20px}.contact-field>span{font-size:13px}
 .contact-action{grid-template-columns:1fr;gap:12px;margin-top:24px}.contact-action button{width:100%}
 .contact-signoff{min-height:76px;flex-direction:column;justify-content:center;align-items:flex-start;gap:5px;font-size:11px;padding:18px 20px}.sky-word{font-size:15vw}.sky-word-long{font-size:10.4vw}
}
@media(max-height:650px) and (min-width:701px){.contact-graphic{padding:20px 5vw}.contact-composition{row-gap:20px;padding-top:24px;padding-bottom:24px}.contact-masthead{padding-bottom:16px}.contact-content h2{font-size:34px;margin-bottom:20px}.contact-person{margin-top:18px}.contact-action{margin-top:20px}.contact-mark-slot{max-width:260px}}
@media(prefers-reduced-motion:reduce){.sky-word{will-change:auto}}
@media(max-width:400px){.contact-composition{grid-template-columns:116px minmax(0,1fr);column-gap:16px}.contact-mark-slot{width:116px}.contact-masthead{min-height:116px}.contact-content h2{font-size:32px}.contact-die{display:none}.contact-person{grid-template-columns:1fr;gap:18px}}
@media(prefers-contrast:more){.island-glass-ready .contact-composition,.contact-composition{background:#fffffff2}.contact-field input,.contact-field textarea{color:#101010}}
