Campus de Navidad Driball

:root{--bg:#FBF6EC;--card:#fff;--ink:#10261F;--muted:#4F6159;--line:#E3DDCF;--tint:#EAF4EE;--green:#0F5A43;--red:#C62F2F;--dim:#8A978F;--on:#fff;} *{box-sizing:border-box} .cn{background:var(--bg);color:var(--ink);font-family:'Barlow',system-ui,sans-serif;font-size:16px} h1,h2,.hd{font-family:'Barlow Condensed','Arial Narrow',sans-serif;margin:0;text-transform:uppercase} p{margin:0} .hero{background:#0B3D2E;color:#fff;padding:40px 20px;background-image:radial-gradient(circle,rgba(255,255,255,.3) 2px,transparent 3px);background-size:80px 80px} .wrap{max-width:1160px;margin:0 auto} .hero h1{font-size:clamp(44px,7vw,84px);font-weight:800;line-height:.95} .hero h1,.hero h1 span{color:#fff!important} .hero p{margin-top:12px;font-size:19px;color:#E7F1EC;max-width:640px} .badge{display:inline-block;background:#C62F2F;color:#fff;font:700 18px 'Barlow Condensed',sans-serif;letter-spacing:.14em;padding:5px 14px;border-radius:6px;text-transform:uppercase;margin-bottom:14px} .grid{display:grid;grid-template-columns:1fr 360px;gap:28px;padding:32px 20px 56px;align-items:start} .step{position:relative;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:24px 24px 24px 80px;margin-bottom:20px} .num{position:absolute;left:22px;top:22px;width:40px;height:40px;border-radius:50%;background:#0F5A43;color:#fff;display:flex;align-items:center;justify-content:center;font:800 22px 'Barlow Condensed',sans-serif} .step h2{font-size:28px;font-weight:700} .sub{color:var(--muted);margin-top:2px} .opts{display:grid;gap:12px;margin-top:16px} .o2{grid-template-columns:1fr 1fr}.o3{grid-template-columns:repeat(3,1fr)} .opt{position:relative;border:2px solid var(--line);border-radius:12px;padding:14px 16px;cursor:pointer;display:block;min-height:44px} .opt input{position:absolute;opacity:0} .opt:has(input:checked){border-color:var(--green);background:var(--tint)} .opt:has(input:focus-visible){outline:3px solid #F28C28} .opt b{display:block;font:700 21px 'Barlow Condensed',sans-serif} .opt small{color:var(--muted);font-size:14px} .tag{position:absolute;top:-11px;right:12px;background:#F28C28;color:#10261F;font:700 13px 'Barlow Condensed',sans-serif;letter-spacing:.06em;text-transform:uppercase;padding:2px 9px;border-radius:6px} .two{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;margin-top:16px} .cal{border:1px solid var(--line);border-radius:12px;padding:14px} .mh{text-align:center;font:700 22px 'Barlow Condensed',sans-serif;text-transform:uppercase;margin-top:6px} .days{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;text-align:center;margin:8px 0 14px} .days .w{font-size:13px;color:var(--muted);padding:4px 0} .d{height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:inherit;font-size:16px;border:0;background:none;color:var(--dim)} button.d{border:2px solid var(--green);color:var(--green);font-weight:600;cursor:pointer;background:var(--card)} button.d[aria-pressed="true"]{background:var(--green);color:var(--on)} button.d:disabled{cursor:default;opacity:.95} .sel{background:var(--tint);border-radius:12px;padding:14px} .sel ul{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:6px} .sel li{background:var(--card);border-radius:8px;padding:7px 12px;font-size:15px} .msg{margin-top:12px;font-size:15px;color:var(--muted);min-height:22px} .msg.err{color:var(--red);font-weight:600} .xt{border:1px solid var(--line);border-radius:12px;padding:16px;margin-top:14px} .xh{display:flex;justify-content:space-between;align-items:baseline;gap:10px} .xh b{font:700 21px 'Barlow Condensed',sans-serif} .xh em{font:800 22px 'Barlow Condensed',sans-serif;color:var(--red);font-style:normal} .chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px} .chip{position:relative;border:1.5px solid var(--line);border-radius:999px;padding:8px 14px;font-size:15px;cursor:pointer;min-height:40px;display:flex;align-items:center} .chip input{position:absolute;opacity:0} .chip:has(input:checked){background:var(--green);border-color:var(--green);color:var(--on)} .chip:has(input:focus-visible){outline:3px solid #F28C28} .chip.off{opacity:.4;cursor:not-allowed;text-decoration:line-through} .side{position:sticky;top:20px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px} .side h2{font-size:30px;font-weight:800} .row{display:flex;justify-content:space-between;gap:10px;padding:5px 0} .row small{display:block;color:var(--muted);font-size:13px} .tot{border-top:2px solid var(--ink);margin-top:10px;padding-top:12px;align-items:center} .tot .hd{font-size:26px;font-weight:800}.tot .big{font:800 42px 'Barlow Condensed',sans-serif;color:var(--green)} .cta{width:100%;margin-top:12px;border:0;border-radius:12px;background:#C62F2F;color:#fff;font:800 23px 'Barlow Condensed',sans-serif;letter-spacing:.06em;text-transform:uppercase;padding:14px;min-height:48px;cursor:pointer} .cta:disabled{background:#9AA79F;cursor:not-allowed} .olv{display:flex;gap:10px;align-items:center;background:var(--tint);border-radius:10px;padding:10px 12px;margin-top:12px;font-size:15px;cursor:pointer} .olv input{width:20px;height:20px;accent-color:#0F5A43} .ok{margin-top:12px;background:var(--tint);color:var(--green);border-radius:10px;padding:12px;font-weight:600;display:none} @media(max-width:900px){.grid{grid-template-columns:1fr}.side{position:static}.o2,.o3,.two{grid-template-columns:1fr}.step{padding:70px 18px 20px}} Navidad 2026Campus de Navidad Driball x OlivarElige horario, días y extras. Nosotros nos encargamos del resto. 1Elige la modalidadEl horario determina el precio base. Campus 9:00 a 14:00Sin comida Campus 9:00 a 16:00Incluye comida 2Selecciona el packPack de 8, pack de 4 o días sueltos. Más ahorroPack 8 díasTodo el campus Pack 4 díasElige 4 fechas Días sueltosLos que necesites 3Elige las fechas 4Añade los extrasMarca los días en que los necesitas, entre tus fechas. Madrugadores y Tiro son a la misma hora, así que cada día solo puedes elegir uno de los dos. Madrugadores · de 8:00 a 9:005 €/día Tiro · entrenamiento específico de 8:00 a 9:0010 €/día Resumen ¿Eres del Olivar? Introduce tu número para ver tu precio. Asegurate de marcar los días previamente. Total Añadir al carrito Pago seguro con tarjeta, Bizum o transferencia var PRICE={a:{8:175,4:100,1:30},b:{8:350,4:190,1:55.5}}; var OLV={a:{8:25,4:10,1:5},b:{8:25,4:15,1:5.5}}; var CAMPUS=["2026-12-23","2026-12-24","2026-12-28","2026-12-29","2026-12-30","2026-12-31","2027-01-04","2027-01-05"]; var MES=['ene','feb','mar','abr','may','jun','jul','ago','sep','oct','nov','dic']; var MN=['Enero','Febrero','Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre']; var MS=[];CAMPUS.forEach(function(d){var k=d.slice(0,7);if(MS.indexOf(k)-1});S.x2=S.x2.filter(function(d){return S.dates.indexOf(d)>-1})} function toggle(list,d){var i=list.indexOf(d);if(i>-1)list.splice(i,1);else list.push(d);list.sort()} function pickDate(d){ if(S.p==='8')return; if(S.dates.indexOf(d)===-1&&S.p==='4'&&S.dates.length>=4){say('Este pack incluye exactamente 4 días. Quita una fecha para cambiarla.',true);return} toggle(S.dates,d);clean();render()} function pickX(k,d){var o=k==='x1'?'x2':'x1';if(S[o].indexOf(d)>-1)return;toggle(S[k],d);render()} function render(){ var n=S.dates.length,pk=S.p; $('sub3').textContent=pk==='8'?'El pack de 8 días incluye todas las fechas del campus.':pk==='4'?'Elige exactamente 4 fechas.':'Elige los días que necesites, sin repetir.'; if(!$('msg').classList.contains('err'))say(pk==='4'?n+' de 4 fechas elegidas':pk==='1'?(n?n+' día(s) elegido(s)':'Elige al menos un día'):''); var h=''; MS.forEach(function(k){var y=+k.slice(0,4),m=+k.slice(5),off=(new Date(y,m-1,1).getDay()+6)%7,nd=new Date(y,m,0).getDate(); h+=''+MN[m-1]+' '+y+''; ['Lu','Ma','Mi','Ju','Vi','Sá','Do'].forEach(function(w){h+=''+w+''}); for(var i=0;i<off;i++)h+=''; for(var d=1;d<=nd;d++){var iso=k+'-'+(d-1){var on=S.dates.indexOf(iso)>-1;h+=''+d+''} else h+=''+d+''} h+=''}); $('cal').innerHTML=h; $('cnt').textContent='Fechas elegidas ('+n+')'; $('lst').innerHTML=S.dates.map(function(d){return ''+lab(d)+' '+d.slice(0,4)+''}).join('')||'Ninguna todavía'; ['x1','x2'].forEach(function(k){ var o=k==='x1'?'x2':'x1';$(k).innerHTML=S.dates.length?S.dates.map(function(d){var bl=S[o].indexOf(d)>-1;return '-1?' checked':'')+(bl?' disabled':'')+'>'+lab(d)+''}).join(''):'Elige primero las fechas.'}); var base=pk==='1'?PRICE[S.h][1]*n:PRICE[S.h][pk],dsc=pk==='1'?OLV[S.h][1]*n:OLV[S.h][pk]; var ex1=S.x1.length*5,ex2=S.x2.length*10,olv=OLVRE.test(($('olvnum').value||'').trim());$('olvmsg').textContent=olv?'Precio Olivar aplicado.':(($('olvnum').value||'').trim()?'Número no válido.':''); var name='Campus '+(S.h==='a'?'9:00 a 14:00':'9:00 a 16:00'); var det=pk==='8'?'Pack 8 días':pk==='4'?'Pack 4 días':'Días sueltos ('+n+' × '+eur(PRICE[S.h][1])+')'; var s=''+name+''+det+''+eur(base)+''; s+='Madrugadores'+S.x1.length+' día(s)'+eur(ex1)+''; s+='Tiro'+S.x2.length+' día(s)'+eur(ex2)+''; if(olv&&n)s+='Descuento Olivar− '+eur(dsc)+''; $('sum').innerHTML=s; $('tot').textContent=eur(Math.max(0,base+ex1+ex2-(olv&&n?dsc:0))); var ok=pk==='8'||(pk==='4'&&n===4)||(pk==='1'&&n>=1); $('cta').disabled=!ok} document.addEventListener('change',function(e){var t=e.target; if(t.name==='cnh'){S.h=t.value;render()} else if(t.name==='cnp'){S.p=t.value;S.dates=t.value==='8'?CAMPUS.slice():[];clean();say('');render()} else if(t.dataset&&t.dataset.x){pickX(t.dataset.x,t.dataset.d)} }); $('cal').addEventListener('click',function(e){var b=e.target.closest('button[data-d]');if(b){say('');pickDate(b.dataset.d)}}); $('cnform').addEventListener('submit',function(){ var h=S.h==='a'?'9-14':'9-16',p=S.p==='8'?'8-dias':S.p==='4'?'4-dias':'dias-sueltos'; var o=''; S.dates.forEach(function(d){o+=''}); S.x1.forEach(function(d){o+=''}); S.x2.forEach(function(d){o+=''}); $('hid').innerHTML=o}); $('olvnum').addEventListener('input',render); $('olvnum').addEventListener('keydown',function(e){if(e.key==='Enter')e.preventDefault()}); render();