/* ==============================
   FREE DISCOVERY CALL 
   ============================== */

/* Let THIS page break out of the global .intro width:80% rule */
.intro.section-booking{
  width: min(1100px, 80%);  
  background-color: rgba(176,226,214,0.8);      /* wide enough for the calendar */
  max-width: var(--container-max);
  margin-top: var(--space-l);
  margin-left: auto;
  margin-right: auto;
  /* keep vertical padding, remove horizontal padding */
  padding-top: clamp(0.75rem, 3vw, 2rem);
  padding-bottom: clamp(0.75rem, 3vw, 2rem);
  padding-left: 0;
  padding-right: 0;
}



/* Keep your paragraphs readable even though the container is wider */
/* H1 = same styling as your regular h2 */
.section-booking h1.discovery-call-title{
  font-size: var(--fs-h2);
  color: var(--color-vividblue);
  max-width: 65ch;
  margin-inline: auto;
  text-wrap: balance;

  /* keep readable padding */
  padding-left: clamp(0.75rem, 3vw, 2rem);
  padding-right: clamp(0.75rem, 3vw, 2rem);
}

/* if you need h2 styling on that page, do it separately */
.section-booking h2{
  font-size: var(--fs-h2);
  color: var(--color-vividblue);
}

.text-lead--wide{
  max-width: 80%;
  margin-left:auto;
  margin-right:auto;
  font-family: var(--ff-heading); font-size: var(--fs-h3); 
  line-height: var(--lh-display); color: var(--color-vividblue); 
  margin-top: 0; margin-bottom: var(--space-xxs); }



.section-booking .separator{
  display: block;
  width: 50%;
  height: 1px;

  margin-left: auto;
  margin-right: auto;

  margin-top: var(--space-l);
  margin-bottom: 2px;

  background: var(--color-bridge);
}


.discovery-bullet{font-family:var(--ff-base);font-size:2em; margin-bottom:var(--space-xxs);line-height:1;
  vertical-align:middle;width:0.5rem;height:0.5rem;border-radius:50%;background: var(--color-yellow-hover);
}
.discovery-bullet{
  margin-top: clamp(0.15rem, 0.5vw, 0.25rem);
  margin-bottom: var(--space-xxs);
}


/* The embed itself should use the full available width */
.section-booking .tidycal-embed{
  width: 100%;
  max-width: 100%;
  margin: var(--space-m) auto 0;
}

/* TidyCal injects an iframe — force responsive behavior */
.section-booking .tidycal-embed iframe{
  display: block;
  width: 100% !important;
  max-width: 100% !important;

  /* the “shrink-to-fit” guard that helps across browsers */
  min-width: 100% !important;

  border: 0 !important;
  height: 780px; /* adjust if you want more/less vertical space */
}


.footer-fixed-contact { margin-top:var(--space-l); padding-top:var(--space-xs); font-family:var(--ff-base); font-size:0.85rem; line-height:1.4; text-align:center; 
  color:var(--color-vividblue); background:transparent; }
.footer-fixed-contact .footer-link { color:var(--color-vividblue); text-decoration:underline;}

/* Tablet / iPad tuning */
@media (min-width: 601px) and (max-width: 1024px){
  .intro.section-booking{
    width: 80%;
    max-width: var(--container-max);
  }

  .section-booking .tidycal-embed,
  .section-booking .tidycal-embed iframe{
    width: 100% !important;
    max-width: 100% !important;
    display: block;
  }

  .section-booking .tidycal-embed iframe{
    height: 800px;
    border: 0 !important;
  }
}

/* Phone tuning */
@media (max-width: 600px){
  .intro.section-booking{
    width: 90%;
    max-width: var(--container-max);
  }

  .intro.section-booking {margin-bottom: 5rem;}
  
  .section-booking .tidycal-embed,
  .section-booking .tidycal-embed iframe{
    width: 100% !important;
    max-width: 100% !important;
    display: block;
  }

  .section-booking .tidycal-embed iframe{
    height: 820px;
    border: 0 !important;
  }
}