/* Jompom Contact doors: two 3D doors that swing open onto their rooms (FillKite forms; design mock in the editor). */
.jp-ct-doors .ct-hero{position:relative;overflow:hidden;overflow:clip;color:#fff;padding:150px 0 100px;background:radial-gradient(50% 60% at 50% 70%,rgba(67,186,255,.45),rgba(67,186,255,0) 70%),var(--ink)}
.jp-ct-doors .ct-hero::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.1) 1.6px,transparent 1.8px);background-size:28px 28px;pointer-events:none}
.jp-ct-doors .ct-intro{position:relative;text-align:center;max-width:820px;margin:0 auto 56px}
.jp-ct-doors .ct-eyebrow{display:inline-flex;align-items:center;gap:10px;padding:8px 16px 8px 10px;border-radius:999px;background:var(--ink2);border:2px solid rgba(255,255,255,.18);font-size:14px;font-weight:600}
.jp-ct-doors .ct-eyebrow i{width:12px;height:12px;border-radius:50%;background:#3ddc84;box-shadow:0 0 0 0 rgba(61,220,132,.7);animation:jp-ct-doors-ping 1.8s infinite}
@keyframes jp-ct-doors-ping{70%{box-shadow:0 0 0 10px rgba(61,220,132,0)}100%{box-shadow:0 0 0 0 rgba(61,220,132,0)}}
.jp-ct-doors .ct-hero h1{font-size:clamp(44px,6.6vw,96px);line-height:.92;letter-spacing:-.045em;margin:22px 0 22px}
.jp-ct-doors .ct-hero h1 span{color:var(--sun)}
.jp-ct-doors .ct-hero .lead{font-size:clamp(16px,1.5vw,19px);color:#d7e2ea;max-width:36em;margin-inline:auto}
.jp-ct-doors .ct-hero .lead a{color:var(--blue);font-weight:600;text-decoration:underline;text-underline-offset:4px}
.jp-ct-doors .doors{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,4vw,60px);max-width:860px;margin-inline:auto;padding:0 0 22px}
.jp-ct-doors .doors::after{content:"";position:absolute;left:-6%;right:-6%;bottom:0;height:22px;border-radius:12px;background:var(--ink2);border:3px solid #3a3d40}
.jp-ct-doors .door-wrap{position:relative;scroll-margin-top:110px}
.jp-ct-doors .sign{display:block;text-align:center;font:700 clamp(13px,1.4vw,15px)/1.2 Poppins,sans-serif;color:#c9d3da;margin-bottom:12px}
.jp-ct-doors .door{display:block;width:100%;padding:0;border:0;background:none;cursor:pointer;color:var(--ink);text-align:left;border-radius:26px 26px 0 0}
.jp-ct-doors .frame{position:relative;display:block;aspect-ratio:3/4;max-height:480px;margin-inline:auto;border:5px solid var(--ink);border-bottom:0;outline:4px solid #3a3d40;border-radius:26px 26px 0 0;perspective:1400px;perspective-origin:50% 40%;background:var(--abyss)}
.jp-ct-doors .inside{position:absolute;inset:0;border-radius:20px 20px 0 0;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:#fff;background:radial-gradient(70% 60% at 60% 40%,rgba(255,226,122,.85),rgba(252,185,0,.25) 60%,transparent 80%),linear-gradient(#0b5d8f,#08466c)}
.jp-ct-doors .door-wrap.q .inside{background:radial-gradient(70% 60% at 60% 40%,rgba(127,210,255,.9),rgba(67,186,255,.25) 60%,transparent 80%),linear-gradient(#0b5d8f,#08466c)}
.jp-ct-doors .inside .toy{width:46%;aspect-ratio:1;perspective:700px}
.jp-ct-doors .inside b{font:800 clamp(18px,2.4vw,28px)/1 var(--jp-display);color:var(--ink);background:#fff;border:3px solid var(--ink);border-radius:12px;padding:6px 12px;rotate:-4deg}
.jp-ct-doors .leaf{position:absolute;inset:0;transform-style:preserve-3d;transform-origin:0 50%;transition:transform 1.1s var(--spring)}
.jp-ct-doors .face,.jp-ct-doors .back{position:absolute;inset:0;border-radius:20px 20px 0 0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.jp-ct-doors .face{display:flex;flex-direction:column;justify-content:space-between;padding:clamp(14px,2.4vw,28px);background:var(--c);border:3px solid var(--ink);border-bottom:0;box-shadow:inset -10px 0 0 rgba(0,0,0,.12)}
.jp-ct-doors .back{background:var(--cb);transform:rotateY(180deg)}
.jp-ct-doors .door-wrap.q .leaf{--c:var(--blue);--cb:#1d8bca}
.jp-ct-doors .door-wrap.t .leaf{--c:var(--sun);--cb:#c89300}
.jp-ct-doors .panels{display:grid;grid-template-rows:repeat(2,minmax(0,1fr));gap:10px;flex:1;margin:12px 0}
.jp-ct-doors .panels i{display:block;border:3px solid rgba(28,29,30,.35);border-radius:12px;box-shadow:inset 3px 3px 0 rgba(255,255,255,.35)}
.jp-ct-doors .face .lbl{font:800 clamp(22px,3.4vw,44px)/.95 var(--jp-display);letter-spacing:-.03em}
.jp-ct-doors .face .sub{display:block;font:500 clamp(12px,1.3vw,15px)/1.35 Poppins,sans-serif;margin-top:8px;max-width:16em}
.jp-ct-doors .knob{position:absolute;right:12%;top:54%;width:clamp(18px,2.4vw,26px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff 0 12%,#cfd8de 30%,#7c868d);border:3px solid var(--ink);transition:rotate .5s var(--spring)}
.jp-ct-doors .num{position:absolute;right:12%;top:clamp(14px,2.4vw,28px);font:800 clamp(14px,1.6vw,18px)/1 var(--jp-display);background:var(--ink);color:#fff;border-radius:8px;padding:5px 8px}
.jp-ct-doors .door:hover .leaf,.jp-ct-doors .door:focus-visible .leaf{transform:rotateY(18deg)}
.jp-ct-doors .door:hover .knob,.jp-ct-doors .door:focus-visible .knob{rotate:-50deg}
.jp-ct-doors .door[aria-expanded="true"] .leaf{transform:rotateY(82deg)}
.jp-ct-doors .door:focus-visible{outline:3px solid var(--sun);outline-offset:6px}
.jp-ct-doors .door[aria-expanded="true"] .state::before{background:#3ddc84}
.js-motion .jp-ct-doors .doors .door-wrap{animation:jp-ct-doors-rise .9s var(--spring) both}
.js-motion .jp-ct-doors .doors .door-wrap.t{animation-delay:.15s}
@keyframes jp-ct-doors-rise{from{translate:0 60px;opacity:0}}
.js-motion .jp-ct-doors .door:not([aria-expanded="true"]) .leaf{animation:jp-ct-doors-knock 6s 2.2s var(--out) infinite}
.js-motion .jp-ct-doors .door-wrap.t .door:not([aria-expanded="true"]) .leaf{animation-delay:3.2s}
@keyframes jp-ct-doors-knock{0%,88%,100%{transform:rotateY(0)}92%{transform:rotateY(10deg)}96%{transform:rotateY(3deg)}}
.jp-ct-doors .door:hover .leaf,.jp-ct-doors .door:focus-visible .leaf{animation:none}

/* ---------- rooms: the forms behind the doors ---------- */
.jp-ct-doors .rooms{padding:70px 0 40px;scroll-margin-top:90px}
.jp-ct-doors .pick{text-align:center;font:700 clamp(20px,2.4vw,28px)/1.2 var(--jp-display);color:#6b757c;padding:30px 0 50px}
.jp-ct-doors .pick[hidden]{display:none}
.jp-ct-doors .room{max-width:860px;margin-inline:auto;background:#fff;border:3px solid var(--ink);border-radius:32px;box-shadow:10px 10px 0 var(--ink);padding:clamp(22px,4vw,44px);scroll-margin-top:100px}
.jp-ct-doors .room[hidden]{display:none}
.jp-ct-doors .room.t{box-shadow:10px 10px 0 var(--sun),10px 10px 0 3px var(--ink)}
.jp-ct-doors .room.q{box-shadow:10px 10px 0 var(--blue),10px 10px 0 3px var(--ink)}
.jp-ct-doors .room.in{animation:jp-ct-doors-room .8s var(--spring) both}
@keyframes jp-ct-doors-room{from{translate:0 50px;scale:.94;opacity:0}}
.jp-ct-doors .room-head{display:flex;gap:16px;align-items:center;margin-bottom:26px;flex-wrap:wrap}
.jp-ct-doors .room-head h2{font-size:clamp(32px,4.4vw,56px)}
.jp-ct-doors .room-head h2:focus{outline:none}
.jp-ct-doors .room-head p{flex-basis:100%;color:#3f4a52;font-size:16px}
.jp-ct-doors .row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.jp-ct-doors .field{display:flex;flex-direction:column;gap:6px;margin-bottom:16px;min-width:0}
.jp-ct-doors .field label,.jp-ct-doors legend{font-weight:600;font-size:14px}
.jp-ct-doors .field .opt{font-weight:400;color:#6b757c}
.jp-ct-doors .field input,.jp-ct-doors .field textarea{font:500 16px Poppins,sans-serif;color:var(--ink);background:var(--light);border:3px solid var(--ink);border-radius:14px;padding:12px 14px;width:100%;transition:box-shadow .45s var(--spring),translate .45s var(--spring),background .2s}
.jp-ct-doors .field textarea{min-height:140px;resize:vertical}
.jp-ct-doors .field input:focus,.jp-ct-doors .field textarea:focus{outline:none;background:#fff;box-shadow:4px 4px 0 var(--blue);translate:-2px -2px}
.jp-ct-doors .field input:user-invalid,.jp-ct-doors .field textarea:user-invalid{border-color:#c4302b}
.jp-ct-doors fieldset{border:0;padding:0;margin:0 0 16px;min-width:0}
.jp-ct-doors legend{padding:0;margin-bottom:8px}
.jp-ct-doors .prio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.jp-ct-doors .prio label{position:relative;cursor:pointer}
.jp-ct-doors .prio input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.jp-ct-doors .prio span{display:flex;align-items:center;justify-content:center;gap:8px;text-align:center;font:700 16px/1.1 var(--jp-display);padding:13px 8px;border:3px solid var(--ink);border-radius:14px;background:var(--light);transition:translate .45s var(--spring),box-shadow .45s var(--spring),background .2s,rotate .45s var(--spring)}
.jp-ct-doors .prio span::before{content:"";width:12px;height:12px;border-radius:50%;border:2px solid var(--ink);background:var(--dot);flex-shrink:0}
.jp-ct-doors .prio label:nth-child(1){--dot:#bfe3fa}
.jp-ct-doors .prio label:nth-child(2){--dot:var(--blue)}
.jp-ct-doors .prio label:nth-child(3){--dot:#ff5a4f}
.jp-ct-doors .prio input:checked + span{background:var(--ink);color:#fff;box-shadow:4px 4px 0 var(--dot);translate:-2px -2px;rotate:-1.5deg}
.jp-ct-doors .prio input:focus-visible + span{outline:3px solid var(--sun);outline-offset:3px}
.jp-ct-doors .drop{position:relative;display:flex;align-items:center;gap:14px;border:3px dashed var(--ink);border-radius:16px;background:var(--sky);padding:16px;transition:background .2s,translate .45s var(--spring)}
.jp-ct-doors .drop:focus-within{outline:3px solid var(--sun);outline-offset:3px}
.jp-ct-doors .drop.over{background:#fff;translate:0 -3px}
.jp-ct-doors .drop input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.jp-ct-doors .drop .ic-box{width:48px;height:48px;background:#fff}
.jp-ct-doors .drop .ic-box svg{width:24px;height:24px}
.jp-ct-doors .drop b{display:block;font-size:15px}
.jp-ct-doors .drop small{display:block;color:#3f4a52;font-size:13px;overflow-wrap:anywhere}
.jp-ct-doors .send{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:6px}
.jp-ct-doors .send small{color:#6b757c;font-size:13px}

.jp-ct-doors .ct-hero{color:#fff}
.jp-ct-doors .ct-hero h1{color:#fff}
.jp-ct-doors .ct-hero h1 span{color:var(--sun)}
.jp-ct-doors .rooms{background:var(--light);color:var(--ink)}
.jp-ct-doors .room-head h2{color:var(--ink);margin:0}
.jp-ct-doors .btn{white-space:normal;text-align:left}
.jp-ct-doors .door,.jp-ct-doors .door:hover,.jp-ct-doors .door:focus{margin:0;background:none;box-shadow:none;color:var(--ink);letter-spacing:normal;text-transform:none;white-space:normal}
.jp-ct-doors .ct-notice{margin:0 0 16px;padding:8px 12px;border:2px dashed var(--ink);border-radius:12px;background:var(--sky);font-weight:600;font-size:14px}

/* FillKite form restyled to the design (beats FillKite's own .fk-form:not(#fk) rules) */
.jp-ct-doors .fk-form:not(#fk):not(#jp){--fk-gap:16px;--fk-radius:14px;--fk-accent:var(--blue);--fk-focus:var(--sun);--fk-error:#c4302b;--fk-button-text:var(--ink);--fk-line:var(--ink);--fk-border:var(--ink);--fk-field-bg:var(--light);color:var(--ink);font:500 16px/1.6 Poppins,sans-serif}
.jp-ct-doors .fk-form:not(#fk):not(#jp) .fk-label{font-weight:600;font-size:14px;margin:0 0 6px}
.jp-ct-doors .fk-form:not(#fk):not(#jp) .fk-input{font:500 16px Poppins,sans-serif;color:var(--ink);background:var(--light);border:3px solid var(--ink);border-radius:14px;padding:12px 14px;box-shadow:none;transition:box-shadow .45s var(--spring),transform .45s var(--spring),background .2s}
.jp-ct-doors .fk-form:not(#fk):not(#jp) .fk-input:hover{border-color:var(--ink)}
.jp-ct-doors .fk-form:not(#fk):not(#jp) .fk-input:focus,.jp-ct-doors .fk-form:not(#fk):not(#jp) .fk-input:focus-visible{outline:none;border-color:var(--ink);background:#fff;box-shadow:4px 4px 0 var(--blue);transform:translate(-2px,-2px)}
.jp-ct-doors .fk-form:not(#fk):not(#jp) .fk-input[aria-invalid=true]{border-color:#c4302b}
.jp-ct-doors .fk-form:not(#fk):not(#jp) textarea.fk-input{min-height:140px;resize:vertical}
.jp-ct-doors .fk-form:not(#fk):not(#jp) .fk-choice input[type=checkbox],.jp-ct-doors .fk-form:not(#fk):not(#jp) .fk-choice input[type=radio]{border:2px solid var(--ink)}
.jp-ct-doors .fk-form:not(#fk):not(#jp) .fk-help{color:#3f4a52}
.jp-ct-doors .fk-form:not(#fk):not(#jp) .fk-actions{margin-top:18px}
.jp-ct-doors .fk-form:not(#fk):not(#jp) .fk-submit,.jp-ct-doors .fk-form:not(#fk):not(#jp) .fk-submit:focus{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:0;padding:15px 26px;border-radius:16px;font:600 16px/1 Poppins,sans-serif;letter-spacing:normal;text-transform:none;white-space:normal;border:3px solid var(--ink);background:var(--sun);color:var(--ink);box-shadow:var(--hard);filter:none;text-shadow:none;cursor:pointer;transition:transform .45s var(--spring),box-shadow .45s var(--spring),background .2s}
.jp-ct-doors .room.q .fk-form:not(#fk):not(#jp) .fk-submit{background:var(--blue)}
.jp-ct-doors .fk-form:not(#fk):not(#jp) .fk-submit:hover:not(:disabled){transform:translate(-3px,-3px) rotate(-1.5deg);box-shadow:7px 7px 0 var(--ink);color:var(--ink);filter:none}
.jp-ct-doors .fk-form:not(#fk):not(#jp) .fk-submit:active:not(:disabled){transform:translate(4px,4px);box-shadow:0 0 0 var(--ink);transition-duration:.08s}
.jp-ct-doors .fk-form:not(#fk):not(#jp) .fk-submit:focus-visible{outline:3px solid var(--sun);outline-offset:3px}
.jp-ct-doors .fk-form:not(#fk):not(#jp) .fk-status--success{border:3px solid var(--ink);border-radius:18px;background:var(--sky);box-shadow:4px 4px 0 var(--ink);font-weight:600;text-align:center;padding:20px}

@media (max-width:560px){
  .jp-ct-doors .ct-hero{padding:124px 0 80px}
  .jp-ct-doors .row{grid-template-columns:minmax(0,1fr)}
  .jp-ct-doors .panels{display:none}
  .jp-ct-doors .face{justify-content:flex-start;gap:10px}
  .jp-ct-doors .face .sub{display:none}
  .jp-ct-doors .inside .toy{width:56%}
  .jp-ct-doors .prio span{font-size:14px;padding:12px 4px}
  .jp-ct-doors .num{display:none}
}
@media (prefers-reduced-motion:reduce){
  .jp-ct-doors .fk-form:not(#fk):not(#jp) .fk-input,.jp-ct-doors .fk-form:not(#fk):not(#jp) .fk-submit{transition:none}
}