/* =====================================================================
   Superstars Festival — Team Entry form skin
   Palette + type from md/superstarsfestival.co.uk-DESIGN.md
   Radii softened at client request (design system specifies 0px).
   Loaded automatically by the SSF Team Entry Availability plugin.
   ===================================================================== */

.forminator-custom-form {
  /* --- palette (design system §2) --- */
  --ssf-navy:#0E1F3D;
  --ssf-navy-deep:#0A1729;
  --ssf-blue:#3480C4;
  --ssf-blue-deep:#286AA5;
  --ssf-blue-pale:#DCEBFA;
  --ssf-blue-mist:#EDF5FC;
  --ssf-canvas:#FAFAF8;
  --ssf-ink:#0D0D0F;
  --ssf-body:#2A3E4A;
  --ssf-muted:#5B5F66;
  --ssf-faint:#C9C9C9;
  --ssf-border:#DEDEDC;
  --ssf-white:#FFFFFF;

  /* --- spacing (§5) --- */
  --sp-xs:8px; --sp-sm:12px; --sp-md:16px; --sp-lg:20px;
  --sp-xl:24px; --sp-xxxl:32px; --sp-section:36px;

  /* --- radii (softened) --- */
  --r-input:10px;
  --r-card:14px;
  --r-pill:9999px;

  --font:"Outfit",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;

  max-width:860px; margin:0 auto;
  background:var(--ssf-white);
  border:1px solid var(--ssf-border);
  border-radius:var(--r-card);
  box-shadow:none;
  padding:0 0 var(--sp-section);
  overflow:hidden;
  font-family:var(--font);
  color:var(--ssf-body);
  font-size:17px; line-height:1.5;
}

/* inner content gets the padding, so the stepper can go full-bleed */
.forminator-custom-form .forminator-row,
.forminator-custom-form .forminator-pagination-footer,
.forminator-custom-form .forminator-pagination-nav{
  padding-left:var(--sp-xxxl); padding-right:var(--sp-xxxl);
}

/* =====================================================================
   1. STEPPER  —  numbered circles, connector rail, labels beneath
   ===================================================================== */
.forminator-custom-form .forminator-pagination-steps{
  display:flex; align-items:flex-start;
  background:var(--ssf-navy);
  border-radius:0;
  padding:var(--sp-xl) var(--sp-xxxl) var(--sp-lg);
  margin:0 0 var(--sp-section);
  counter-reset:ssfstep;
}

.forminator-custom-form .forminator-step{
  position:relative;
  flex:1 1 0; min-width:0;
  display:flex; flex-direction:column-reverse;   /* circle above label */
  align-items:center; gap:var(--sp-sm);
  counter-increment:ssfstep;
  text-align:center;
}

/* connector rail between circles */
.forminator-custom-form .forminator-step::before{
  content:""; position:absolute; z-index:0;
  top:16px; left:-50%; width:100%; height:2px;
  background:rgba(255,255,255,.18);
}
.forminator-custom-form .forminator-step:first-child::before{ display:none; }
.forminator-custom-form .forminator-step.forminator-step-complete::before,
.forminator-custom-form .forminator-step.forminator-step-active::before{
  background:var(--ssf-blue);
}

/* the numbered circle */
.forminator-custom-form .forminator-step-dot,
.forminator-custom-form .forminator-step > span:not(.forminator-step-label){
  position:relative; z-index:1;
  width:34px; height:34px; flex:none;
  display:flex; align-items:center; justify-content:center;
  border-radius:var(--r-pill);
  background:transparent;
  border:2px solid rgba(255,255,255,.28);
  font-family:var(--font); font-size:15px; font-weight:800; line-height:1;
  color:rgba(255,255,255,.55);
}
.forminator-custom-form .forminator-step-dot::before,
.forminator-custom-form .forminator-step > span:not(.forminator-step-label)::before{
  content:counter(ssfstep);
}
.forminator-custom-form .forminator-step.forminator-step-active .forminator-step-dot,
.forminator-custom-form .forminator-step.forminator-step-complete .forminator-step-dot,
.forminator-custom-form .forminator-step.forminator-step-active > span:not(.forminator-step-label),
.forminator-custom-form .forminator-step.forminator-step-complete > span:not(.forminator-step-label){
  background:var(--ssf-blue); border-color:var(--ssf-blue); color:var(--ssf-white);
}

.forminator-custom-form .forminator-step-label{
  font-family:var(--font);
  font-size:13px; font-weight:700; line-height:1.15;
  letter-spacing:1.4px; text-transform:uppercase;
  color:rgba(255,255,255,.55);
}
.forminator-custom-form .forminator-step.forminator-step-active .forminator-step-label,
.forminator-custom-form .forminator-step.forminator-step-complete .forminator-step-label{
  color:var(--ssf-white);
}

/* =====================================================================
   2. LABELS & INPUTS
   ===================================================================== */
.forminator-custom-form .forminator-label{
  font-family:"Poppins",var(--font);
  font-size:14px; font-weight:600; line-height:1.2;
  text-transform:uppercase; letter-spacing:.4px;
  color:var(--ssf-ink);
  margin-bottom:var(--sp-xs);
}
.forminator-custom-form .forminator-required{ color:var(--ssf-blue); }

.forminator-custom-form input[type=text],
.forminator-custom-form input[type=email],
.forminator-custom-form input[type=tel],
.forminator-custom-form input[type=number],
.forminator-custom-form textarea,
.forminator-custom-form select{
  width:100%;
  font-family:var(--font); font-size:16px; line-height:1.5;
  color:var(--ssf-body);
  background-color:var(--ssf-white);      /* 3. no transparency */
  background-image:none;
  border:1px solid var(--ssf-border);
  border-radius:var(--r-input);           /* 2. softened corners */
  padding:14px var(--sp-md);
  box-shadow:none;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.forminator-custom-form input::placeholder,
.forminator-custom-form textarea::placeholder{ color:var(--ssf-faint); }

.forminator-custom-form input:focus,
.forminator-custom-form textarea:focus,
.forminator-custom-form select:focus{
  outline:none;
  border-color:var(--ssf-blue);
  box-shadow:0 0 0 3px rgba(52,128,196,.18);
}

/* 3. dropdowns — solid fill, custom navy chevron, opaque option list */
.forminator-custom-form select{
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  padding-right:44px;
  background-color:var(--ssf-white);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%230E1F3D' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right var(--sp-md) center;
  cursor:pointer;
}
.forminator-custom-form select option{
  background-color:var(--ssf-white);
  color:var(--ssf-body);
  padding:var(--sp-sm);
}
.forminator-custom-form select option:disabled{ color:var(--ssf-faint); }

.forminator-custom-form .forminator-error-message{
  color:var(--ssf-navy); font-size:14px; font-weight:700;
  letter-spacing:.4px;
  margin-top:var(--sp-xs);
}
.forminator-custom-form .forminator-has_error input,
.forminator-custom-form .forminator-has_error select{
  border-color:var(--ssf-navy)!important; border-width:2px!important;
}

/* =====================================================================
   3. HEADINGS IN HTML FIELDS
   ===================================================================== */
.ssf-eyebrow{
  font-family:"Outfit",sans-serif;
  font-size:14px; font-weight:700; line-height:1;
  letter-spacing:1.4px; text-transform:uppercase;
  color:var(--ssf-blue);
  margin:0 0 var(--sp-sm);
}
.ssf-head{
  font-family:"Outfit",sans-serif;
  font-size:clamp(30px,4.5vw,44px); font-weight:800;
  line-height:1; letter-spacing:-1.2px; text-transform:uppercase;
  color:var(--ssf-ink);
  margin:0 0 var(--sp-md);
}
.ssf-sub{
  font-family:"Outfit",sans-serif;
  font-size:17px; font-weight:400; line-height:1.5;
  color:var(--ssf-body);
  margin:0 0 var(--sp-xl);
}

/* =====================================================================
   4. BUTTONS  —  pill, navy, lift on hover
   ===================================================================== */
.forminator-custom-form .forminator-button{
  font-family:var(--font);
  font-size:15px; font-weight:700; line-height:1;
  letter-spacing:1.4px; text-transform:uppercase;
  padding:var(--sp-lg) 40px; min-height:55px;
  border:none; border-radius:var(--r-pill);
  background:var(--ssf-navy); color:var(--ssf-white);
  box-shadow:none; cursor:pointer;
  transition:transform .15s ease, background-color .15s ease;
}
.forminator-custom-form .forminator-button:hover{
  background:var(--ssf-blue-deep); color:var(--ssf-white);
  transform:translateY(-2px);
}
.forminator-custom-form .forminator-button:active{ transform:translateY(0); }
.forminator-custom-form .forminator-button:focus{ outline:none; }

.forminator-custom-form .forminator-button-back{
  background:var(--ssf-white); color:var(--ssf-blue);
  border:2px solid var(--ssf-blue);
}
.forminator-custom-form .forminator-button-back:hover{
  background:var(--ssf-white); color:var(--ssf-blue-deep);
  border-color:var(--ssf-blue-deep);
}

/* =====================================================================
   5. PRICE BOX  —  one clean block, no nested input frame
   ===================================================================== */
.forminator-custom-form .forminator-field-calculation,
.forminator-custom-form [class*="forminator-field-calculation"]{
  display:flex; align-items:center; justify-content:space-between;
  gap:var(--sp-md);
  background:var(--ssf-blue-pale);
  border:none; border-radius:var(--r-card);
  padding:var(--sp-lg) var(--sp-xl);
  margin:0 0 var(--sp-lg);
}
/* kill every nested frame Forminator wraps the value in */
.forminator-custom-form .forminator-field-calculation *,
.forminator-custom-form [class*="forminator-field-calculation"] *{
  border:none!important;
  background:transparent!important;
  box-shadow:none!important;
  outline:none!important;
}
.forminator-custom-form .forminator-field-calculation .forminator-label{
  margin:0; color:var(--ssf-navy); font-size:14px;
}
.forminator-custom-form .forminator-field-calculation input{
  padding:0!important; width:auto!important; min-width:0;
  font-family:var(--font); font-size:40px; font-weight:800;
  line-height:1; letter-spacing:-1.2px;
  color:var(--ssf-navy)!important; text-align:right;
}

/* =====================================================================
   6. AVAILABILITY BOARD
   Design system declares no status ramp (§10), so states are separated
   by tint weight AND label, never by colour alone.
   ===================================================================== */
.ssf-board{ margin:var(--sp-xl,24px) 0 var(--sp-sm,12px); }

.ssf-board-title{
  display:flex; align-items:center; gap:var(--sp-sm,12px);
  margin-bottom:var(--sp-sm,12px);
  font-family:"Outfit",sans-serif;
  font-size:14px; font-weight:700; line-height:1;
  letter-spacing:1.4px; text-transform:uppercase;
  color:var(--ssf-blue,#3480C4);
}
.ssf-pin{ width:8px; height:8px; border-radius:9999px; background:var(--ssf-blue,#3480C4); }

.ssf-board-scroll{
  overflow-x:auto;
  border:1px solid var(--ssf-border,#DEDEDC);
  border-radius:var(--r-card,14px);
}
.ssf-board-msg{
  margin:0; padding:var(--sp-xl,24px);
  font-family:"Outfit",sans-serif; font-size:16px; line-height:1.5;
  color:var(--ssf-muted,#5B5F66);
}
.ssf-board-msg.ssf-warn{ color:var(--ssf-navy,#0E1F3D); font-weight:700; }

table.ssf-table{
  border-collapse:collapse; width:100%; min-width:620px;
  font-family:"Outfit",sans-serif; font-size:14px;
}
table.ssf-table th, table.ssf-table td{
  padding:var(--sp-sm,12px) var(--sp-xs,8px);
  text-align:center;
  border-bottom:1px solid var(--ssf-border,#DEDEDC);
  border-right:1px solid var(--ssf-border,#DEDEDC);
}
table.ssf-table tr:last-child th,
table.ssf-table tr:last-child td{ border-bottom:none; }
table.ssf-table th:last-child, table.ssf-table td:last-child{ border-right:none; }

table.ssf-table thead th{
  background:var(--ssf-navy,#0E1F3D); color:#fff;
  font-size:12px; font-weight:700; line-height:1.2;
  letter-spacing:1.2px; text-transform:uppercase;
  padding-top:var(--sp-md,16px); padding-bottom:var(--sp-md,16px);
}
table.ssf-table thead th.ssf-hi{ background:var(--ssf-blue,#3480C4); }

table.ssf-table tbody th{
  background:var(--ssf-canvas,#FAFAF8);
  text-align:left; white-space:nowrap;
  padding-left:var(--sp-md,16px);
  font-size:12px; font-weight:700; line-height:1.2;
  letter-spacing:1.2px; text-transform:uppercase;
  color:var(--ssf-ink,#0D0D0F);
}
table.ssf-table tr.ssf-rowhi td{ background:var(--ssf-blue-mist,#EDF5FC); }
table.ssf-table tr.ssf-rowhi th{ background:var(--ssf-blue-pale,#DCEBFA); color:var(--ssf-navy,#0E1F3D); }

table.ssf-table td.ssf-click{ cursor:pointer; transition:background-color .12s ease; }
table.ssf-table td.ssf-click:hover{ background:var(--ssf-blue-pale,#DCEBFA); }
table.ssf-table td.ssf-sel{ box-shadow:inset 0 0 0 2px var(--ssf-blue,#3480C4); }

.ssf-cell{
  display:inline-flex; align-items:center; gap:var(--sp-xs,8px);
  white-space:nowrap;
  font-size:12px; font-weight:700; line-height:1;
  letter-spacing:.6px; text-transform:uppercase;
  padding:6px var(--sp-sm,12px);
  border-radius:9999px;
}
.ssf-cell .ssf-d{ width:7px; height:7px; border-radius:9999px; flex:none; }

.ssf-cell.ssf-open{ background:var(--ssf-blue-pale,#DCEBFA); color:var(--ssf-blue-deep,#286AA5); }
.ssf-cell.ssf-open .ssf-d{ background:var(--ssf-blue,#3480C4); }

.ssf-cell.ssf-few{ background:var(--ssf-navy,#0E1F3D); color:#fff; }
.ssf-cell.ssf-few .ssf-d{ background:var(--ssf-blue,#3480C4); }

.ssf-cell.ssf-full{
  background:transparent; color:var(--ssf-faint,#C9C9C9);
  border:1px solid var(--ssf-faint,#C9C9C9);
  text-decoration:line-through;
}
.ssf-cell.ssf-full .ssf-d{ background:var(--ssf-faint,#C9C9C9); }

.ssf-legend{
  display:flex; flex-wrap:wrap; gap:var(--sp-lg,20px);
  margin-top:var(--sp-sm,12px);
  font-family:"Outfit",sans-serif; font-size:14px; line-height:1.5;
  color:var(--ssf-muted,#5B5F66);
}
.ssf-legend span{ display:inline-flex; align-items:center; gap:var(--sp-xs,8px); }
.ssf-legend i.ssf-d{ width:8px; height:8px; border-radius:9999px; display:inline-block; }
.ssf-legend i.ssf-open{ background:var(--ssf-blue,#3480C4); }
.ssf-legend i.ssf-few { background:var(--ssf-navy,#0E1F3D); }
.ssf-legend i.ssf-full{ background:var(--ssf-faint,#C9C9C9); }

/* =====================================================================
   7. REVIEW SUMMARY
   ===================================================================== */
.ssf-summary{
  border:1px solid var(--ssf-border,#DEDEDC);
  border-radius:var(--r-card,14px);
  overflow:hidden;
  margin:0 0 var(--sp-xl,24px);
}
.ssf-srow{
  display:flex; justify-content:space-between; gap:var(--sp-md,16px);
  padding:var(--sp-sm,12px) var(--sp-md,16px);
  border-bottom:1px solid var(--ssf-border,#DEDEDC);
  font-family:"Outfit",sans-serif; font-size:16px; line-height:1.5;
}
.ssf-srow:last-child{ border-bottom:none; }
.ssf-srow .k{
  font-family:"Poppins","Outfit",sans-serif;
  font-size:13px; font-weight:600; line-height:1.2;
  text-transform:uppercase; letter-spacing:.4px;
  color:var(--ssf-muted,#5B5F66);
}
.ssf-srow .v{ font-weight:700; text-align:right; color:var(--ssf-ink,#0D0D0F); }

.ssf-srow-total{
  background:var(--ssf-navy,#0E1F3D);
  padding:var(--sp-lg,20px) var(--sp-md,16px);
}
.ssf-srow-total .k{ color:var(--ssf-blue,#3480C4); }
.ssf-srow-total .v{
  font-family:"Outfit",sans-serif; font-size:30px; font-weight:800;
  line-height:1; letter-spacing:-1.2px; color:#fff;
}

/* =====================================================================
   8. RESPONSIVE
   ===================================================================== */
@media (max-width:768px){
  .forminator-custom-form{ border-radius:0; border-left:none; border-right:none; }
  .forminator-custom-form .forminator-row,
  .forminator-custom-form .forminator-pagination-footer,
  .forminator-custom-form .forminator-pagination-nav{
    padding-left:var(--sp-md); padding-right:var(--sp-md);
  }
  .forminator-custom-form .forminator-pagination-steps{ padding:var(--sp-lg) var(--sp-md); }
  .forminator-custom-form .forminator-step-label{ font-size:11px; letter-spacing:.6px; }
  .forminator-custom-form .forminator-row .forminator-col{ width:100%; }
  .forminator-custom-form .forminator-button{ width:100%; padding:var(--sp-lg) var(--sp-xl); }
  .forminator-custom-form .forminator-field-calculation input{ font-size:30px; }
}

/* =====================================================================
   9. OVERRIDES — custom stepper, select parity, debug panel
   These come last so they win over Forminator's own rules.
   ===================================================================== */

/* force light rendering of native dropdown popups */
.forminator-custom-form{ color-scheme:light; }

/* Forminator's own step indicator is hidden by the plugin; belt and braces */
.forminator-custom-form .forminator-pagination-steps[style*="display: none"]{ display:none!important; }

/* ---------- custom stepper ---------- */
.ssf-stepper{
  display:flex; align-items:flex-start;
  background:#0E1F3D;
  padding:24px 32px 20px;
  margin:0 0 36px;
}
.ssf-stp{
  position:relative;
  flex:1 1 0; min-width:0;
  display:flex; flex-direction:column; align-items:center; gap:10px;
  text-align:center;
}
.ssf-stp::before{
  content:""; position:absolute; z-index:0;
  top:16px; left:-50%; width:100%; height:2px;
  background:rgba(255,255,255,.18);
}
.ssf-stp:first-child::before{ display:none; }
.ssf-stp.is-active::before,
.ssf-stp.is-done::before{ background:#3480C4; }

.ssf-stp-dot{
  position:relative; z-index:1;
  width:34px; height:34px; flex:none;
  display:flex; align-items:center; justify-content:center;
  border-radius:9999px;
  background:transparent;
  border:2px solid rgba(255,255,255,.28);
  font-family:"Outfit",sans-serif; font-size:15px; font-weight:800; line-height:1;
  color:rgba(255,255,255,.55);
}
.ssf-stp.is-active .ssf-stp-dot,
.ssf-stp.is-done .ssf-stp-dot{
  background:#3480C4; border-color:#3480C4; color:#fff;
}

.ssf-stp-lbl{
  font-family:"Outfit",sans-serif;
  font-size:12px; font-weight:700; line-height:1.15;
  letter-spacing:1.2px; text-transform:uppercase;
  color:rgba(255,255,255,.55);
}
.ssf-stp.is-active .ssf-stp-lbl,
.ssf-stp.is-done .ssf-stp-lbl{ color:#fff; }

/* ---------- selects match text inputs exactly ---------- */
.forminator-custom-form select,
.forminator-custom-form .forminator-field select{
  border:1px solid #DEDEDC!important;
  border-radius:10px!important;
  background-color:#fff!important;
  color:#2A3E4A!important;
  font-family:"Outfit",sans-serif!important;
  font-size:16px!important;
  line-height:1.5!important;
  padding:14px 44px 14px 16px!important;
  height:auto!important; min-height:0!important;
  box-shadow:none!important;
}
.forminator-custom-form select:focus,
.forminator-custom-form .forminator-field select:focus{
  border-color:#3480C4!important;
  box-shadow:0 0 0 3px rgba(52,128,196,.18)!important;
}
.forminator-custom-form select option{
  background-color:#fff!important;
  color:#2A3E4A!important;
}

/* ---------- debug panel (?ssfdebug=1) ---------- */
.ssf-debug{
  margin:12px 0 0; padding:12px 16px;
  background:#0E1F3D; color:#DCEBFA;
  border-radius:10px;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:12px; line-height:1.5;
  white-space:pre-wrap; word-break:break-all;
}

@media (max-width:768px){
  .ssf-stepper{ padding:20px 16px 16px; margin-bottom:24px; }
  .ssf-stp-lbl{ font-size:10px; letter-spacing:.6px; }
}

/* =====================================================================
   10. SELECT2  —  Forminator renders dropdowns with Select2 and appends
   the option list to <body>, so these selectors are deliberately global.
   ===================================================================== */

/* the closed control, matched to the text inputs */
.select2-container--default .select2-selection--single,
.select2-container .select2-selection--single{
  height:auto!important;
  min-height:0!important;
  background-color:#fff!important;
  border:1px solid #DEDEDC!important;
  border-radius:10px!important;
  padding:13px 44px 13px 16px!important;
  outline:none!important;
  box-shadow:none!important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered{
  font-family:"Outfit",-apple-system,sans-serif!important;
  font-size:16px!important; line-height:1.5!important;
  color:#2A3E4A!important;
  padding:0!important;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder{
  color:#8A9199!important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow{
  height:100%!important; top:0!important; right:14px!important; width:12px!important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b{
  border-color:#0E1F3D transparent transparent transparent!important;
}
.select2-container--default.select2-container--open .select2-selection--single{
  border-color:#3480C4!important;
  box-shadow:0 0 0 3px rgba(52,128,196,.18)!important;
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b{
  border-color:transparent transparent #0E1F3D transparent!important;
}

/* the popup list — opaque, was see-through before */
.select2-container--open .select2-dropdown,
.select2-dropdown{
  background-color:#fff!important;
  border:1px solid #DEDEDC!important;
  border-radius:10px!important;
  box-shadow:0 12px 30px rgba(14,31,61,.16)!important;
  overflow:hidden;
  z-index:99999!important;
}
.select2-results{ background-color:#fff!important; }
.select2-results__options{ background-color:#fff!important; }
.select2-results__option{
  background-color:#fff!important;
  font-family:"Outfit",-apple-system,sans-serif!important;
  font-size:16px!important; line-height:1.5!important;
  color:#2A3E4A!important;
  padding:12px 16px!important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted{
  background-color:#DCEBFA!important;
  color:#0E1F3D!important;
}
.select2-container--default .select2-results__option[aria-selected=true],
.select2-container--default .select2-results__option[data-selected=true]{
  background-color:#3480C4!important;
  color:#fff!important;
}
.select2-container--default .select2-results__option[aria-disabled=true],
.select2-results__option[aria-disabled=true]{
  color:#C9C9C9!important;
  text-decoration:line-through;
}
.select2-search--dropdown{ background-color:#fff!important; padding:8px!important; }
.select2-search--dropdown .select2-search__field{
  border:1px solid #DEDEDC!important; border-radius:8px!important; padding:8px 12px!important;
}

/* Forminator's own step indicator, replaced by .ssf-stepper */
.forminator-custom-form .forminator-pagination-steps{ display:none!important; }

/* =====================================================================
   11. VALIDATION STATES + LAYOUT STABILITY
   Note: the design system declares no error colour (§10). Red added at
   client request because form validation needs to read as an error.
   ===================================================================== */

.forminator-custom-form{ --ssf-error:#C0392B; }

/* stop the form changing width when error messages appear */
.forminator-custom-form,
.forminator-custom-form *,
.forminator-custom-form *::before,
.forminator-custom-form *::after{ box-sizing:border-box; }

.forminator-custom-form{ width:100%!important; max-width:860px!important; }
.forminator-custom-form .forminator-row{ margin-left:0!important; margin-right:0!important; }
.forminator-custom-form .forminator-col{ min-width:0; }

/* reserve the error line so nothing jumps as messages appear */
.forminator-custom-form .forminator-error-message{
  color:#C0392B!important;
  font-family:"Outfit",-apple-system,sans-serif!important;
  font-size:13px!important; font-weight:600!important;
  letter-spacing:0!important; text-transform:none!important;
  line-height:1.4!important;
  margin-top:6px!important;
  overflow-wrap:anywhere;
}

.forminator-custom-form .forminator-required,
.forminator-custom-form .forminator-label .forminator-required{ color:#C0392B!important; }

.forminator-custom-form .forminator-has_error input,
.forminator-custom-form .forminator-has_error textarea,
.forminator-custom-form .forminator-has_error select,
.forminator-custom-form input.forminator-has_error,
.forminator-custom-form select.forminator-has_error{
  border-color:#C0392B!important;
  border-width:1px!important;
  box-shadow:0 0 0 3px rgba(192,57,43,.14)!important;
}

/* Select2 control in an error state */
.forminator-has_error .select2-container--default .select2-selection--single,
.forminator-has_error .select2-selection--single{
  border-color:#C0392B!important;
  box-shadow:0 0 0 3px rgba(192,57,43,.14)!important;
}

/* form-level error banner at the top of the form */
.forminator-custom-form .forminator-response-message.forminator-error{
  background:#FDECEA!important;
  border:1px solid #F0B7B0!important;
  border-radius:10px!important;
  color:#8C2A20!important;
  font-family:"Outfit",-apple-system,sans-serif!important;
  font-size:15px!important; font-weight:600!important;
  margin:0 32px 20px!important;
  padding:14px 16px!important;
}
@media (max-width:768px){
  .forminator-custom-form .forminator-response-message.forminator-error{ margin:0 16px 16px!important; }
}

/* =====================================================================
   12. STEPPER RAIL FIX
   Inactive dots were transparent, so the connector line showed through
   them. Fill them with the band colour so the rail stops at the circle.
   ===================================================================== */
.ssf-stepper{ position:relative; }

.ssf-stp-dot{
  background:#0E1F3D!important;          /* same as the band */
  box-shadow:0 0 0 4px #0E1F3D;          /* clears the rail either side */
  position:relative;
  z-index:2;
}
.ssf-stp.is-active .ssf-stp-dot,
.ssf-stp.is-done .ssf-stp-dot{
  background:#3480C4!important;
  box-shadow:0 0 0 4px #0E1F3D;
}

/* rail sits behind, and stops short of the circles */
.ssf-stp::before{
  top:17px!important;                    /* dead centre of a 34px dot */
  height:2px!important;
  z-index:0!important;
  transform:translateY(-1px);
}

/* =====================================================================
   13. SELECT2 CHEVRON
   Replaces Select2's CSS-triangle arrow with the design-system chevron,
   and stops stray placeholder text rendering in the arrow slot.
   ===================================================================== */
.select2-container--default .select2-selection--single .select2-selection__arrow b,
.select2-container .select2-selection--single .select2-selection__arrow b{
  display:none!important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow,
.select2-container .select2-selection--single .select2-selection__arrow{
  width:16px!important;
  height:100%!important;
  top:0!important;
  right:14px!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%230E1F3D' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  transition:transform .15s ease;
}
.select2-container--open .select2-selection--single .select2-selection__arrow{
  transform:rotate(180deg);
}

/* keep long labels tidy without spilling into the arrow */
.select2-container--default .select2-selection--single .select2-selection__rendered{
  padding-right:12px!important;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* never render a clear ("x") control — we don't allow clearing */
.select2-selection__clear{ display:none!important; }

/* =====================================================================
   14. SUBMITTED STATE
   Once the success message appears the plugin adds .ssf-submitted to the
   form; everything except the confirmation panel is then hidden.
   ===================================================================== */
.forminator-custom-form.ssf-submitted .ssf-stepper,
.forminator-custom-form.ssf-submitted .forminator-pagination,
.forminator-custom-form.ssf-submitted .forminator-pagination-steps,
.forminator-custom-form.ssf-submitted .forminator-pagination-footer,
.forminator-custom-form.ssf-submitted .forminator-pagination-nav,
.forminator-custom-form.ssf-submitted .forminator-row,
.forminator-custom-form.ssf-submitted .forminator-button{
  display:none!important;
}
.forminator-custom-form.ssf-submitted{ padding:0!important; }
.forminator-custom-form.ssf-submitted .forminator-response-message{
  display:block!important;
  background:transparent!important;
  border:none!important;
  margin:0!important;
  padding:0!important;
}

/* ---- the confirmation panel itself ---- */
.ssf-done{
  text-align:center;
  padding:56px 32px 60px;
  font-family:"Outfit",-apple-system,sans-serif;
}
.ssf-done-tick{
  width:72px; height:72px; margin:0 auto 24px;
  border-radius:9999px;
  background:#DCEBFA; color:#0E1F3D;
  display:flex; align-items:center; justify-content:center;
  font-size:34px; font-weight:800; line-height:1;
}
.ssf-done h2{
  font-family:"Outfit",sans-serif;
  font-size:clamp(28px,4vw,40px); font-weight:800;
  line-height:1; letter-spacing:-1.2px; text-transform:uppercase;
  color:#0D0D0F; margin:0 0 12px;
}
.ssf-done p{
  font-size:17px; line-height:1.5; color:#2A3E4A;
  margin:0 auto 16px; max-width:440px;
}
.ssf-done-ref{
  display:inline-block;
  background:#0E1F3D; color:#fff;
  font-size:15px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase;
  padding:12px 24px; border-radius:9999px;
  margin:8px 0 28px!important;
}
.ssf-done-note{
  font-size:14px!important; color:#5B5F66!important;
}
.ssf-done-btn{
  display:inline-block;
  background:#0E1F3D; color:#fff!important;
  font-size:15px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase;
  text-decoration:none!important;
  padding:20px 40px; border-radius:9999px;
  transition:transform .15s ease, background-color .15s ease;
}
.ssf-done-btn:hover{ background:#286AA5; transform:translateY(-2px); }
.ssf-done-btn.ssf-done-btn--ghost{
  background:#fff; color:#3480C4!important; border:2px solid #3480C4;
  margin-left:8px;
}
.ssf-done-btn.ssf-done-btn--ghost:hover{ background:#fff; color:#286AA5!important; border-color:#286AA5; }
@media (max-width:520px){
  .ssf-done-btn{ display:block; margin:0 0 12px!important; }
  .ssf-done-btn.ssf-done-btn--ghost{ margin-left:0!important; }
}

/* =====================================================================
   15. FIELD HEIGHT PARITY
   Elementor's global form styles use selectors like
   `.elementor-kit-N input:not([type=button]):not([type=submit])`, whose
   :not() arguments out-rank our rules — so text inputs were rendering short
   and square next to the tall rounded Select2 controls. Pin both to one
   height with !important.
   ===================================================================== */
.forminator-custom-form input[type=text],
.forminator-custom-form input[type=email],
.forminator-custom-form input[type=tel],
.forminator-custom-form input[type=number],
.forminator-custom-form textarea{
  box-sizing:border-box!important;
  height:52px!important;
  min-height:52px!important;
  padding:0 16px!important;
  border:1px solid #DEDEDC!important;
  border-radius:10px!important;
  background-color:#fff!important;
  font-family:"Outfit",-apple-system,sans-serif!important;
  font-size:16px!important;
  line-height:50px!important;
  color:#2A3E4A!important;
  box-shadow:none!important;
}
.forminator-custom-form textarea{
  height:auto!important; min-height:120px!important;
  padding:14px 16px!important; line-height:1.5!important;
}
.forminator-custom-form input[type=text]:focus,
.forminator-custom-form input[type=email]:focus,
.forminator-custom-form input[type=tel]:focus,
.forminator-custom-form input[type=number]:focus,
.forminator-custom-form textarea:focus{
  border-color:#3480C4!important;
  box-shadow:0 0 0 3px rgba(52,128,196,.18)!important;
  outline:none!important;
}

/* Select2 control: exactly the same 52px box */
.select2-container--default .select2-selection--single,
.select2-container .select2-selection--single{
  box-sizing:border-box!important;
  height:52px!important;
  min-height:52px!important;
  padding:0 44px 0 16px!important;
  display:flex!important;
  align-items:center!important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered{
  line-height:50px!important;
  padding:0!important;
}

/* calculation (fee) input sits inside the price box — keep it unboxed */
.forminator-custom-form .forminator-field-calculation input{
  height:auto!important; min-height:0!important; line-height:1!important;
  padding:0!important; border:none!important; background:transparent!important;
}

/* error state still wins over the parity rules above */
.forminator-custom-form .forminator-has_error input[type=text],
.forminator-custom-form .forminator-has_error input[type=email],
.forminator-custom-form .forminator-has_error input[type=tel]{
  border-color:#C0392B!important;
  box-shadow:0 0 0 3px rgba(192,57,43,.14)!important;
}