.elementor-555 .elementor-element.elementor-element-9f4db21{text-align:center;}.elementor-555 .elementor-element.elementor-element-9f4db21 .elementor-heading-title{font-weight:600;line-height:1.2em;}.elementor-555 .elementor-element.elementor-element-f12d1f0{text-align:center;margin:20px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-555 .elementor-element.elementor-element-88256a4{text-align:center;}.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-item{border-width:0px;}.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-item .elementor-tab-content{border-width:0px;}.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-item .elementor-tab-title.elementor-active{border-width:0px;}.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-tab-title{background-color:#FEFCF4;padding:8px 30px 8px 30px;}.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-icon, .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-title{color:#18360D;}.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-icon svg{fill:#18360D;}.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-active .elementor-accordion-icon, .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-active .elementor-accordion-title{color:#FFFFFF;}.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-active .elementor-accordion-icon svg{fill:#FFFFFF;}.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-title{font-family:"Merriweather", Sans-serif;font-size:21px;font-weight:400;line-height:1.3em;}.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-tab-title .elementor-accordion-icon i:before{color:#18360D;}.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-tab-title .elementor-accordion-icon svg{fill:#18360D;}.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-tab-title.elementor-active .elementor-accordion-icon i:before{color:#18360D;}.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-tab-title.elementor-active .elementor-accordion-icon svg{fill:#18360D;}.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-icon{margin-inline-end:20px;}.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-tab-content{background-color:#FFFFFF;color:#565656;font-family:"DM Sans", Sans-serif;font-size:16px;font-weight:400;padding:10px 30px 0px 30px;}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-tab-title{padding:8px 30px 8px 30px;}}@media(max-width:767px){.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-title{font-size:18px;}.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-tab-title{padding:12px 20px 12px 20px;}.elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-tab-content{padding:10px 20px 0px 20px;}}/* Start custom CSS for heading, class: .elementor-element-9f4db21 *//* FPC SEO 2026-10-07: hero heading changed H2 -> H1 for SEO. Keep the pre-change rendered size by mirroring Astra's H2 sizing and Astra's breakpoints (921px / 544px) for this widget only. Values match Astra exactly: 2.2222rem = 40px desktop, 1.5556rem = 25.5px tablet (Astra root 102.6%), 1.7778rem = 32px mobile. */ .elementor-555 .elementor-element.elementor-element-9f4db21 .elementor-heading-title { font-size: 2.2222222222222rem; } @media (max-width: 921px) { .elementor-555 .elementor-element.elementor-element-9f4db21 .elementor-heading-title { font-size: 1.5555555555556rem; } } @media (max-width: 544px) { .elementor-555 .elementor-element.elementor-element-9f4db21 .elementor-heading-title { font-size: 1.7777777777778rem; } }/* End custom CSS */ /* Start custom CSS for accordion, class: .elementor-element-88fcf68 *//* FAQ accordion: matches the approved Bacchus Marsh FAQ (page 783, widget 5b07f36). Applies at all breakpoints. Previously desktop-only (min-width:1025px), which left the open question white-on-cream and the rows unpadded on tablet/mobile. Phase 2 fix 2026-10-08. Scoped to this widget only via the ".elementor-555 .elementor-element.elementor-element-88fcf68" prefix. */ /* Spacing between rows: Figma gap-[15px] separating the open row+answer from the closed list, gap-[10px] between each closed row */ .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-item + .elementor-accordion-item { margin-top: 10px; } .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-item:first-child { margin-bottom: 15px; } /* Row shape + height: Figma rounded-[73px] pill, min h-[60px] on every question row (min-height, not a hard height, so the row can grow if a title ever wraps). Vertical title_padding is set natively (Style tab: 8px desktop/tablet, 12px mobile) so wrapped questions keep breathing room; single-line rows stay at this 60px min-height. Horizontal padding is 30px (20px mobile). Same rule for active and inactive rows. */ .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-tab-title { border-radius: 73px; overflow: hidden; display: flex; align-items: center; min-height: 60px; } /* Actual rendered DOM (verified via REST API) has the icon BEFORE the title , so default flex row order puts the icon first/left. Explicit "order" fixes this regardless of DOM order: title first visually (order:1) and given flex:1 so it fills the row, icon last visually (order:2) at a fixed width so it lands at the true right edge - no absolute positioning, no dependency on Elementor's own markup order. */ .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-tab-title .elementor-accordion-title { order: 1; flex: 1 1 auto; min-width: 0; } /* Active/open row fill: Figma bg-[#18360d], applied only while the row is expanded. Closed rows keep the native "title_background" (#FEFCF4) set on the Style tab. */ .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-tab-title.elementor-active { background-color: #18360D; } /* Expand/collapse control: Figma 43x43 circle bg-[#fadf7d] behind the chevron icon, present on both open and closed rows. order:2 (paired with the title's order:1 above) puts it last in visual flex order regardless of its earlier position in the DOM. */ .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-icon { display: flex; align-items: center; justify-content: center; width: 43px; height: 43px; border-radius: 50%; background-color: #FADF7D; flex-shrink: 0; order: 2; } /* Icon state wrappers: base sizing only, no display set here - display is decided explicitly below per state so exactly ONE of closed/opened ever renders. */ .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-icon-closed, .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-icon-opened { position: relative; width: 24px; height: 24px; } /* Inactive row: show the closed-state icon only, hide the opened-state one */ .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-tab-title:not(.elementor-active) .elementor-accordion-icon-closed { display: inline-flex; } .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-tab-title:not(.elementor-active) .elementor-accordion-icon-opened { display: none; } /* Active row: show the opened-state icon only, hide the closed-state one (same glyph either way, per Figma - both states use one identical chevron) */ .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-tab-title.elementor-active .elementor-accordion-icon-closed { display: none; } .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-tab-title.elementor-active .elementor-accordion-icon-opened { display: inline-flex; } /* Icon glyph: reproduces the ACTUAL Figma vector (node icon-park-outline:down inside 16669:754 - 24x24, single path "M18 9L12 15L6 9", stroke #18360D, stroke-width 2, round linecap/linejoin) instead of the Font Awesome "angle-down" SVG Elementor actually renders (verified via REST API: ). Hides that rendered SVG inside whichever wrapper is visible, then paints the exact Figma shape as a CSS mask on a pseudo-element, sized 24x24 and centered in the badge. */ .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-icon-closed > *, .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-icon-opened > * { visibility: hidden; } .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-icon-closed::after, .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-icon-opened::after { content: ""; position: absolute; inset: 0; background-color: #18360D; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M18 9L12 15L6 9' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M18 9L12 15L6 9' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: contain; mask-size: contain; } /* Mobile: slightly smaller chevron circle so long questions keep more width */ @media (max-width: 767px) { .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-icon { width: 36px; height: 36px; } .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-icon-closed, .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-accordion-icon-opened { width: 20px; height: 20px; } } /* Spacing refinement 2026-10-08: at 1024px and below keep at least 12px between the question text and the chevron (the native icon spacing lands on the outer side of the chevron because CSS re-orders it to the right). */ @media (max-width: 1024px) { .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-tab-title { gap: 12px; } } /* Spacing refinement 2026-10-08: on mobile cap the corner radius at 28px (approved Tier 1 treatment) so wrapped questions are not cut into by a full-height pill curve. */ @media (max-width: 767px) { .elementor-555 .elementor-element.elementor-element-88fcf68 .elementor-tab-title { border-radius: 28px; } }/* End custom CSS */ /* Start custom CSS for html, class: .elementor-element-2c6d9e5 *//* Map embed: iframes are inline by default and sit on the text baseline, leaving a ~10px descender strip below the map. Block display removes it so the map meets the footer flush. Scoped to this widget. */ .elementor-555 .elementor-element.elementor-element-2c6d9e5 iframe{display:block;}/* End custom CSS */