/* A conversation studio: compact form at the top, playful context beside it. */
.contact-page{padding-top:25px;padding-bottom:65px}
.contact-page .breadcrumbs{margin-bottom:27px}
.contact-studio{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(32px,5vw,86px);align-items:start}
.contact-intro{min-width:0;padding-top:10px}
.contact-intro h1{font-size:clamp(54px,5.65vw,88px);line-height:1.02;letter-spacing:-.055em;margin:21px 0}
.contact-intro h1 span{color:var(--orange)}
.contact-intro header>p:not(.eyebrow){font-size:17px;line-height:1.75;color:var(--muted);max-width:440px}
.contact-doodle{position:relative;display:flex;align-items:flex-start;flex-direction:column;padding:30px 0 22px 12px;margin:5px 0 8px;max-width:400px}
.hello-bubble,.reply-bubble{position:relative;font-family:var(--display);font-weight:700;line-height:1.1;letter-spacing:-.035em;border:1.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink)}
.hello-bubble{background:#ffdfb2;border-radius:20px 20px 20px 4px;padding:16px 27px;font-size:30px;transform:rotate(-5deg)}
.hello-bubble i{position:absolute;right:-37px;top:-23px;font-size:59px;font-style:normal;color:var(--orange);text-shadow:1px 1px var(--ink)}
.reply-bubble{align-self:flex-end;background:var(--orange);border-radius:20px 20px 4px 20px;padding:15px 23px;font-size:27px;transform:rotate(4deg);margin-top:8px}
.reply-bubble b{display:inline-block;margin-left:11px}
.contact-doodle-note{font-size:9px;letter-spacing:.09em;font-weight:600;margin:23px 0 0 20px;color:var(--muted)}
.contact-help-links{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.contact-help-links>a{display:flex;align-items:center;gap:12px;padding:17px 13px;border:1px solid var(--line);border-radius:12px;background:#fffdf780;transition:background .2s,transform .2s,border-color .2s}
.contact-help-links>a:hover{background:#ffead7;border-color:#bd5a2d;transform:translateY(-3px)}
.contact-help-links>a>span:not(.contact-link-symbol){font-size:11px;line-height:1.5;color:var(--muted)}
.contact-help-links b{display:block;font-size:15px;font-weight:600;color:var(--ink);margin-top:4px}
.contact-link-symbol{display:grid;place-items:center;width:30px;height:34px;flex-shrink:0;font-family:var(--display);font-size:25px;color:#ae3b0d}
.contact-help-links .icon{width:16px;height:16px;flex-shrink:0;margin-left:auto}
.contact-footnote{font-size:12px;line-height:1.75;color:var(--muted);margin-top:17px;max-width:440px}
.contact-studio .contact-form-card{position:relative;padding:27px 29px 28px;border:1px solid #d8cfbd;background:#fffdf7;border-radius:19px;box-shadow:0 7px 0 #eee7d8}
.contact-card-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.contact-card-heading .eyebrow{font-size:10px;letter-spacing:.08em;margin-bottom:9px;color:#9c390f}
.contact-card-heading h2{font-size:clamp(27px,2.4vw,37px);line-height:1.12;letter-spacing:-.045em}
.contact-card-heading>span{display:grid;place-items:center;flex-shrink:0;background:#ffdfb2;border-radius:50%;width:40px;height:40px;font-size:26px}
.contact-studio .contact-form-card>p{font-size:13px;margin-top:9px}
.contact-studio .contact-form-card form{margin-top:23px}
.contact-studio .support-form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:17px 17px;margin-bottom:18px}
.contact-studio .contact-form-card label{font-size:13px;margin-bottom:7px}
.contact-studio .contact-form-card input{min-height:46px;padding:11px 13px;font-size:14px}
.contact-studio .contact-form-card textarea{min-height:108px;height:108px;padding:11px 13px;font-size:14px;line-height:1.6}
.contact-studio .contact-form-card .form-privacy{font-size:11px;line-height:1.7;margin:12px 0 17px}
.contact-studio .contact-form-card .button{min-height:50px;font-size:15px;justify-content:space-between;padding:13px 19px}
.contact-form-card input:focus-visible,.contact-form-card textarea:focus-visible,.tracking-card input:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.contact-studio .contact-preview pre{background:#fff0dd}
/* Shared, keyboard-operable selection controls; the native select keeps form values. */
.bandit-select{position:relative;min-width:0;width:100%}
body select.bandit-select-native{position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;padding:0!important;margin:0!important;overflow:hidden;clip-path:inset(50%);opacity:0;pointer-events:none;border:0!important}
.bandit-select-trigger{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:46px;padding:10px 12px 10px 14px;background:#fffdf7;border:1px solid #cfc7b7;border-radius:9px;color:var(--ink);font:500 14px/1.5 var(--body);text-align:left;cursor:pointer;transition:border-color .18s,background .18s,box-shadow .18s}
.bandit-select-trigger>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.bandit-select-trigger>svg{width:24px;height:24px;flex-shrink:0;padding:3px;background:#f0e9db;border-radius:6px;transition:transform .2s,background .2s}
.bandit-select-trigger:hover,.bandit-select-trigger[aria-expanded=true]{border-color:#b84a1a;background:#fff8ed}
.bandit-select-trigger[aria-expanded=true]>svg{transform:rotate(180deg);background:#ffdfb2}
.bandit-select-trigger:focus{outline:none}
.bandit-select-trigger:focus-visible{border-color:#ad3f12;box-shadow:0 0 0 3px #ff5a162b}
.bandit-select-trigger:disabled{opacity:.5;cursor:not-allowed}
.bandit-select-panel{position:fixed;inset:auto;margin:0;padding:7px;background:#fffdf7;color:var(--ink);border:1px solid #d8cbb6;border-radius:12px;box-shadow:0 14px 36px #32251626,0 3px 0 #20201d0a;max-width:calc(100vw - 20px);overflow-y:auto;overscroll-behavior:contain;z-index:2000;opacity:0;transform:translateY(-5px);transition:opacity .16s,transform .16s;font-family:var(--body)}
.bandit-select-panel[data-open]{opacity:1;transform:translateY(0)}
.bandit-select-panel[hidden]{display:none}
.bandit-select-option{display:flex;align-items:center;justify-content:space-between;gap:17px;padding:11px 12px;min-height:44px;border-radius:7px;font-size:14px;line-height:1.5;cursor:pointer;transition:background .12s}
.bandit-select-option[aria-selected=true]{background:#ffead7;color:#91320b;font-weight:600}
.bandit-select-option.is-active{box-shadow:inset 0 0 0 1px #b84a1a;background:#fff0df}
.bandit-select-option[aria-disabled=true]{opacity:.45;cursor:not-allowed}
.bandit-select-option>span:last-child{width:17px;flex-shrink:0;text-align:center}
.shop-sort{flex-direction:row;align-items:center;gap:10px;font-size:13px}
.shop-sort>.sort-label{font-size:12px;cursor:pointer}
.shop-sort>.bandit-select{width:195px}
.shop-sort .bandit-select-trigger{font-size:13px;min-height:46px}
@media(max-width:1100px){.contact-studio{gap:30px;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}.contact-studio .contact-form-card{padding:25px}.contact-help-links{grid-template-columns:1fr}.contact-help-links>a{padding:13px}.contact-doodle{padding-right:10px}.hello-bubble{font-size:26px}.reply-bubble{font-size:24px}.contact-intro h1{font-size:clamp(49px,5.7vw,68px)}}
@media(max-width:760px){.contact-page{padding-top:21px;padding-bottom:45px}.contact-page .breadcrumbs{margin-bottom:24px}.contact-studio{display:grid;grid-template-columns:1fr;gap:25px}.contact-intro{display:contents}.contact-intro header{order:0;padding:0}.contact-intro header>.eyebrow{font-size:9px;letter-spacing:.07em}.contact-intro h1{font-size:clamp(45px,10vw,68px);margin:16px 0}.contact-intro header>p:not(.eyebrow){font-size:15px;line-height:1.7}.contact-studio .contact-form-card{order:1;padding:24px 20px;box-shadow:0 5px 0 #eee7d8}.contact-card-heading h2{font-size:29px}.contact-card-heading>span{width:34px;height:34px}.contact-studio .contact-form-card>p{font-size:12px}.contact-studio .contact-form-card form{margin-top:21px}.contact-studio .support-form-grid{gap:16px 12px}.contact-studio .contact-form-card input,.contact-studio .contact-form-card textarea,.contact-form-card .bandit-select-trigger{font-size:16px}.contact-studio .contact-form-card label{font-size:12px}.contact-studio .contact-form-card textarea{height:118px;min-height:118px}.contact-studio .contact-form-card .form-privacy{font-size:11px}.contact-doodle{order:2;width:100%;max-width:355px;margin:0 auto;padding-top:9px}.contact-help-links{order:3;margin:0;grid-template-columns:1fr 1fr}.contact-help-links>a{gap:8px;padding:12px 9px}.contact-help-links b{font-size:13px}.contact-help-links>a>span:not(.contact-link-symbol){font-size:10px}.contact-link-symbol{width:20px;font-size:22px}.contact-help-links .icon{width:13px}.contact-footnote{order:4;margin-top:-8px;font-size:12px}.shop-sort{gap:7px;align-items:center;flex-direction:row}.shop-sort .sort-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.shop-sort>.bandit-select{width:179px}.shop-sort .bandit-select-trigger{font-size:12px;min-height:46px;padding-left:12px}.shop-sort .bandit-select-trigger>svg{width:22px;height:22px}.bandit-select-option{font-size:15px;min-height:47px}}
@media(max-width:420px){.contact-studio .support-form-grid{grid-template-columns:1fr}.contact-studio .contact-form-card{padding:23px 18px}.contact-card-heading h2{font-size:27px}.contact-card-heading>span{width:29px;height:29px;font-size:22px}.shop-sort>.bandit-select{width:163px}.contact-help-links{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.contact-help-links>a,.bandit-select-trigger,.bandit-select-trigger>svg,.bandit-select-panel,.bandit-select-option{transition:none}}

.contact-page{padding-top:20px}.contact-page .breadcrumbs{margin-bottom:18px}
.contact-studio .contact-form-card{padding:24px 27px}
.contact-card-heading .eyebrow{margin-bottom:6px}.contact-card-heading h2{font-size:clamp(27px,2.2vw,34px)}
.contact-studio .contact-form-card form{margin-top:18px}
.contact-studio .support-form-grid{gap:14px 17px;margin-bottom:15px}
.contact-studio .contact-form-card label{margin-bottom:6px}
.contact-studio .contact-form-card textarea{height:100px;min-height:100px}
.contact-studio .contact-form-card .form-privacy{margin-bottom:13px}
.hello-bubble i{width:60px;height:60px;display:block}.hello-bubble i .burst{width:100%;height:100%;color:var(--orange);filter:drop-shadow(1px 1px 0 var(--ink))}
.reply-bubble b .icon{width:24px;height:24px;vertical-align:middle}.contact-card-heading>span .icon{width:23px;height:23px}
.bandit-select-panel{scrollbar-width:thin;scrollbar-color:#c9b69b transparent}
@media(max-width:760px){.contact-page{padding-top:21px}.contact-page .breadcrumbs{margin-bottom:24px}.contact-studio .contact-form-card{padding:24px 20px}.contact-card-heading h2{font-size:29px}.contact-studio .support-form-grid{gap:16px 12px}.contact-studio .contact-form-card textarea{height:118px;min-height:118px}}
@media(max-width:420px){.contact-studio .contact-form-card{padding:23px 18px}.contact-card-heading h2{font-size:27px}}

/* A slimmer, more readable contact form with softly filled, borderless fields. */
@media(min-width:761px){
 .contact-studio{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(24px,3.2vw,64px)}
 .contact-studio .contact-form-card{width:100%;max-width:none;justify-self:stretch}
}
.contact-studio .contact-form-card>p{font-size:15px;line-height:1.6}
.contact-studio .contact-form-card label{font-size:14px;line-height:1.5;margin-bottom:7px}
.contact-studio .support-form-grid{gap:16px 17px;margin-bottom:17px}
.contact-studio .contact-form-card input,
.contact-studio .contact-form-card textarea,
.contact-studio .contact-form-card .bandit-select-trigger,
.contact-studio .contact-form-card select:not(.bandit-select-native){border:0;outline:none;background-color:#f3efe6;color:var(--ink);box-shadow:none;font-size:16px;transition:background-color .18s,box-shadow .18s}
.contact-studio .contact-form-card input,
.contact-studio .contact-form-card .bandit-select-trigger,
.contact-studio .contact-form-card select:not(.bandit-select-native){min-height:48px}
.contact-studio .contact-form-card textarea{height:120px;min-height:120px}
.contact-studio .contact-form-card input::placeholder,
.contact-studio .contact-form-card textarea::placeholder{color:#716e64;opacity:1}
.contact-studio .contact-form-card input:hover,
.contact-studio .contact-form-card textarea:hover,
.contact-studio .contact-form-card .bandit-select-trigger:hover{background-color:#ede7da}
.contact-studio .contact-form-card input:focus-visible,
.contact-studio .contact-form-card textarea:focus-visible,
.contact-studio .contact-form-card .bandit-select-trigger:focus-visible,
.contact-studio .contact-form-card select:not(.bandit-select-native):focus-visible{outline:none;background-color:#fff0db;box-shadow:inset 0 -3px 0 #bd430f}
.contact-studio .contact-form-card .bandit-select-trigger[aria-expanded=true]{background-color:#fff0db}
.contact-studio .contact-form-card .form-privacy{font-size:12px;line-height:1.65;margin:13px 0 15px}
.contact-studio .contact-form-card .button{font-size:16px;min-height:52px}
@media(max-width:760px){.contact-studio .contact-form-card>p{font-size:14px}.contact-studio .contact-form-card label{font-size:14px}.contact-studio .support-form-grid{gap:17px 12px}.contact-studio .contact-form-card textarea{height:140px;min-height:140px}}
@media(prefers-reduced-motion:reduce){.contact-studio .contact-form-card input,.contact-studio .contact-form-card textarea,.contact-studio .contact-form-card .bandit-select-trigger{transition:none}}
/* Keep the taller form's submit action inside shorter laptop viewports. */
@media(min-width:761px) and (max-height:800px){
 .contact-studio .contact-form-card{padding:22px 27px}
 .contact-studio .contact-form-card form{margin-top:15px}
 .contact-studio .support-form-grid{gap:14px 17px;margin-bottom:15px}
 .contact-studio .contact-form-card textarea{height:112px;min-height:112px}
 .contact-studio .contact-form-card .form-privacy{margin:10px 0 12px}
}

/* Bring the conversation and form together without crowding either column. */
.contact-card-heading h2{font-size:clamp(34px,3.05vw,46px);line-height:1.08;letter-spacing:-.045em}
@media(min-width:761px){.contact-intro header>p:not(.eyebrow){max-width:500px}.contact-doodle{max-width:480px;padding-right:16px}}
@media(max-width:760px){.contact-card-heading h2{font-size:34px}}
@media(max-width:420px){.contact-card-heading h2{font-size:32px}}