/* Di Patata · estilos */
:root{
  --crema:#FFF6E6; --tinta:#1F2340; --coral:#FF5B4A; --coral-osc:#C2361F; --patata:#F2B544; --arena:#F6E3BC;
  --gris:#5A5F78; --borde:#E6D8BD; --blanco:#fff; --verde:#2E7D4F; --verde-claro:#E6F2EA; --amarillo-claro:#FDEBC7;
  --radio:24px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--crema);color:var(--tinta);font-family:'Nunito',system-ui,-apple-system,'Segoe UI',sans-serif;font-size:17px;line-height:1.55}
img,svg{max-width:100%;height:auto}
a{color:var(--tinta)} a:hover{color:var(--coral-osc)}
h1,h2,h3,.fredoka{font-family:'Fredoka','Nunito',sans-serif;line-height:1.1;margin:0}
p{margin:0}
.envoltorio{max-width:1200px;margin:0 auto;padding:0 20px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 24px;border-radius:999px;border:0;font:inherit;font-weight:800;text-decoration:none;cursor:pointer;transition:transform .15s}
.btn:hover{transform:translateY(-1px)}
.btn-coral{background:var(--coral);color:var(--tinta)} .btn-coral:hover{color:var(--tinta)}
.btn-tinta{background:var(--tinta);color:var(--crema)} .btn-tinta:hover{color:var(--crema)}
.btn-borde{background:#fff;color:var(--tinta);border:2px solid var(--tinta)}
.btn-grande{min-height:56px;font-size:18px;padding:14px 28px}
.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none}

/* Cabecera */
.cabecera{border-bottom:1px solid var(--borde);background:var(--crema);position:sticky;top:0;z-index:20}
.cabecera .envoltorio{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding-top:12px;padding-bottom:12px}
.marca{display:flex;align-items:center;gap:10px;text-decoration:none}
.marca svg{width:50px;height:41px}
.marca span{font-family:'Fredoka',sans-serif;font-size:28px;font-weight:700;color:var(--tinta)}
.marca b{color:#E0412F;font-weight:700}
.cab-der{display:flex;align-items:center;gap:22px}
.menu{display:flex;flex-wrap:wrap;align-items:center;gap:6px 22px;font-weight:700}
.menu a{text-decoration:none}
.btn-cab .corto{display:none}
.hamburguesa{display:none;width:48px;height:48px;border-radius:12px;border:2px solid var(--tinta);background:#fff;align-items:center;justify-content:center;cursor:pointer;padding:0}
.hamburguesa path{stroke:var(--tinta);stroke-width:2.4;stroke-linecap:round;transition:transform .2s,opacity .2s;transform-origin:12px 12px}
.cabecera.abierta .hamburguesa .l1{transform:translateY(6px) rotate(45deg)}
.cabecera.abierta .hamburguesa .l2{opacity:0}
.cabecera.abierta .hamburguesa .l3{transform:translateY(-6px) rotate(-45deg)}
@media (max-width:900px){
  .cabecera .envoltorio{flex-wrap:nowrap;position:relative}
  .marca svg{width:40px;height:33px}
  .marca span{font-size:23px}
  .cab-der{gap:10px}
  .btn-cab{min-height:48px;padding:10px 18px;font-size:16px}
  .btn-cab .largo{display:none}.btn-cab .corto{display:inline}
  .hamburguesa{display:flex}
  .menu{display:none;position:absolute;top:100%;left:0;right:0;background:var(--crema);flex-direction:column;align-items:stretch;gap:0;padding:8px 20px 16px;border-bottom:1px solid var(--borde);box-shadow:0 12px 24px rgba(31,35,64,.12)}
  .cabecera.abierta .menu{display:flex}
  .menu a{padding:14px 4px;font-size:19px;border-bottom:1px solid var(--borde)}
  .menu a:last-child{border-bottom:0}
}

/* Portada */
.hero{padding:56px 0 48px}
.hero .envoltorio{display:flex;flex-wrap:wrap;align-items:center;gap:40px}
.hero-texto{flex:1 1 460px;display:flex;flex-direction:column;gap:18px}
.antetitulo{font-weight:800;letter-spacing:2px;font-size:14px;color:#8A5A12}
.hero h1{font-size:clamp(38px,5.4vw,62px);font-weight:700}
.hero p.lead{font-size:20px;max-width:560px}
.botones{display:flex;flex-wrap:wrap;gap:12px}
.checks{list-style:none;padding:0;margin:4px 0 0;display:flex;flex-wrap:wrap;gap:8px 22px;font-weight:700}
.checks li::before{content:"✓ ";color:var(--verde)}
.hero-imagen{flex:1 1 380px}
.hero-imagen img{display:block;width:100%;border-radius:28px}

.seccion{padding:64px 0}
.seccion.blanca{background:#fff}
.seccion.oscura{background:var(--tinta);color:var(--crema)}
.seccion.oscura a{color:var(--crema)}
.titulo-seccion{display:flex;flex-direction:column;gap:8px;margin-bottom:28px}
.titulo-seccion h2{font-size:clamp(32px,4vw,44px);font-weight:700}
.titulo-seccion p{font-size:19px}

.rejilla{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.tarjeta{background:var(--crema);border-radius:var(--radio);padding:24px;display:flex;flex-direction:column;gap:10px}
.seccion:not(.blanca) .tarjeta{background:#fff}
.tarjeta img{border-radius:18px;background:var(--arena)}
.tarjeta h3{font-size:26px;font-weight:600}
.tarjeta .precio{margin-top:auto;font-weight:800}
.paso{background:#fff;border-radius:var(--radio);padding:22px;display:flex;flex-direction:column;gap:6px}
.paso .num{font-family:'Fredoka',sans-serif;font-size:40px;font-weight:700;color:var(--coral-osc)}
.paso strong{font-size:20px}
ol.rejilla{list-style:none;padding:0;margin:0}

.zona{display:flex;flex-wrap:wrap;gap:40px;align-items:center}
.zona>div{flex:1 1 420px;display:flex;flex-direction:column;gap:14px}
.zona h2{font-size:clamp(32px,4vw,44px)}
.zona-form{display:flex;flex-wrap:wrap;gap:10px}
.zona-form label{flex-basis:100%;font-weight:800}
.resultado{background:#2C3463;border-radius:14px;padding:14px 18px;font-weight:700;min-height:52px}
.resultado.ok{background:#2E5E45} .resultado.mal{background:#7A2A22}

.galeria{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.galeria img{border-radius:20px;aspect-ratio:1;object-fit:cover;width:100%;background:var(--arena)}

details{background:var(--crema);border-radius:16px;padding:16px 20px;margin-bottom:12px}
summary{font-weight:800;font-size:18px;cursor:pointer}
details p{margin-top:10px}

.llamada{background:var(--coral);border-radius:32px;padding:40px 28px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px}
.llamada h2{font-size:clamp(28px,3.4vw,40px)}

.pie{background:var(--tinta);color:var(--crema);padding:44px 0 90px}
.pie .envoltorio{display:flex;flex-wrap:wrap;justify-content:space-between;gap:28px}
.pie a{color:var(--crema)}
.pie div{display:flex;flex-direction:column;gap:6px}

.wa-flotante{position:fixed;right:18px;bottom:18px;z-index:30;width:60px;height:60px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.wa-flotante svg{width:32px;height:32px}

/* Formularios */
.campo{display:flex;flex-direction:column;gap:6px;font-weight:800}
.campo span.ayuda{font-weight:400;color:var(--gris);font-size:15px}
input[type=text],input[type=tel],input[type=email],input[type=number],input[type=date],input[type=time],input[type=password],input[type=url],select,textarea{
  min-height:50px;border-radius:12px;border:2px solid var(--tinta);padding:10px 14px;font:inherit;font-weight:400;background:#fff;color:var(--tinta);width:100%}
textarea{min-height:96px}
input:focus,select:focus,textarea:focus,button:focus-visible,a:focus-visible{outline:3px solid var(--patata);outline-offset:2px}
.casilla{display:flex;align-items:flex-start;gap:10px;font-weight:700}
.casilla input{width:22px;height:22px;margin-top:2px;flex:none}

/* Reservar */
.reservar{display:flex;flex-wrap:wrap;align-items:flex-start;gap:28px;padding:28px 0 64px}
.pasos{flex:999 1 560px;min-width:0;display:flex;flex-direction:column;gap:22px}
.bloque{background:#fff;border-radius:var(--radio);padding:24px;display:flex;flex-direction:column;gap:16px}
.bloque h2{font-size:28px;font-weight:600}
.servicios-sel{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.serv{border:2px solid var(--borde);border-radius:18px;padding:14px 16px;display:flex;flex-direction:column;gap:10px;background:#fff}
.serv.activo{border:3px solid var(--tinta);background:var(--crema)}
.serv label.nombre{display:flex;align-items:center;gap:10px;font-weight:800;font-size:19px;cursor:pointer}
.serv label.nombre input{width:22px;height:22px}
.serv .horas{display:flex;align-items:center;justify-content:space-between;gap:8px}
.serv .horas select{width:auto;min-height:44px}
.nota{background:var(--amarillo-claro);border-radius:12px;padding:12px 16px;font-weight:700}
.nota.verde{background:var(--verde-claro);border:2px solid var(--verde)}
.nota.roja{background:#FBE3E0;border:2px solid #B3261E}

.cal-cab{display:flex;align-items:center;justify-content:space-between;gap:10px}
.cal-cab strong{font-family:'Fredoka',sans-serif;font-size:24px;font-weight:600;text-transform:capitalize}
.cal-cab button{min-width:48px;min-height:48px;border-radius:12px;border:2px solid var(--tinta);background:#fff;font-size:22px;font-weight:800;cursor:pointer}
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;text-align:center}
.cal .dsem{font-weight:800;color:var(--gris);font-size:14px}
.cal button{min-height:50px;border-radius:12px;border:2px solid var(--borde);background:#fff;font:inherit;font-weight:700;cursor:pointer;color:var(--tinta);padding:0}
.cal button.poco{border-color:#E8A13A;background:var(--amarillo-claro)}
.cal button.completo,.cal button.cerrado{border:0;background:#ECE9E3;color:#77746E;cursor:not-allowed}
.cal button.completo{text-decoration:line-through}
.cal button.elegido{border:3px solid var(--tinta);background:var(--coral);color:var(--tinta);font-weight:800}
.leyenda{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:15px;font-weight:700}
.leyenda i{display:inline-block;width:16px;height:16px;border-radius:4px;vertical-align:-3px;margin-right:6px;border:2px solid var(--borde);background:#fff}
.leyenda i.poco{border-color:#E8A13A;background:var(--amarillo-claro)} .leyenda i.completo{border:0;background:#ECE9E3}

.fila{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.sugerencias{position:relative}
.sugerencias ul{position:absolute;left:0;right:0;top:100%;z-index:10;list-style:none;margin:4px 0 0;padding:6px;background:#fff;border:2px solid var(--tinta);border-radius:12px;max-height:280px;overflow:auto}
.sugerencias li button{display:block;width:100%;text-align:left;border:0;background:none;padding:10px 12px;border-radius:8px;font:inherit;cursor:pointer;color:var(--tinta)}
.sugerencias li button:hover,.sugerencias li button.activo{background:var(--crema)}
.sugerencias small{color:var(--gris)}

.resumen{flex:1 1 330px;position:sticky;top:90px;background:var(--tinta);color:var(--crema);border-radius:var(--radio);padding:24px;display:flex;flex-direction:column;gap:12px}
.resumen h2{font-size:26px;font-weight:600}
.resumen .linea{display:flex;justify-content:space-between;gap:10px}
.resumen .sep{border-top:1px solid #3B4475;padding-top:12px}
.resumen .total{display:flex;justify-content:space-between;align-items:baseline}
.resumen .total b{font-family:'Fredoka',sans-serif;font-size:34px}
.resumen .desc{color:var(--patata)}
.resumen small{color:#D8DAE8}
.resumen a{color:var(--crema)}
.errores{background:#FBE3E0;color:#7A1E15;border-radius:14px;padding:14px 18px;font-weight:700}
.errores ul{margin:6px 0 0;padding-left:20px}

/* Ficha de reserva del cliente */
.ficha{max-width:760px;margin:0 auto;padding:36px 20px 72px;display:flex;flex-direction:column;gap:20px}
.estado{display:inline-block;border-radius:999px;padding:4px 14px;font-weight:800}
.estado.pendiente{background:var(--amarillo-claro)} .estado.confirmada,.estado.completada{background:#CFE3D6}
.estado.cancelada,.estado.caducada{background:#ECE9E3}
.tabla-res{width:100%;border-collapse:collapse}
.tabla-res td{padding:6px 0;border-bottom:1px solid #f0e6d2} .tabla-res td:last-child{text-align:right}
.legal{max-width:820px;margin:0 auto;padding:40px 20px 72px}
.legal h1{font-size:40px;margin-bottom:20px} .legal h2{font-size:24px;margin:28px 0 10px} .legal p{margin-bottom:12px}
.marca span{white-space:nowrap}
@media (max-width:380px){.cabecera .envoltorio{gap:8px}.marca{gap:6px}.marca svg{width:32px;height:27px}.marca span{font-size:20px}.cab-der{gap:8px}.btn-cab{padding:10px 14px;font-size:15px}.hamburguesa{width:44px;height:44px}}
