/* ============ Become a Customer — Sysco bac layout 1:1 ============ */

/* HERO: photo + 90deg dark-left gradient, white 48px/600 title, left-aligned, 640px */
.bac2-hero { position: relative; height: min(640px, 62svh); min-height: 420px; display: flex; align-items: center; isolation: isolate; margin-top: 0; }
.bac2-hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.bac2-hero-grad { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(0,0,0,.8) 0%, rgba(0,0,0,.25) 55%, rgba(255,255,255,0) 75%); }
.bac2-hero-content h1 { color: #fff; font-family: var(--font-body, Inter, sans-serif); font-size: 48px; font-weight: 600; margin-bottom: 10px; }
.bac2-hero-content p { color: #fff; font-size: 1.15rem; font-weight: 500; }

/* SPLIT: two 480px-ish columns like Sysco's flex layout */
.bac2-split { background: #fff; padding: 64px 0 72px; }
.bac2-split-inner { display: flex; gap: 64px; justify-content: space-between; align-items: flex-start; }
.bac2-left { flex: 0 1 480px; }
.bac2-left h2 { font-size: 32px; font-weight: 600; color: #191B1D; line-height: 1.25; margin-bottom: 16px; font-family: var(--font-body, Inter, sans-serif); }
.bac2-intro { font-size: 16px; color: #000; line-height: 1.65; margin-bottom: 14px; }
.bac2-point { display: flex; gap: 16px; margin: 22px 0; }
.bac2-ico { width: 46px; height: 46px; flex: none; border-radius: 12px; display: grid; place-items: center; background: rgba(76, 159, 19, .12); color: var(--leaf-deep); }
.bac2-ico svg { width: 24px; height: 24px; }
.bac2-point h4 { font-size: 20px; font-weight: 600; color: #222; margin-bottom: 6px; }
.bac2-point p { font-size: 14px; color: #000; line-height: 1.6; }

/* FORM CARD: white, 5px radius, colored header bar w/ white centered 24px title */
.bac2-formcard { flex: 0 1 480px; background: #fff; border-radius: 5px; border: 1px solid var(--border); box-shadow: 0 10px 34px -18px rgba(23,10,17,.25); position: sticky; top: 120px; }
.bac2-formhead { background: var(--pink-deep); border-radius: 5px 5px 0 0; padding: 14px 18px; }
.bac2-formhead h3 { color: #fff; font-size: 24px; font-weight: 600; text-align: center; font-family: var(--font-body, Inter, sans-serif); }
.bac2-formbody { padding: 22px 26px 26px; position: relative; }
.bac2-label { display: block; font-size: 16px; font-weight: 600; color: #000; margin: 16px 0 8px; }
.bac2-input { width: 100%; padding: 11px 13px; border: 1px solid #B9BCBE; border-radius: 4px; font: inherit; font-size: 15px; color: #191B1D; background: #fff; }
.bac2-input:focus { outline: none; border-color: var(--pink-deep); box-shadow: 0 0 0 3px rgba(var(--pink-rgb),.14); }
.bac2-check { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #333; margin-top: 10px; cursor: pointer; }
.bac2-upload { position: relative; border: 1.5px dashed #B9BCBE; border-radius: 4px; padding: 16px; font-size: 13.5px; color: #555; text-align: center; }
.bac2-upload:hover { border-color: var(--pink-deep); }
.bac2-upload input[type="file"] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.bac2-upload img { max-height: 130px; margin-top: 12px; border-radius: 4px; border: 1px solid var(--border); }
.bac2-actions { display: flex; justify-content: space-between; align-items: center; margin-top: 22px; }
.bac2-help { color: var(--pink-deep); font-weight: 600; font-size: 14px; text-decoration: underline; text-underline-offset: 3px; }
.bac2-submit { background: var(--leaf); color: #fff; font: inherit; font-size: 15px; font-weight: 600; padding: 10px 26px; border: 0; border-radius: 4px; cursor: pointer; transition: background .2s; }
.bac2-submit:hover { background: var(--leaf-deep); }
.bac2-submit:disabled { background: #ccc; cursor: default; }
.bac2-signin { margin-top: 14px; font-size: 12.5px; color: #555; }
.bac2-signin a { color: var(--pink-deep); font-weight: 600; }
.bc-msg { margin-top: 16px; padding: 14px 16px; border-radius: 6px; font-size: .93rem; }
.bc-msg.ok { background: rgba(76,159,19,.1); border: 1px solid rgba(76,159,19,.35); color: var(--leaf-deep); }
.bc-msg.err { background: rgba(var(--pink-rgb),.08); border: 1px solid rgba(var(--pink-rgb),.3); color: var(--pink-deep); }

/* TILES */
.bac2-tiles { background: #F7F7F8; padding: 56px 0 64px; }
.bac2-tiles-title { font-size: 32px; font-weight: 600; color: #191B1D; text-align: center; margin-bottom: 34px; font-family: var(--font-body, Inter, sans-serif); }
.bac2-tiles-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.bac2-tile { background: #fff; border: 1px solid var(--border); border-radius: 8px; padding: 26px; }
.bac2-tile h3 { font-size: 20px; font-weight: 600; color: #191B1D; margin-bottom: 8px; }
.bac2-tile p { font-size: 14px; color: #333; line-height: 1.6; margin-bottom: 12px; }
.bac2-tile a { color: var(--leaf-deep); font-weight: 600; font-size: 14px; }

/* STRIP */
.bac2-strip { background: #fff; padding: 54px 0; text-align: center; }
.bac2-strip h2 { color: #191B1D; font-size: 30px; font-weight: 600; margin-bottom: 12px; font-family: var(--font-body, Inter, sans-serif); }
.bac2-strip p { color: #333; max-width: 700px; margin: 0 auto 22px; line-height: 1.65; }

/* FAQ */
.bac2-faq { background: #fff; padding: 60px 0 76px; }
.bac2-faq h2 { font-size: 32px; font-weight: 600; color: #191B1D; margin-bottom: 26px; font-family: var(--font-body, Inter, sans-serif); }
.bac2-faq details { border-bottom: 1px solid var(--border); padding: 4px 0; }
.bac2-faq summary { cursor: pointer; font-weight: 600; font-size: 17px; color: #191B1D; padding: 16px 30px 16px 0; list-style: none; position: relative; }
.bac2-faq summary::-webkit-details-marker { display: none; }
.bac2-faq summary::after { content: "+"; position: absolute; right: 4px; top: 50%; transform: translateY(-50%); font-size: 22px; color: var(--pink-deep); font-weight: 400; }
.bac2-faq details[open] summary::after { content: "\2212"; }
.bac2-faq details p { padding: 0 0 18px; color: #333; line-height: 1.65; max-width: 860px; }

@media (max-width: 980px) {
  .bac2-split-inner { flex-direction: column; }
  .bac2-left, .bac2-formcard { flex: 1 1 auto; width: 100%; position: static; }
  .bac2-hero-content h1 { font-size: 34px; }
  .bac2-tiles-grid { grid-template-columns: 1fr; }
}

/* ============ Enquiry form (Become a Customer — Reynolds-style, Vala green) ============ */
.enq { background: #F6F7F3; padding: 64px 0 76px; }
.enq-title { font-family: var(--font-display, 'Calistoga', Georgia, serif); font-size: 40px; color: var(--leaf-deep, #37750E); text-align: center; margin: 0 0 8px; }
.enq-sub { text-align: center; color: #5B6B5E; max-width: 660px; margin: 0 auto 40px; font-size: 15px; line-height: 1.6; }
.enq-form { max-width: 1040px; margin: 0 auto; }
.enq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 52px; }
.enq-col { display: flex; flex-direction: column; }
.enq-label { font-weight: 700; color: var(--leaf-deep, #37750E); font-size: 13.5px; margin: 18px 0 7px; }
.enq-col > .enq-label:first-child, .enq-label-block { margin-top: 0; }
.req { color: #E03131; font-weight: 700; }
.enq-input, .enq-select select { width: 100%; border: 1.5px solid #B9C9AE; border-radius: 999px; background: #fff; padding: 13px 18px; font: inherit; font-size: 15px; color: #243024; outline: none; transition: border-color .15s ease, box-shadow .15s ease; }
.enq-textarea { border-radius: 20px; resize: vertical; min-height: 154px; }
.enq-input:focus, .enq-select select:focus { border-color: var(--leaf, #4C9F13); box-shadow: 0 0 0 3px rgba(76,159,19,.14); }
.enq-select { position: relative; }
.enq-select select { appearance: none; -webkit-appearance: none; padding-right: 42px; cursor: pointer; }
.enq-select::after { content: ""; position: absolute; right: 20px; top: 45%; width: 9px; height: 9px; border-right: 2px solid #6b7d6b; border-bottom: 2px solid #6b7d6b; transform: translateY(-50%) rotate(45deg); pointer-events: none; }
.enq-checks { display: flex; flex-direction: column; gap: 12px; margin-bottom: 2px; }
.enq-check, .enq-agree { display: flex; align-items: flex-start; gap: 10px; font-weight: 700; color: var(--leaf-deep, #37750E); font-size: 14.5px; cursor: pointer; }
.enq-agree { margin-top: 14px; }
.enq-check input, .enq-agree input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--leaf, #4C9F13); flex: 0 0 auto; }
.enq-check span, .enq-agree span { line-height: 1.4; }
.enq-agree a { color: var(--leaf-deep, #37750E); text-decoration: underline; text-underline-offset: 2px; }
.enq-foot { display: flex; align-items: center; justify-content: flex-end; gap: 24px; margin-top: 34px; }
.enq-help { color: var(--leaf-deep, #37750E); font-weight: 600; font-size: 14px; text-decoration: none; }
.enq-help:hover { text-decoration: underline; }
.enq-submit { background: var(--leaf, #4C9F13); color: #fff; border: 0; border-radius: 999px; padding: 14px 46px; font: inherit; font-weight: 700; font-size: 16px; cursor: pointer; transition: background .15s ease; }
.enq-submit:hover { background: var(--leaf-deep, #37750E); }
.enq-submit:disabled { opacity: .55; cursor: default; }
.enq .bc-msg { max-width: 1040px; margin: 20px auto 0; }
@media (max-width: 760px) {
  .enq-grid { grid-template-columns: 1fr; gap: 0; }
  .enq-title { font-size: 30px; }
  .enq-foot { justify-content: stretch; flex-direction: column-reverse; gap: 14px; }
  .enq-submit { width: 100%; }
}