@font-face{font-family:Bricolage;src:url(/assets/fonts/bricolage-grotesque-latin-wght-normal.woff2) format("woff2");font-weight:200 800;font-display:swap}
@font-face{font-family:Figtree;src:url(/assets/fonts/figtree-latin-wght-normal.woff2) format("woff2");font-weight:300 900;font-display:swap}
:root{--ink:#10241c;--muted:#5a6d64;--em:#0f5b43;--em-d:#0a3f2f;--mint:#eef6f1;--line:#d6e5dc;--pink:#d32263;--pink-d:#a8174d;--white:#fff;--r:18px;
  --head:Bricolage,"Trebuchet MS",system-ui,sans-serif;--body:Figtree,system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;font:400 16px/1.55 var(--body);color:var(--ink);background:var(--mint);min-height:100dvh}
.shell{display:grid;grid-template-columns:minmax(0,46fr) minmax(0,54fr);min-height:100dvh}
.hero{position:sticky;top:0;height:100dvh;overflow:hidden;color:#fff;background:var(--em-d)}
.hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:46% 40%;transform:scale(1.06);animation:settle 1.6s cubic-bezier(.2,.7,.2,1) forwards}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,63,47,.15) 0%,rgba(10,63,47,.1) 35%,rgba(7,38,28,.92) 100%)}
.badge{position:absolute;top:clamp(16px,3vw,32px);left:clamp(16px,3vw,32px);background:#fff;border-radius:14px;padding:10px 16px;box-shadow:0 10px 30px rgba(0,0,0,.22)}
.badge img{display:block;height:clamp(40px,5vw,58px);width:auto}
.hero-copy{position:absolute;left:clamp(20px,3.4vw,44px);right:clamp(20px,3.4vw,44px);bottom:clamp(24px,4vw,48px);max-width:30rem}
.kicker{margin:0 0 10px;font-weight:700;color:#ffd3e3;letter-spacing:.01em}
.hero h1{margin:0 0 12px;font:800 clamp(2rem,3.6vw,3.3rem)/1.02 var(--head);letter-spacing:-.03em;text-wrap:balance}
.hero-copy p:last-child{margin:0;opacity:.92;max-width:26rem}
.big-wheel{position:absolute;right:-90px;bottom:-90px;width:min(52%,300px);opacity:.7;filter:drop-shadow(0 6px 24px rgba(0,0,0,.25))}
.big-wheel *{fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round}
.w-ring,.w-hub,.spoke{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.4s .25s cubic-bezier(.6,0,.2,1) forwards}
.spoke{stroke:var(--pink);stroke-width:7;stroke-dasharray:1;animation-delay:calc(.5s + var(--i)*.12s)}
.wheel-spin{transform-origin:0 0;animation:turn 2.2s .9s cubic-bezier(.3,.9,.2,1) both}
@keyframes draw{to{stroke-dashoffset:0}}@keyframes turn{from{transform:rotate(-120deg)}to{transform:rotate(0)}}@keyframes settle{to{transform:scale(1)}}
.panel{padding:clamp(22px,4vw,56px);max-width:700px;width:100%;margin:0 auto;display:flex;flex-direction:column;min-height:100dvh}
.progress{height:8px;border-radius:99px;background:var(--line);overflow:hidden}
.progress i{display:block;height:100%;width:25%;background:linear-gradient(90deg,var(--em),var(--pink));border-radius:99px;transition:width .6s cubic-bezier(.3,.9,.2,1)}
.stepno{margin:12px 0 22px;color:var(--muted);font-weight:600;font-size:.92rem}
form{flex:1}fieldset.step{display:none;border:0;margin:0;padding:0;min-width:0}
fieldset.is-on{display:block;animation:rise .55s cubic-bezier(.2,.8,.2,1)}
@keyframes rise{from{opacity:0;transform:translateX(26px)}to{opacity:1;transform:none}}
legend{font:800 clamp(1.7rem,3vw,2.35rem)/1.05 var(--head);letter-spacing:-.025em;margin-bottom:18px;padding:0;text-wrap:balance}
.hint{margin:16px 0 10px;color:var(--muted)}
.field{display:block;font-weight:700;font-size:.94rem;margin:16px 0}
.field input,.field select,.field textarea{display:block;width:100%;margin-top:7px;padding:13px 15px;font:500 1rem var(--body);color:var(--ink);background:#fff;border:2px solid var(--line);border-radius:14px;transition:border-color .2s,box-shadow .2s;appearance:none}
.field select{background-image:linear-gradient(45deg,transparent 50%,var(--em) 50%),linear-gradient(135deg,var(--em) 50%,transparent 50%);background-position:calc(100% - 20px) 55%,calc(100% - 14px) 55%;background-size:6px 6px;background-repeat:no-repeat}
.field textarea{resize:vertical;min-height:110px}
:is(input,select,textarea,button):focus-visible,.bead:focus-visible{outline:3px solid var(--pink);outline-offset:2px}
.field :is(input,select,textarea):focus{border-color:var(--em);box-shadow:0 0 0 4px rgba(15,91,67,.12)}
.count{float:right;font-weight:500;color:var(--muted);font-size:.8rem}.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.trap{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.switch{display:flex;gap:14px;align-items:center;background:#fff;border:2px solid var(--line);padding:14px 16px;border-radius:16px;cursor:pointer}
.switch input{position:absolute;opacity:0}.switch small{display:block;color:var(--muted)}
.knob{flex:none;width:52px;height:30px;border-radius:99px;background:#c9d6cf;position:relative;transition:background .3s}
.knob::after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.25);transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.switch input:checked+.knob{background:var(--em)}.switch input:checked+.knob::after{transform:translateX(22px)}
.switch input:focus-visible+.knob{outline:3px solid var(--pink);outline-offset:2px}
.scale{display:grid;grid-template-columns:repeat(10,1fr);gap:6px}
.scale button{aspect-ratio:1;border:2px solid var(--line);background:#fff;border-radius:50%;font:700 .95rem var(--head);color:var(--em-d);cursor:pointer;transition:transform .25s cubic-bezier(.3,1.6,.5,1),background .2s,color .2s,border-color .2s;padding:0}
.scale button:hover{transform:translateY(-3px)}
.scale button.on{background:var(--em);border-color:var(--em);color:#fff;transform:scale(1.1)}
.scale button.peak{background:var(--pink);border-color:var(--pink)}
.scale-label{min-height:1.6em;margin:10px 0 0;font:700 1.05rem var(--head);color:var(--em)}
.wheel-wrap{max-width:520px;margin:0 auto}#rate{width:100%;height:auto;display:block;touch-action:manipulation}
#rate .ring{fill:none;stroke:var(--line);stroke-width:1.5}#rate .sp{stroke:#c7d8ce;stroke-width:3;stroke-linecap:round}
#rate .shape{fill:rgba(211,34,99,.2);stroke:var(--pink);stroke-width:4;stroke-linejoin:round;transition:all .45s cubic-bezier(.3,.9,.2,1)}
#rate .lab{font:700 27px var(--body);fill:var(--em-d)}
#rate .bead{fill:#fff;stroke:#b9cdc1;stroke-width:3;cursor:pointer;transition:fill .2s,stroke .2s,r .25s cubic-bezier(.3,1.8,.5,1)}
#rate .bead:hover{stroke:var(--pink)}#rate .bead.on{fill:var(--pink);stroke:var(--pink)}#rate .bead.cur{r:19}
.chips{display:flex;flex-wrap:wrap;gap:9px}
.chip,.pill{border:2px solid var(--line);background:#fff;border-radius:99px;padding:10px 16px;font:600 .95rem var(--body);color:var(--ink);cursor:pointer;transition:transform .25s cubic-bezier(.3,1.6,.5,1),background .2s,border-color .2s,color .2s}
.chip:hover,.pill:hover{transform:translateY(-2px)}
.chip[aria-pressed=true],.pill[aria-checked=true]{background:var(--em);border-color:var(--em);color:#fff}
.yn{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:8px}.yn span{font-weight:700;margin-right:6px}
.nav{display:flex;gap:12px;justify-content:space-between;margin-top:26px}
.btn{margin-left:auto;border:0;border-radius:99px;padding:15px 34px;font:700 1.02rem var(--head);color:#fff;background:var(--pink);cursor:pointer;box-shadow:0 10px 24px rgba(211,34,99,.3);transition:transform .25s cubic-bezier(.3,1.6,.5,1),background .2s}
.btn:hover{background:var(--pink-d);transform:translateY(-2px)}.btn:disabled{opacity:.6;cursor:wait}
.btn.ghost{margin:0;background:transparent;color:var(--em);box-shadow:none;border:2px solid var(--line)}
.error{min-height:1.4em;color:#b3123f;font-weight:600;margin:12px 0 0}
.done{text-align:center;padding:40px 0;animation:rise .7s both}.done svg{width:150px}.done h2{font:800 2rem/1.1 var(--head);margin:18px 0 8px;letter-spacing:-.02em}
.done p{color:var(--muted);max-width:26rem;margin:auto}.d-ring{fill:none;stroke:var(--em);stroke-width:3}.dsp{stroke:var(--pink);stroke-width:5;stroke-linecap:round}
.done-wheel{transform-origin:0 0;animation:turn 1.6s cubic-bezier(.3,.9,.2,1) both}
footer{margin-top:28px;color:var(--muted);font-size:.82rem}
[hidden]{display:none!important}
@media (max-width:899px){
  .shell{display:block}.hero{position:relative;height:min(62vw,340px)}.big-wheel{display:none}.hero-copy{bottom:16px}.hero h1{font-size:1.65rem;margin:0}.hero-copy p{display:none}.kicker{margin-bottom:4px;font-size:.85rem}
  .panel{min-height:0;padding:22px 18px 36px}.two{grid-template-columns:1fr}.scale{gap:4px}.btn{padding:15px 28px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important}.w-ring,.w-hub,.spoke{stroke-dashoffset:0}}
.role{display:flex;gap:10px;margin:2px 0 6px}.role .pill{flex:1;padding:15px 10px;font-size:1rem}
.ts{margin:20px 0 0;min-height:65px}