/* The contact page follows Crewbound's ink/indigo/cream/gold design signature. */
.contact-hero{overflow:hidden;background:var(--ink);color:var(--cream);padding:72px 0 88px}
.contact-hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.contact-eyebrow{color:var(--gold);font:800 13px/1.3 var(--round);letter-spacing:.11em;margin:0 0 25px}
.contact-hero h1{font-size:clamp(48px,6.5vw,82px);line-height:1.03;letter-spacing:-.035em}
.contact-hero h1 span{color:var(--gold)}
.contact-intro{color:var(--cream2);font-size:clamp(18px,2vw,21px);line-height:1.65;max-width:31em;margin:27px 0 30px}
.contact-jump{display:inline-flex;align-items:center;gap:15px;color:#fff;font:800 16px/1.2 var(--round);text-decoration:none;border-bottom:2px solid var(--gold);padding-bottom:9px}
.contact-jump span{color:var(--gold);font-size:22px}
.contact-hero-art{height:310px;position:relative}
.idea-card{position:absolute;inset:37px 25px 0 36px;max-width:390px;border-radius:25px;background:var(--raised);box-shadow:0 25px 50px rgba(0,0,0,.25);transform:rotate(3deg);padding:30px;color:var(--cream)}
.idea-card-cap{color:var(--lav);font:800 13px var(--round);letter-spacing:.14em;margin:0 0 12px}
.idea-card strong{font:900 clamp(29px,3.2vw,42px)/1.03 var(--round);display:block;letter-spacing:-.03em}
.idea-card strong span{color:var(--gold)}
.idea-divider{border-top:2px dashed rgba(255,243,227,.3);margin:27px 0}
.idea-card p:last-of-type{font-weight:700;margin:0;font-size:16px;display:flex;align-items:center;gap:12px}
.idea-avatar{background:var(--gold);color:var(--ink);border-radius:50%;width:35px;height:35px;display:grid;place-items:center;font:900 17px var(--round)}
.idea-spark{position:absolute;right:24px;bottom:26px;font-size:42px;color:var(--gold);font-style:normal}
.note-bubble{position:absolute;z-index:2;background:var(--cream);color:var(--ink);padding:12px 16px;border-radius:17px;box-shadow:0 10px 20px rgba(0,0,0,.25);display:flex;gap:9px;align-items:center;font:800 15px var(--round);white-space:nowrap}
.note-bubble .note-emoji{color:var(--indigo);font-size:25px;line-height:1}
.note-one{left:-15px;top:1px;transform:rotate(-7deg)}
.note-two{right:-3px;bottom:-3px;transform:rotate(-5deg)}
.contact-main{padding:94px 0 112px;background:var(--cream)}
.contact-columns{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:72px;align-items:start}
.contact-info{position:sticky;top:40px}
.contact-info .section-tag{color:var(--indigo);font:900 13px var(--round);letter-spacing:.12em;margin:0 0 18px}
.contact-info h2{font-size:clamp(36px,4.1vw,54px);line-height:1.05;max-width:9em}
.contact-info-copy{font-size:18px;color:#554C5B;line-height:1.7;margin:22px 0 34px;max-width:22em}
.contact-promise{display:flex;gap:14px;padding:23px 0;border-top:2px dashed #D8CBBB;border-bottom:2px dashed #D8CBBB}
.contact-promise-graphic{display:grid;place-items:center;flex:none;background:var(--gold);height:47px;width:47px;border-radius:15px;font-size:30px;color:var(--ink)}
.contact-promise strong{font:900 19px var(--round)}
.contact-promise p{font-size:15px;color:#655B69;margin:6px 0 0;line-height:1.5}
.contact-help{margin-top:32px;font-size:15px;line-height:1.65;color:#655B69}
.contact-help strong{font:900 19px var(--round);color:var(--ink)}
.contact-help p{margin:8px 0}
.contact-help a{font-weight:700;text-decoration:underline;text-underline-offset:3px}
.contact-panel{background:#fff;border-radius:30px;padding:35px;box-shadow:0 24px 70px rgba(20,16,46,.09);border:1px solid rgba(20,16,46,.06)}
.contact-panel fieldset{padding:0;margin:0 0 29px;border:0;min-width:0}
.contact-panel legend,.contact-panel .field>label{display:block;font:900 17px/1.3 var(--round);color:var(--ink);margin:0 0 13px}
.contact-panel legend>span,.contact-panel .field>label>span:not(.field-optional){color:var(--indigo)}
.type-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.type-label{cursor:pointer;position:relative;display:block;min-width:0}
.type-label input{position:absolute;opacity:0;width:1px;height:1px}
.type-card{min-height:110px;border:2px solid #ECE8E5;background:#FCFAF7;border-radius:18px;padding:14px 15px;display:flex;flex-direction:column;align-items:flex-start;transition:background .16s,border-color .16s,box-shadow .16s}
.type-label input:checked+.type-card{border-color:var(--indigo);background:#F1F0FF;box-shadow:inset 0 0 0 1px var(--indigo)}
.type-label input:focus-visible+.type-card{outline:3px solid var(--gold);outline-offset:3px}
.type-label:hover .type-card{border-color:var(--lav)}
.type-label input:checked+.type-card::after{content:'✓';position:absolute;right:13px;top:12px;font:900 13px var(--round);color:#fff;background:var(--indigo);border-radius:50%;width:21px;height:21px;display:grid;place-items:center}
.type-icon{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;font:900 23px var(--round);margin-bottom:10px}
.type-icon.idea{background:#FFF0C8;color:#76500B}.type-icon.bug{background:#E7E5FF;color:#4F46E5}.type-icon.account{background:#D8F5EB;color:#146A4E}.type-icon.security{background:#FFE3DC;color:#B34C35}.type-icon.other{background:#EDE7F4;color:#6C517F}
.type-card strong{font:900 15px/1.1 var(--round);color:var(--ink)}
.type-card small{font:500 12px/1.35 var(--sans);color:#665D69;margin-top:5px}
.contact-fields{display:flex;flex-direction:column;gap:21px}
.contact-panel .field{min-width:0}
.contact-panel .field>label{margin-bottom:8px}
.contact-panel .field-optional{font:500 13px var(--sans);color:#827987}
.contact-panel .field input,.contact-panel .field textarea{width:100%;background:#FCFAF7;color:var(--ink);border:2px solid #E8E3E1;border-radius:14px;padding:14px 16px;line-height:1.45;font:16px/1.45 var(--sans);outline:0;transition:border-color .15s,box-shadow .15s}
.contact-panel .field textarea{resize:vertical;min-height:145px}
.contact-panel .field input:focus,.contact-panel .field textarea:focus{border-color:var(--indigo);box-shadow:0 0 0 3px #DCD9FE}
.contact-panel .field input::placeholder,.contact-panel .field textarea::placeholder{color:#8F8594}
.contact-panel .field small{display:block;color:#746978;font-size:13px;margin-top:7px;line-height:1.4}
.bug-fields{background:#F5F3FF;border:1px solid #E5E2FF;padding:20px;border-radius:17px;display:flex;flex-direction:column;gap:17px}
.bug-fields[hidden],.contact-caution[hidden],.contact-success[hidden]{display:none!important}
.contact-caution{display:flex;align-items:flex-start;gap:12px;border-radius:15px;background:#FFF4EA;border:1px solid #F2DCC9;padding:14px;color:#6B3A19}
.contact-caution>span{background:#BF5A20;color:#fff;border-radius:50%;display:grid;place-items:center;width:23px;height:23px;font-weight:800;flex:none}
.contact-caution p{font-size:13px;line-height:1.5;margin:0}
.contact-caution a{color:#823C1C;font-weight:700}
.contact-send{border:0;border-radius:16px;background:var(--indigo);color:#fff;font:900 17px var(--round);padding:18px 25px;display:flex;justify-content:center;gap:14px;align-items:center;cursor:pointer;width:100%;transition:background .15s,transform .15s}
.contact-send:hover{background:#6158F0;transform:translateY(-1px)}
.contact-send:disabled{opacity:.7;cursor:wait;transform:none}
.contact-send span{font-size:20px}
.contact-privacy{font-size:12px;color:#756D7A;line-height:1.55;margin:-8px 0 0;text-align:center}
.contact-privacy a{color:var(--indigo);font-weight:700}
.contact-status{font-size:14px;line-height:1.45;margin:-7px 0 0;font-weight:700}
.contact-status:empty{display:none}
.contact-status.error{color:#B42318}
.contact-status.success{color:#13764B}
.contact-success{text-align:center;padding:30px 8px 18px}
.success-mark{width:75px;height:75px;border-radius:24px;display:grid;place-items:center;margin:0 auto 25px;font-size:45px;background:#E7E5FF;color:var(--indigo)}
.contact-success h2{font-size:clamp(29px,3.6vw,43px);line-height:1.09}
.contact-success>p{color:#655B69;max-width:32em;font-size:16px;margin:18px auto 26px}
.reference-box{background:var(--cream);border:2px dashed #D8CBBB;border-radius:18px;padding:21px 18px;display:flex;flex-direction:column;gap:7px;align-items:center}
.reference-box small{font:900 12px var(--round);letter-spacing:.12em;color:#706477}
.reference-box strong{font:900 25px var(--round);letter-spacing:.025em}
.reference-box button,.contact-again{background:transparent;border:0;cursor:pointer;color:var(--indigo);font:800 15px var(--round);text-decoration:underline;text-underline-offset:3px}
.contact-success .reference-help{font-size:13px;line-height:1.6;margin:20px auto}
.contact-again{font-size:16px}
.contact-end{background:var(--indigo);color:#fff;padding:31px 0}
.contact-end-grid{display:flex;justify-content:space-between;align-items:center;gap:22px}
.contact-end p{font:900 clamp(20px,2.6vw,30px)/1.2 var(--round);margin:0}
.contact-end p span{color:var(--gold);margin-right:8px}
.contact-end a{font:800 16px var(--round);color:#fff;text-underline-offset:5px}
@media(max-width:940px){.contact-columns{grid-template-columns:1fr;gap:32px}.contact-info{position:static}.contact-info h2{max-width:none}.contact-info-copy{max-width:36em}.contact-hero-grid{grid-template-columns:1fr 0.7fr;gap:12px}.note-bubble{font-size:12px}}
@media(max-width:720px){.contact-hero{padding:51px 0 62px}.contact-hero-grid{grid-template-columns:1fr}.contact-hero-art{display:none}.contact-main{padding:55px 0 68px}.contact-panel{padding:23px 18px;border-radius:24px}.contact-info h2{font-size:39px}.contact-info-copy{font-size:17px}.contact-promise,.contact-help{display:none}.contact-end-grid{flex-direction:column;align-items:flex-start}.contact-end a{margin-left:1px}}
@media(max-width:400px){.type-grid{grid-template-columns:1fr 1fr;gap:7px}.type-card{padding:12px 9px;min-height:111px}.type-card strong{font-size:13px}.type-card small{font-size:11px}.type-label input:checked+.type-card::after{right:7px;top:7px}.contact-panel{padding:20px 13px}}
/* Bot-trap field must not be visible or focusable for people. */
.contact-panel .bot-field{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;overflow:hidden!important;clip-path:inset(50%)!important;pointer-events:none!important}
