/* FI Claim Free Session — front end (minimal mono + subtle accent).
   Swap --accent to #BCF986 for the brand-lime look. */
.fic-stage{
  --ink:#0b0b0c;
  --ink-soft:#6b7280;
  --line:#e6e6e8;
  --accent:#16a34a;
  --accent-ink:#ffffff;
  --bg:#f5f5f4;
  --card:#ffffff;
  --radius:22px;
  --maxw:620px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --shadow:0 1px 2px rgba(16,16,18,.04), 0 18px 50px -24px rgba(16,16,18,.22);

  box-sizing:border-box;
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
}
.fic-stage *{ box-sizing:border-box; }

/* Standalone lander (/claim-free-session): full-screen centred card. */
.fic-stage--full{
  min-height:100svh;
  display:flex; align-items:center; justify-content:center;
  padding:24px 16px;
  background:
    radial-gradient(1200px 600px at 50% -10%, #ffffff 0%, rgba(255,255,255,0) 60%),
    var(--bg);
}
/* Embedded in a normal page (suburb/blog pages): inline, no full-screen takeover. */
.fic-stage--inline{ display:block; padding:48px 0; background:none; }
.fic-stage--inline .fic-card{ margin:0 auto; }

.fic-card{
  position:relative; width:100%; max-width:var(--maxw);
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow); padding:clamp(22px,4vw,40px); overflow:hidden;
}

.fic-head{ margin-bottom:16px; text-align:center; }
.fic-title{ margin:0; font-size:clamp(27px,6.6vw,36px); font-weight:800; letter-spacing:-.022em; line-height:1.1; color:var(--ink); }

.fic-progress{ height:4px; background:var(--line); border-radius:999px; overflow:hidden; margin-bottom:18px; }
.fic-progress > i{ display:block; height:100%; width:0%; background:var(--accent); border-radius:999px; transition:width .5s var(--ease); }

.fic-steps{ position:relative; margin:0; }
.fic-step{ display:none; animation:fic-rise .45s var(--ease) both; }
.fic-step.active{ display:block; }
@keyframes fic-rise{ from{ opacity:0; transform:translateY(10px) } to{ opacity:1; transform:none } }

.fic-qrow{ display:flex; align-items:baseline; gap:10px; margin:0 0 22px; }
.fic-qnum{ font-size:13px; font-weight:600; color:var(--accent); flex:none; transform:translateY(-1px); }
.fic-q{ font-size:clamp(22px,3.8vw,28px); line-height:1.22; font-weight:600; letter-spacing:-.012em; margin:0; }
.fic-q .req{ color:#ef4444; font-weight:600; margin-left:3px; }

.fic-choices{ display:grid; gap:10px; }
.fic-choice{
  appearance:none; text-align:left; cursor:pointer; background:#fff; border:1.5px solid var(--line);
  border-radius:14px; padding:16px 18px; font:inherit; font-size:16px; font-weight:500; color:var(--ink);
  display:flex; align-items:center; gap:14px; transition:.16s var(--ease); -webkit-tap-highlight-color:transparent;
}
.fic-choice:hover{ border-color:var(--ink); background:var(--ink); color:#fff; transform:translateY(-1px); }
.fic-choice:hover .key{ background:#fff; border-color:#fff; color:var(--ink); }
.fic-choice .key{
  flex:none; width:26px; height:26px; border-radius:7px; border:1.5px solid var(--line);
  display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; color:var(--ink-soft); transition:.16s var(--ease);
}
.fic-choice.sel{ border-color:var(--ink); background:var(--ink); color:#fff; }
.fic-choice.sel .key{ background:#fff; border-color:#fff; color:var(--ink); }

.fic-field{ position:relative; }
.fic-input{
  width:100%; font:inherit; font-size:18px; color:var(--ink); border:none; border-bottom:2px solid var(--line);
  background:transparent; padding:12px 2px; outline:none; transition:border-color .18s var(--ease);
}
.fic-input::placeholder{ color:#b6b6bb; }
.fic-input:focus{ border-color:var(--accent); }

.fic-error{ min-height:18px; margin-top:10px; font-size:13px; color:#ef4444; font-weight:500; }

.fic-actions{ display:flex; align-items:center; gap:14px; margin-top:24px; }
.fic-cta{
  appearance:none; cursor:pointer; font:inherit; font-weight:600; font-size:15px; background:var(--ink); color:#fff;
  border:1px solid var(--ink); border-radius:12px; padding:13px 26px; transition:.16s var(--ease); -webkit-tap-highlight-color:transparent;
}
.fic-cta:hover, .fic-cta:focus, .fic-cta:focus-visible, .fic-cta:active{ background:var(--ink); color:#fff; border-color:var(--ink); outline:none; transform:translateY(-1px); box-shadow:0 10px 24px -12px rgba(11,11,12,.6); }
.fic-cta.is-busy{ opacity:.7; pointer-events:none; }
.fic-hint{ font-size:12.5px; color:var(--ink-soft); }
.fic-hint b{ color:var(--ink); font-weight:600; }

/* booking step — preloaded in the DOM (display:none still lets the Fluent Booking Vue app
   mount + fetch availability), then shown instantly. No opacity animation: with fill-mode
   'both' a non-running animation can stick the calendar at opacity:0 (reduced-motion / some
   mobile browsers) — which hid the calendar. Plain display toggle = always visible. */
.fic-booking{ display:none; opacity:1; }
.fic-booking.is-shown{ display:block; opacity:1; }
.fic-booking-lead{ font-size:clamp(20px,3.4vw,25px); font-weight:600; letter-spacing:-.01em; margin:0 0 18px; }
.fic-booking-cal{ min-height:120px; }

/* Fluent Booking forces its desktop two-column layout (fcal_on_md) even inside our ~480px
   card, which squashes the date grid (overlapping day headers + horizontal overflow).
   Force a single-column stack so the host info sits above a full-width calendar. */
/* Narrow-card fallback ONLY while the card is still the narrow quiz (not yet dissolved).
   Once .is-booking dissolves the card to full width, Fluent Booking keeps its natural
   two-column layout (no force-stack) — fixes the squashed calendar on inline embeds. */
.fic-card:not(.is-booking) .fic-booking .fcal_calendar_inner{ flex-direction:column !important; gap:16px !important; }
.fic-card:not(.is-booking) .fic-booking .fcal_calendar_inner > *{ width:100% !important; max-width:100% !important; flex:0 0 auto !important; }

/* Booking step shown: dissolve the card "body" (keep only the heading) and let the Fluent
   Booking calendar use its natural full-width layout. Applies to BOTH the standalone lander
   (--full) and inline embeds on suburb/blog pages (--inline) so the calendar is never squashed.
   width:100% keeps it inside its content column; max-width reaches ~1000px on desktop. */
.fic-card.is-booking{
  max-width:min(96vw,1000px); margin-inline:auto;
  background:transparent; border:none; box-shadow:none; padding:0; overflow:visible;
}
.fic-card.is-booking .fic-head{ text-align:center; margin-bottom:16px; }
.fic-card.is-booking .fic-progress{ display:none; }
.fic-card.is-booking .fic-booking-lead{ text-align:center; }

/* keep the hidden capture form out of view but submittable */
.fi-claim-hidden-form{ position:absolute !important; left:-9999px !important; top:auto !important; width:1px !important; height:1px !important; overflow:hidden !important; }
.fic-hp{ display:none !important; }

/* In-content links: match the minimal black design instead of the theme's blue. Scoped to
   article/body copy only — site nav, footer, and .gb-button / block-button CTAs keep their own
   styling. Loads on every page carrying the claim form (the suburb/landing pages). */
.entry-content a:not(.gb-button):not([class*="gb-container-link"]):not(.wp-block-button__link):not(.wp-element-button):not([class*="button"]){
  color:#0b0b0c;
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:2px;
  text-decoration-color:rgba(11,11,12,.30);
  transition:color .15s ease, text-decoration-color .15s ease;
}
.entry-content a:not(.gb-button):not([class*="gb-container-link"]):not(.wp-block-button__link):not(.wp-element-button):not([class*="button"]):hover{
  color:#16a34a;
  text-decoration-color:#16a34a;
}

/* --- Booking submit loading state: adds a spinner to Fluent Booking's native
   .fcal_btn_submitting state so users get clear feedback during the (multi-second)
   booking POST. FB toggles this class itself; we only style it. --- */
.fcal_btn_submitting{
  position:relative;
  pointer-events:none;
  opacity:.92;
}
.fcal_btn_submitting::before{
  content:"";
  width:1em;
  height:1em;
  margin-right:.5em;
  border:2px solid rgba(255,255,255,.45);
  border-top-color:#fff;
  border-radius:50%;
  display:inline-block;
  vertical-align:-.15em;
  animation:fic-spin .6s linear infinite;
}
@keyframes fic-spin{ to{ transform:rotate(360deg); } }
