/* Twoblinks pudding-pup theme — this file changes the visual style only. */
:root { --butter:#fff0ba; --caramel:#a66532; --cocoa:#60391f; --strawberry:#ef91a3; --vanilla:#fffdf3; --cream-line:#f3ddb0; }
body { background:radial-gradient(circle at 12% 1%,#fff8de 0,transparent 28%),linear-gradient(135deg,#fffdf5 0%,#fff7df 52%,#fff9f1 100%); color:var(--cocoa); }
.booking-shell { width:min(760px,calc(100% - 36px)); padding-top:34px; }
.brand { padding:0 8px; }.brand>span { background:linear-gradient(145deg,#f7ce5e,#d79b4d); box-shadow:0 8px 16px #d5964f55; color:#704022; }.brand strong { color:var(--cocoa); }.brand small { color:#b48d61; }
.language-toggle { margin-left:auto; min-width:48px; border:1px solid #edcf9c; border-radius:999px; padding:7px 10px; background:#fff9e9; color:#9a6034; font-size:12px; font-weight:800; letter-spacing:.4px; }.language-toggle:hover { background:#fff0c6; }
.pudding-hero { position:relative; min-height:300px; overflow:hidden; margin:25px 0 27px; border:1px solid #f0d99e; border-radius:30px; background:radial-gradient(circle at 19% 20%,#fffdf4 0,transparent 32%),linear-gradient(135deg,#fff8dc 0%,#ffe5bf 100%); box-shadow:0 18px 35px #bd895724; }.pudding-hero:before,.pudding-hero:after { content:""; position:absolute; width:150px; height:150px; border:13px solid #fff9e8b8; border-radius:50%; }.pudding-hero:before { top:-86px; left:-70px; }.pudding-hero:after { bottom:-95px; right:-45px; }
.hero { position:relative; z-index:1; width:57%; padding:51px 0 45px 35px; }.hero .eyebrow { color:#b67a51; }.hero h1 { color:var(--cocoa); font-size:clamp(35px,7vw,54px); }.hero em { color:#df7e8e; }.hero>p:last-child { color:#8e6b4b; max-width:280px; }
.mascot-wrap { position:absolute; z-index:1; right:1%; bottom:-14px; width:300px; filter:drop-shadow(0 13px 10px #9b633235); }.mascot-wrap img { display:block; width:100%; height:auto; }.hero-sparkle { position:absolute; z-index:2; color:#e99c69; font-size:24px; }.sparkle-one { top:27px; left:50%; }.sparkle-two { top:81px; right:9%; color:#f18fa2; }.sparkle-three { bottom:21px; left:40%; font-size:17px; }
.booking-card,.success-card { border-color:#f0dfba; background:#fffefa; box-shadow:0 18px 43px #8f673718; }.step-heading>span { background:#fff0c4; color:#a76735; }.step-heading h2,.success-card h2 { color:var(--cocoa); }.step-heading p { color:#9a7859; }.service-option,.slot { border-color:#eddfc1; background:#fffefa; color:var(--cocoa); }.service-option:hover,.service-option.selected,.slot:hover,.slot.selected { border-color:#eba3a9; background:#fff4eb; box-shadow:0 5px 14px #d66e7920; }.service-option span,.hint,.loading { color:#a48668; }.service-option small { color:#d27c67; }.date-row button,.book-button { background:linear-gradient(135deg,#e9939e,#df788b); box-shadow:0 8px 17px #e878973b; }.date-row button:hover,.book-button:hover { background:#ce697d; }label { color:#8a6b4c; }input,textarea { border-color:#eadbc0; background:#fffefa; color:var(--cocoa); }input:focus,textarea:focus { border-color:#e49aa1; box-shadow:0 0 0 3px #fff0e9; }.interac-box { background:#fff5cb; border-color:#f0d889; }.interac-box strong { color:#8d562d; }.interac-box p { color:#85643f; }.success-mark { background:#fff0bf; color:#ce8064; }.secondary-button { border-color:#edcfab; color:#b86d51; background:#fffefa; }footer { color:#ad8a62; }
.policy-card { display:flex; align-items:flex-start; gap:13px; margin:0 0 25px; padding:17px 20px; border:1px solid #f0d99e; border-radius:19px; background:#fff9e8; color:var(--cocoa); }.policy-card h2 { margin:0; font:600 18px "Playfair Display","Noto Sans HK",serif; }.policy-card p:last-child { margin:6px 0 0; color:#896a4d; font-size:12px; line-height:1.7; }.policy-mark { display:grid; flex:0 0 auto; place-items:center; width:31px; height:31px; margin-top:2px; border-radius:50%; background:#ffe5a0; color:#c77867; font-size:18px; }.policy-card .eyebrow { color:#b67a51; margin-bottom:3px; }
@media (max-width:650px) { .booking-shell { width:min(100% - 26px,720px); }.pudding-hero { min-height:395px; margin-top:20px; }.mascot-wrap { width:260px; left:50%; right:auto; top:-17px; bottom:auto; transform:translateX(-50%); }.hero { width:100%; padding:245px 21px 25px; text-align:center; }.hero>p:last-child { margin-left:auto; margin-right:auto; }.hero h1 { font-size:38px; }.sparkle-one { top:29px; left:13%; }.sparkle-two { top:175px; right:13%; }.sparkle-three { bottom:25px; left:13%; }.booking-card,.success-card { border-radius:22px; } }