/* Página de cotización */
body.cotpage{background:var(--paper)}
.hr{display:flex;align-items:center;gap:18px}
.back{color:#cfd4c4;text-decoration:none;font-weight:500;font-size:.95rem}
.back:hover{color:var(--lime)}
.btn.sm{min-height:40px;padding:0 16px;font-size:.92rem}
main{padding:34px 0 80px}
.grid{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:32px;align-items:start}

/* migas */
.crumbs{display:flex;gap:6px;margin-bottom:16px}
.crumbs i{flex:1;height:5px;border-radius:3px;background:var(--line);transition:background .3s}
.crumbs i.on{background:var(--ink)}
.crumbs i.cur{background:var(--lime);box-shadow:0 0 0 1px var(--ink) inset}

/* tarjeta de pregunta */
.qcard{background:#fff;border:1px solid var(--line);border-radius:24px;padding:34px clamp(20px,4vw,40px) 30px;animation:rise .35s ease both}
.qcard:focus{outline:none}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.st{font-size:.85rem;font-weight:600;color:var(--mut);letter-spacing:.06em;text-transform:uppercase}
.qcard h1{font-size:clamp(1.6rem,3.4vw,2.2rem);line-height:1.15;font-weight:800;letter-spacing:-.015em;margin:10px 0 8px}
.hint{color:var(--mut);margin-bottom:22px;font-size:1.04rem;max-width:36em}
.opts{display:grid;gap:10px}
.opt{display:flex;justify-content:space-between;align-items:center;gap:14px;text-align:left;border:1.5px solid var(--line);border-radius:14px;padding:15px 18px;min-height:64px;background:#fff;transition:border-color .15s,background .15s,transform .15s;width:100%}
.opt:hover{border-color:var(--ink)}
.opt:active{transform:scale(.995)}
.opt[aria-pressed=true]{border-color:var(--ink);background:#f1fbd0;box-shadow:inset 0 0 0 1px var(--ink)}
.opt b{display:block;font-weight:600;font-size:1.04rem}
.opt .d{display:block;color:var(--mut);font-size:.92rem;line-height:1.35;margin-top:2px}
.opt .pr{font-weight:700;font-size:.93rem;white-space:nowrap}
.opt .pr.in{color:#2c6b00}
.opt[disabled]{cursor:default}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.grp{font-size:.85rem;font-weight:700;color:var(--mut);margin:26px 0 10px;letter-spacing:.05em;text-transform:uppercase}
.grp:first-of-type{margin-top:0}
.grp small{display:block;text-transform:none;letter-spacing:0;font-weight:400;margin-top:3px;font-size:.92rem}
.sub-opts{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 4px}
.chip{border:1.5px solid var(--line);background:#fff;border-radius:99px;padding:9px 16px;font-weight:600;font-size:.93rem;min-height:44px}
.chip:hover{border-color:var(--ink)}
.chip[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}

/* filas con ayuda (?) */
.mod{position:relative}
.mod .row2{display:flex;gap:8px;align-items:stretch}
.mod .opt{flex:1}
.q{flex:none;width:48px;border:1.5px solid var(--line);border-radius:14px;font-weight:700;font-size:1.05rem;color:var(--mut);background:#fff}
.q:hover,.q[aria-expanded=true]{border-color:var(--ink);color:var(--ink)}
.tip{background:var(--paper);border-radius:12px;padding:12px 16px;margin:8px 0 2px;font-size:.96rem;color:#33372b;animation:rise .25s ease both}
.badge{display:inline-block;background:var(--lime);color:var(--ink);font-size:.72rem;font-weight:700;border-radius:99px;padding:2px 9px;margin-left:8px;vertical-align:middle;letter-spacing:.02em}

/* recomendación */
.rec{border:1.5px dashed #9bc92a;background:#f6fde0;border-radius:16px;padding:16px 18px;margin-bottom:20px}
.rec b{display:block;margin-bottom:4px}
.rec p{color:#3b4630;font-size:.96rem}
.rec .btn{margin-top:12px;min-height:44px;font-size:.95rem}

/* dominio */
.domgrid{display:grid;gap:10px}
.field{display:grid;gap:6px;margin-top:16px}
.field label{font-weight:600;font-size:.95rem}
.field input,.field textarea{font:inherit;border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;min-height:50px;width:100%;background:#fff;resize:vertical}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px rgba(188,253,10,.6)}
.field small{color:var(--mut)}
.err{color:#b3261e;font-size:.92rem;min-height:1.2em;margin-top:6px}

/* navegación de la tarjeta */
.cnav{display:flex;justify-content:space-between;gap:12px;margin-top:30px;padding-top:22px;border-top:1px solid var(--line)}
.cnav .btn{min-width:150px}

/* lateral "Tu web" */
.mine{position:sticky;top:88px;background:#fff;border:1px solid var(--line);border-radius:24px;overflow:hidden}
.mine-h{display:flex;justify-content:space-between;align-items:center;width:100%;padding:18px 22px;border-bottom:1px solid var(--line);text-align:left;cursor:default}
.mine-h .mh-l b{font-size:1.15rem;display:block}
.mine-h small{color:var(--mut);font-size:.88rem}
.mh-r{display:flex;align-items:center;gap:12px;font-weight:800;font-size:1.25rem}
.chev{display:none;width:12px;height:12px;border-right:2.5px solid var(--ink);border-bottom:2.5px solid var(--ink);transform:rotate(45deg);margin-top:-4px;transition:transform .25s}
.mine-b{padding:18px 22px 22px;max-height:calc(100dvh - 190px);overflow-y:auto}
.planbox{background:var(--ink);color:#fff;border-radius:16px;padding:16px 18px;margin-bottom:14px;position:relative;overflow:hidden}
.planbox.pop{animation:pop .6s cubic-bezier(.2,1.4,.3,1)}
@keyframes pop{0%{transform:scale(.96)}50%{transform:scale(1.03)}100%{transform:scale(1)}}
.planbox .pl{font-size:.82rem;color:var(--mut-d);letter-spacing:.05em;text-transform:uppercase}
.planbox .pn{font-size:1.25rem;font-weight:800;margin-top:2px}
.planbox .pp{color:var(--lime);font-weight:700;margin-top:2px}
.planbox .pi{margin-top:10px;font-size:.88rem;color:var(--mut-d)}
.planbox .more{margin-top:10px;font-size:.88rem;color:var(--lime);text-decoration:underline;font-weight:600;min-height:32px}
.planbox ul{list-style:none;margin-top:8px;display:grid;gap:5px;font-size:.9rem}
.planbox li:before{content:"✓";color:var(--lime);font-weight:800;margin-right:8px}
.items{list-style:none;display:grid;gap:8px}
.items li{display:flex;justify-content:space-between;gap:12px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:10px 14px;font-size:.95rem;background:#fff}
.items li small{display:block;color:var(--mut);font-size:.82rem}
.items li .v{font-weight:700;white-space:nowrap}
.items li .v.in{color:#2c6b00}
.items li.in{animation:slin .55s cubic-bezier(.2,.9,.3,1) both}
.items li.out{animation:slout .3s ease both}
.items li.flash{animation:flash .8s ease}
@keyframes slin{0%{opacity:0;transform:translateX(30px) scale(.97);background:var(--lime)}60%{opacity:1;transform:none;background:var(--lime)}100%{background:#fff}}
@keyframes slout{to{opacity:0;transform:translateX(-24px);max-height:0;padding-top:0;padding-bottom:0;margin:0;border-width:0}}
@keyframes flash{0%{background:var(--lime)}100%{background:#fff}}
.upg2{background:#f1fbd0;border:1px solid #c9e78a;border-radius:12px;padding:12px 14px;font-size:.93rem;margin-top:12px;animation:rise .4s ease both}
.mtot{margin-top:16px;border-top:1px solid var(--line);padding-top:14px}
.mtot .ln{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.mtot .ln b{font-size:1.8rem;letter-spacing:-.02em}
.mtot .ln.s{margin-top:4px;color:var(--mut);font-size:.95rem}
.mnote{color:var(--mut);font-size:.82rem;margin-top:10px}

/* resumen */
.sumhead{margin-bottom:26px}
.sumhead h1{font-size:clamp(1.9rem,4vw,2.8rem);font-weight:800;letter-spacing:-.02em;line-height:1.1;margin:8px 0 8px}
.sumhead p{color:var(--mut);font-size:1.1rem;max-width:40em}
.sumgrid{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:32px;align-items:start}
.card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:26px clamp(18px,3vw,32px);margin-bottom:18px}
.card h2{font-size:1.3rem;font-weight:800;margin-bottom:4px;letter-spacing:-.01em}
.card .sub2{color:var(--mut);margin-bottom:16px;font-size:.98rem}
.pkg{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;flex-wrap:wrap;margin-bottom:6px}
.pkg .pn{font-size:1.6rem;font-weight:800}
.pkg .pp{font-size:1.6rem;font-weight:800;color:var(--ink)}
.checks{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;margin-top:14px}
.checks li{display:flex;gap:10px;align-items:flex-start;font-size:.98rem}
.checks li:before{content:"";flex:none;width:20px;height:20px;border-radius:50%;background:var(--lime) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5l3 3 6-6.5' fill='none' stroke='%230b0c08' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/20px no-repeat;margin-top:2px}
table.calc{width:100%;border-collapse:collapse;font-size:.98rem}
table.calc td{padding:11px 0;border-bottom:1px solid var(--line);vertical-align:top}
table.calc td:last-child{text-align:right;font-weight:700;white-space:nowrap;padding-left:14px}
table.calc td small{display:block;color:var(--mut);font-weight:400;font-size:.86rem}
table.calc tr.sub td{font-weight:700;border-bottom:0}
table.calc tr.tot td{font-size:1.25rem;font-weight:800;border-top:2px solid var(--ink);border-bottom:0;padding-top:14px}
.note2{background:#f1fbd0;border-radius:12px;padding:12px 14px;font-size:.95rem;margin-top:14px}
.need{list-style:none;display:grid;gap:12px}
.need li{display:flex;gap:12px;align-items:flex-start}
.need li:before{content:"";flex:none;width:22px;height:22px;border:2px solid var(--ink);border-radius:7px;margin-top:2px}
.need b{display:block}
.need span{color:var(--mut);font-size:.95rem}
.tl{list-style:none;counter-reset:t;display:grid;gap:18px}
.tl li{position:relative;padding-left:52px}
.tl li:before{counter-increment:t;content:counter(t);position:absolute;left:0;top:0;width:36px;height:36px;border-radius:50%;background:var(--ink);color:var(--lime);font-weight:800;display:grid;place-items:center}
.tl b{display:block}
.tl span{color:var(--mut);font-size:.96rem}
.side{position:sticky;top:88px}
.side .card{margin-bottom:14px}
.sidetot .ln{display:flex;justify-content:space-between;align-items:baseline;padding:4px 0}
.sidetot .ln.big b{font-size:2rem;letter-spacing:-.02em}
.side .btn{width:100%;min-height:54px}
.side .btn-ghost{margin-top:10px}
.fine{color:var(--mut);font-size:.86rem;margin-top:10px;text-align:center}

@media (max-width:980px){
  .grid,.sumgrid{grid-template-columns:1fr}
  .side{position:static}
  main{padding-bottom:140px}
  /* lateral como hoja inferior */
  .mine{position:fixed;left:0;right:0;bottom:0;top:auto;z-index:25;border-radius:22px 22px 0 0;border-bottom:0;box-shadow:0 -10px 40px rgba(0,0,0,.18)}
  .mine-h{cursor:pointer;border-bottom:0;padding:14px 20px}
  .chev{display:block}
  .mine.open .chev{transform:rotate(225deg);margin-top:4px}
  .mine-b{display:none;max-height:62dvh;border-top:1px solid var(--line)}
  .mine.open .mine-b{display:block}
  .hr .back{display:none}
}
@media (max-width:640px){
  .two{grid-template-columns:1fr}
  .checks{grid-template-columns:1fr}
  .cnav .btn{min-width:0;flex:1}
  .btn.sm{padding:0 12px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* iconos */
.opt .lead,.items .lead{display:flex;align-items:center;gap:14px;min-width:0}
.ic{flex:none;width:42px;height:42px;border-radius:12px;background:#eef1e4;color:var(--ink);display:grid;place-items:center;transition:background .15s,color .15s}
.ic svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.opt[aria-pressed=true] .ic{background:var(--ink);color:var(--lime)}
.items .ic{width:34px;height:34px;border-radius:10px}
.items .ic svg{width:18px;height:18px}

/* pago */
.linkbtn{display:block;width:100%;margin-top:12px;background:none;border:0;color:var(--mut);font-weight:600;text-decoration:underline;min-height:44px;font-size:.95rem}
.pmeths{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.pm{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;border:1.5px solid var(--line);border-radius:14px;padding:16px 10px;background:#fff;min-height:132px;transition:border-color .15s,background .15s}
.pm:hover{border-color:var(--ink)}
.pm[aria-pressed=true]{border-color:var(--ink);background:#f1fbd0;box-shadow:inset 0 0 0 1px var(--ink)}
.pm .pmn{font-weight:700;font-size:.95rem;line-height:1.25}
.pm .pmn small{display:block;font-weight:500;color:var(--mut);font-size:.8rem;margin-top:2px}
.plogo{height:44px;display:flex;align-items:center;justify-content:center}
.plogo img{max-height:44px;max-width:110px;object-fit:contain}
.plogo .pl-t{display:inline-block;border:1.5px solid var(--line);border-radius:10px;padding:8px 16px;font-weight:800;letter-spacing:.02em;background:#f6f7f2}
.paysteps{margin:10px 0 16px;padding-left:20px;color:var(--mut);display:grid;gap:6px}
.paysteps b{color:var(--ink)}
.crow{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line)}
.crow span{display:block;color:var(--mut);font-size:.88rem}
.crow b{font-size:1.15rem;letter-spacing:.01em;word-break:break-all}
.crow .chip{flex:none}
@media (max-width:640px){.pmeths{grid-template-columns:1fr}.pm{flex-direction:row;min-height:0;text-align:left;padding:12px 14px}.pm .plogo{width:90px;flex:none}}
.grid>*,.sumgrid>*{min-width:0}
.opt .lead>span:last-child{min-width:0}
@media (max-width:640px){.opt{padding:13px 14px;gap:10px}.opt .pr{font-size:.82rem;white-space:normal;text-align:right;max-width:34%}.ic{width:38px;height:38px}}

/* etapas */
.stp{display:flex;gap:10px;list-style:none;margin:26px 0 6px;flex-wrap:wrap}
.stp li{display:flex;align-items:center;gap:10px;font-weight:600;color:var(--mut);padding:8px 16px 8px 8px;border-radius:99px;background:#fff;border:1.5px solid var(--line)}
.stp i{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:.85rem;font-weight:800;background:#eef1e4;color:var(--ink)}
.stp li.cur{border-color:var(--ink);color:var(--ink)}.stp li.cur i{background:var(--ink);color:var(--lime)}
.stp li.done{color:var(--ink)}.stp li.done i{background:var(--lime)}
.calc td.in{color:#2c6b00;font-weight:700}
.plogo img{border-radius:10px}

.must{border:1.5px solid #dfe6cc;background:#fbfdf4;border-radius:16px;padding:16px 18px;margin-top:20px}
.must>b{display:block;font-size:1.02rem}
.must .msub{color:#5a634b;font-size:.9rem;margin:2px 0 10px}
.must ul{list-style:none;padding:0;margin:0;display:grid;gap:10px;grid-template-columns:1fr 1fr}
.must li{display:flex;gap:10px;align-items:flex-start;min-width:0}
.must li:before{content:"";flex:none;width:20px;height:20px;border-radius:50%;background:#BCFD0A url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/13px no-repeat;margin-top:1px}
.must li span{display:block;min-width:0}
.must li b{display:block;font-size:.95rem;line-height:1.25}
.must li small{display:block;color:#5a634b;font-size:.84rem;line-height:1.35;margin-top:2px}
.must.cmp{margin:0;border:0;background:none;padding:0}
.must.cmp ul{grid-template-columns:1fr 1fr}
@media(max-width:700px){.must ul,.must.cmp ul{grid-template-columns:1fr}}
.remind{border:1.5px solid #e8c9a0;background:#fff8ee}
.remind .rl{list-style:none;padding:0;margin:12px 0 10px;display:grid;gap:8px}
.remind .rl li{display:flex;justify-content:space-between;gap:12px;background:#fff;border:1px solid #f0dcbc;border-radius:12px;padding:10px 12px}
.remind .rl b{font-size:.94rem}.remind .rl span{font-weight:700;text-align:right;font-size:.92rem}
.remind .rnote{font-size:.86rem;color:#6b5a3e}
