@font-face{font-family:'Liebling';src:url('../fonts/Liebling_Regular.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Liebling';src:url('../fonts/Liebling_Medium.otf') format('opentype');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Liebling';src:url('../fonts/Liebling_Bold.otf') format('opentype');font-weight:700;font-style:normal;font-display:swap}





:root{
  --teal:#0D565E;--teal-dark:#084345;--teal-accent:#01C8BD;
  --blue:#076DF2;--purple:#7614D9;--lime:#B0F300;--lime-dark:#5FB800;
  --g900:#111827;--g700:#374151;--g600:#4B5563;--g500:#6B7280;--g400:#9CA3AF;
  --g300:#D1D5DB;--g200:#E5E7EB;--g100:#F3F4F6;--g50:#F9FAFB;--white:#fff;
  --mint:#E5F2FA;--danger:#DC2626;
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Liebling',-apple-system,sans-serif;background:#dfe7e8;color:var(--g900);line-height:1.55;
  min-height:100vh;display:flex;align-items:flex-start;justify-content:center;padding:32px 16px}
.card{width:100%;max-width:560px;background:var(--white);border-radius:18px;padding:34px 40px 26px;
  box-shadow:0 18px 50px rgba(13,86,94,.10);position:relative;min-height:0;display:flex;flex-direction:column}
.head{text-align:center;margin-bottom:22px}
.logo{height:46px;width:auto;display:inline-block}
@media(max-width:520px){.logo{height:40px}}
.progress{margin-bottom:4px}
.ptop{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:7px}
.psec{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-accent);font-weight:500}
.pcount{font-size:11px;color:var(--g400);font-weight:500}
.ptrack{height:4px;border-radius:3px;background:var(--g200);overflow:hidden}
.pfill{height:100%;background:var(--teal-accent);border-radius:3px;width:0;transition:width .35s cubic-bezier(.3,.8,.3,1)}
.step{padding-top:22px;flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
.step.step--compact{flex:0 0 auto;padding-top:18px}
.step.step--compact + .errmsg + .nav,.step.step--compact ~ .nav{margin-top:20px}
.card:has(.step--compact){min-height:0}
.step .choices,.step .fields{flex:0 0 auto}
.step.enter{animation:slide .3s cubic-bezier(.2,.7,.3,1)}
@keyframes slide{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}
.s-title{font-size:20px;font-weight:700;color:var(--teal);line-height:1.25}
.s-sub{font-size:13px;color:var(--g500);margin-top:5px}
.eta{display:inline-block;font-size:11px;color:var(--g400);margin-top:10px;border:1px solid var(--g200);border-radius:20px;padding:3px 11px}
.choices{display:flex;flex-direction:column;gap:14px;margin-top:18px;flex:0 0 auto}
.choices.flash{animation:shake .4s}
@keyframes shake{0%,100%{transform:none}20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}
.opt{border:1.4px solid var(--g200);border-radius:13px;padding:20px 18px;cursor:pointer;height:auto;min-height:0;
  display:flex;align-items:flex-start;gap:13px;transition:border-color .15s,background .15s;background:var(--white);flex:0 0 auto}
.opt .dot{flex:none;width:19px;height:19px;border-radius:50%;border:1.8px solid var(--g300);margin-top:1px;transition:all .15s;position:relative}
.opt .opt-copy{flex:1;min-width:0;min-height:0}
.opt .opt-copy--desc{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:12px;row-gap:4px}
.opt .ot{font-size:15px;font-weight:500;color:var(--g700)}
.opt-copy--desc .ot{font-weight:700;color:var(--g900)}
.opt .od{font-size:12.5px;color:var(--g500);line-height:1.45;min-width:0}
.choices:not(.choices--intencion) .od{flex:1 1 12rem}
@media(hover:hover){.opt:hover{border-color:var(--teal-accent)}}
.opt.selected{border-color:var(--teal);background:var(--mint)}
.opt.selected .dot{border-color:var(--teal);background:var(--teal)}
.opt.selected .dot:after{content:"";position:absolute;inset:4px;background:#fff;border-radius:50%}
.opt.selected .ot{color:var(--teal-dark)}
.fields{margin-top:22px}
.field{margin-bottom:18px}
.field label{display:block;font-size:12.5px;color:var(--g600);font-weight:500;margin-bottom:6px}
.field label .req{color:var(--teal-accent)}
.field input,.field select{width:100%;border:none;border-bottom:1.4px solid var(--g200);background:transparent;
  font-family:inherit;font-size:16px;color:var(--g900);padding:8px 2px;transition:border-color .15s}
.field input::placeholder{color:var(--g400);font-weight:400}
.field input:focus,.field select:focus{outline:none;border-bottom-color:var(--teal-accent)}
.field.err input,.field.err select{border-bottom-color:var(--danger)}
.field select{cursor:pointer}
.field .hint{font-size:11.5px;color:var(--g400);margin-top:5px;line-height:1.4}
.field .ferr{font-size:11.5px;color:var(--danger);margin-top:5px;min-height:0;display:none}
.field.err .ferr{display:block}
.row{display:flex;gap:16px}
.row .field{flex:1}.row .field.sm{flex:.55}
.errmsg{font-size:12.5px;color:var(--danger);margin-top:8px;display:none}
.errmsg.show{display:block}
.nav{display:flex;justify-content:space-between;align-items:center;margin-top:24px;gap:14px}
.btn{font-family:inherit;font-size:15px;font-weight:500;border-radius:30px;padding:13px 26px;cursor:pointer;border:none;transition:opacity .15s,transform .1s}
.btn:active{transform:scale(.98)}
.btn.primary{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;text-align:center;background:var(--teal);color:var(--white);flex:1;font-weight:600;border-radius:8px}
.btn.primary:disabled{opacity:.45;cursor:not-allowed;transform:none}
.nav.nav--solo{display:grid;grid-template-columns:minmax(0,1fr);justify-items:center}
.nav.nav--solo .btn.primary{flex:none;width:min(100%,320px);max-width:320px;margin:0 auto}
.choices--intencion{gap:12px;margin-top:16px}
.choices--intencion .opt{display:grid;grid-template-columns:19px minmax(0,1fr);gap:12px;align-items:start;padding:18px 16px;height:auto;min-height:0}
.choices--intencion .opt .dot{margin-top:2px}
.choices--intencion .opt-copy{flex:none;display:block;min-height:0;height:auto}
.choices--intencion .opt-copy--desc{display:block;height:auto;flex:none}
.choices--intencion .od{display:block;margin-top:4px;flex:none;height:auto}
.progress.is-single-step .ptrack{opacity:.35}
@media(hover:hover){.btn.primary:hover{background:var(--teal-dark);opacity:1}.btn.primary:disabled:hover{background:var(--teal);opacity:.45}.btn.ghost:hover{color:var(--g700)}}
.btn.ghost{background:transparent;color:var(--g500)}
.btn.ghost.hide{display:none}
.legal{text-align:center;font-size:10.5px;color:var(--g400);margin-top:16px}
.legal a{color:var(--teal);text-decoration:underline}
.legal a:hover{color:var(--teal-dark)}
.confirm-msg{margin-top:28px;text-align:center;padding:32px 24px;background:var(--mint);border-radius:16px;border:1px solid rgba(1,200,189,.22)}
.confirm-icon{width:56px;height:56px;margin:0 auto;border-radius:50%;background:var(--teal-accent);color:#053b3a;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:700;line-height:1}
.r-head{display:flex;align-items:center;gap:10px;margin-bottom:4px}
.r-check{width:24px;height:24px;border-radius:50%;background:var(--teal-accent);color:#053b3a;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700}
.r-badges{display:flex;gap:12px;margin:20px 0}
.badge{flex:1;border-radius:14px;padding:15px 16px;border-left:4px solid}
.badge .bl{font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:500;opacity:.85}
.badge .bt{font-size:17px;font-weight:700;margin-top:4px;line-height:1.15}
.internal{background:var(--g50);border:1px solid var(--g100);border-radius:14px;padding:16px 18px}
.internal .it{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--g400);font-weight:500;margin-bottom:12px}
.recap{display:flex;flex-direction:column;gap:8px}
.rr{display:flex;justify-content:space-between;gap:14px;font-size:13px;border-bottom:1px dashed var(--g200);padding-bottom:7px}
.rr:last-child{border-bottom:none}
.rr .k{color:var(--g500)}.rr .v{color:var(--g900);font-weight:500;text-align:right}
.note{font-size:11.5px;color:var(--g400);margin-top:14px;line-height:1.5}
.done{padding-top:6px}
.done-icon{display:flex;justify-content:center;margin-bottom:14px}
.done-title{font-size:22px;font-weight:700;color:var(--teal);text-align:center;line-height:1.2}
.done-lead{font-size:14px;color:var(--g600);text-align:center;margin-top:6px;margin-bottom:24px;line-height:1.5}
.done-steps{display:flex;flex-direction:column;gap:14px;background:var(--g50);border-radius:14px;padding:18px 18px}
.ds-row{display:flex;gap:13px;align-items:flex-start}
.ds-num{flex:none;width:24px;height:24px;border-radius:50%;background:var(--teal-accent);color:#053b3a;display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:700;margin-top:1px}
.ds-t{font-size:14px;font-weight:600;color:var(--g900);line-height:1.3}
.ds-d{font-size:12.5px;color:var(--g500);margin-top:2px;line-height:1.5}
.done-note{font-size:12px;color:var(--g500);text-align:center;margin-top:18px;line-height:1.55}
.done-note strong{color:var(--teal);font-weight:600}
.done-social{margin-top:22px;text-align:center;padding:18px 16px;border-top:1px dashed var(--g200)}
.ds-title{font-size:14px;font-weight:700;color:var(--teal)}
.ds-sub{font-size:12px;color:var(--g500);margin-top:3px;margin-bottom:14px;line-height:1.5}
.ds-links{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.ds-link{display:inline-flex;align-items:center;gap:7px;border:1.4px solid var(--g200);border-radius:24px;padding:8px 14px;font-size:13px;font-weight:500;color:var(--teal);text-decoration:none;transition:all .15s;background:var(--white)}
.ds-link svg{flex:none}
@media(hover:hover){.ds-link:hover{border-color:var(--teal-accent);background:var(--mint);color:var(--teal-dark)}}
@media(max-width:520px){
  body{padding:0;padding-bottom:env(safe-area-inset-bottom,0);background:var(--white)}
  .card{max-width:none;min-height:100dvh;border-radius:0;box-shadow:none;padding:26px 20px 22px;padding-bottom:calc(22px + env(safe-area-inset-bottom,0))}
  .card:has(.step--compact){min-height:0}
  .head{margin-bottom:18px}
  .r-badges{flex-direction:column;gap:10px}
  .row{flex-direction:column;gap:0}
  .row .field.sm{flex:1}
  .opt .opt-copy--desc{flex-direction:column;align-items:flex-start;column-gap:0;row-gap:4px}
  #nav{position:sticky;bottom:0;margin-top:auto;padding-top:16px;padding-bottom:env(safe-area-inset-bottom,0);background:var(--white);border-top:1px solid var(--g100);margin-left:-20px;margin-right:-20px;padding-left:20px;padding-right:20px;z-index:2}
  .card:has(.step--compact) #nav{margin-top:20px;position:static;border-top:none;margin-left:0;margin-right:0;padding-left:0;padding-right:0}
  .nav.nav--solo{display:grid;justify-items:center}
  .nav.nav--solo .btn.primary{width:min(100%,320px)}
}
