/* Bitachon Challenge raffle claim page. Follows the Bitachon BRAND.md (ink + orange, Bricolage/DM Sans/Caveat,
   orange highlighter, flat ink buttons, no gradients/glows on buttons). Self-contained: does not use styles.css. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#FFFCF6;font-family:'DM Sans',system-ui,sans-serif;color:#4A4458;font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:#3C1454}a:hover{color:#7B45A0}

.bc-wrap{position:relative;min-height:100vh;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:28px 20px 36px;background:linear-gradient(135deg,#F7EEFF 0%,#FFF0D0 50%,#FFF3D9 100%)}
.bc-logo{display:block;margin:0 auto 22px;position:relative;z-index:1}
.bc-logo img{display:block;height:62px;width:auto;mix-blend-mode:multiply}

#confetti{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:3}
.bc-flash{position:fixed;inset:0;z-index:2;pointer-events:none;opacity:0;
  background:radial-gradient(circle at 50% 40%,rgba(255,255,255,.95),rgba(255,198,107,.4) 40%,rgba(255,255,255,0) 70%)}
.bc-flash.go{animation:bc-flash .7s ease-out}
@keyframes bc-flash{0%{opacity:0}18%{opacity:1}100%{opacity:0}}

.bc-view{position:relative;z-index:1;width:100%;display:flex;flex-direction:column;align-items:center}
.bc-view.is-hidden{display:none}

.hl{background:linear-gradient(transparent 52%,rgba(255,184,102,.6) 52%,rgba(255,184,102,.6) 94%,transparent 94%);padding:0 3px}

/* card */
.bc-card{width:100%;max-width:440px;background:#FFFFFF;border-radius:28px;padding:38px 32px 30px;text-align:center;box-shadow:0 24px 60px rgba(60,20,84,.14)}
.bc-card.success,.bc-card.commentcard{max-width:500px;padding:42px 40px 36px}
.bc-h,.bc-headline{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;color:#3C1454;letter-spacing:-.02em;line-height:1.1;margin:0}
.bc-h{font-size:clamp(1.7rem,4.4vw,2.1rem);margin-bottom:12px}
.bc-headline{font-size:clamp(1.9rem,4.4vw,2.4rem);margin:12px 0 6px}
.bc-sub{color:#4A4458;line-height:1.5;margin:0 0 22px}
.bc-sub.big{font-size:1.1rem;font-weight:500}
.bc-sub-small{color:#6B6478;font-size:.92rem;line-height:1.5;margin:0 auto 22px}
.bc-day{display:inline-block;color:#7B45A0;font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin-bottom:12px}

/* form */
.bc-form{display:flex;flex-direction:column;gap:14px}
.bc-form input[type=email],.bc-form input[type=text]{width:100%;font:inherit;font-size:17px;padding:15px 18px;border:1.5px solid #E7DCEB;border-radius:14px;background:#FFFFFF;color:#3C1454;box-shadow:0 6px 18px rgba(60,20,84,.06)}
.bc-form input:focus{outline:2px solid #FFA327;outline-offset:2px}
.bc-form .btn{width:100%;padding:16px 28px;font-size:19px;margin-top:4px}
.bc-error{color:#B42318;margin:12px 0 0;font-size:.92rem;font-weight:700}
.bc-error[hidden]{display:none}
.bc-fallback{margin:26px 0 0;font-size:.86rem;color:#6B6478}
.bc-fallback a{text-decoration:none;font-weight:700}

/* buttons: flat ink, hand-drawn arrow, no shadows or gradients */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;border:0;cursor:pointer;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;letter-spacing:-.01em;color:#FFFFFF;background:#3C1454;border-radius:14px;transition:background .15s ease}
.btn::after{content:'';width:24px;height:13px;flex:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 16'%3E%3Cpath d='M2 9 C 9 6, 17 7, 25 8' fill='none' stroke='%23FFC66B' stroke-width='2.4' stroke-linecap='round'/%3E%3Cpath d='M20 3 C 23 5, 25 7, 27 8 C 24 10, 22 12, 20 14' fill='none' stroke='%23FFC66B' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center/contain;transition:transform .15s ease}
.btn:hover{color:#FFFFFF;background:#4E1D6C}.btn:hover::after{transform:translateX(4px)}
.btn:disabled{opacity:.6;cursor:default}
.btn-ghost{background:#FFFFFF;color:#3C1454;border:2px solid #3C1454}
.btn-ghost:hover{background:#FFFFFF;color:#7B45A0}
.btn-ghost::after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 16'%3E%3Cpath d='M2 9 C 9 6, 17 7, 25 8' fill='none' stroke='%233C1454' stroke-width='2.4' stroke-linecap='round'/%3E%3Cpath d='M20 3 C 23 5, 25 7, 27 8 C 24 10, 22 12, 20 14' fill='none' stroke='%233C1454' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}

/* success */
.bc-badge{width:68px;height:68px;margin:0 auto;border-radius:50%;background:#FFA327;display:flex;align-items:center;justify-content:center}
.bc-badge svg{width:34px;height:30px}
.bc-help{margin:14px 0 0;font-size:.86rem;color:#6B6478}
.bc-help[hidden]{display:none}
.success.animate{animation:bc-popin .7s cubic-bezier(.18,.9,.3,1.2)}
@keyframes bc-popin{0%{opacity:0;transform:scale(.7) translateY(20px)}60%{transform:scale(1.03)}100%{opacity:1;transform:scale(1)}}
.success.animate .bc-badge{animation:bc-pop 1.1s ease-out .15s both}
@keyframes bc-pop{0%{transform:scale(0) rotate(-30deg)}55%{transform:scale(1.25) rotate(8deg)}100%{transform:scale(1)}}

/* raffle ticket */
.ticket{position:relative;display:flex;align-items:stretch;width:92%;max-width:360px;margin:6px auto 34px;border-radius:14px;
  background:linear-gradient(160deg,#FFC277 0%,#FFA327 100%);box-shadow:0 14px 30px -12px rgba(255,155,61,.6);transform:rotate(-4deg)}
.success.animate .ticket{animation:bc-ticketIn .65s cubic-bezier(.2,.9,.3,1.4) .45s both}
@keyframes bc-ticketIn{0%{opacity:0;transform:scale(.85) rotate(-4deg)}100%{opacity:1;transform:scale(1) rotate(-4deg)}}
.ticket-main{position:relative;flex:1;padding:24px 10px;min-height:148px;display:flex;flex-direction:column;justify-content:center}
.ticket-main::before{content:"";position:absolute;inset:7px;border:1.5px dashed rgba(60,20,84,.35);border-radius:9px}
.tnum{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:4.3rem;line-height:1;color:#3C1454;letter-spacing:-.03em}
.tlabel{font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.14em;color:#6A3A00;margin-top:14px}
.ticket-stub{position:relative;width:70px;flex:none;display:flex;align-items:center;justify-content:center;border-left:2.5px dashed rgba(60,20,84,.45)}
.ticket-stub span{writing-mode:vertical-rl;font-weight:800;font-size:.85rem;letter-spacing:.1em;color:#6A3A00;font-variant-numeric:tabular-nums}
.ticket::before,.ticket::after{content:"";position:absolute;right:67px;width:18px;height:18px;border-radius:50%;background:#FFFFFF;z-index:2}
.ticket::before{top:-9px}.ticket::after{bottom:-9px}

.prize-row{display:flex;align-items:center;gap:16px;text-align:left}
.giftcard{width:78px;height:auto;flex:none;display:block;filter:drop-shadow(0 6px 14px rgba(35,47,62,.3))}
.bc-foot{color:#6B6478;font-size:.92rem;line-height:1.45;margin:0;font-weight:500}
.bc-note{color:#6B6478;font-size:.82rem;font-style:italic;line-height:1.45;margin:14px 0 0;text-align:left}

/* comments */
.commentcard{margin-top:18px;text-align:left}
.commentcard label{display:block;font-size:.9rem;color:#3C1454;margin-bottom:8px;font-weight:700;line-height:1.4}
.commentcard label span{color:#6B6478;font-weight:500}
.commentcard textarea{width:100%;font:inherit;font-size:.98rem;padding:12px 14px;border-radius:14px;border:1.5px solid #E7DCEB;background:#FFFFFF;color:#3C1454;resize:vertical;min-height:76px;margin-bottom:12px}
.commentcard textarea:focus{outline:2px solid #FFA327;outline-offset:2px}
.commentcard .btn{width:100%;padding:13px 20px;font-size:17px}
.comment-status{margin:10px 0 0;text-align:center;font-weight:700;color:#3C1454}
.comment-status[hidden]{display:none}
.thanks-final{padding:30px 12px;text-align:center}
.thanks-final .thanks-check{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:#FFA327;margin-bottom:12px}
.thanks-final .thanks-check svg{width:28px;height:26px}
.thanks-final p{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:1.45rem;color:#3C1454;margin:0;max-width:none}

.bc-share{margin:24px auto 0;max-width:430px;text-align:center;font-size:1rem;line-height:1.55;position:relative;z-index:1}
.bc-share a{font-weight:700}
.bc-partners{margin:28px 0 0;font-size:.82rem;color:#6B6478;text-align:center;position:relative;z-index:1}
.bc-partners a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:rgba(60,20,84,.35)}
.bc-partners a:hover{color:#7B45A0}

@media (max-width:480px){
  .bc-card,.bc-card.success,.bc-card.commentcard{padding:32px 22px 26px}
  .ticket-stub{width:56px}.ticket::before,.ticket::after{right:53px}
  .tnum{font-size:3.6rem}
}
@media (prefers-reduced-motion: reduce){
  .bc-flash,.success.animate,.success.animate .bc-badge,.success.animate .ticket{animation:none !important}
}