/*
 * The Global Select header (option B2, Jay 2026-10-23): loads on Global Select pages only (body.gs-hdr).
 * Flatsome's header keeps its layout, height and the top bar; these rules style the Global Select elements
 * the plugin hands it (includes/header.php): the lockup words, the Global Select nav, ☰ Menu, ♡, Quote Request,
 * the ☰ panel under the header and the phone off-canvas additions. Tokens as the pages (BRAND.md).
 */
.gs-hdr {
	--gs-ink: #1e2b23;
	--gs-text: #2e3a32;
	--gs-muted: #5e6a61;
	--gs-sage: #c7d0c4;
	--gs-head: #5f7a62;
	--gs-line: #d5d9d6;
	--gs-serif: "Cormorant Garamond", "Cormorant", Georgia, serif;
	--gs-sans: Lato, "Lato Fallback", "Helvetica Neue", Arial, sans-serif; /* "Lato Fallback" = the theme's metric-matched Arial (sw2, 2026-10-23) */
}
/* UberMenu prints its icon sprite (<svg class="ubermenu-essential-icons">) in the footer of every page, and its own
   stylesheet collapses it. On the pages with the Global Select header the UberMenu CSS is not loaded (the ☰ panel
   fetches the menu on first open), so the sprite took the browser's default 300 × 150px as a blank band under the
   footer (Jay 2026-10-23 14:02). The same rule UberMenu's CSS carries: */
svg.ubermenu-essential-icons { position: absolute; width: 0; height: 0; overflow: hidden; }
:root {
}

/* 1. The lockup: logo (Flatsome's element) · 1px divider · the words ------------------------------- */
.gs-hdr .header-main .nav > li.gs-hdr__words { display: flex; align-items: center; margin: 0; padding: 0; }
.gs-hdr .header-main .nav > li.gs-hdr__words .gs-hdr__div { display: block; width: 1px; height: 34px; margin: 0 18px 0 6px; background: var(--gs-line); }
.gs-hdr .header-main .nav > li.gs-hdr__words .gs-hdr__name {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0;
	margin-right: 22px;
	color: var(--gs-head);
	font: italic 500 26px/1 var(--gs-serif);
	letter-spacing: 0.01em;
	text-transform: none;
	white-space: nowrap;
}
.gs-hdr .header-main .nav > li.gs-hdr__words .gs-hdr__name:hover { color: var(--gs-ink); }
.gs-hdr .mobile-nav > li.gs-hdr__words .gs-hdr__div { height: 24px; margin: 0 10px 0 2px; }
.gs-hdr .mobile-nav > li.gs-hdr__words .gs-hdr__name { margin-right: 0; font-size: 21px; }

/* 2. The Global Select nav (the "Global Select header" menu). Its dropdown (Jay 2026-10-26 18:29): ONE simple column,
      directly under the item, left-aligned with it, as wide as the longest link: sw2's shared compact variant
      (.swp-pm__item--compact / .swp-pm__panel--compact, subbrand-header.css; behaviour header-v2.js) with the UberMenu
      panel look; rows 15px Lato #555, 10px 20px, hover colour only (#111, no underline); no photo, title, heading, notch. */
.gs-hdr .header-main .header-nav-main > li.swp-pm__item > a.swp-pm__top .icon-angle-down { margin-left: 5px; font-size: 10px; }
.gs-hdr .header-main .header-nav-main > li.gs-pm__item::before,
.gs-hdr .header-main .header-nav-main > li.gs-pm__item::after { display: none !important; } /* Flatsome's dropdown notch */
.gs-hdr .header-main .header-nav-main > li.gs-pm__item > .gs-pm__panel {
	top: 100%;
	left: 0;
	right: auto;
	width: max-content;
	min-width: 180px;
	max-width: calc(100vw - 30px);
	margin: 0;
	padding: 8px 0;
	background: #f9f9f9;
	border: 1px solid #e0e0e0;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
	text-align: left;
}
.gs-hdr .gs-pm__panel ul.swp-pm__list { margin: 0; padding: 0; list-style: none; }
.gs-hdr .gs-pm__panel ul.swp-pm__list > li { margin: 0; padding: 0; list-style: none; }
.gs-hdr .gs-pm__panel ul.swp-pm__list a {
	display: block;
	padding: 10px 20px;
	color: #555555;
	font: 400 15px/1.3 Lato, "Lato Fallback", "Helvetica Neue", Arial, sans-serif;
	letter-spacing: 0;
	text-transform: none;
	text-decoration: none;
	white-space: nowrap;
}
.gs-hdr .gs-pm__panel ul.swp-pm__list a:hover,
.gs-hdr .gs-pm__panel ul.swp-pm__list a:focus-visible { color: #111111; text-decoration: none; background: transparent; }
.gs-hdr .gs-pm__panel ul.swp-pm__list a:focus-visible { outline: 2px solid #5f7a62; outline-offset: -2px; }
@media (max-width: 849px) { .gs-hdr .swp-pm__panel { display: none; } } /* phones: the drawer (the shared row's rows), never the panel */
.gs-hdr .header-main .header-nav-main > li.menu-item > a { font: 700 13px/1 var(--gs-sans); letter-spacing: 0.12em; color: var(--gs-ink); }
.gs-hdr .header-main .header-nav-main > li.menu-item > a:hover,
.gs-hdr .header-main .header-nav-main > li.menu-item.current-menu-item > a,
.gs-hdr .header-main .header-nav-main > li.menu-item.current-menu-ancestor > a { color: var(--gs-head); }

/* 2a. One line + "More" (Jay 2026-10-26 18:30; includes/header.php): the menu never wraps; while it would overflow its
      last items move into "More", a panel in the By Type column's look. In "More" an item with its own column (By
      Type) shows as a plain link (its column stays closed there). */
@media (min-width: 850px) {
	.gs-hdr .header-main .header-inner > .flex-left { min-width: 0; }
	.gs-hdr .header-main .header-nav-main.nav-left { flex-wrap: nowrap; }
	.gs-hdr .header-main .header-nav-main.nav-left > li { flex: none; }
	.gs-hdr .header-main .header-nav-main.nav-left > li.gs-more[hidden] { display: none; }
	.gs-hdr .header-main .header-nav-main.nav-left > li.gs-more { position: relative; }
	.gs-hdr .header-main .header-nav-main.nav-left > li.gs-more > a .icon-angle-down { margin-left: 5px; font-size: 10px; }
	.gs-hdr .header-main .header-nav-main.nav-left > li.gs-more::before,
	.gs-hdr .header-main .header-nav-main.nav-left > li.gs-more::after { display: none !important; } /* Flatsome's dropdown notch */
	.gs-hdr .header-main .header-nav-main.nav-left > li.gs-more > ul.gs-more__list {
		top: 100%;
		left: 0;
		right: auto;
		width: max-content;
		min-width: 180px;
		margin: 0;
		padding: 8px 0;
		background: #f9f9f9;
		border: 1px solid #e0e0e0;
		box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
		text-align: left;
	}
	.gs-hdr .header-main .header-nav-main.nav-left > li.gs-more.gs-more--open > ul.gs-more__list { opacity: 1; visibility: visible; transform: none; pointer-events: auto; }
	.gs-hdr .gs-more__list > li { margin: 0; padding: 0; border: 0; list-style: none; }
	.gs-hdr .gs-more__list > li::before, .gs-hdr .gs-more__list > li::after { display: none !important; }
	.gs-hdr .header-main .gs-more__list > li > a {
		display: block;
		min-height: 0;
		margin: 0;
		border: 0;
		padding: 10px 20px;
		color: #555555;
		font: 400 15px/1.3 Lato, "Lato Fallback", "Helvetica Neue", Arial, sans-serif;
		letter-spacing: 0;
		text-transform: none;
		text-decoration: none;
		white-space: nowrap;
		box-shadow: none;
	}
	.gs-hdr .header-main .gs-more__list > li > a:hover,
	.gs-hdr .header-main .gs-more__list > li > a:focus-visible { color: #111111; background: transparent; text-decoration: none; }
	.gs-hdr .header-main .gs-more__list > li > a:focus-visible { outline: 2px solid #5f7a62; outline-offset: -2px; }
	.gs-hdr .gs-more__list .icon-angle-down, .gs-hdr .gs-more__list .swp-pm__panel { display: none !important; }
}
/* 1230px up: the stone pages' narrower container (about 130px less row than the entry page) still holds Collection ·
   By Type · Our Process · About next to the bar (Jay 2026-10-26 19:24): item gaps 14px (Flatsome's 18), icon gaps 16px. */
@media (min-width: 1230px) {
	.gs-hdr .header-main .header-nav-main.nav-left > li.menu-item { margin: 0 7px; }
	body.gs-hdr .header-main .flex-right .nav-right { column-gap: 16px; }
}
/* 850-1229px (e.g. 1024): a tighter row, so Collection and By Type stay in the row and only the rest goes into More. */
@media (min-width: 850px) and (max-width: 1229px) {
	.gs-hdr .header-main .header-inner > #logo { margin-right: 12px; } /* Flatsome's .logo-left .logo: 30px */
	.gs-hdr .header-main .nav > li.gs-hdr__words .gs-hdr__div { margin: 0 12px 0 2px; }
	.gs-hdr .header-main .nav > li.gs-hdr__words .gs-hdr__name { margin-right: 10px; font-size: 22px; }
	.gs-hdr .header-main .header-nav-main.nav-left > li.menu-item { margin: 0 5px; }
	.gs-hdr .header-main .header-nav-main.nav-left > li.menu-item > a { letter-spacing: 0.06em; }
	/* body.gs-hdr: these must beat section 3 below and the theme's 24px icon-group gap */
	body.gs-hdr .header-main .flex-right .nav-right { column-gap: 8px; }
	body.gs-hdr .header-main .nav-right > li.gs-hdr__item { padding-left: 0; }
	body.gs-hdr .header-main .nav-right > li.gs-hdr__item--sbar { padding-left: 0; }
	body.gs-hdr .gs-hdr__quote { padding: 0 12px; }
}
/* 850-959px: no room for the bar next to the lockup; the magnifier + the slim panel (as on phones, the same Global
   Select search) take its place. */
@media (min-width: 850px) and (max-width: 959px) {
	.gs-hdr .header-main .nav-right > li.gs-hdr__item.gs-hdr__item--sbar { display: none; }
	.gs-hdr .header-main .nav-right > li.gs-hdr__item.gs-hdr__item--search { display: flex !important; } /* !important: Flatsome's .show-for-medium */
}

/* 2c. The menu's in-page targets ("Our Process" = #how-it-works, "About" = #our-team; Jay 2026-10-26 19:24) land
      under the sticky header (64px desktop / 56px phones + room). */
.gs-hdr #our-team, .gs-hdr .scroll-to > a[name] { scroll-margin-top: 88px; }
.gs-hdr .scroll-to > a[name] { display: block; } /* an empty inline anchor has no box to scroll to */

/* 2b. The "Natural stones" dropdown (Jay 2026-10-23 16:42, replacing the 14:36 / 15:0x swatch version). Earlier note:
   spacing feel, rows ≥ 44px with hairlines, 20px 28px inside the white panel (Flatsome's panel + soft shadow kept), a
   32px square swatch of the group before each name (header.php nav_menu_item_title; lazy 64px WebP), hover = a light
   background + the sage underline, a visible focus ring. The order is the menu's (Appearance › Menus). */
.gs-hdr .header-main .header-nav-main > li.menu-item > ul.nav-dropdown { min-width: 0; width: max-content; padding: 20px 28px; border: 1px solid var(--gs-line); box-shadow: 0 14px 30px rgba(30, 43, 35, 0.12); }
.gs-hdr .header-main .header-nav-main > li.menu-item > ul.nav-dropdown > li.gs-nav__sub { margin: 0; padding: 0; border-top: 1px solid var(--gs-line); }
.gs-hdr .header-main .header-nav-main > li.menu-item > ul.nav-dropdown > li.gs-nav__sub:first-child { border-top: 0; }
.gs-hdr .header-main .header-nav-main > li.menu-item > ul.nav-dropdown > li.gs-nav__sub > a { /* Jay 16:42: Title Case as typed, Lato 400 16px, the top links' ink + letter-spacing, 44px rows, no swatch */
	display: flex;
	align-items: center;
	min-height: 44px;
	margin: 0;
	padding: 2px 0;
	border: 0;
	background: none;
	color: var(--gs-ink);
	font: 400 16px/1.2 var(--gs-sans);
	letter-spacing: 0.12em;
	text-transform: none;
	white-space: nowrap;
}
.gs-hdr .gs-nav__label { position: relative; }
.gs-hdr .gs-nav__label::after { content: ""; position: absolute; left: 0; right: 0.12em; bottom: -3px; height: 2px; background: var(--gs-sage); transform: scaleX(0); transform-origin: left center; transition: transform 0.2s; }
@media (hover: hover) {
	.gs-hdr .header-main .header-nav-main > li.menu-item > ul.nav-dropdown > li.gs-nav__sub > a:hover { color: var(--gs-head); background: none; }
	.gs-hdr .header-main .header-nav-main > li.menu-item > ul.nav-dropdown > li.gs-nav__sub > a:hover .gs-nav__label::after { transform: scaleX(1); }
}
.gs-hdr .header-main .header-nav-main > li.menu-item > ul.nav-dropdown > li.gs-nav__sub.current-menu-item > a { color: var(--gs-head); }
.gs-hdr .header-main .header-nav-main > li.menu-item > ul.nav-dropdown > li.gs-nav__sub.current-menu-item > a .gs-nav__label::after { transform: scaleX(1); }
.gs-hdr .header-main .header-nav-main > li.menu-item > ul.nav-dropdown > li.gs-nav__sub > a:focus-visible { outline: 2px solid var(--gs-head); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .gs-hdr .gs-nav__label::after { transition: none; } }
/* (Phones: the drawer's Global Select rows were the plugin's own until 2026-10-26; the shared sub-brand row prints
   them now, in the Architectural brand's rows: Jay's Q3.) */

/* 3. The right side: ♡ · Quote Request (the desktop ☰ was removed, Jay 2026-10-24) ------------------ */
.gs-hdr .header-main .nav-right > li.gs-hdr__item { display: flex; align-items: center; margin: 0; padding: 0 0 0 14px; }
.gs-hdr .header-main .hide-for-medium.flex-right > ul.nav-right { padding-right: 0; } /* Quote Request ends on the content's right edge (was 20px in; Jay 2026-10-24: one edge per page) */
.gs-hdr .gs-hdr__heart:focus-visible, .gs-hdr .gs-hdr__quote:focus-visible, .gs-hdr .gs-hdr__name:focus-visible { outline: 2px solid var(--gs-head); outline-offset: 3px; }
.gs-hdr .gs-hdr__heart { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; color: var(--gs-ink); border-radius: 50%; }
.gs-hdr .gs-hdr__heart:hover { color: var(--gs-head); background: #f2f3f1; }
.gs-hdr .gs-hdr__heart svg { display: block; }
/* The style-8 button, as the sticky bar's compact Quote Request */
.gs-hdr .gs-hdr__quote {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 40px;
	padding: 0 16px;
	background: #ffffff;
	color: var(--gs-ink);
	border: 2px solid var(--gs-ink);
	box-shadow: 3px 3px 0 var(--gs-sage);
	font: 700 14px/1.2 var(--gs-sans);
	letter-spacing: 0;
	text-transform: none;
	transition: transform 0.12s, box-shadow 0.12s, background-color 0.12s;
}
.gs-hdr .header-main .nav-right > li.gs-hdr__item > a.gs-hdr__quote, .gs-hdr .header-main .nav-uppercase > li.gs-hdr__item > a.gs-hdr__quote { text-transform: none; letter-spacing: 0; font-size: 14px; } /* beats Flatsome's and the child theme's uppercase nav rules (header-footer.css loads after this file) */
.gs-hdr .gs-hdr__quote:hover { background: var(--gs-sage); color: var(--gs-ink); transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--gs-sage); }
.gs-hdr .gs-hdr__quote svg { display: block; }
.gs-hdr .mobile-nav > li.gs-hdr__item { margin: 0; padding: 0 0 0 4px; display: flex; align-items: center; }

/* 4. The empty bottom row goes (no site mega menu on Global Select pages) ---------------------------- */
.gs-hdr #wide-nav { display: none; }

/* 5. (The desktop ☰ panel was here; removed with the panel, Jay 2026-10-24.) */

/* 6. Phones: the lockup, ♡ and ☰ (the off-canvas rows are the shared sub-brand row's since 2026-10-26) ----------- */
@media (max-width: 849px) {
	/* The lockup reads mark · divider · Global Select: the logo first (Flatsome centres it on phones), the words
	   next to it, ♡ and ☰ at the right. */
	.gs-hdr .header-main .header-inner { flex-wrap: nowrap; }
	.gs-hdr .header-main .header-inner > #logo { order: 1; flex: 0 0 auto; width: auto; max-width: 118px; margin: 0; }
	/* An explicit width: the logo is an SVG without its own size (sw2's site_logo), so "width: auto" collapsed it to
	   0 px on phones (found 2026-10-24, HD2); the height follows its viewBox. */
	.gs-hdr .header-main .header-inner > #logo img { width: 96px; height: auto; max-height: 30px; }
	.gs-hdr .header-main .mobile-nav > li.gs-hdr__words .gs-hdr__name { font-size: 18px; } /* room for the logo, ⌕, ♡ and ☰ on one line */
	.gs-hdr .header-main .mobile-nav.nav-right > li.gs-hdr__item { padding-left: 0; } /* the three 44px icons side by side (the desktop's 14px gaps cut the words) */
	.gs-hdr .header-main .mobile-nav > li.gs-hdr__words .gs-hdr__div { margin: 0 10px 0 6px; } /* not the desktop's 18px / 22px gaps */
	.gs-hdr .header-main .mobile-nav > li.gs-hdr__words .gs-hdr__name { margin-right: 0; }
	.gs-hdr .header-main .header-inner > .show-for-medium.flex-left { order: 2; flex: 1 1 auto; min-width: 0; }
	.gs-hdr .header-main .header-inner > .show-for-medium.flex-right { order: 3; flex: 0 0 auto; }
	.gs-hdr .mobile-nav > li.gs-hdr__words { min-width: 0; }
	/* Phones: Flatsome's ☰ (the menu-icon element) gets a 44px tap area and the ♡'s centre line (sw2's note, 2026-10-23 11:16). */
	.gs-hdr .header-main .nav-right > li.nav-icon > a.is-small { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0; padding: 0; }
	.gs-hdr .header-main .nav-right > li.nav-icon > a.is-small > i.icon-menu { line-height: 1; }
	.gs-hdr .mobile-nav > li.gs-hdr__words .gs-hdr__name { overflow: hidden; text-overflow: ellipsis; }
}

/* 6b. Sticky (HD2, Jay 2026-10-24; Flatsome's sticky header, switched on for GS pages in header.php): once stuck the
   header is slim, 64px on desktop with no top bar, and the lockup shrinks with it; phones 56px. Flatsome keeps the
   header's own box at its full height while the bar is fixed, so the page under it never moves. */
.gs-hdr .header-wrapper.stuck .header-main .nav > li.gs-hdr__words .gs-hdr__name { font-size: 22px; }
.gs-hdr .header-wrapper.stuck .header-main .nav > li.gs-hdr__words .gs-hdr__div { height: 26px; }
body.gs-hdr .header-wrapper.stuck #logo img { max-height: 28px !important; width: auto; } /* !important: Flatsome's .stuck #logo img { max-height: 64px !important } */
.gs-hdr .header-wrapper.stuck { box-shadow: 0 1px 0 var(--gs-line), 0 4px 14px rgba(30, 43, 35, 0.08); }
@media (max-width: 849px) {
	body.gs-hdr .header-wrapper.stuck .header-main { height: 56px !important; } /* !important: Flatsome's .stuck .header-main { height: 64px !important } */
	body.gs-hdr .header-wrapper.stuck .header-main .header-inner > #logo img { width: 88px; max-height: 26px !important; }
	.gs-hdr .header-wrapper.stuck .header-main .mobile-nav > li.gs-hdr__words .gs-hdr__name { font-size: 17px; }
	.gs-hdr .header-wrapper.stuck .header-main .mobile-nav > li.gs-hdr__words .gs-hdr__div { height: 22px; }
}

@media (max-width: 374px) { /* small phones: the lockup a touch smaller, so "Global Select" stays whole next to ⌕ ♡ ☰ */
	.gs-hdr .header-main .header-inner > #logo img { width: 86px; }
	.gs-hdr .header-main .mobile-nav > li.gs-hdr__words .gs-hdr__name { font-size: 17px; }
	.gs-hdr .header-main .mobile-nav > li.gs-hdr__words .gs-hdr__div { margin: 0 8px 0 4px; }
}

/* 7. The entry page under the header: the hero fills the rest of the first screen ----------------- */
.gs-hdr.gs-entry-page .gs-entry { min-height: calc(100vh - var(--gs-hdr-h, 121px)); min-height: calc(100svh - var(--gs-hdr-h, 121px)); }
.gs-hdr.gs-entry-page .gs-entry-bar { display: none; } /* the slim bar's job is done by the header */
.gs-hdr.gs-entry-page .gs-how { background: #ffffff; }
.gs-hdr.gs-entry-page .gs-how .gs-how__title { margin: 0 0 8px; color: var(--gs-ink); font: 500 clamp(30px, 3.6vw, 40px)/1.15 var(--gs-serif); text-align: center; }
.gs-hdr.gs-entry-page .gs-how .gs-how__lede { max-width: 36em; margin: 0 auto 28px; color: var(--gs-text); font: 400 17px/1.6 var(--gs-sans); text-align: center; }
.gs-page.gs-entry-page .gs-how .gs-layout .row.gs-steps { margin-top: 0; } /* the steps box (global-select.css §8) without the section gap above it */
.gs-page.gs-entry-page .gs-how .gs-layout .row.gs-steps::before { display: none; }
/* The steps box and the steps themselves: ONE component in global-select.css §8 (Jay 2026-10-24), the same on the
   stone pages; only the section gap above it is dropped here. */
/* The FAQ ("Questions about Global Select", a Flatsome accordion so UX Builder and its FAQPage schema stay) in the
   product pages' "Questions from specifiers" look (global-select.css §8 tokens): a Lato eyebrow over a centred
   Cormorant heading, an 820px column, Cormorant 24px questions in the green ink with hairlines, a + / × at the right
   that turns as it opens, Lato answers ≤ 640px with a small indent. Flatsome's slide keeps the open / close smooth. */
.gs-page.gs-entry-page .gs-how .gs-how__faq-head { margin: 0 auto; max-width: 820px; text-align: center; }
.gs-page.gs-entry-page .gs-how .gs-how__faq-head .gs-label { margin: 0 0 10px; }
.gs-page.gs-entry-page .gs-how .gs-how__faq-head h2, .gs-page.gs-entry-page .gs-how .gs-how__faq-head h3 { margin: 0 0 14px; color: var(--gs-ink); font: 500 clamp(30px, 3.6vw, 44px)/1.15 var(--gs-serif); text-transform: none; letter-spacing: normal; }
.gs-page.gs-entry-page .gs-how .accordion.gs-how__faq { width: 100%; max-width: 820px; margin: 0 auto; border-top: 1px solid #e3e0d8; } /* width: Flatsome's accordion shrink-wraps otherwise */
.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-item { margin: 0; border: 0; border-bottom: 1px solid #e3e0d8; }
.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	margin: 0;
	padding: 24px 0;
	border: 0;
	background: none;
	color: var(--gs-ink);
	font: 600 24px/1.3 var(--gs-serif);
	text-transform: none;
	letter-spacing: normal;
	cursor: pointer;
}
.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-title > span { order: 1; flex: 1 1 auto; }
.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-title .toggle { /* Flatsome's chevron button becomes the + / × at the right */
	order: 2;
	position: relative;
	flex: none;
	width: 24px;
	height: 24px;
	min-height: 0;
	margin: 0;
	padding: 0;
	background: none;
	border: 0;
	box-shadow: none;
	color: var(--gs-ink);
	transition: transform 0.2s;
}
.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-title .toggle i { display: none; }
.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-title .toggle::before,
.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-title .toggle::after { content: ""; position: absolute; top: 11px; left: 4px; width: 16px; height: 1.5px; background: var(--gs-ink); }
.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-title .toggle::after { transform: rotate(90deg); }
.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-item.active .accordion-title .toggle,
.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-title[aria-expanded="true"] .toggle { transform: rotate(45deg); } /* also the first item, open on load (open="1"; rendered open, no shift) */
.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-title:hover, .gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-title:hover > span { color: var(--gs-hover); }
.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-title:focus-visible { outline: 2px solid var(--gs-head); outline-offset: 2px; }
.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-inner { max-width: 640px; margin: 0; padding: 0 40px 24px 16px; border: 0; }
.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-inner p { margin: 0 0 10px; color: var(--gs-text); font: 400 16px/1.6 var(--gs-sans); }
.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-inner p:last-child { margin-bottom: 0; }
.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-inner a { color: var(--gs-ink); text-decoration: underline; text-decoration-color: #666666; text-decoration-thickness: 1px; text-underline-offset: 3px; } /* the links rule (Jay 26 Oct 14:40): ink + 1px #666 */
.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-inner a:hover { color: var(--gs-ink); text-decoration-color: var(--gs-ink); }
@media (max-width: 549px) {
	.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-title { padding: 18px 0; font-size: 24px; gap: 14px; } /* Cormorant never under 24px */
	.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-inner { padding: 0 0 18px 8px; }
}
@media (prefers-reduced-motion: reduce) {
	.gs-page.gs-entry-page .gs-how .gs-how__faq .accordion-title .toggle { transition: none; }
}