/* ==========================================================================
   Bulk Quote template (template-bulk-quote.php)
   Loaded only on that template, after style.css, so it reuses the theme's
   palette, .rule, .btn-call and .checklist.
   ========================================================================== */

.bulk-section{ padding:72px 0 80px; }
.bulk-section--navy{ background: var(--navy); }
.bulk-section--blue{ background: var(--blue); }

.bulk-section__title{
  font-size: clamp(1.5rem, 2.6vw, 1.875rem);   /* → 30px */
  font-weight:700;
  line-height:1.2;
  margin-bottom:48px;
}

.bulk-btn{ margin-top:28px; padding-left: 32px !important; background-color: #32CD32 !important; }

/* ---------- Header button (mobile only) ----------
   Printed beside the logo via the scotia_header_actions hook. Desktop
   already has the hero button in view, so it only shows below 992px, the
   same breakpoint the theme uses for its mobile header. */

.bulk-header-cta{ display:none; }

@media (max-width: 991.98px){
  /* The theme's header row still wraps, so its full-width call button (when
     enabled) keeps its own row underneath. */
  .site-header .container:has(.bulk-header-cta){ column-gap:12px; }
  .bulk-header-cta{
    display:inline-flex;
    align-items:center;
    order:2;
    margin-left:auto;
    padding:10px 16px;
    border-radius: var(--radius-pill);
    background: #32CD32;
    color: var(--white);
    font-size:0.75rem;
    font-weight:800;
    line-height:1.2;
    letter-spacing:0.03em;
    text-transform:uppercase;
    white-space:nowrap;
    transition: background-color .18s ease;
  }
  .bulk-header-cta:hover,
  .bulk-header-cta:focus-visible{ background: var(--gold-dark); color: var(--white); }
}

/* Small phones: shrink the logo a touch so both fit on one row. */
@media (max-width: 399.98px){
  .site-header .container:has(.bulk-header-cta) .brand img{ height:32px; }
  .bulk-header-cta{ padding:9px 12px; font-size:0.6875rem; letter-spacing:0; }
}

/* Gold disc used for audience icons and step numbers. */
.bulk-icon{
  display:grid;
  place-items:center;
  width:64px;
  height:64px;
  border-radius:50%;
  background: var(--gold);
  color: var(--navy);
}
.bulk-icon svg{ width:34px; height:34px; }
.bulk-icon img{ width:38px; height:38px; object-fit:contain; }

/* ---------- Hero ---------- */

.bulk-hero{
  background: var(--navy);
  padding:72px 0 96px;
}
.bulk-hero__title{
  font-size: clamp(2rem, 3.6vw, 2.75rem);      /* → 44px */
  font-weight:700;
  line-height:1.2;
  text-wrap: balance;
}
.bulk-hero__title + .rule{ margin-top:22px; }
.bulk-hero__lead{
  font-size:1.1875rem;
  line-height:1.6;
  margin-top:26px;
  max-width:31em;
}
/* Bouncing text + button share a shrink-to-fit column, so the text is
   centred over the button. Colour, size and bounce come from the theme's
   .bouncing-text. */
.bulk-hero__cta{
  display:inline-flex;
  flex-direction:column;
  align-items:center;
}
.bulk-bounce{ margin-top:24px; text-align:center; }
.bulk-bounce + .bulk-btn{ margin-top:16px; }
/* If the text is the wider of the two, the button grows to match so both
   still start on the hero's left edge. */
.bulk-hero__cta .bulk-btn{
  align-self:stretch;
  justify-content:center;
  padding-inline:32px;
}

.bulk-hero__phone{
  margin-top:20px;
  font-size:0.9375rem;
}
.bulk-hero__phone a{ color: var(--white); }
.bulk-hero__phone a:hover{ color: var(--gold); }
.bulk-hero__media{ text-align:center; }
.bulk-hero__image{ width:100%; max-width:440px; height:auto; }

/* ---------- Who We Help ---------- */

.bulk-audiences__list,
.bulk-steps__list{ margin:0; padding:0; list-style:none; }

.bulk-audience__title,
.bulk-step__title{
  margin-top:24px;
  color: var(--gold);
  font-size:1.1875rem;
  font-weight:800;
  line-height:1.3;
}
.bulk-audience__text,
.bulk-step__text{
  margin-top:10px;
  font-size:0.9375rem;
  line-height:1.6;
  max-width:16em;
}

/* ---------- Bulk Discounts / Wholesale ---------- */

.bulk-offers__title{
  font-size: clamp(1.375rem, 2.2vw, 1.75rem);
  font-weight:700;
  line-height:1.25;
}
.bulk-offers__text{
  margin-top:24px;
  font-size:1rem;
  line-height:1.7;
  max-width:30em;
}
.bulk-offers__text p + p{ margin-top:1em; }

/* ---------- Trust band ----------
   Reuses the Bulk Discounts title/text styles. It follows the navy
   "What's Available" section, so a hairline keeps the two apart. */

.bulk-available + .bulk-trust{ border-top:1px solid var(--rule); }
.bulk-trust__text{ max-width:40em; }

.bulk-trust__quotes{ margin-top:40px; }
.bulk-quote{
  height:100%;
  margin:0;
  padding:28px 30px;
  border-left:4px solid var(--gold);
  border-radius:0 var(--radius-card) var(--radius-card) 0;
  background: rgba(255,255,255,.06);
}
.bulk-quote__text{ margin:0; font-size:1.0625rem; line-height:1.65; }
.bulk-quote__text p + p{ margin-top:.8em; }
.bulk-quote__cite{ margin-top:16px; font-size:0.9375rem; }
.bulk-quote__name{ display:block; color: var(--gold); font-weight:800; }
.bulk-quote__detail{ display:block; color: var(--muted); }

/* ---------- How It Works ---------- */

.bulk-step__number{
  width:56px;
  height:56px;
  font-size:1.5rem;
  font-weight:800;
  line-height:1;
}

/* ---------- What's Available ---------- */

.bulk-available__title{
  font-size: clamp(1.5rem, 2.6vw, 1.875rem);
  font-weight:700;
  margin-bottom:26px;
}
.bulk-checklist li{
  padding-left:28px;
  margin-bottom:10px;
  font-size:1rem;
}
.bulk-checklist li::before{ width:18px; height:18px; top:3px; }

.bulk-available__image{
  display:block;
  width:100%;
  height:auto;
  border-radius: var(--radius-card);
}

/* ---------- Request a Bulk Quote ----------
   Styles the Contact Form 7 form (.form-row-three / .form-row-two / .form-row-one markup),
   scoped to this section so other CF7 forms are untouched. */

#bulk-quote{ scroll-margin-top:24px; }
.bulk-form{ padding-bottom:96px; }
/* Reassurance line directly under the heading. */
.bulk-form .bulk-section__title:has(+ .bulk-form__intro){ margin-bottom:14px; }
.bulk-form__intro{
  max-width:40em;
  margin:0 auto 36px;
  color: var(--white);
  font-size:1rem;
  line-height:1.6;
  text-align:center;
  text-wrap: balance;
}
.bulk-form__card{
  max-width:780px;
  margin-inline:auto;
}

.bulk-form .wpcf7-form{
  display:grid;
  gap:12px;
}
.bulk-form .hidden-fields-container{ display:none; }
.bulk-form .form-row p{ margin:0; }
.bulk-form .form-row br{ display:none; }   /* CF7 auto-<p> line breaks */

.bulk-form .form-row-two p{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}
.bulk-form .form-row-three p{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:12px;
}
.bulk-form .wpcf7-form-control-wrap{ display:block; position:relative; }

/* Text fields, selects and textarea */
.bulk-form input:is([type="text"],[type="email"],[type="tel"],[type="number"]),
.bulk-form select,
.bulk-form textarea{
  display:block;
  width:100%;
  min-height:50px;
  padding:12px 16px;
  border:2px solid transparent;
  border-radius: var(--radius-field);
  background: var(--white);
  color: var(--navy);
  font-family: var(--font);
  font-size:0.9375rem;
  line-height:1.4;
  box-shadow:none;
  transition: border-color .15s ease;
}
.bulk-form textarea{
  height:132px;
  min-height:100px;
  resize:vertical;
}
.bulk-form ::placeholder{ color:#5A6A8A; opacity:1; }

.bulk-form select{
  appearance:none;
  -webkit-appearance:none;
  padding-right:44px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath fill='%23023177' d='M0 0h10L5 6z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 16px center;
  background-size:10px 6px;
  cursor:pointer;
}
/* Placeholder-style first option ("Number of Containers", etc.) */
.bulk-form select:has(option[value=""]:checked){ color:#5A6A8A; }

.bulk-form input:focus,
.bulk-form select:focus,
.bulk-form textarea:focus{
  outline:none;
  border-color: var(--gold);
}

/* "Condition:" label + checkbox group */
.bulk-form .form-label{
  margin:6px 0 2px;
  font-size:0.9375rem;
  font-weight:800;
}
.bulk-form .wpcf7-checkbox{
  display:flex;
  flex-wrap:wrap;
  gap:10px 32px;
  padding-block:6px;
}
.bulk-form .wpcf7-list-item{ margin:0; }
.bulk-form .wpcf7-list-item label:has(input[type="checkbox"]){
  display:inline-flex;
  align-items:center;
  max-width:none;
  cursor:pointer;
  font-size:0.9375rem;
}
.bulk-form .wpcf7-list-item input[type="checkbox"]{
  margin-right:10px;
  border-color: var(--white);
}

/* Submit */
.bulk-form .form-row:has(.wpcf7-submit) p{
  display:flex;
  justify-content:center;
  align-items:center;
  margin-top:20px;
}
.bulk-form .wpcf7-submit{
  min-height:54px;
  padding:12px 48px;
  border:0;
  border-radius: var(--radius-pill);
  background: var(--gold);
  color: var(--white);
  font-family: var(--font);
  font-size:0.9375rem;
  font-weight:800;
  letter-spacing:0.02em;
  text-transform:uppercase;
  cursor:pointer;
  transition: background-color .18s ease, transform .18s ease;
}
.bulk-form .wpcf7-submit:hover,
.bulk-form .wpcf7-submit:focus-visible{
  background: var(--gold-dark);
  transform: translateY(-1px);
}
.bulk-form .wpcf7-submit:disabled{ opacity:.6; cursor:wait; transform:none; }
.bulk-form .wpcf7-spinner{ margin:0 0 0 12px; }

/* Validation + response messages */
.bulk-form .wpcf7-not-valid{ border-color:#FF8A80; }
.bulk-form .wpcf7-not-valid-tip{
  margin-top:6px;
  color:#FFC9C4;
  font-size:0.8125rem;
  font-weight:600;
}
.bulk-form .wpcf7 form .wpcf7-response-output{
  margin:8px 0 0;
  padding:12px 16px;
  border:2px solid var(--gold);
  border-radius: var(--radius-field);
  font-size:0.9375rem;
  text-align:center;
}
.bulk-form .wpcf7 form.invalid .wpcf7-response-output,
.bulk-form .wpcf7 form.unaccepted .wpcf7-response-output,
.bulk-form .wpcf7 form.failed .wpcf7-response-output{ border-color:#FF8A80; }
.bulk-form .wpcf7 form.init .wpcf7-response-output{ display:none; }

@media (max-width: 575.98px){
  .bulk-form .form-row-two p{ grid-template-columns:1fr; }
  .bulk-form .wpcf7-submit{ width:100%; }
}

/* ---------- Closing CTA ---------- */

.bulk-cta{ padding:64px 0; }
.bulk-cta__title{
  font-size: clamp(1.5rem, 2.6vw, 1.875rem);
  font-weight:700;
}
.bulk-cta__text{ margin-top:16px; }
.bulk-cta__text a{ color: var(--gold); font-weight:800; white-space:nowrap; }
.bulk-cta__text a:hover{ color: var(--gold-dark); }
.bulk-cta .bulk-btn{ margin-top:0; }

/* ---------- Responsive ---------- */

@media (max-width: 991.98px){
  .bulk-hero{ padding:48px 0 64px; }
  .bulk-hero__image{ max-width:360px; }
  .bulk-section{ padding:56px 0 64px; }
  .bulk-section__title{ margin-bottom:36px; }
  .bulk-available__image{ max-width:480px; margin-inline:auto; }
}

@media (max-width: 767.98px){
  .bulk-hero{ padding:36px 0 52px; }
  .bulk-hero__lead{ font-size:1.0625rem; margin-top:22px; }
  .bulk-audience__text,
  .bulk-step__text{ max-width:none; }
  .bulk-cta{ text-align:center; }
}