/* ============================================================================
   YWF Open Class Sign-Ups — front-end form
   Matches the Yoga with Florentia site: Poppins, babe-blue palette, square
   corners, thin --line borders, paper panels, uppercase tracked labels.
   Everything is scoped under .ywf-oc and ships its own brand tokens so it can
   never be restyled by — or leak into — the theme.
   ============================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;1,400&family=Poppins:wght@300;400;500;600;700;800&display=swap');

.ywf-oc {
  --white:#FFFFFF; --paper:#F2F8FC; --cream:#DCEBF6; --cream-deep:#BFDDF1;
  --ink:#15323F; --charcoal:#1F404D; --soft:#51626C; --mute:#8AA0AD;
  --line:#D5E5F1; --gold:#4E9BD0; --babe:#A8D6F0; --babe-deep:#7FC1E8;
  --sans:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --serif:'Lora',Georgia,serif;
  --star:#E8B14C;

  width:100%;
  font-family:var(--sans);
  color:var(--ink);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-align:left;
}
.ywf-oc *, .ywf-oc *::before, .ywf-oc *::after { box-sizing:border-box; }

/* the form column stays centered + readable; the hero (below) breaks full-bleed */
.ywf-oc-formwrap { max-width:680px; margin:0 auto; padding:0 1.25rem; }
.ywf-oc-withhero .ywf-oc-formwrap { padding-top:clamp(2.5rem,6vw,4.5rem); padding-bottom:clamp(1.5rem,5vw,3.5rem); }
.ywf-oc-form-intro { margin-bottom:1.6rem; }
.ywf-oc-withhero .ywf-oc-form-intro { text-align:center; }
.ywf-oc-withhero .ywf-oc-form-intro .ywf-oc-sub { margin-left:auto; margin-right:auto; }

/* ---------- full-bleed hero (mirrors the site .hero-full) ---------- */
/* strip the page-builder padding around our block so the hero sits flush + full-bleed */
.elementor-widget-html:has(.ywf-oc-withhero) > .elementor-widget-container,
.e-con:has(.ywf-oc-withhero), .e-con:has(.ywf-oc-withhero) > .e-con-inner,
.elementor-section:has(.ywf-oc-withhero) > .elementor-container { padding:0 !important; max-width:100% !important; }
/* Mirrors the site's .hero-full exactly (the rule the other pages use, which
   works on mobile): object-fit:cover image, vh-based min-height, scrim, content
   bottom-aligned and sized to FIT inside the vh so the image always covers the
   whole hero — no grey band, text on top. Heights: 82vh (≤880) / 90vh / 96vh. */
.ywf-oc-hero {
  position:relative; width:100vw; margin-left:calc(50% - 50vw);
  min-height:90vh; display:flex; align-items:flex-end; overflow:hidden;
}
.ywf-oc-hero-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ywf-oc-hero-scrim { position:absolute; inset:0; background:linear-gradient(to top, rgba(13,28,38,.66), rgba(13,28,38,.12) 42%, rgba(13,28,38,.32)); }
.ywf-oc-hero-inner { position:relative; width:100%; max-width:1240px; margin:0 auto; padding:0 clamp(1.25rem,4vw,4rem) clamp(2.5rem,6vw,5rem); color:#fff; }
.ywf-oc-hero-tuck { margin-top:calc(-1 * (var(--header-height,140px) + 40px)); }
@media (min-width:881px) { .ywf-oc-hero { min-height:96vh; } }
@media (max-width:880px) { .ywf-oc-hero { min-height:82vh; } }
.ywf-oc-hero-eyebrow { margin:0 0 1rem; font-size:0.7rem; letter-spacing:0.32em; text-transform:uppercase; color:rgba(255,255,255,.88); font-weight:500; }
.ywf-oc-hero-title { margin:0; color:#fff; font-family:var(--sans); font-weight:800; text-transform:uppercase; font-size:clamp(2.4rem,5.2vw,4.6rem); line-height:0.96; letter-spacing:-0.015em; }
.ywf-oc-hero-title em { font-style:normal; color:rgba(255,255,255,.78); display:block; }
.ywf-oc-hero-lead { margin:1.4rem 0 2rem; color:rgba(255,255,255,.92); max-width:560px; font-size:clamp(1rem,1.3vw,1.15rem); line-height:1.65; }
.ywf-oc-hero-ctas { display:flex; gap:0.75rem; flex-wrap:wrap; align-items:center; }
.ywf-oc-hero-btn {
  display:inline-flex; align-items:center; justify-content:center; padding:1.15rem 2.6rem;
  background:var(--babe); color:#fff; border:1px solid var(--babe);
  font-size:0.8rem; font-weight:500; letter-spacing:0.2em; text-transform:uppercase; cursor:pointer;
  transition:background .25s, color .25s, border-color .25s;
}
.ywf-oc-hero-btn:hover { background:#fff; color:var(--babe); border-color:#fff; }
.ywf-oc-hero-rating { display:inline-flex; align-items:center; gap:0.6rem; margin-top:1.5rem; font-size:0.8rem; letter-spacing:0.06em; color:rgba(255,255,255,.92); transition:opacity .2s; }
.ywf-oc-hero-rating:hover { opacity:.82; }
.ywf-oc-hero-rating .ywf-oc-stars { color:var(--star); letter-spacing:2px; }
.ywf-oc-hero-bullets { list-style:none; margin:1.3rem 0 0; padding:0; display:flex; flex-direction:column; gap:0.55rem; }
.ywf-oc-hero-bullets li { display:flex; align-items:center; gap:0.6rem; font-size:0.84rem; color:#fff; font-weight:500; text-shadow:0 1px 3px rgba(0,0,0,.55); }
.ywf-oc-hero-bullets svg { width:17px; height:17px; flex-shrink:0; stroke:#fff; fill:none; stroke-width:1.8; }
@media (max-width:600px) {
  .ywf-oc-hero-inner { padding-bottom:1.9rem; }
  .ywf-oc-hero-eyebrow { margin-bottom:.5rem; font-size:.6rem; letter-spacing:.24em; }
  .ywf-oc-hero-title { font-size:clamp(1.8rem,7vw,2.4rem); }
  .ywf-oc-hero-lead { font-size:.82rem; line-height:1.45; margin:.7rem 0 1rem; }
  .ywf-oc-hero-btn { width:100%; padding:.9rem 1.4rem; }
  .ywf-oc-hero-rating { margin-top:.85rem; }
  .ywf-oc-hero-bullets { margin-top:.85rem; gap:.4rem; }
  .ywf-oc-hero-bullets li { font-size:.76rem; }
}

/* ---------- header copy ---------- */
.ywf-oc-eyebrow {
  margin:0 0 0.9rem; font-size:0.68rem; letter-spacing:0.3em; text-transform:uppercase;
  color:var(--soft); font-weight:600;
}
.ywf-oc-title {
  margin:0 0 0.75rem; font-family:var(--sans); font-weight:800; text-transform:uppercase;
  font-size:clamp(1.6rem,4vw,2.4rem); line-height:1.02; letter-spacing:-0.01em; color:var(--ink);
}
.ywf-oc-sub {
  margin:0 0 2rem; font-size:0.98rem; line-height:1.7; color:var(--soft); max-width:54ch;
}

/* ---------- fields ---------- */
.ywf-oc-fields { display:flex; flex-direction:column; gap:1.25rem; }
.ywf-oc-row { display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; }
.ywf-oc-field { display:flex; flex-direction:column; }
.ywf-oc-field-party { max-width:160px; }

.ywf-oc label,
.ywf-oc .ywf-oc-cal-label {
  display:block; margin:0 0 0.45rem; font-size:0.64rem; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--soft); font-weight:600;
}
.ywf-oc .ywf-oc-req { color:var(--babe-deep); margin-left:1px; }
.ywf-oc .ywf-oc-opt { color:var(--mute); letter-spacing:0.08em; font-weight:500; text-transform:none; }

.ywf-oc input[type="text"],
.ywf-oc input[type="email"],
.ywf-oc input[type="tel"],
.ywf-oc input[type="number"] {
  width:100%; padding:0.85rem 1rem; font:inherit; font-size:0.95rem;
  color:var(--ink); background:var(--paper);
  border:1px solid var(--line) !important; border-radius:0 !important;
  -webkit-appearance:none; appearance:none; transition:border-color .2s, box-shadow .2s;
}
.ywf-oc input::placeholder { color:var(--mute); }
.ywf-oc input:focus {
  outline:none; border-color:var(--babe-deep) !important;
  box-shadow:0 0 0 1.5px var(--babe-deep);
}
.ywf-oc input[aria-invalid="true"] { border-color:#D98A8A !important; box-shadow:0 0 0 1.5px rgba(217,138,138,.5); }

/* ---------- calendar ---------- */
.ywf-oc-cal-field { gap:0; }
.ywf-oc-cal-help { margin:0 0 0.85rem; font-size:0.8rem; color:var(--mute); line-height:1.5; }
.ywf-oc-cal {
  border:1px solid var(--line); background:var(--white); padding:0.9rem;
}
.ywf-oc-cal-loading { padding:2.5rem 0; text-align:center; color:var(--mute); font-size:0.85rem; }

.ywf-oc-cal-nav {
  display:flex; align-items:center; justify-content:space-between; margin-bottom:0.85rem;
}
.ywf-oc-cal-month {
  font-size:0.82rem; letter-spacing:0.12em; text-transform:uppercase; font-weight:600; color:var(--ink);
}
.ywf-oc-cal-arrow {
  width:38px; height:38px; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--line); background:#fff; color:var(--ink); cursor:pointer;
  font-size:1rem; line-height:1; border-radius:0; transition:background .2s, border-color .2s, color .2s;
}
.ywf-oc-cal-arrow:hover:not(:disabled) { background:var(--ink); color:#fff; border-color:var(--ink); }
.ywf-oc-cal-arrow:disabled { color:var(--mute); cursor:default; opacity:.4; }

.ywf-oc-cal-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:4px; }
.ywf-oc-cal-dow {
  text-align:center; font-size:0.58rem; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--mute); font-weight:600; padding-bottom:4px;
}
.ywf-oc-day {
  aspect-ratio:1/1; min-height:40px; display:flex; align-items:center; justify-content:center;
  font-family:var(--sans); font-size:0.9rem; color:var(--ink);
  background:#fff !important; border:1px solid var(--line) !important; border-radius:0 !important;
  cursor:pointer; padding:0; transition:background .15s, border-color .15s, color .15s; position:relative;
}
.ywf-oc-day.is-empty { background:transparent !important; border-color:transparent !important; cursor:default; }
.ywf-oc-day:hover:not(:disabled):not([aria-pressed="true"]) { background:var(--babe) !important; border-color:var(--babe) !important; color:#fff; }
.ywf-oc-day[aria-pressed="true"] {
  background:var(--babe-deep) !important; border-color:var(--babe-deep) !important; color:#fff !important; font-weight:600;
}
.ywf-oc-day:disabled {
  color:var(--mute) !important; background:var(--paper) !important; border-color:var(--line) !important;
  cursor:default; opacity:.55;
}
.ywf-oc-day.is-today:not([aria-pressed="true"]) { box-shadow:inset 0 0 0 2px var(--babe); }
.ywf-oc-day:focus-visible { outline:2px solid var(--gold); outline-offset:2px; z-index:1; }

.ywf-oc-cal-foot {
  display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:0.85rem;
}
.ywf-oc-cal-summary { margin:0; font-size:0.85rem; color:var(--ink); font-weight:500; }
.ywf-oc-cal-summary .ywf-oc-count { color:var(--babe-deep); font-weight:700; }
.ywf-oc-clear {
  flex:0 0 auto; font-size:0.62rem; letter-spacing:0.14em; text-transform:uppercase; font-weight:600;
  color:var(--soft); background:none; border:none; border-bottom:1px solid var(--soft); padding:0 0 1px;
  cursor:pointer; transition:opacity .2s;
}
.ywf-oc-clear:hover { opacity:.6; }

/* ---------- consent ---------- */
.ywf-oc-consent { margin-top:0.25rem; }
.ywf-oc-check { display:flex; align-items:flex-start; gap:0.65rem; cursor:pointer; text-transform:none; letter-spacing:normal; }
.ywf-oc-check input[type="checkbox"] {
  flex:0 0 auto; width:18px; height:18px; margin-top:2px; accent-color:var(--babe-deep);
  border-radius:0; cursor:pointer;
}
.ywf-oc-check span {
  font-size:0.85rem; line-height:1.55; color:var(--soft); font-weight:400;
  text-transform:none; letter-spacing:normal;
}
.ywf-oc-check a { color:var(--gold); text-decoration:underline; text-underline-offset:2px; }
.ywf-oc-check a:hover { color:var(--ink); }

/* ---------- price line + brunch add-on ---------- */
.ywf-oc-price-line { margin:.7rem 0 0; font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--babe-deep); font-weight:700; }
.ywf-oc-brunch { background:var(--paper); border:1px solid var(--line); padding:.95rem 1.1rem; }
.ywf-oc-brunch .ywf-oc-brunch-title { display:block; font-size:.92rem; font-weight:600; color:var(--ink); text-transform:none; letter-spacing:normal; }
.ywf-oc-brunch .ywf-oc-brunch-price { color:var(--babe-deep); font-weight:700; }
.ywf-oc-brunch .ywf-oc-brunch-note { display:block; margin-top:.25rem; font-size:.8rem; line-height:1.5; color:var(--soft); font-style:italic; }

/* ---------- captcha ---------- */
.ywf-oc-captcha { margin:.25rem 0; min-height:1px; }

/* ---------- FAQ accordion (matches the site .faq-list) ---------- */
.ywf-oc-faq-wrap { max-width:780px; margin:0 auto; padding:clamp(1.5rem,5vw,3rem) 1.25rem clamp(2.5rem,6vw,4rem); }
.ywf-oc-faq-title { margin:0 0 1.4rem; font-family:var(--sans); font-weight:800; text-transform:uppercase; letter-spacing:-0.01em; font-size:clamp(1.4rem,3vw,2rem); color:var(--ink); }
.ywf-oc-faq-item { border-top:1px solid var(--line); }
.ywf-oc-faq-item:last-child { border-bottom:1px solid var(--line); }
.ywf-oc-faq-q { width:100%; text-align:left; background:none; border:none; padding:1.25rem 0; display:flex; justify-content:space-between; align-items:center; gap:1rem; font-family:var(--sans); font-size:.92rem; font-weight:600; text-transform:uppercase; letter-spacing:.02em; color:var(--ink); cursor:pointer; transition:opacity .2s; }
.ywf-oc-faq-q:hover { opacity:.62; }
.ywf-oc-faq-toggle { font-size:1.35rem; font-weight:300; line-height:1; flex-shrink:0; color:var(--babe-deep); }
.ywf-oc-faq-a { max-height:0; overflow:hidden; transition:max-height .35s ease; }
.ywf-oc-faq-item.is-open .ywf-oc-faq-a { max-height:500px; }
.ywf-oc-faq-a-inner { padding:0 0 1.3rem; font-size:.92rem; line-height:1.7; color:var(--soft); max-width:94%; }

/* ---------- honeypot (visually hidden, kept in DOM) ---------- */
.ywf-oc-hp { position:absolute !important; left:-5000px !important; width:1px; height:1px; overflow:hidden; }

/* ---------- error ---------- */
.ywf-oc-error {
  background:#FBEDED; border:1px solid #E7C3C3; color:#8A3B3B;
  padding:0.8rem 1rem; font-size:0.85rem; line-height:1.5;
}

/* ---------- submit ---------- */
.ywf-oc-submit {
  display:inline-flex; align-items:center; justify-content:center; gap:0.6rem; align-self:flex-start;
  margin-top:0.4rem; padding:1.1rem 2.6rem; font-family:var(--sans); font-size:0.78rem; font-weight:500;
  letter-spacing:0.22em; text-transform:uppercase; cursor:pointer;
  background:var(--babe) !important; color:#fff !important; border:1px solid var(--babe) !important;
  border-radius:0 !important; transition:background .25s, color .25s, border-color .25s;
}
.ywf-oc-submit:hover:not(:disabled) { background:#fff !important; color:var(--babe) !important; border-color:var(--babe) !important; }
.ywf-oc-submit:disabled { opacity:.75; cursor:default; }
.ywf-oc-spinner {
  width:15px; height:15px; border:2px solid rgba(255,255,255,.5); border-top-color:#fff;
  border-radius:50%; display:none; animation:ywf-oc-spin .7s linear infinite;
}
.ywf-oc-submit.is-loading .ywf-oc-spinner { display:inline-block; }
.ywf-oc-submit.is-loading:hover .ywf-oc-spinner { border-color:rgba(168,214,240,.5); border-top-color:var(--babe); }
@keyframes ywf-oc-spin { to { transform:rotate(360deg); } }

/* ---------- success ---------- */
.ywf-oc-success { text-align:center; padding:2.5rem 1.5rem; border:1px solid var(--line); background:var(--paper); }
.ywf-oc-success-mark {
  width:54px; height:54px; margin:0 auto 1.1rem; display:flex; align-items:center; justify-content:center;
  background:var(--babe-deep); color:#fff; font-size:1.6rem; line-height:1;
}
.ywf-oc-success-title { margin:0 0 0.6rem; font-weight:800; text-transform:uppercase; letter-spacing:-0.01em; font-size:1.4rem; color:var(--ink); }
.ywf-oc-success-msg { margin:0 auto; max-width:46ch; color:var(--soft); font-size:0.98rem; line-height:1.7; }

/* ---------- responsive ---------- */
@media (max-width:560px) {
  .ywf-oc-row { grid-template-columns:1fr; gap:1.25rem; }
  .ywf-oc-field-party { max-width:none; }
  .ywf-oc-cal { padding:0.7rem; }
  .ywf-oc-cal-grid { gap:3px; }
  .ywf-oc-day { font-size:0.82rem; min-height:38px; }
  .ywf-oc-submit { width:100%; align-self:stretch; }
}
@media (prefers-reduced-motion:reduce) {
  .ywf-oc-spinner { animation:none; }
  .ywf-oc-day, .ywf-oc-submit, .ywf-oc-cal-arrow { transition:none; }
}