/* Paso entre la landing y Mercado Pago: comprar.html y comprar-ayuno.html */
body{padding-bottom:0}
.cabeza :focus-visible,main :focus-visible{outline-color:var(--tinta)}
.cabeza{max-width:1112px;margin:auto;padding:calc(var(--franja) + 14px) 16px 0;display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.ley{font-size:14px;font-weight:700;line-height:1.15;color:var(--tinta);min-height:44px;display:inline-flex;align-items:flex-start;padding-top:2px;text-align:right}
main{max-width:1112px;margin:auto;padding:0 16px 32px}
h1{font:400 clamp(36px,10vw,60px)/1.05 "Alfa Slab One",serif;color:var(--granada);margin:14px 0 14px}
#error{display:none;background:var(--granada);color:var(--blanco);font-weight:700;padding:12px 14px;margin-bottom:14px}
#error:target{display:block}

.item{display:grid;grid-template-columns:72px 1fr;grid-template-rows:auto auto 1fr;gap:4px 14px;align-items:start}
.item img{grid-row:span 3;box-shadow:0 1px 6px rgba(27,27,24,.3)}
.item h2{font-size:21px;line-height:1.2;font-weight:700}
.item .precio{font:400 24px/1.1 "Alfa Slab One",serif;color:var(--granada)}
.item p{font-size:17px;line-height:1.3}

input[type=checkbox]{appearance:none;-webkit-appearance:none;width:44px;height:44px;margin:0;cursor:pointer;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='1' y='1' width='22' height='22' fill='%23fff' stroke='%231B1B18' stroke-width='2'/%3E%3C/svg%3E") center/24px no-repeat}
input[type=checkbox]:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='1' y='1' width='22' height='22' fill='%23fff' stroke='%231B1B18' stroke-width='2'/%3E%3Cpath d='M5.5 12.5l4.5 4.5 8.5-10' fill='none' stroke='%23B5121B' stroke-width='3.5'/%3E%3C/svg%3E")}
@media (forced-colors:active){input[type=checkbox]{appearance:auto;-webkit-appearance:auto}}

.bumps{border:0;padding:0;margin:24px 0 0;min-width:0}
.bumps legend{width:100%;padding:0 0 6px;font-size:15px;line-height:1.2;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--aceite);border-bottom:2px solid var(--aceite)}
.bump{display:grid;grid-template-columns:44px 1fr auto;gap:2px 8px;align-items:start;padding:0 8px 12px 0;border-bottom:1px solid #CFCFC8;cursor:pointer;transition:background-color 160ms ease-out}
.bump:has(:checked){background:#EDEDE7}
.bump input{grid-row:1/3}
.bump b{font-size:19px;line-height:1.2;padding-top:10px}
.bump .mas{font-weight:700;white-space:nowrap;padding-top:10px}
.bump small{grid-column:2/-1;font-size:16px;line-height:1.3;color:var(--piedra)}

.pago{margin-top:24px;display:grid;gap:14px}
.pago label[for=email]{display:block;font-weight:700;margin-bottom:4px}
.pago input[type=email]{width:100%;min-height:52px;padding:10px 12px;font:inherit;color:inherit;background:var(--blanco);border:2px solid var(--tinta);border-radius:0}
.ayuda{font-size:16px;line-height:1.3;color:var(--piedra);margin-top:4px}
.acepta{display:grid;grid-template-columns:44px 1fr;gap:0 8px;font-size:16px;line-height:1.35;cursor:pointer}
.acepta span{padding-top:9px}
.total{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-top:2px solid var(--tinta);padding-top:10px;font-size:20px;font-weight:700}
.total[hidden]{display:none}
.total strong{font:400 34px/1.05 "Alfa Slab One",serif;color:var(--granada);white-space:nowrap}
.un-pago{font-size:17px;line-height:1.3;margin-top:-8px}
.pago .btn{width:100%;min-height:54px;border:0;font-family:inherit;font-size:19px;cursor:pointer}
form:invalid .btn,form:invalid .btn:hover{background:var(--piedra)}
.garantia{background:var(--aceite);color:var(--blanco);padding:12px 14px;line-height:1.3}
.garantia b{display:block;color:var(--miel);font-size:15px;letter-spacing:.04em;text-transform:uppercase}

@media (min-width:900px){
  form{display:grid;grid-template-columns:1.15fr .85fr;gap:0 64px;align-items:start}
  .item{grid-template-columns:160px 1fr;gap:6px 24px}
  .item h2{font-size:26px}
  .item .precio{font-size:30px}
  .item p{font-size:18px}
  .pago{margin-top:0;position:sticky;top:calc(var(--franja) + 16px)}
}
