
/* ===== ORE free taster booking form =====
   Paste this whole file into your site, or embed it in an iframe.
   Set API_URL below to your Google Apps Script web app URL.
   Leave it empty to run in demo mode (nothing is saved or emailed). */
:root{
  --teal:#007E91; --teal-dark:#005E6E; --teal-soft:#D9F3F7;
  --ink:#2A2622; --muted:#4E463E; --soft:#6B6157; --line:#E2D7C9;
  --cream:#FBF8F3; --white:#FFFFFF; --error:#A1281A; --error-soft:#FDECEA;
}
*{box-sizing:border-box}
[hidden]{display:none!important}


.ore-intro{flex:1 1 340px;min-width:0;display:flex;flex-direction:column;gap:16px}
.ore-intro h2{margin:0;font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:clamp(34px,5vw,52px);line-height:1.06;letter-spacing:-1px}
.ore-intro p{margin:0;color:var(--muted)}
.ore-tip{background:var(--teal-soft);border-radius:20px;padding:20px}
.ore-wa{align-self:flex-start;display:inline-flex;align-items:center;gap:10px;background:var(--white);border:2px solid var(--line);color:var(--ink);text-decoration:none;font-weight:700;padding:12px 20px;border-radius:999px;font-size:17px;min-height:48px}
.ore-wa:hover{border-color:var(--teal)}
.ore-card{flex:1 1 520px;min-width:0;background:var(--white);border-radius:28px;padding:28px}
@media (max-width:520px){.ore-card{padding:20px;border-radius:22px}}
form{display:flex;flex-direction:column;gap:26px}
fieldset{border:0;margin:0;padding:0;min-width:0;display:flex;flex-direction:column;gap:10px}
legend{font-weight:800;font-size:19px;padding:0;margin-bottom:10px}
.ore-days{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin}
.ore-day{flex:0 0 auto;min-height:56px;min-width:76px;padding:6px 14px;border-radius:14px;border:2px solid var(--line);background:var(--white);color:var(--ink);font:inherit;font-weight:700;font-size:15px;line-height:1.25;cursor:pointer}
.ore-day[aria-pressed="true"]{background:var(--teal);border-color:var(--teal);color:#fff}
.ore-class{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:14px 18px;min-height:56px;border-radius:14px;border:2px solid var(--line);background:var(--white);color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.ore-class[aria-pressed="true"]{border-color:var(--teal);background:var(--teal-soft)}
.ore-class:disabled{cursor:default;border-style:dashed;color:#8A8076;background:var(--white)}
.ore-tag{display:inline-block;margin-left:6px;color:var(--teal-dark);font-weight:800;font-size:14px}
.ore-left{font-size:15px;color:var(--muted);white-space:nowrap}
.ore-class[aria-pressed="true"] .ore-left{color:var(--teal-dark);font-weight:700}
.ore-row{display:flex;flex-wrap:wrap;gap:14px}
.ore-row>label{flex:1 1 200px}
label.ore-field{display:flex;flex-direction:column;gap:6px;font-weight:700}
input[type=text],input[type=tel],input[type=email],textarea{padding:14px 16px;font-size:17px;border:2px solid var(--line);border-radius:14px;font-family:inherit;color:var(--ink);background:#fff;width:100%}
textarea{font-weight:400;resize:vertical}
input:focus,textarea:focus,button:focus-visible,a:focus-visible{outline:3px solid var(--teal);outline-offset:2px}
.ore-kinds{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.ore-kind{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;min-height:64px;padding:12px 16px;border-radius:16px;border:2px solid var(--line);background:var(--white);color:var(--ink);font:inherit;cursor:pointer}
.ore-kind strong{font-size:17px}
.ore-kind span{font-size:14px;color:var(--muted)}
.ore-kind[aria-pressed="true"]{background:var(--teal);border-color:var(--teal);color:#fff}
.ore-kind[aria-pressed="true"] span{color:#E6F7FA}
.ore-yn{display:flex;gap:10px}
.ore-yn button{min-height:48px;padding:10px 30px;border-radius:999px;border:2px solid var(--line);background:#fff;color:var(--ink);font:inherit;font-weight:700;cursor:pointer}
.ore-yn button[aria-pressed="true"]{background:var(--teal);border-color:var(--teal);color:#fff}
.ore-consent{display:flex;gap:12px;align-items:flex-start;color:var(--muted);font-size:16px;font-weight:400}
.ore-consent input{width:24px;height:24px;margin-top:1px;flex:0 0 auto;accent-color:var(--teal)}
.ore-submit{background:var(--teal);color:#fff;border:0;font-weight:800;padding:16px 28px;border-radius:999px;font-size:19px;font-family:inherit;cursor:pointer;min-height:56px}
.ore-submit:hover{background:var(--teal-dark)}
.ore-submit[disabled]{opacity:.7;cursor:progress}
.ore-small{color:var(--soft);font-size:15px;text-align:center;margin:0}
.ore-err{color:var(--error);font-size:15px;font-weight:700;margin:0}
.ore-banner{background:var(--error-soft);color:var(--error);border-radius:14px;padding:14px 16px;font-weight:700;margin:0}
.ore-hidden{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ore-done{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.ore-done h3{margin:0;font-family:'Bricolage Grotesque',sans-serif;font-size:34px;line-height:1.1}
.ore-tick{width:56px;height:56px;border-radius:999px;background:var(--teal-soft);display:flex;align-items:center;justify-content:center}
.ore-link{background:none;border:0;padding:0;color:var(--teal);font:inherit;font-weight:700;text-decoration:underline;cursor:pointer;min-height:44px}
.ore-demo{background:#FFF6DA;color:#5C4500;border-radius:12px;padding:10px 14px;font-size:14px;margin:0 0 18px}
.ore-empty{color:var(--muted);margin:0}

