/* PEOFSC child: only what Divi 5 presets cannot express. Values are design tokens (Divi variables / global colours). */
/* Search results: pill-shaped submit like the Red Pill Button preset (the Search module has no radius option). */
.et_pb_search input.et_pb_searchsubmit { border-radius: 0 var(--gvid-peo-radius-btn) var(--gvid-peo-radius-btn) 0; }

/* Testimonial citation (name + role) inside the Slider: the Slider module has a single body-font setting, so the cite line needs its own size.
   Matches the live site: name 13px/20px, role 11px/16px, weight 500. Sizes come from the Divi variables. */
.et_pb_slider .et_pb_slide_content p.peo-cite { font-size: var(--gvid-peo-fs-role); line-height: 16px; font-weight: 500; }
.et_pb_slider .et_pb_slide_content p.peo-cite strong { font-size: var(--gvid-peo-fs-small); line-height: 20px; font-weight: 500; }

/* Open mobile (hamburger) menu. Background colour lives in the PEO Main Navigation preset; these cover what the Menu module has no option for:
   white dividers and a filled active item (as on the live site), and scrolling when the list is taller than the screen. */
.et_pb_menu .et_mobile_menu { max-height: calc(100vh - 120px); overflow-y: auto; -webkit-overflow-scrolling: touch; }
.et_pb_menu .et_mobile_menu li a { border-bottom: 1px solid var(--gcid-peo-white); }
.et_pb_menu.et_pb_module .et_mobile_menu li.current-menu-item > a { background-color: var(--gcid-peo-red-dark); color: var(--gcid-peo-white) !important; }

/* Tabs (PEO Tabs preset sets the colours): separate pill-free buttons with gaps and no frame, as on the live site. The Tabs module has no gap/frame option. */
.et_pb_tabs { border: 0; }
.et_pb_tabs .et_pb_tabs_controls { background: none; border-bottom: 0; display: flex; flex-wrap: wrap; gap: var(--gvid-peo-sp-xs); }
.et_pb_tabs .et_pb_tabs_controls::after { display: none; }
.et_pb_tabs .et_pb_tabs_controls li { border-right: 0; float: none; }
.et_pb_tabs .et_pb_tabs_controls li a { padding: 14px 20px; display: block; line-height: var(--gvid-peo-lh-small); }

/* "At a Glance" / "Plan and Details" tables kept from the old pages (Code module): striped rows, right-aligned labels, no borders, like the live site. */
.peo-table table { width: 100%; border: 0; border-collapse: collapse; margin: 0; }
.peo-table td { border: 0; padding: 20px; width: 50%; font-size: var(--gvid-peo-fs-small); line-height: var(--gvid-peo-lh-small); color: var(--gcid-body-color); }
.peo-table td:first-child { text-align: right; padding-right: 30px; }
.peo-table tr:nth-child(odd) td { background: var(--gcid-peo-pale); }

/* Tick lists inside tab and accordion text (rich text has no icon-list option): red tick like the Icon List module. */
ul.peo-checklist { list-style: none; padding-left: 0; }
ul.peo-checklist li { position: relative; padding-left: 26px; margin-bottom: 6px; }
ul.peo-checklist li::before { content: "\2714"; position: absolute; left: 0; color: var(--gcid-peo-red-dark); font-size: 13px; }

/* CTA box (announcement box on project pages): let the blurb text use the full column width; Divi caps blurb content at 550px. */
.peo-cta-box .et_pb_blurb_content { max-width: none; }
/* Service pages (Theme Builder template "Services (title bar + sidebar)"): the service's own Divi content sits in the 3/4 column,
   so its sections/rows drop their full-page spacing and fill the column. Row spacing between blocks stays as set in each row. */
#et-boc .et-l .peo-svc-main .et-l--post .et_pb_section { padding: 0 !important; }
#et-boc .et-l .peo-svc-main .et-l--post .et_pb_row { width: 100% !important; max-width: none !important; }
#et-boc .et-l .peo-svc-main .et-l--post .et_pb_section:first-child .et_pb_row:first-child { padding-top: 0 !important; }
/* Sidebar download buttons (PEO Download Button preset): full-width bars with a 24px icon 18px from the left, as on the live site.
   Divi's own button-icon rule outranks preset custom CSS, so this lives here. */
#et-boc .et-l .peo-svc-sidebar .et_pb_button_module_wrapper { display: block; width: 100%; }
body #page-container #et-boc .et-l .peo-svc-sidebar .preset--module--divi-button--peo-button-download { display: block; position: relative; width: 100%; max-width: none; }
body #page-container #et-boc .et-l .peo-svc-sidebar .preset--module--divi-button--peo-button-download:before,
body #page-container #et-boc .et-l .peo-svc-sidebar .preset--module--divi-button--peo-button-download:hover:before {
  position: absolute; top: 50%; left: 18px; right: auto; margin: 0 !important; transform: translateY(-50%);
  font-size: 24px !important; line-height: 24px !important; opacity: 1;
  content: "\f13a" !important; font-family: "FontAwesome" !important; font-weight: 900 !important; } /* Divi prints no data-icon for preset icons */
/* Header top bar, Facebook cell: Social Follow sizes the icon box at 2x the icon size (28px for the 14px icon) and has no box-size option,
   so the cell is set here to the live 48px wide, full bar height (!important: Divi's icon-size rule is !important); its dividers come from the module border. */
#et-boc .et-l .peo-social li.et_pb_social_icon { align-self: stretch; margin: 0; }
#et-boc .et-l .peo-social li.et_pb_social_icon a.icon { width: 48px !important; height: var(--gvid-peo-topbar-h) !important; }
#et-boc .et-l .peo-social li.et_pb_social_icon a.icon:before { width: 48px; height: var(--gvid-peo-topbar-h); line-height: var(--gvid-peo-topbar-h); }