:root{
  --field:#20402C;
  --field-2:#1A3624;
  --moss:#3C6B47;
  --harvest:#E6A532;
  --harvest-deep:#C9852A;
  --paper:#E8EBDF;
  --paper-2:#DDE1D1;
  --card:#FCFBF6;
  --ink:#1A2A1F;
  --ink-soft:#5C6B5A;
  --stitch:#C7C0A8;
  --line:#E1DDCD;
  --danger:#B4472B;
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  font-family:"Work Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color:var(--ink);
  background:radial-gradient(125% 80% at 50% -8%, var(--paper) 0%, var(--paper-2) 68%, #D4D8C7 100%);
  background-attachment:fixed;
  min-height:100dvh;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  padding:22px 15px calc(40px + env(safe-area-inset-bottom));
  display:flex; justify-content:center;
}
.uf-shell{width:100%; max-width:520px;}

.uf-card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:24px;
  box-shadow:0 14px 36px rgba(32,64,44,.12), 0 2px 8px rgba(32,64,44,.06);
  overflow:hidden;
  animation:ufrise .5s cubic-bezier(.2,.7,.2,1) both;
}
@keyframes ufrise{from{opacity:0; transform:translateY(14px)} to{opacity:1; transform:none}}

/* header — workshirt yoke */
.uf-head{
  position:relative;
  background:linear-gradient(180deg, var(--field) 0%, var(--field-2) 100%);
  color:#F2F4E9;
  padding:26px 24px 30px;
}
.uf-head::after{
  content:""; position:absolute; left:18px; right:18px; bottom:13px;
  border-top:2px dashed rgba(230,165,50,.55);
}
.uf-kicker{
  margin:0 0 9px; font-size:11.5px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--harvest); font-weight:600; display:flex; align-items:center; gap:9px;
}
.uf-dot{width:7px; height:7px; border-radius:50%; background:var(--harvest); display:inline-block;}
.uf-title{
  margin:0; font-family:"Bricolage Grotesque","Work Sans",sans-serif; font-weight:800;
  font-size:31px; line-height:1.03; letter-spacing:-.015em;
}
.uf-sub{margin:7px 0 0; font-style:italic; color:#C7D1BD; font-size:14.5px;}

.uf-body{padding:24px 20px 26px;}

/* name patch — signature */
.uf-patch-wrap{display:flex; justify-content:center; margin:2px 0 22px;}
.uf-patch{
  position:relative; width:100%; max-width:330px; text-align:center;
  background:#FFFDF6; border:2px solid var(--field); border-radius:999px;
  padding:13px 26px 15px;
  box-shadow:0 6px 0 rgba(32,64,44,.10), 0 12px 24px rgba(32,64,44,.12);
}
.uf-patch::before{
  content:""; position:absolute; inset:5px; border-radius:999px;
  border:1.5px dashed var(--harvest); pointer-events:none;
}
.uf-patch-label{font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--moss); font-weight:600;}
.uf-patch-label i{font-style:italic; color:var(--ink-soft); text-transform:none; letter-spacing:.02em;}
.uf-patch input{
  width:100%; border:0; background:transparent; text-align:center; outline:none;
  font-family:"Bricolage Grotesque","Work Sans",sans-serif; font-weight:700; font-size:22px;
  color:var(--field); margin-top:3px; border-bottom:2px solid transparent;
}
.uf-patch input::placeholder{color:#AAB4A1; font-weight:600;}
.uf-patch input:focus{border-bottom-color:var(--harvest);}
.uf-patch.is-bad{border-color:var(--danger);}

/* question block */
.uf-q{padding:18px 2px;}
.uf-q + .uf-q{border-top:2px dashed var(--stitch);}
.uf-qhead{display:flex; gap:11px; align-items:flex-start; margin-bottom:13px;}
.uf-num{
  flex:0 0 auto; width:27px; height:27px; margin-top:1px; border-radius:8px;
  background:var(--field); color:#F2F4E9; font-weight:700; font-size:14px;
  font-family:"Bricolage Grotesque","Work Sans",sans-serif; display:grid; place-items:center;
}
.uf-en{font-weight:600; font-size:16.5px; line-height:1.32;}
.uf-es{display:block; margin-top:3px; font-style:italic; color:var(--ink-soft); font-size:14px; line-height:1.32;}

/* toggle */
.uf-toggle{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
.uf-toggle-btn{
  appearance:none; cursor:pointer; font-family:inherit;
  border:2px solid var(--line); background:#fff; color:var(--ink);
  border-radius:14px; padding:13px 10px; min-height:56px; font-size:16.5px; font-weight:600;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:0;
  transition:transform .12s ease, background .12s ease, border-color .12s ease, box-shadow .12s ease;
}
.uf-toggle-btn small{font-style:italic; font-weight:500; color:var(--ink-soft); font-size:12.5px;}
.uf-toggle-btn:active{transform:translateY(1px);}
.uf-toggle-btn[aria-pressed="true"]{
  border-color:var(--field); background:var(--field); color:#fff;
  box-shadow:0 6px 16px rgba(32,64,44,.22);
}
.uf-toggle-btn[aria-pressed="true"] small{color:#CDE0CC;}
.uf-q.is-bad .uf-toggle-btn{border-color:var(--danger);}

/* conditional reveal */
.uf-cond{display:grid; grid-template-rows:0fr; opacity:0;
  transition:grid-template-rows .35s ease, opacity .3s ease;}
.uf-cond.is-open{grid-template-rows:1fr; opacity:1;}
.uf-cond-inner{overflow:hidden;}
.uf-cond-card{
  margin-top:14px; background:#F4F6EC; border:1.5px dashed var(--moss);
  border-radius:14px; padding:4px 14px 12px;
}

.uf-subq{padding:11px 0;}
.uf-subq + .uf-subq{border-top:1px dashed rgba(60,107,71,.45); margin-top:2px; padding-top:14px;}
.uf-subq-title{font-weight:600; font-size:15.5px; color:var(--field);}
.uf-subq-title i{display:block; margin-top:2px; font-style:italic; font-weight:500; color:var(--ink-soft); font-size:13px;}
.uf-subq-title b{font-family:"Bricolage Grotesque","Work Sans",sans-serif; color:var(--moss); margin-right:5px;}

.uf-row{padding:9px 0 3px;}
.uf-rlabel{display:flex; align-items:center; gap:8px; font-weight:600; font-size:15px; margin-bottom:8px;}
.uf-rlabel svg{width:21px; height:21px; color:var(--moss); flex:0 0 auto;}
.uf-rlabel small{font-style:italic; font-weight:500; color:var(--ink-soft);}

/* stepper */
.uf-stepper{display:inline-grid; grid-template-columns:48px 66px 48px; align-items:center;}
.uf-step{
  appearance:none; cursor:pointer; height:48px; border:2px solid var(--line); background:#fff;
  font-size:23px; font-weight:700; color:var(--field); display:grid; place-items:center;
}
.uf-step:first-child{border-radius:12px 0 0 12px;}
.uf-step:last-child{border-radius:0 12px 12px 0;}
.uf-step:active{background:#EFF2E7;}
.uf-numinput{
  height:48px; width:66px; text-align:center; border:2px solid var(--line); border-left:0; border-right:0;
  font-family:"Bricolage Grotesque","Work Sans",sans-serif; font-weight:700; font-size:18px; color:var(--ink);
  -moz-appearance:textfield;
}
.uf-numinput::-webkit-outer-spin-button,.uf-numinput::-webkit-inner-spin-button{-webkit-appearance:none; margin:0;}

/* text + textarea */
.uf-text,.uf-area{
  width:100%; font-family:inherit; font-size:16px; color:var(--ink);
  border:2px solid var(--line); border-radius:12px; padding:13px 14px; background:#fff;
}
.uf-area{min-height:96px; resize:vertical; line-height:1.45;}
.uf-size-grid{display:grid; grid-template-columns:1fr 1fr; gap:12px;}

.uf-text:focus,.uf-area:focus,.uf-toggle-btn:focus-visible,.uf-step:focus-visible,.uf-submit:focus-visible{
  outline:none; border-color:var(--harvest); box-shadow:0 0 0 3px rgba(230,165,50,.32);
}

/* submit */
.uf-submit{
  margin-top:24px; width:100%; cursor:pointer; border:0; border-radius:16px; padding:18px;
  font-family:"Bricolage Grotesque","Work Sans",sans-serif; font-size:18px; font-weight:700; color:#1A2A1F;
  background:linear-gradient(180deg, var(--harvest), var(--harvest-deep));
  box-shadow:0 10px 22px rgba(201,133,42,.34);
  display:flex; align-items:center; justify-content:center; gap:8px;
  transition:transform .12s ease, box-shadow .12s ease;
}
.uf-submit small{font-weight:600; font-style:italic; opacity:.82; font-size:13px;}
.uf-submit:active{transform:translateY(1px); box-shadow:0 6px 14px rgba(201,133,42,.34);}
.uf-foot{text-align:center; color:var(--ink-soft); font-size:12.5px; margin:15px 4px 0; line-height:1.5;}

/* messages */
.uf-err{display:none; color:var(--danger); font-weight:600; font-size:13.5px; margin-top:8px;}
.uf-q.is-bad .uf-err{display:block;}
.uf-banner{
  display:none; background:#FBE7E1; color:var(--danger); border:1.5px solid #E7B7A6;
  border-radius:12px; padding:12px 14px; font-size:14px; font-weight:600; margin-bottom:16px;
}
.uf-banner.show{display:block;}

/* thank-you */
.uf-thanks{text-align:center; padding:34px 12px 24px; animation:ufrise .45s ease both;}
.uf-check{width:76px; height:76px; border-radius:50%; background:var(--field); display:grid; place-items:center;
  margin:0 auto 18px; box-shadow:0 10px 24px rgba(32,64,44,.26);}
.uf-check svg{width:38px; height:38px; color:var(--harvest);}
.uf-thanks h2{margin:0 0 8px; font-family:"Bricolage Grotesque","Work Sans",sans-serif; font-size:27px; color:var(--ink);}
.uf-thanks p{margin:5px 0; color:var(--ink-soft); font-size:15px;}
.uf-thanks p.es{font-style:italic;}

@media (prefers-reduced-motion:reduce){ *{animation:none!important; transition:none!important;} }
@media (max-width:380px){
  .uf-title{font-size:27px;}
  .uf-body{padding:22px 16px 24px;}
  .uf-stepper{grid-template-columns:44px 58px 44px;}
}