/* GFO Salon 2026-10-01: fonts + The Private Salon (build/proto/salon.css) + WordPress additions. */
/* Self-hosted variable fonts from Google Fonts (SIL OFL 1.1): Libre Bodoni (display serif), Open Sans (reading sans). latin + latin-ext. */
@font-face{font-family:'Libre Bodoni';font-style:normal;font-weight:400 700;font-display:swap;src:url("fonts/LibreBodoni-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Libre Bodoni';font-style:normal;font-weight:400 700;font-display:swap;src:url("fonts/LibreBodoni-latin.woff2") format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Open Sans';font-style:normal;font-weight:300 800;font-display:swap;src:url("fonts/OpenSans-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Open Sans';font-style:normal;font-weight:300 800;font-display:swap;src:url("fonts/OpenSans-latin.woff2") format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

/* PT Serif (SIL OFL 1.1): small serif lines (sale line). */
@font-face{font-family:'PT Serif';font-style:normal;font-weight:400;font-display:swap;src:url("fonts/PTSerif-400-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'PT Serif';font-style:normal;font-weight:400;font-display:swap;src:url("fonts/PTSerif-400-latin.woff2") format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

/* The Private Salon: Go Fit Organic store shell, wave 1 (answer-post template + shared header/footer).
   Approved comp: .impeccable/mocks/post-comp-a.png (1024x1536; phone screen 756 comp px = 390 CSS px, k = 1.93846).
   Hero values below are measured off the comp and converted at k; the page is phone-first and uses container
   queries on .gfo-s-root so the same layout renders inside the comp frame and on a real phone. */

:root {
	--s-orange-strip: #C24E17;  /* sale strip: one step deeper so white text passes AA (4.8:1) */
	--s-porcelain: #FAF4EE;     /* page ground (comp #faf4ee) */
	--s-porcelain-hi: #FBF7F3;  /* header ground (comp #fbf7f3) */
	--s-card: #FAF3EC;          /* appointment-card stock (comp #faf3ec) */
	--s-ink: #161311;           /* near-black ink */
	--s-ink-soft: #4A403B;      /* secondary text, tinted from the ink */
	--s-gold: #C8964F;          /* gold-foil hairline (comp #c89852) */
	--s-gold-deep: #B98137;     /* gold on the card's inner line */
	--s-cream: #F8F5E6;         /* blind-emboss highlight between the card's gold lines */
	--s-rule: #E2DBD5;          /* header hairline (comp #e2dbd5) */
	--s-serif: 'Libre Bodoni', 'Bodoni 72', 'Didot', 'Times New Roman', serif;
	--s-serif-text: 'PT Serif', Georgia, 'Times New Roman', serif; /* small serif lines (measured match for the comp's sale lettering) */
	--s-sans: 'Open Sans', 'Segoe UI', system-ui, -apple-system, sans-serif;
}

.gfo-s-root { container: salon / inline-size; }
.gfo-s-root, .gfo-s-root *, .gfo-s-root *::before, .gfo-s-root *::after { box-sizing: border-box; }
.gfo-s-root {
	margin: 0; background: var(--s-porcelain); color: var(--s-ink);
	font-family: var(--s-sans); font-size: 17px; line-height: 1.55;
	-webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
.gfo-s-root ::selection { background: #F3C9A8; color: var(--s-ink); }
.gfo-s-root :focus-visible { outline: 2px solid var(--s-ink); outline-offset: 2px; border-radius: 2px; }
/* base resets carry zero specificity so every component rule wins */
:where(.gfo-s-root) a { color: inherit; }
:where(.gfo-s-root) img { max-width: 100%; }
.gfo-s-skip { position: absolute; left: -9999px; top: 0; }
.gfo-s-skip:focus { left: 8px; top: 8px; z-index: 100; background: var(--s-ink); color: #fff; padding: 10px 14px; }

/* ---------- Sale line (shared) ---------- */
.gfo-s-sale {
	display: flex; align-items: center; justify-content: center;
	min-height: 28px; padding: 7px 8px; background: var(--s-orange-strip);
}
.gfo-s-sale a {
	display: block; color: #fff; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
	font-family: var(--s-serif-text); font-size: clamp(10.6px, 2.95cqw, 11.6px); line-height: 14px; letter-spacing: 0.02em;
}

/* ---------- Header (shared) ---------- */
.gfo-s-hdr {
	position: sticky; top: 0; z-index: 50;
	display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
	height: 56.2px; padding: 0 4.3px 0 7.4px;
	background: var(--s-porcelain-hi);
}
.gfo-s-hdr__rule { position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--s-rule); }
.gfo-s-hdr__start { justify-self: start; display: flex; }
.gfo-s-hdr__end { justify-self: end; display: flex; gap: 1px; }
.gfo-s-iconbtn {
	display: grid; place-items: center; width: 44px; height: 44px; margin: 0; padding: 0;
	border: 0; background: none; color: var(--s-ink); cursor: pointer; text-decoration: none; border-radius: 4px;
}
.gfo-s-iconbtn svg { display: block; }
.gfo-s-menu-glyph { width: 21.7px; height: 15.5px; margin-top: -1.5px; }
.gfo-s-search-glyph { width: 17.6px; height: 17.6px; margin-top: 0.6px; margin-left: 0.2px; }
.gfo-s-cart { grid-template-columns: auto auto; column-gap: 5.6px; align-items: center; justify-content: center; }
.gfo-s-cart-glyph { width: 16.4px; height: 20.4px; margin-top: -1px; }
.gfo-s-cart__n { font-family: var(--s-sans); font-size: 12.3px; line-height: 1; font-weight: 400; margin-top: 1px; }
.gfo-s-brand {
	display: flex; flex-direction: column; align-items: center; text-decoration: none; color: var(--s-ink);
	padding-top: 3.6px;
}
.gfo-s-brand__name { font-family: var(--s-serif); font-size: 18.2px; line-height: 1; letter-spacing: 0.002em; white-space: nowrap; }
.gfo-s-brand__country {
	font-family: var(--s-sans); font-weight: 600; font-size: 10px; line-height: 1; letter-spacing: 0.34em;
	text-transform: uppercase; margin-top: 3.2px; margin-right: -0.34em;
}

/* ---------- Answer-post head ---------- */
.gfo-s-post__head { padding: 0 18px; text-align: center; }
.gfo-s-post__title {
	margin: 19.1px auto 0; max-width: 275px; text-wrap: balance;
	font-family: var(--s-serif); font-weight: 400; font-size: 36.2px; line-height: 38.4px; letter-spacing: -0.004em;
	color: var(--s-ink);
}
/* Real titles run long: step the size down and let them use the full width. */
.gfo-s-post__title--long { max-width: none; font-size: 31px; line-height: 1.1; }
.gfo-s-post__title--xlong { max-width: none; font-size: 27px; line-height: 1.12; }
.gfo-s-byline { margin: 2.8px 0 0; font-size: 13.5px; line-height: 1.35; color: var(--s-ink); }
.gfo-s-offlink { margin: 1.5px 0 0; font-size: 13.5px; line-height: 1.35; }
.gfo-s-offlink a { display: inline-block; padding: 3px 2px; color: var(--s-ink); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2.4px; text-decoration-skip-ink: none; }
.gfo-s-answer {
	margin: 7px 0 0; padding: 11px 12px 9.5px;
	background: var(--s-porcelain); border: 1px solid var(--s-gold);
}
.gfo-s-answer p {
	margin: 0 auto; max-width: 300px;
	font-family: var(--s-sans); font-size: 17px; line-height: 22.5px; color: var(--s-ink);
}
.gfo-s-answer strong { font-family: var(--s-serif); font-weight: 700; font-size: 21px; letter-spacing: -0.01em; }

/* ---------- Velvet band + product card ---------- */
.gfo-s-band {
	margin-top: 10.3px; padding: 146px 18px 24px;
	background-color: #D95A16; background-image: var(--s-velvet); background-size: cover; background-position: center top;
}
.gfo-s-pcard {
	position: relative; text-align: center;
	background: var(--s-card); border: 1px solid var(--s-gold-deep); border-radius: 10.5px;
	box-shadow: 0 0 0 1.5px var(--s-cream), 0 0 0 2px rgba(200, 145, 70, 0.85);
	padding: 0 20.1px 9px;
}
.gfo-s-pcard__img {
	display: block; position: relative; z-index: 2;
	width: 334.3px; max-width: none; height: 237.3px; object-fit: contain;
	margin: -144.5px 0 0 -7.2px;
	filter: drop-shadow(0 6px 7px rgba(90, 30, 5, 0.18));
}
.gfo-s-pcard__name {
	margin: -0.2px 0 0; font-family: var(--s-serif); font-weight: 400; font-size: 26.3px; line-height: 29px; color: var(--s-ink);
	white-space: nowrap;
}
.gfo-s-pcard__rule { height: 1px; margin: 0; border: 0; background: var(--s-gold); }
.gfo-s-pcard__rule--1 { margin-top: 4.6px; }
.gfo-s-pcard__rating {
	display: flex; align-items: center; justify-content: center; gap: 5px;
	margin: 4px 0 0; font-size: 13.5px; line-height: 16px; color: var(--s-ink);
}
.gfo-s-pcard__rating svg { width: 14.4px; height: 13.2px; flex: none; margin-top: -1.4px; }
.gfo-s-pcard__price { margin: 2px 0 0; font-family: var(--s-serif); font-size: 22px; line-height: 26px; color: var(--s-ink); }
.gfo-s-pcard__rule--2 { margin-top: 3px; }
.gfo-s-pcard__trust { margin: 4.5px 0 0; font-size: 13px; line-height: 16px; color: var(--s-ink); }
.gfo-s-btn {
	display: flex; align-items: center; justify-content: center;
	min-height: 44px; margin: 7px 0.6px 0 -1.3px; border-radius: 4px;
	background: var(--s-ink); color: #fff; text-decoration: none;
	font-family: var(--s-serif); font-size: 16px; line-height: 1.2; letter-spacing: 0.003em; padding: 0 12px;
}
.gfo-s-btn:hover { background: #2A2320; }

/* Centred text blocks shrink to their text so each is one tidy element (review crops, focus rings). */
.gfo-s-post__title, .gfo-s-byline, .gfo-s-offlink, .gfo-s-answer p, .gfo-s-pcard__name, .gfo-s-pcard__rating, .gfo-s-pcard__price, .gfo-s-pcard__trust { width: fit-content; margin-left: auto; margin-right: auto; }

/* ======================================================================
   Sections below the first viewport (inherit the hero's system: porcelain
   panels framed in gold hairlines, velvet bands, one display serif).
   ====================================================================== */
.gfo-s-vh { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.gfo-s-band { position: relative; }
.gfo-s-band .gfo-s-pcard { max-width: 390px; margin-left: auto; margin-right: auto; }

/* Reading column */
.gfo-s-prose { max-width: 42rem; margin: 0 auto; padding: 30px 22px 6px; }
.gfo-s-prose p { margin: 0 0 1.05em; font-size: 17px; line-height: 1.62; color: var(--s-ink); }
.gfo-s-prose a { color: var(--s-ink); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: var(--s-gold); }
.gfo-s-prose a:hover { text-decoration-color: var(--s-ink); }
.gfo-s-prose h2 { margin: 1.55em 0 0.45em; font-family: var(--s-serif); font-weight: 400; font-size: 27px; line-height: 1.12; letter-spacing: -0.005em; color: var(--s-ink); text-wrap: balance; }
.gfo-s-prose strong { font-weight: 700; }
.gfo-s-prose--after { padding-top: 26px; padding-bottom: 30px; }

/* Mid-post tray on a slim velvet band */
.gfo-s-tray-band { margin: 28px 0 4px; padding: 18px; background-color: #D95A16; background-image: var(--s-velvet); background-size: cover; background-position: center 30%; }
.gfo-s-tray {
	display: grid; grid-template-columns: 112px 1fr; column-gap: 14px; row-gap: 12px; align-items: center;
	max-width: 560px; margin: 0 auto; padding: 14px 16px 16px;
	background: var(--s-card); border: 1px solid var(--s-gold-deep); border-radius: 10.5px;
	box-shadow: 0 0 0 1.5px var(--s-cream), 0 0 0 2px rgba(200, 145, 70, 0.85);
}
.gfo-s-tray__img { display: block; width: 112px; height: auto; filter: drop-shadow(0 4px 5px rgba(90, 30, 5, 0.16)); }
.gfo-s-tray__body p { margin: 0; }
.gfo-s-tray__name { font-family: var(--s-serif); font-size: 18px; line-height: 1.15; color: var(--s-ink); text-wrap: balance; }
.gfo-s-tray__rating { display: flex; align-items: center; gap: 5px; margin-top: 6px !important; font-size: 13.5px; line-height: 16px; }
.gfo-s-tray__rating svg { width: 14px; height: 13px; flex: none; }
.gfo-s-tray__price { margin-top: 4px !important; font-family: var(--s-serif); font-size: 19px; line-height: 1.2; }
.gfo-s-btn.gfo-s-tray__btn { grid-column: 1 / -1; margin: 0; }

/* Genuine-pack check */
.gfo-s-genuine { margin: 30px 0 28px; padding: 20px 20px 16px; background: var(--s-porcelain-hi); border: 1px solid var(--s-gold); }
.gfo-s-genuine__icon { display: block; width: 30px; height: 30px; margin: 0 0 12px; color: var(--s-ink); }
.gfo-s-prose .gfo-s-genuine__title { margin: 0 0 8px; font-size: 23px; }
.gfo-s-prose .gfo-s-genuine p { font-size: 16px; line-height: 1.55; margin: 0 0 10px; }
.gfo-s-prose .gfo-s-genuine__link a { display: inline-flex; align-items: center; min-height: 32px; font-weight: 600; text-decoration-color: var(--s-ink); }
.gfo-s-genuine__link a::after { content: ""; width: 8px; height: 8px; margin-left: 9px; border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; transform: rotate(45deg); }

/* Closing card with the pack list */
.gfo-s-band--close { margin-top: 8px; padding: 148px 18px 28px; }
.gfo-s-pcard--close { padding-bottom: 16px; }
.gfo-s-pcard--close .gfo-s-pcard__name { margin-top: 0; }
.gfo-s-pcard--close .gfo-s-pcard__rating { margin-top: 5px; }
.gfo-s-pcard--close .gfo-s-pcard__rule { margin: 12px 0 0; }
.gfo-s-packs { margin: 4px 0 0; }
.gfo-s-packs__row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 9px 2px; }
.gfo-s-packs__row + .gfo-s-packs__row { border-top: 1px dotted var(--s-gold); }
.gfo-s-packs dt { font-size: 15px; letter-spacing: 0.01em; color: var(--s-ink); text-align: left; }
.gfo-s-packs dd { margin: 0; font-family: var(--s-serif); font-size: 21px; line-height: 1; color: var(--s-ink); }
.gfo-s-pcard--close .gfo-s-pcard__trust { margin-top: 10px; }
.gfo-s-pcard--close .gfo-s-btn { margin-top: 10px; }

/* Reviewer + trust note */
.gfo-s-reviewer { margin: 0 0 20px; padding: 18px 18px 8px; background: var(--s-porcelain-hi); border: 1px solid var(--s-gold); }
.gfo-s-prose .gfo-s-reviewer p { font-size: 15px; line-height: 1.55; margin: 0 0 10px; }
.gfo-s-prose .gfo-s-reviewer__who { display: flex; align-items: center; gap: 12px; font-size: 15.5px; }
.gfo-s-prose .gfo-s-reviewer__note { color: var(--s-ink-soft); font-size: 14px; }
.gfo-s-monogram {
	flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%;
	background: var(--s-orange-strip); color: #fff; font-family: var(--s-serif); font-size: 12.5px; letter-spacing: 0.06em; font-style: normal;
	box-shadow: inset 0 0 0 1.5px rgba(255, 244, 228, 0.55), 0 0 0 1px var(--s-gold);
}
.gfo-s-prose .gfo-preferred-source { font-size: 14.5px; line-height: 1.55; color: var(--s-ink-soft); margin: 0; }

/* Keep reading */
.gfo-s-related { max-width: 42rem; margin: 0 auto; padding: 8px 22px 36px; }
.gfo-s-related__title { margin: 0 0 8px; padding-top: 26px; border-top: 1px solid var(--s-rule); font-family: var(--s-serif); font-weight: 400; font-size: 25px; color: var(--s-ink); }
.gfo-s-related__list { list-style: none; margin: 0; padding: 0; }
.gfo-s-related__list li + li { border-top: 1px solid var(--s-gold); }
.gfo-s-related__list a { display: block; padding: 14px 0; font-family: var(--s-serif); font-size: 18.5px; line-height: 1.3; color: var(--s-ink); text-decoration: none; }
.gfo-s-related__list a:hover { text-decoration: underline; text-decoration-color: var(--s-gold); text-underline-offset: 4px; }

/* Footer: the salon's back office, near-black with gold hairlines */
.gfo-s-foot { background: var(--s-ink); color: #F3EEE8; padding: 36px 22px calc(96px + env(safe-area-inset-bottom)); }
.gfo-s-foot > * { max-width: 62rem; margin-left: auto; margin-right: auto; }
.gfo-s-foot a { color: #F3EEE8; }
.gfo-s-foot h2 { margin: 0 0 8px; font-family: var(--s-sans); font-weight: 600; font-size: 13px; line-height: 1.3; letter-spacing: 0.16em; text-transform: uppercase; color: var(--s-gold); }
/* The page's ink focus ring vanishes on the ink footer: a light ring here. */
.gfo-s-foot :focus-visible { outline-color: #F3EEE8; }
.gfo-s-foot ul { list-style: none; margin: 0; padding: 0; }
.gfo-s-foot__word { display: inline-block; font-family: var(--s-serif); font-size: 24px; line-height: 1; text-decoration: none; }
.gfo-s-foot__country { display: block; margin-top: 7px; font-family: var(--s-sans); font-weight: 600; font-size: 10px; line-height: 1; letter-spacing: 0.34em; text-transform: uppercase; color: #D9CFC6; }
.gfo-s-foot__line { margin: 16px 0 12px; font-size: 17px; line-height: 1.5; color: #D9CFC6; }
.gfo-s-foot__chat { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font-size: 15px; font-weight: 600; text-decoration: none; }
.gfo-s-foot__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 18px; margin-top: 24px; padding: 24px 0 18px; border-top: 1px solid rgba(200, 150, 79, 0.55); border-bottom: 1px solid rgba(200, 150, 79, 0.55); }
.gfo-s-foot__cols li a { display: flex; align-items: center; min-height: 44px; padding: 0; font-size: 15px; line-height: 1.35; text-decoration: none; }
.gfo-s-foot__cols li a:hover { text-decoration: underline; text-underline-offset: 3px; }
.gfo-s-foot__pay { padding: 20px 0 18px; }
.gfo-s-foot__pay ul { display: flex; flex-wrap: wrap; gap: 6px; }
.gfo-s-foot__pay li { padding: 5px 9px; border: 1px solid rgba(243, 238, 232, 0.3); border-radius: 3px; font-size: 13px; line-height: 1.2; color: #E9E1D8; }
.gfo-s-foot__disc { border-top: 1px solid rgba(200, 150, 79, 0.55); border-bottom: 1px solid rgba(200, 150, 79, 0.55); }
.gfo-s-foot__disc summary { display: flex; align-items: center; justify-content: space-between; min-height: 48px; font-size: 15px; cursor: pointer; list-style: none; }
.gfo-s-foot__disc summary::-webkit-details-marker { display: none; }
.gfo-s-foot__disc summary::after { content: ""; width: 8px; height: 8px; margin-right: 4px; border-right: 1.5px solid var(--s-gold); border-bottom: 1.5px solid var(--s-gold); transform: rotate(45deg); transition: transform 0.25s; }
.gfo-s-foot__disc[open] summary::after { transform: rotate(-135deg); }
.gfo-s-foot__disc-body { padding: 4px 0 18px; }
.gfo-s-foot__disc-body h2 { margin-top: 14px; }
.gfo-s-foot__disc-body li a { display: flex; align-items: center; min-height: 44px; padding: 0; font-size: 15px; line-height: 1.35; color: #D9CFC6; text-decoration: none; }
.gfo-s-foot__legal { padding-top: 20px; }
.gfo-s-foot__social { display: flex; gap: 18px; margin-bottom: 12px !important; }
.gfo-s-foot__social a { display: inline-flex; align-items: center; min-height: 44px; padding: 0; font-size: 14px; }
.gfo-s-foot__legal p { margin: 0; font-size: 13px; line-height: 1.55; color: #BDB2A8; }
.gfo-s-foot__legal p a { color: #E9E1D8; }

/* Bottom dock: the advisor badge (chat) always; the product bar only between the two product cards */
.gfo-s-dock { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; pointer-events: none; }
.gfo-s-dock__bar {
	display: flex; align-items: center; gap: 10px; min-height: 64px;
	padding: 10px 84px calc(10px + env(safe-area-inset-bottom)) 16px;
	background: var(--s-ink); color: #fff; box-shadow: 0 -6px 18px rgba(22, 19, 17, 0.18);
	transform: translateY(110%); visibility: hidden;
	transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), visibility 0s linear 0.5s;
}
.gfo-s-dock[data-state="bar"] .gfo-s-dock__bar { transform: none; visibility: visible; pointer-events: auto; transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), visibility 0s; }
.gfo-s-dock__label { flex: 1; min-width: 0; margin: 0; display: flex; flex-direction: column; gap: 2px; }
.gfo-s-dock__name { font-family: var(--s-serif); font-size: 16px; line-height: 1.15; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gfo-s-dock__price { font-family: var(--s-sans); font-size: 13.5px; line-height: 1.2; color: #E9E1D8; }
.gfo-s-dock__view {
	flex: none; display: grid; place-items: center; min-width: 72px; height: 44px; padding: 0 16px;
	background: #fff; color: var(--s-ink); border-radius: 5px; font-family: var(--s-sans); font-weight: 600; font-size: 15px; text-decoration: none;
}
.gfo-s-advisor {
	position: absolute; right: 12px; bottom: calc(10px + env(safe-area-inset-bottom)); pointer-events: auto;
	display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%;
	background: var(--s-orange-strip); color: #fff; text-decoration: none;
	font-family: var(--s-serif); font-size: 15px; letter-spacing: 0.06em;
	box-shadow: inset 0 0 0 2px rgba(255, 244, 228, 0.55), 0 0 0 1.5px var(--s-gold), 0 8px 18px rgba(90, 30, 5, 0.32);
	transition: transform 0.2s ease-out;
}
.gfo-s-advisor:hover { transform: translateY(-2px); }

/* Sources (shown only when a post has them; the dashed frame marks the prototype placeholder) */
.gfo-s-sources { margin: 26px 0 8px; padding: 16px 18px 14px; border: 1px solid var(--s-gold); }
.gfo-s-sources[data-placeholder] { border-style: dashed; }
.gfo-s-prose .gfo-s-sources__title { margin: 0 0 8px; font-size: 21px; }
.gfo-s-sources ol { margin: 0; padding-left: 1.2em; font-size: 14.5px; line-height: 1.5; }
.gfo-s-prose .gfo-s-sources__todo { margin: 0; font-size: 14.5px; line-height: 1.5; color: var(--s-ink-soft); font-style: italic; }

/* One bottom element at a time: the dock steps out instantly while the email slide-in is open */
.gfo-s-dock[data-state="yield"] .gfo-s-dock__bar { transform: translateY(110%); visibility: hidden; transition: none; }
.gfo-s-dock[data-state="yield"] .gfo-s-advisor { visibility: hidden; opacity: 0; transition: none; }
/* Quiet while the first card's button is on screen: the badge never sits on the main button */
.gfo-s-dock[data-state="quiet"] .gfo-s-advisor { visibility: hidden; opacity: 0; transform: translateY(12px); transition: opacity 0.3s, transform 0.3s, visibility 0s linear 0.3s; }

/* The email slide-in and footer signup (gfo-email-list.php) re-dressed in the salon's tokens on salon pages.
   Same markup and behaviour; only its CSS variables and a few declarations are overridden. */
#gfo-slide, #gfo-sub {
	--gs-font: 'Open Sans', 'Segoe UI', system-ui, sans-serif !important;
	--gs-ink: #161311 !important; --gs-txt: #161311 !important; --gs-acc: #161311 !important;
	--gs-btn: #161311 !important; --gs-btn-txt: #FFFFFF !important; --gs-bg: #FAF4EE !important;
	--gs-mute: #4A403B !important; --gs-line: #C8964F !important;
}
#gfo-slide { background: #FAF4EE !important; border-radius: 0 !important; border-top: 1px solid #C8964F !important; box-shadow: 0 -10px 30px rgba(22, 19, 17, 0.16) !important; }
@media (min-width: 601px) { #gfo-slide { border: 1px solid #C8964F !important; border-radius: 10.5px !important; } }
#gfo-slide .gfo-sub__eye, #gfo-sub .gfo-sub__eye { display: none !important; }
#gfo-slide .gfo-slide__top { margin-bottom: 12px !important; }
#gfo-slide .gfo-slide__h, #gfo-sub .gfo-sub__h { font-family: 'Libre Bodoni', 'Times New Roman', serif !important; font-weight: 400 !important; font-size: 21px !important; line-height: 1.2 !important; color: #161311 !important; letter-spacing: 0 !important; }
#gfo-slide .gfo-slide__h em, #gfo-sub .gfo-sub__h em { color: #161311 !important; font-style: normal !important; }
#gfo-slide .gfo-sub__email, #gfo-sub .gfo-sub__email { height: 48px !important; border: 1px solid #C8964F !important; border-radius: 4px !important; background: #FDFBF8 !important; font-family: 'Open Sans', system-ui, sans-serif !important; font-size: 16px !important; }
#gfo-slide .gfo-sub__email:focus, #gfo-sub .gfo-sub__email:focus { outline: 2px solid #161311 !important; outline-offset: 1px !important; border-color: #161311 !important; }
#gfo-slide .gfo-sub__btn, #gfo-sub .gfo-sub__btn { height: 48px !important; border-radius: 4px !important; background: #161311 !important; color: #FFFFFF !important; font-family: 'Libre Bodoni', 'Times New Roman', serif !important; font-weight: 400 !important; font-size: 16px !important; letter-spacing: 0.003em !important; }
#gfo-slide .gfo-sub__fine, #gfo-sub .gfo-sub__fine { font-family: 'Open Sans', system-ui, sans-serif !important; font-size: 12.5px !important; color: #4A403B !important; }
#gfo-slide .gfo-slide__x {
	font-size: 0 !important; color: transparent !important; width: 44px !important; height: 44px !important; top: 4px !important; right: 4px !important;
	background: center / 16px 16px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 5l14 14M19 5L5 19' stroke='%23161311' stroke-width='1.9' stroke-linecap='round' fill='none'/%3E%3C/svg%3E") !important;
}

/* Header that steps aside while reading down and returns on the way up */
.gfo-s-hdr { transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1); }
.gfo-s-hdr.is-away { transform: translateY(-105%); }

/* Menu drawer */
.gfo-s-menu { position: fixed; inset: 0; z-index: 80; background: rgba(22, 19, 17, 0.42); }
.gfo-s-menu[hidden] { display: none; }
.gfo-s-menu__panel {
	position: absolute; top: 0; bottom: 0; left: 0; width: min(88%, 380px); overflow-y: auto;
	padding: 10px 22px 28px; background: var(--s-porcelain-hi); border-right: 1px solid var(--s-gold);
	animation: gfo-s-menu-in 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes gfo-s-menu-in { from { transform: translateX(-100%); } to { transform: none; } }
.gfo-s-menu__top { display: flex; align-items: center; justify-content: space-between; min-height: 52px; }
.gfo-s-menu__title { font-family: var(--s-sans); font-weight: 600; font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--s-ink-soft); }
.gfo-s-menu__search { display: flex; align-items: center; margin: 6px 0 18px; border: 1px solid var(--s-gold); background: var(--s-porcelain); }
.gfo-s-menu__search input { flex: 1; min-width: 0; height: 46px; padding: 0 12px; border: 0; background: transparent; font: 16px/1.2 var(--s-sans); color: var(--s-ink); }
.gfo-s-menu__search input:focus { outline: none; }
.gfo-s-menu__search:focus-within { box-shadow: 0 0 0 1.5px var(--s-ink); }
.gfo-s-menu__nav ul { list-style: none; margin: 0; padding: 0; }
.gfo-s-menu__nav li + li { border-top: 1px solid var(--s-gold); }
.gfo-s-menu__nav a { display: block; padding: 13px 0; font-family: var(--s-serif); font-size: 21px; line-height: 1.2; color: var(--s-ink); text-decoration: none; }
.gfo-s-menu__small { margin-top: 22px !important; }
.gfo-s-menu__small a { font-family: var(--s-sans); font-size: 15.5px; padding: 11px 0; }

/* Signature moment, "the presentation": below-the-fold packs rise onto their card as it arrives. The resting state
   is the default (no JS, reduced motion, or already on screen = no movement). */
.gfo-s-tray__img, .gfo-s-pcard--close .gfo-s-pcard__img { transition: transform 0.9s cubic-bezier(0.16, 1, 0.3, 1), filter 0.9s cubic-bezier(0.16, 1, 0.3, 1); }
.gfo-s-lift { transform: translateY(18px); filter: drop-shadow(0 16px 14px rgba(90, 30, 5, 0.1)) !important; }
@media (prefers-reduced-motion: reduce) { .gfo-s-tray__img, .gfo-s-pcard--close .gfo-s-pcard__img { transition: none; } .gfo-s-lift { transform: none; } }

@media (prefers-reduced-motion: reduce) {
	.gfo-s-hdr, .gfo-s-dock__bar, .gfo-s-advisor { transition: none; }
	.gfo-s-dock[data-state] .gfo-s-advisor { transition: none; transform: none; }
	.gfo-s-menu__panel { animation: none; }
}

/* ---------- Wider screens (container queries on the page root, so the comp frame and real phones agree) ---------- */
@container salon (min-width: 760px) {
	.gfo-s-sale a { font-size: 12.5px; letter-spacing: 0.03em; }
	.gfo-s-hdr { height: 68px; padding: 0 20px; }
	.gfo-s-brand__name { font-size: 23px; }
	.gfo-s-brand__country { font-size: 10.5px; margin-top: 5px; }
	.gfo-s-post__head { max-width: 780px; margin: 0 auto; padding: 0 32px; }
	.gfo-s-post__title { max-width: 700px; margin-top: 44px; font-size: 54px; line-height: 1.04; letter-spacing: -0.01em; }
	.gfo-s-post__title--long { font-size: 46px; }
	.gfo-s-post__title--xlong { font-size: 40px; }
	.gfo-s-byline { margin-top: 16px; font-size: 15px; }
	.gfo-s-offlink { font-size: 15px; }
	.gfo-s-answer { max-width: 640px; margin: 18px auto 0; padding: 16px 28px 14px; }
	.gfo-s-answer p { max-width: 540px; font-size: 19px; line-height: 26px; text-wrap: balance; }
	.gfo-s-answer strong { font-size: 24px; }
	.gfo-s-band { margin-top: 28px; padding: 196px 32px 44px; }
	.gfo-s-band .gfo-s-pcard { max-width: 440px; padding-left: 26px; padding-right: 26px; }
	.gfo-s-band .gfo-s-pcard__img { width: 400px; height: auto; margin: -172px auto 0; }
	.gfo-s-band--close { padding-top: 196px; }
	.gfo-s-pcard__name { font-size: 30px; line-height: 1.15; }
	.gfo-s-prose { padding: 44px 32px 10px; }
	.gfo-s-prose p { font-size: 18px; line-height: 1.66; }
	.gfo-s-prose h2 { font-size: 32px; }
	.gfo-s-tray-band { padding: 26px 32px; }
	.gfo-s-tray { max-width: 740px; grid-template-columns: 150px minmax(0, 1fr) auto; column-gap: 24px; padding: 16px 24px; }
	.gfo-s-tray__name { font-size: 21px; }
	.gfo-s-tray__img { width: 150px; }
	.gfo-s-btn.gfo-s-tray__btn { grid-column: auto; padding: 0 24px; white-space: nowrap; }
	.gfo-s-related { padding-left: 32px; padding-right: 32px; }
	.gfo-s-foot { padding: 52px 40px 110px; }
	.gfo-s-foot__top { display: grid; grid-template-columns: 1.2fr 2fr; gap: 40px; }
	.gfo-s-foot__cols { grid-template-columns: repeat(3, 1fr); margin-top: 0; border-top: 0; border-bottom: 0; padding-top: 0; }
	.gfo-s-dock__bar { max-width: 560px; margin: 0 auto 16px; border-radius: 10px; padding-right: 16px; }
	.gfo-s-advisor { right: 24px; bottom: 24px; }
}

/* The Private Salon, wave 2: shop + category (approved comp .impeccable/mocks/cat/cat-comp-c.png, "C · The ladder").
   Loaded after salon.css. Values measured off the comp at k = 1.93846 (756 comp px = 390 CSS px). */

.gfo-s-cathead { padding: 0 18px; text-align: center; }
.gfo-s-crumbs { margin: 15.3px 0 0; font-size: 13.5px; line-height: 1.35; color: var(--s-ink); }
.gfo-s-crumbs a { color: inherit; text-decoration: none; }
.gfo-s-crumbs a:hover { text-decoration: underline; text-underline-offset: 2.4px; }
.gfo-s-cattitle {
	margin: 9px 0 0; font-family: var(--s-serif); font-weight: 400; font-size: 54.2px; line-height: 1; letter-spacing: 0.012em;
	color: var(--s-ink);
}
.gfo-s-catguide { margin: 3px 0 0; font-size: 16px; line-height: 1.35; color: var(--s-ink); letter-spacing: -0.003em; }

/* The range band: the velvet carries the kit ladder, its trust line and the rest of the range. White text on the velvet
   sits on its own soft fold of deeper velvet (the Deeper Strip Rule), so it keeps AA contrast on every fold. */
.gfo-s-band--range {
	margin-top: 17px; padding: 45.34px 13.4px 44px;
	/* The velvet keeps its own scale down the tall band: the plate stacked with its mirror, repeated. */
	background-image: var(--s-velvet-tile, var(--s-velvet));
	background-size: 100% auto; background-position: center top; background-repeat: repeat-y;
}

/* ---------- The ladder: the three kits side by side ---------- */
.gfo-s-ladder {
	position: relative;
	background: var(--s-card); border: 1px solid var(--s-gold-deep); border-radius: 10.5px;
	box-shadow: 0 0 0 1.5px var(--s-cream), 0 0 0 2px rgba(200, 145, 70, 0.85);
}
.gfo-s-ladder__table { width: calc(100% - 15.4px); margin: 0 7.7px; border-collapse: collapse; table-layout: fixed; }
.gfo-s-ladder__c0 { width: 52.2px; }
.gfo-s-ladder__c1 { width: 99.55px; }
.gfo-s-ladder__c2 { width: 105.25px; }
.gfo-s-ladder__table th, .gfo-s-ladder__table td { padding: 0; font-weight: 400; text-align: center; vertical-align: middle; }
.gfo-s-ladder__table .gfo-s-ladder__kit { vertical-align: top; padding-top: 14px; }
.gfo-s-ladder__pack { display: block; width: auto; max-width: none; height: 95.9px; margin: 0 auto; filter: drop-shadow(0 1px 1.5px rgba(90, 30, 5, 0.12)); }
.gfo-s-ladder__pack--1 { transform: translateX(2.9px); }
.gfo-s-ladder__pack--2 { transform: translateX(-3.1px); }
.gfo-s-ladder__pack--3 { transform: translateX(-3.2px); }
.gfo-s-ladder__name { display: block; margin-top: 2.9px; font-family: var(--s-serif); font-size: 15.4px; line-height: 17px; color: var(--s-ink); }
.gfo-s-ladder__prices td { padding: 4.6px 0 5.4px; font-family: var(--s-serif); font-size: 14.6px; line-height: 17px; color: var(--s-ink); vertical-align: top; }
.gfo-s-ladder__prices td + td + td,
.gfo-s-ladder__table tbody td + td,
.gfo-s-ladder__table tfoot td + td + td { border-left: 1px solid var(--s-gold); }
.gfo-s-ladder__table tbody tr { border-top: 1px solid var(--s-gold); }
.gfo-s-ladder__table tbody th, .gfo-s-ladder__table tbody td { height: 34.05px; }
.gfo-s-ladder__table tbody th {
	padding-left: 4.7px; text-align: left; font-family: var(--s-sans); font-size: 13px; line-height: 14px; color: var(--s-ink);
}
.gfo-s-yes, .gfo-s-no { display: inline-block; vertical-align: middle; }
.gfo-s-yes {
	width: 15px; height: 12.9px; background: var(--s-gold-deep);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 26'%3E%3Cpath d='M2 14.5l8.2 8.2L28 2.5' fill='none' stroke='%23000' stroke-width='4.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 26'%3E%3Cpath d='M2 14.5l8.2 8.2L28 2.5' fill='none' stroke='%23000' stroke-width='4.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.gfo-s-no { width: 16px; height: 1.5px; background: #C5C2C1; border-radius: 1px; }
.gfo-s-ladder__table tfoot td { padding: 4.45px 0 9.4px; }
.gfo-s-ladder__btn { height: 44px; margin: 0 auto; padding: 0 6px; }
.gfo-s-ladder__table tfoot td:nth-child(2) .gfo-s-ladder__btn { width: 84.2px; }
.gfo-s-ladder__table tfoot td:nth-child(3) .gfo-s-ladder__btn { width: 87.2px; }
.gfo-s-ladder__table tfoot td:nth-child(4) .gfo-s-ladder__btn { width: 77.9px; }
.gfo-s-ladder__trust {
	display: flex; align-items: center; justify-content: center; gap: 6px; width: fit-content; max-width: 100%;
	margin: 2px auto 0; padding: 18px 30px; font-size: 14px; line-height: 20px; color: #fff;
	background: radial-gradient(closest-side, rgba(140, 40, 4, 0.8) 0 74%, rgba(140, 40, 4, 0) 100%);
}
.gfo-s-ladder__trust svg { width: 13.5px; height: 12.4px; flex: none; margin-top: -1.5px; }

/* ---------- The rest of the range: a two-up grid of porcelain cards on the same velvet ---------- */
.gfo-s-range__title {
	width: fit-content; max-width: 100%; margin: 38px auto 0; padding: 18px 48px; text-align: center;
	font-family: var(--s-serif); font-weight: 400; font-size: 26px; line-height: 1.15; color: #fff;
	background: radial-gradient(closest-side, rgba(140, 40, 4, 0.62) 0 70%, rgba(140, 40, 4, 0) 100%);
}
.gfo-s-grid { list-style: none; margin: 96px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 94px 10px; }
.gfo-s-gcard {
	position: relative; display: flex; flex-direction: column; align-items: center; text-align: center;
	padding: 0 10px 10px; background: var(--s-card); border: 1px solid var(--s-gold-deep); border-radius: 10.5px;
	box-shadow: 0 0 0 1.5px var(--s-cream), 0 0 0 2px rgba(200, 145, 70, 0.85);
}
.gfo-s-gcard__img {
	display: block; width: calc(100% + 16px); max-width: none; height: auto; margin: -84px -8px 0;
	filter: drop-shadow(0 5px 6px rgba(90, 30, 5, 0.18));
}
.gfo-s-gcard--noimg { padding-top: 16px; }
.gfo-s-gcard__name { margin: 4px 0 0; font-family: var(--s-serif); font-weight: 400; font-size: 20.5px; line-height: 1.1; text-wrap: balance; color: var(--s-ink); }
.gfo-s-gcard__rule { width: 100%; height: 1px; margin: 7px 0 0; border: 0; background: var(--s-gold); }
.gfo-s-gcard__note { margin: 5px 0 0; font-size: 13px; line-height: 1.3; color: var(--s-ink-soft); }
.gfo-s-gcard__name a { color: inherit; text-decoration: none; }
.gfo-s-gcard__name a::after { content: ""; position: absolute; inset: 0; border-radius: 10.5px; }
.gfo-s-gcard__name a:focus-visible { outline: none; }
.gfo-s-gcard:has(a:focus-visible) { outline: 2px solid var(--s-ink); outline-offset: 3px; }
.gfo-s-gcard__rating { display: flex; align-items: center; gap: 4px; margin: 6px 0 0; font-size: 13px; line-height: 16px; color: var(--s-ink); }
.gfo-s-gcard__rating svg { width: 12.5px; height: 11.5px; flex: none; margin-top: -1px; }
.gfo-s-gcard__price { margin: 3px 0 10px; font-family: var(--s-serif); font-size: 18px; line-height: 22px; color: var(--s-ink); }
.gfo-s-gcard__foot { width: 100%; margin-top: auto; display: flex; flex-direction: column; align-items: center; }
.gfo-s-gcard__btn { width: 100%; }
.gfo-s-gcard:hover .gfo-s-gcard__btn { background: var(--s-ink-hover, #2A2320); }

/* ---------- About the category: the store's own category text, kept verbatim ---------- */
.gfo-s-catabout { padding: 30px 22px 34px; }
.gfo-s-catabout h2 { margin: 0; font-family: var(--s-serif); font-weight: 400; font-size: 24px; line-height: 1.15; }
.gfo-s-catabout p { margin: 10px 0 0; font-size: 17px; line-height: 1.6; color: var(--s-ink); }

/* ---------- Store pages beyond the comp: the shop's range tabs, long titles, page links, an empty range ---------- */
.gfo-s-cattitle--long { max-width: 330px; margin-left: auto; margin-right: auto; font-size: 34px; line-height: 1.08; text-wrap: balance; }
.gfo-s-tabs {
	display: flex; gap: 8px; margin: 16px -18px 0; padding: 2px 18px 12px;
	overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.gfo-s-tabs::-webkit-scrollbar { display: none; }
.gfo-s-tab {
	flex: none; display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px;
	background: var(--s-card); border: 1px solid var(--s-gold); border-radius: 4px;
	font-family: var(--s-serif); font-size: 16px; line-height: 1; color: var(--s-ink); text-decoration: none; white-space: nowrap;
}
.gfo-s-tab.is-on { background: var(--s-ink); border-color: var(--s-ink); color: #fff; }
.gfo-s-pages { margin: 44px 0 0; }
.gfo-s-pages ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0; padding: 0; list-style: none; }
.gfo-s-pages a, .gfo-s-pages span {
	display: grid; place-items: center; min-width: 44px; min-height: 44px; padding: 0 12px; border-radius: 4px;
	background: var(--s-card); color: var(--s-ink); font-family: var(--s-serif); font-size: 17px; text-decoration: none;
}
.gfo-s-pages .current { background: var(--s-ink); color: #fff; }
.gfo-s-pages .dots { background: transparent; color: #fff; }
.gfo-s-empty { margin: 8px 0 0; padding: 22px 20px; background: var(--s-card); border-radius: 10.5px; text-align: center; font-size: 16px; }
.gfo-s-empty a { color: inherit; }

/* Computers: the same page in a wider centred column; the grid runs three across. */
@container salon (min-width: 760px) {
	.gfo-s-cathead { padding: 0 32px; }
	.gfo-s-cattitle--long { max-width: 720px; font-size: 44px; }
	.gfo-s-tabs { justify-content: center; flex-wrap: wrap; overflow: visible; margin: 18px 0 0; padding: 2px 0 12px; }
	.gfo-s-band--range { padding-left: 32px; padding-right: 32px; }
	/* The ladder is the page's main choice: on computers it stays the largest thing on the band. */
	.gfo-s-ladder { max-width: 760px; margin: 0 auto; }
	.gfo-s-ladder__table { width: calc(100% - 32px); margin: 0 16px; }
	.gfo-s-ladder__c0 { width: 150px; }
	.gfo-s-ladder__c1, .gfo-s-ladder__c2 { width: auto; }
	.gfo-s-ladder__table .gfo-s-ladder__kit { padding-top: 22px; }
	.gfo-s-ladder__pack { height: 150px; }
	.gfo-s-ladder__pack--1, .gfo-s-ladder__pack--2, .gfo-s-ladder__pack--3 { transform: none; }
	.gfo-s-ladder__name { margin-top: 8px; font-size: 21px; line-height: 24px; }
	.gfo-s-ladder__prices td { padding: 4px 0 12px; font-size: 20px; line-height: 24px; }
	.gfo-s-ladder__table tbody th { padding-left: 8px; font-size: 15px; line-height: 18px; white-space: nowrap; }
	.gfo-s-ladder__table tbody th, .gfo-s-ladder__table tbody td { height: 44px; }
	.gfo-s-ladder__table tfoot td { padding: 12px 0 18px; }
	.gfo-s-ladder__table tfoot td .gfo-s-ladder__btn { width: 132px !important; }
	.gfo-s-yes { width: 20px; height: 17px; }
	.gfo-s-no { width: 20px; }
	.gfo-s-ladder__trust { font-size: 15px; }
	.gfo-s-grid { max-width: 880px; margin: 150px auto 0; grid-template-columns: repeat(3, 1fr); gap: 150px 20px; }
	.gfo-s-gcard__img { margin-top: -128px; }
	.gfo-s-catabout { max-width: 720px; margin: 0 auto; }
}

/* The presentation (wave 1's signature motion) reaches the grid: each pack rises onto its card as the card arrives. */
.gfo-s-gcard__img { transition: transform 0.9s cubic-bezier(0.16, 1, 0.3, 1), filter 0.9s cubic-bezier(0.16, 1, 0.3, 1); }
@media (prefers-reduced-motion: reduce) { .gfo-s-gcard__img { transition: none; } }

/* The Private Salon, wave 3: the store homepage (approved comp .impeccable/mocks/home/home-sg.png, "C revised").
   Loaded after salon.css and cat.css (it reuses the range title and the grid card). Values measured off the comp at
   k = 1.846154 (720 comp px = 390 CSS px). */

/* ---------- The door: one statement, then the genuine-pack check ---------- */
.gfo-s-homehead { padding: 0 9.75px; text-align: center; }
.gfo-s-hometitle {
	width: fit-content; max-width: 290px; margin: 14.35px auto 0; text-wrap: balance;
	font-family: var(--s-serif); font-weight: 400; font-size: 36px; line-height: 36.3px; letter-spacing: -0.004em;
	color: var(--s-ink);
}

/* The QR card: how to check a pack is original. The icon is a pictogram of a QR code, never a scannable fake.
   Its instruction is reading text in a framed panel, so it keeps the 16 px floor and wraps to two lines (the comp set
   it on one line at 12 px; the Readability Floor Rule raises it for 55+ readers). */
.gfo-s-qrcard {
	display: grid; grid-template-columns: 92.7px 1fr; align-items: start;
	margin: 10.55px 0 0; padding: 8.9px 10px 7.1px 0; text-align: left;
	background: var(--s-porcelain-hi); border: 1px solid var(--s-gold); border-radius: 4.3px;
}
.gfo-s-qrcard__icon { width: 37px; height: 37px; margin: 11.2px 0 0 24.5px; color: var(--s-ink); }
.gfo-s-qrcard__body { min-width: 0; }
.gfo-s-qrcard__title { width: fit-content; margin: 0; font-family: var(--s-serif); font-weight: 400; font-size: 20px; line-height: 24px; color: var(--s-ink); }
.gfo-s-qrcard__text { width: fit-content; margin: 1px 0 0; font-size: 16px; line-height: 21px; text-wrap: balance; color: var(--s-ink); }
.gfo-s-qrcard__link {
	position: relative; display: block; width: fit-content; margin: -1px 0 0 -2px; padding: 3.5px 2px;
	font-size: 13.5px; line-height: 17px; color: var(--s-ink);
	text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2.6px; text-decoration-skip-ink: none;
}
/* The Readability Floor: a 44 px target without moving the approved card. */
.gfo-s-qrcard__link::after { content: ""; position: absolute; inset: -10px -8px; }

/* ---------- The bestsellers: the store's top four by orders, two-up on the velvet ---------- */
.gfo-s-band--best {
	margin-top: 9.2px; padding: 3.3px 8.4px 40px;
	background-image: var(--s-velvet-tile, var(--s-velvet));
	background-size: 100% auto; background-position: center top; background-repeat: repeat-y;
}
.gfo-s-best__title { margin-top: 0; padding: 10px 40px; font-size: 33.8px; line-height: 40px; letter-spacing: -0.004em; }
.gfo-s-grid--best { margin: 26.1px 0 0; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 29px 6px; }

/* The card stands its pack on a common line: every pack sits the same distance above the name, so each row's names,
   ratings and buttons align (the Real Pack rule: the pack is the product's real photo, never a poster). */
.gfo-s-gcard--best { padding: 0 10px 7.9px; }
.gfo-s-gcard--best .gfo-s-gcard__img {
	width: calc(100% + 26.4px); aspect-ratio: 1296 / 920; object-fit: contain; object-position: 50% 100%;
	margin: -37px -13.2px 0;
}
.gfo-s-gcard--best .gfo-s-gcard__name { margin: -0.86px -6px 0; font-size: 16px; line-height: 20px; }
.gfo-s-gcard--best .gfo-s-gcard__rule { margin-top: 5.76px; }
.gfo-s-gcard--best .gfo-s-gcard__rating { gap: 5px; margin-top: 3.36px; font-size: 13.5px; line-height: 16px; }
.gfo-s-gcard--best .gfo-s-gcard__rating svg { width: 14.4px; height: 13.2px; margin-top: -1.4px; }
.gfo-s-gcard--best .gfo-s-gcard__price { margin: 4.48px 0 0; font-size: 16.9px; line-height: 20px; }
/* The button keeps the 44 px control floor (the comp drew it 28 px tall); the whole card stays the one link. */
.gfo-s-gcard--best .gfo-s-gcard__btn { margin: 2.86px 0 0; }

/* ---------- Below the grid: the whole range, then the way on ---------- */
.gfo-s-best__all { margin: 38px 0 0; text-align: center; }
/* The secondary action on the velvet is cut from the card's own stock: porcelain with the double gold hairline. */
.gfo-s-btn.gfo-s-btn--porcelain {
	display: inline-flex; min-width: 250px; margin: 0; padding: 0 28px;
	background: var(--s-card); color: var(--s-ink); border: 1px solid var(--s-gold-deep);
	box-shadow: 0 0 0 1.5px var(--s-cream), 0 0 0 2px rgba(200, 145, 70, 0.85);
}
.gfo-s-btn.gfo-s-btn--porcelain:hover { background: #FFFDFA; }
/* White words on the velvet sit on their own soft fold of deeper velvet (the Soft Fold Rule, as the ladder's trust line). */
.gfo-s-best__trust {
	width: fit-content; max-width: 100%; margin: 12px auto 0; padding: 5px 28px; text-align: center;
	font-size: 14px; line-height: 22px; color: #fff;
	background: radial-gradient(closest-side, rgba(140, 40, 4, 0.8) 0 74%, rgba(140, 40, 4, 0) 100%);
}
.gfo-s-best__trust a { display: inline-flex; align-items: center; min-height: 44px; color: #fff; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.gfo-s-best__trust a:focus-visible { outline-color: #fff; }
/* Too long for one line (salon.js measures it): the link takes its own line and the dot goes. */
.gfo-s-best__trust.is-stacked .gfo-s-best__sep { display: none; }
.gfo-s-best__trust.is-stacked a { display: flex; width: fit-content; margin: 0 auto; }

/* The range index: every range with the products it holds, one gold-ruled row each; the whole row is the link. */
.gfo-s-ranges { max-width: 42rem; margin: 0 auto; padding: 44px 22px 6px; }
.gfo-s-ranges__title, .gfo-s-faq__title {
	margin: 0 0 14px; text-align: center; text-wrap: balance;
	font-family: var(--s-serif); font-weight: 400; font-size: 29px; line-height: 1.1; letter-spacing: -0.004em; color: var(--s-ink);
}
.gfo-s-ranges__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--s-gold); }
.gfo-s-ranges__list li { border-bottom: 1px solid var(--s-gold); }
.gfo-s-ranges__list a {
	display: grid; grid-template-columns: 1fr auto; column-gap: 14px; align-items: center;
	min-height: 60px; padding: 11px 2px; color: var(--s-ink); text-decoration: none;
}
.gfo-s-ranges__name { font-family: var(--s-serif); font-size: 21px; line-height: 1.15; }
.gfo-s-ranges__items { grid-column: 1; margin-top: 3px; font-size: 14px; line-height: 1.35; color: var(--s-ink-soft); }
.gfo-s-ranges__list a::after {
	content: ""; grid-column: 2; grid-row: 1 / span 2; width: 8px; height: 8px; margin-right: 5px;
	border-top: 1.5px solid var(--s-gold-deep); border-right: 1.5px solid var(--s-gold-deep); transform: rotate(45deg);
}
.gfo-s-ranges__list a:hover .gfo-s-ranges__name { text-decoration: underline; text-decoration-color: var(--s-gold); text-decoration-thickness: 1px; text-underline-offset: 4px; }
.gfo-s-ranges__list a:focus-visible { outline-offset: -2px; }

/* The store's own questions: delivery, genuine packs, choosing, paying. Facts from the store's policy pages only. */
.gfo-s-faq { max-width: 42rem; margin: 0 auto; padding: 46px 22px 52px; }
.gfo-s-faq__item { border-bottom: 1px solid var(--s-gold); }
.gfo-s-faq__item:first-of-type { border-top: 1px solid var(--s-gold); }
.gfo-s-faq__item summary {
	display: grid; grid-template-columns: 1fr auto; align-items: center; column-gap: 14px;
	min-height: 58px; padding: 12px 2px; cursor: pointer; list-style: none;
	font-family: var(--s-serif); font-size: 19px; line-height: 1.25; color: var(--s-ink);
}
.gfo-s-faq__item summary::-webkit-details-marker { display: none; }
.gfo-s-faq__item summary::after {
	content: ""; width: 9px; height: 9px; margin: -5px 5px 0 0;
	border-right: 1.5px solid var(--s-gold-deep); border-bottom: 1.5px solid var(--s-gold-deep); transform: rotate(45deg);
	transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.gfo-s-faq__item[open] summary::after { transform: rotate(-135deg); margin-top: 5px; }
.gfo-s-faq__item summary:focus-visible { outline-offset: -2px; }
.gfo-s-faq__a p { margin: 0 0 18px; font-size: 17px; line-height: 1.6; color: var(--s-ink); }
.gfo-s-faq__a a { color: var(--s-ink); text-decoration: underline; text-decoration-color: var(--s-gold); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.gfo-s-faq__a a:hover { text-decoration-color: var(--s-ink); }
@media (prefers-reduced-motion: reduce) { .gfo-s-faq__item summary::after { transition: none; } }

/* ---------- Mid-page (owner pick B, 30 Sep): our customers, then every range as its real pack ---------- */
/* ---------- Range tiles: every range as its real pack on a card (replaces the text index) ---------- */
.gfo-s-rtiles { padding: 44px 14px 6px; }
.gfo-s-rtiles__grid { list-style: none; margin: 20px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 10px; }
.gfo-s-rtile a {
	display: flex; flex-direction: column; align-items: center; height: 100%; padding: 10px 10px 13px; text-align: center;
	background: var(--s-card); border: 1px solid var(--s-gold-deep); border-radius: 10.5px; color: var(--s-ink); text-decoration: none;
	box-shadow: 0 0 0 1.5px var(--s-cream), 0 0 0 2px rgba(200, 145, 70, 0.85);
}
.gfo-s-rtile img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: contain; object-position: 50% 100%; }
.gfo-s-rtile__name { margin-top: 8px; font-family: var(--s-serif); font-size: 19px; line-height: 1.15; }
.gfo-s-rtile__n { margin-top: 3px; font-size: 13.5px; line-height: 1.3; color: var(--s-ink-soft); }

/* ---------- Our customers: real, consented buyers with their packs ---------- */
.gfo-s-people { padding: 44px 14px 6px; }
.gfo-s-people__lead { width: fit-content; max-width: 300px; margin: 6px auto 0; text-align: center; font-size: 17px; line-height: 1.45; color: var(--s-ink-soft); text-wrap: balance; }
.gfo-s-people__grid { list-style: none; margin: 18px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 10px; }
.gfo-s-person figure { margin: 0; }
.gfo-s-person img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 10.5px; box-shadow: 0 0 0 1px var(--s-gold-deep), 0 0 0 2.5px var(--s-cream); }
.gfo-s-person figcaption { margin-top: 7px; text-align: center; font-size: 13.5px; line-height: 1.35; color: var(--s-ink-soft); }
.gfo-s-person figcaption b { display: block; font-family: var(--s-serif); font-weight: 400; font-size: 18px; color: var(--s-ink); }
/* the lighter variant: one swipeable row */
.gfo-s-people--strip .gfo-s-people__grid { display: flex; gap: 10px; margin: 18px -14px 0; padding: 0 14px 6px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.gfo-s-people--strip .gfo-s-person { flex: 0 0 58%; scroll-snap-align: start; }

/* ---------- Computers: the door stays a column, the bestsellers stand in one row of four ---------- */
@container salon (min-width: 760px) {
	.gfo-s-homehead { max-width: 760px; margin: 0 auto; padding: 0 32px; }
	.gfo-s-hometitle { max-width: none; margin-top: 30px; font-size: 48px; line-height: 1.04; }
	.gfo-s-qrcard { margin-top: 20px; }
	.gfo-s-band--best { margin-top: 28px; padding: 26px 32px 60px; }
	.gfo-s-grid--best { max-width: 1080px; margin: 104px auto 0; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 20px; }
	.gfo-s-gcard--best { padding: 0 14px 12px; }
	/* A landscape pack would cross the card's side border at this width: the pack rises from the card, inside its edge. */
	.gfo-s-gcard--best .gfo-s-gcard__img { width: 100%; margin: -64px 0 0; }
	.gfo-s-gcard--best .gfo-s-gcard__name { font-size: 19px; line-height: 23px; }
	.gfo-s-gcard--best .gfo-s-gcard__price { font-size: 19px; line-height: 23px; }
	.gfo-s-best__all { margin-top: 52px; }
	.gfo-s-ranges { max-width: 900px; padding: 64px 32px 10px; }
	.gfo-s-ranges__list { display: grid; grid-template-columns: 1fr 1fr; column-gap: 44px; border-top: 0; }
	.gfo-s-ranges__list li:nth-child(-n + 2) { border-top: 1px solid var(--s-gold); }
	.gfo-s-ranges__title, .gfo-s-faq__title { font-size: 34px; margin-bottom: 20px; }
	.gfo-s-faq { padding: 64px 32px 72px; }
}

/* The answers open with the page's one ease (browsers that animate details content; others simply open). */
@supports selector(::details-content) {
	.gfo-s-faq { interpolate-size: allow-keywords; }
	.gfo-s-faq__item::details-content {
		height: 0; overflow: clip;
		transition: height 0.38s cubic-bezier(0.16, 1, 0.3, 1), content-visibility 0.38s allow-discrete;
	}
	.gfo-s-faq__item[open]::details-content { height: auto; }
	@media (prefers-reduced-motion: reduce) { .gfo-s-faq__item::details-content { transition: none; } }
}

/* Mid-page on computers: the same sections in the wider centred column */
@container salon (min-width: 760px) {
	.gfo-s-rtiles, .gfo-s-people { max-width: 1080px; margin: 0 auto; padding-left: 32px; padding-right: 32px; }
	.gfo-s-rtiles__grid, .gfo-s-people__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
	.gfo-s-people__lead { max-width: 520px; }
}

/* The Private Salon, wave 3b: the country picker at gofitorganic.com (the network's front door).
   Approved comp: .impeccable/mocks/home/picker.png (1024x1536; phone screen 758 comp px = 390 CSS px, k = 1.94359).
   Measured values are converted at k; the Readability Floor wins where the comp drew smaller (16 px card labels,
   44 px targets). Loaded after salon.css. */

/* ---------- Header: the wordmark alone (the front door has no store yet, so no menu, search or cart) ---------- */
.gfo-s-hdr.gfo-s-hdr--solo { position: relative; display: flex; justify-content: center; height: 52px; padding: 0; }
.gfo-s-hdr--solo .gfo-s-brand { padding-top: 0; }
/* With nothing else in the bar, the wordmark takes the size it has on computers (the comp draws it this large). */
.gfo-s-hdr--solo .gfo-s-brand__name { font-size: 20.5px; }

/* ---------- The question on the velvet, then the suggestion card ---------- */
.gfo-s-band.gfo-s-band--picker {
	margin-top: 0; padding: 30px 10px 32px;
	background-image: var(--s-velvet-tile, var(--s-velvet));
	background-size: 100% auto; background-position: center top; background-repeat: repeat-y;
}
/* White words on the velvet sit on their own soft fold of deeper velvet (the Soft Fold Rule). */
.gfo-s-picker__title {
	width: fit-content; max-width: 100%; margin: 0 auto; padding: 10px 14px 12px; text-align: center;
	font-family: var(--s-serif); font-weight: 400; font-size: 45.8px; line-height: 49px; letter-spacing: -0.025em; color: #fff;
	/* 0.3 keeps white above 3:1 on the brightest sheen (large text) without a visible dark patch */
	background: radial-gradient(closest-side, rgba(140, 40, 4, 0.3) 0 60%, rgba(140, 40, 4, 0) 100%);
}

.gfo-s-suggest {
	position: relative; margin: 0 20px; padding: 18px 21.6px 4px; text-align: center;
	background: var(--s-card); border: 1px solid var(--s-gold); border-radius: 4.3px; /* the framed-panel corner (as the QR card) */
	box-shadow: 0 0 0 2px #FDFBF8; /* the thin white rim outside the gold hairline */
}
.gfo-s-suggest[hidden] { display: none; }
.gfo-s-suggest__pin { display: block; width: 30.9px; height: 39.6px; margin: 0 auto; color: var(--s-gold); }
.gfo-s-suggest__lead { margin: 4.7px 0 0; font-size: 17px; line-height: 22px; color: var(--s-ink); }
.gfo-s-suggest__country { margin: 2px 0 0; font-family: var(--s-serif); font-weight: 400; font-size: 38.5px; line-height: 46px; letter-spacing: -0.004em; color: var(--s-ink); }
.gfo-s-btn.gfo-s-suggest__go { margin: 11px 0 0; min-height: 44px; font-size: 18px; }
.gfo-s-suggest__remember {
	display: inline-flex; align-items: center; gap: 18.4px; min-height: 44px; margin: 1px 0 0; cursor: pointer;
	font-size: 16px; line-height: 22px; color: var(--s-ink);
}
/* A native checkbox, drawn as the comp's gold square; the whole label is the 44 px target. */
/* Centred text blocks shrink to their text so each is one tidy element (review crops, focus rings). */
.gfo-s-suggest__lead, .gfo-s-suggest__country { width: fit-content; margin-left: auto; margin-right: auto; }
.gfo-s-suggest__remember input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.gfo-s-suggest__box {
	flex: none; width: 21.1px; height: 21.6px; border: 1.5px solid var(--s-gold); border-radius: 3px; background: var(--s-card);
	display: grid; place-items: center;
}
.gfo-s-suggest__box::after {
	content: ""; width: 10px; height: 5.5px; margin-top: -3px; border-left: 2px solid var(--s-ink); border-bottom: 2px solid var(--s-ink);
	transform: rotate(-45deg); opacity: 0;
}
.gfo-s-suggest__remember input:checked + .gfo-s-suggest__box::after { opacity: 1; }
.gfo-s-suggest__remember input:focus-visible + .gfo-s-suggest__box { outline: 2px solid var(--s-ink); outline-offset: 2px; }
.gfo-s-suggest__another {
	display: flex; align-items: center; justify-content: center; width: fit-content; min-height: 44px; margin: 0 auto;
	font-size: 16px; line-height: 22px; color: var(--s-ink);
	text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; text-decoration-skip-ink: none;
}

/* ---------- Every store: two columns of names over gold hairlines ---------- */
.gfo-s-stores { padding: 14.9px 18px 0; }
.gfo-s-stores:focus { outline: none; }
.gfo-s-stores__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 27px; }
.gfo-s-stores__list li { position: relative; }
.gfo-s-stores__list li[hidden] { display: none; }
.gfo-s-stores__list a {
	display: flex; align-items: center; min-height: 45.8px; padding: 8px 0 0 8px;
	font-family: var(--s-serif); font-size: 19.2px; line-height: 24px; color: var(--s-ink); text-decoration: none;
}
.gfo-s-stores__list a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.gfo-s-stores__rule { position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--s-gold); pointer-events: none; }
/* The suggested store is on the card, so the list leaves it out: picker.js sets html[data-gfo-store] before the list
   is parsed, so the row is never drawn and nothing moves. */
html[data-gfo-store="singapore"] [data-store-item="singapore"],
html[data-gfo-store="malaysia"] [data-store-item="malaysia"],
html[data-gfo-store="hongkong"] [data-store-item="hongkong"],
html[data-gfo-store="indonesia"] [data-store-item="indonesia"],
html[data-gfo-store="unitedstates"] [data-store-item="unitedstates"],
html[data-gfo-store="australia"] [data-store-item="australia"],
html[data-gfo-store="unitedkingdom"] [data-store-item="unitedkingdom"],
html[data-gfo-store="canada"] [data-store-item="canada"],
html[data-gfo-store="new-zealand"] [data-store-item="new-zealand"],
html[data-gfo-store="taiwan"] [data-store-item="taiwan"],
html[data-gfo-store="uae"] [data-store-item="uae"],
html[data-gfo-store="saudiarabia"] [data-store-item="saudiarabia"] { display: none; }
.gfo-s-stores__note { width: fit-content; max-width: 100%; margin: 26px auto 0; padding: 0 0 36px; text-align: center; font-size: 17px; line-height: 1.5; color: var(--s-ink-soft); text-wrap: balance; }

/* The front door has no bottom dock, so its footer keeps no room for one. */
.gfo-s-foot.gfo-s-foot--root { padding-bottom: calc(36px + env(safe-area-inset-bottom)); }

/* ---------- Below the list (owner pick B, 30 Sep): the genuine-pack card, then our ranges on the velvet ---------- */
/* ---------- The root: the genuine-pack card, then a shelf of our ranges on the velvet ---------- */
.gfo-s-rootcheck { padding: 30px 14px 0; }
.gfo-s-rootcheck .gfo-s-qrcard { margin: 0; }
.gfo-s-shelf {
	margin-top: 34px; padding: 26px 16px 30px; text-align: center;
	background-color: #D95A16; background-image: var(--s-velvet-tile, var(--s-velvet)); background-size: 100% auto; background-repeat: repeat-y;
}
.gfo-s-shelf__title { width: fit-content; max-width: 100%; margin: 0 auto; padding: 8px 30px; font-family: var(--s-serif); font-weight: 400; font-size: 29px; line-height: 1.15; color: #fff;
	background: radial-gradient(closest-side, rgba(140, 40, 4, 0.5) 0 66%, rgba(140, 40, 4, 0) 100%); }
.gfo-s-shelf__grid { list-style: none; margin: 18px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 8px; }
.gfo-s-shelf__item img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; object-position: 50% 100%; filter: drop-shadow(0 6px 8px rgba(90, 30, 5, 0.35)); }
.gfo-s-shelf__item span { display: block; margin-top: 6px; font-family: var(--s-serif); font-size: 16px; line-height: 1.2; color: #fff; }
.gfo-s-shelf__note { width: fit-content; max-width: 100%; margin: 16px auto 0; padding: 4px 22px; font-size: 14px; line-height: 1.5; color: #fff;
	background: radial-gradient(closest-side, rgba(140, 40, 4, 0.6) 0 70%, rgba(140, 40, 4, 0) 100%); }

/* ---------- Motion: the concierge's one gesture ---------- */
@media (prefers-reduced-motion: no-preference) {
	/* The card arrives once, rising onto the velvet the way the packs rise onto their cards (the presentation). */
	.gfo-s-suggest:not([hidden]) { animation: gfo-suggest-in 0.34s cubic-bezier(0.2, 0.7, 0.2, 1); }
	/* "Choose another country" glides to the list instead of jumping. */
	html:has(.gfo-s-stores) { scroll-behavior: smooth; }
	.gfo-s-suggest__box::after { transform: rotate(-45deg) scale(0.6); transition: opacity 0.12s ease-out, transform 0.12s ease-out; }
	.gfo-s-suggest__remember input:checked + .gfo-s-suggest__box::after { transform: rotate(-45deg) scale(1); }
}
@keyframes gfo-suggest-in { from { transform: translateY(10px); } } /* visible from the first paint (LCP); it only settles */

/* ---------- Computers: the same page in a wider centred column (owner ruling 29 Sep) ---------- */
@container salon (min-width: 760px) {
	.gfo-s-hdr.gfo-s-hdr--solo { height: 64px; }
	.gfo-s-hdr--solo .gfo-s-brand__name { font-size: 23px; }
	.gfo-s-band.gfo-s-band--picker { padding: 48px 32px 56px; }
	.gfo-s-picker__title { font-size: 56px; line-height: 60px; }
	.gfo-s-suggest { max-width: 460px; margin: 32px auto 0; padding-left: 36px; padding-right: 36px; }
	.gfo-s-stores { max-width: 880px; margin: 0 auto; padding: 28px 32px 0; }
	.gfo-s-stores__list { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 32px; }
	.gfo-s-foot.gfo-s-foot--root { padding-bottom: 52px; }
	/* two link columns here (company, policies), not the stores' three */
	.gfo-s-foot--root .gfo-s-foot__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Below the list on computers: the card and the shelf in the centred column */
@container salon (min-width: 760px) {
	.gfo-s-rootcheck { max-width: 880px; margin: 0 auto; padding: 36px 32px 0; }
	.gfo-s-shelf__grid { max-width: 880px; margin-left: auto; margin-right: auto; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 18px; }
}

/* The root's menu (owner, 30 Sep): the stores' menu button at the left of the solo header; the drawer is the stores'. */
.gfo-s-hdr--solo .gfo-s-hdr__start { position: absolute; left: 7.4px; top: 50%; transform: translateY(-50%); }

/* The Private Salon, wave 4: the cart page and the cart drawer (mockup round). Porcelain counter, gold hairlines,
   near-black buttons; velvet only in whole bands. Loaded after salon.css (and home.css for the bestseller cards). */

.gfo-s-cart-page { padding: 22px 14px 8px; }
.gfo-s-cart__title { margin: 0; font-family: var(--s-serif); font-weight: 400; font-size: 34px; line-height: 1.1; text-align: center; color: var(--s-ink); }
.gfo-s-cart__count { margin: 4px 0 0; text-align: center; font-size: 15px; color: var(--s-ink-soft); }

/* ---------- Lines ---------- */
.gfo-s-lines { list-style: none; margin: 18px 0 0; padding: 0; border-top: 1px solid var(--s-gold); }
.gfo-s-line { display: grid; grid-template-columns: 84px minmax(0, 1fr) auto; gap: 4px 14px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--s-gold); }
.gfo-s-line img { grid-row: 1 / span 3; width: 84px; height: auto; aspect-ratio: 1; object-fit: contain; object-position: 50% 100%; filter: drop-shadow(0 4px 5px rgba(90, 30, 5, 0.16)); }
.gfo-s-line__name { font-family: var(--s-serif); font-size: 19px; line-height: 1.15; color: var(--s-ink); }
.gfo-s-line__pack { font-size: 14px; line-height: 1.35; color: var(--s-ink-soft); }
.gfo-s-line__price { grid-column: 3; grid-row: 1; font-family: var(--s-serif); font-size: 18px; color: var(--s-ink); }
.gfo-s-line__remove { grid-column: 2; justify-self: start; display: inline-flex; align-items: center; min-height: 44px; margin: -8px 0 -12px; font-size: 14px; color: var(--s-ink-soft); text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Totals ---------- */
.gfo-s-totals { margin: 18px 0 0; padding: 16px 16px 14px; background: var(--s-card); border: 1px solid var(--s-gold-deep); border-radius: 10.5px;
	box-shadow: 0 0 0 1.5px var(--s-cream), 0 0 0 2px rgba(200, 145, 70, 0.85); }
.gfo-s-totals__row { display: flex; justify-content: space-between; gap: 12px; margin: 0; padding: 4px 0; font-size: 16px; line-height: 1.4; color: var(--s-ink); }
.gfo-s-totals__row--total { margin-top: 6px; padding-top: 10px; border-top: 1px solid var(--s-gold); font-family: var(--s-serif); font-size: 24px; }
.gfo-s-totals__free { color: var(--s-ink); }
.gfo-s-btn.gfo-s-checkout { min-height: 52px; margin: 14px 0 0; font-size: 19px; }
.gfo-s-express { margin: 10px 0 0; text-align: center; font-size: 13.5px; color: var(--s-ink-soft); }
.gfo-s-stack { list-style: none; margin: 14px 0 0; padding: 12px 0 0; border-top: 1px solid rgba(200, 150, 79, 0.45); }
.gfo-s-stack li { position: relative; padding: 3px 0 3px 22px; font-size: 16px; line-height: 1.4; color: var(--s-ink); }
.gfo-s-stack li::before { content: ""; position: absolute; left: 3px; top: 9px; width: 10px; height: 5.5px; border-left: 1.6px solid var(--s-gold-deep); border-bottom: 1.6px solid var(--s-gold-deep); transform: rotate(-45deg); }
.gfo-s-stack__est { font-weight: 600; }

/* ---------- Pairs well with: one piece that goes with what you chose ---------- */
.gfo-s-pair { margin: 22px 0 0; }
.gfo-s-pair__title { margin: 0 0 10px; font-family: var(--s-serif); font-weight: 400; font-size: 22px; line-height: 1.2; color: var(--s-ink); }
.gfo-s-pair__card { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 12px; background: var(--s-card); border: 1px solid var(--s-gold); border-radius: 10.5px; }
.gfo-s-pair__card img { width: 76px; height: auto; aspect-ratio: 1; object-fit: contain; object-position: 50% 100%; }
.gfo-s-pair__name { display: block; font-family: var(--s-serif); font-size: 18px; line-height: 1.2; color: var(--s-ink); }
.gfo-s-pair__why { display: block; margin-top: 2px; font-size: 14px; line-height: 1.35; color: var(--s-ink-soft); }
.gfo-s-pair__price { display: block; margin-top: 2px; font-family: var(--s-serif); font-size: 16px; color: var(--s-ink); }
.gfo-s-btn.gfo-s-pair__add { min-height: 44px; margin: 0; padding: 0 18px; font-size: 16px; }

/* ---------- Sticky total + Checkout (phones), shown once the totals card has scrolled away ---------- */
.gfo-s-stickybuy { position: sticky; bottom: 0; z-index: 30; display: flex; align-items: center; justify-content: space-between; gap: 12px;
	margin: 0 -14px; padding: 10px 14px calc(10px + env(safe-area-inset-bottom)); background: var(--s-ink); color: #fff; }
.gfo-s-stickybuy__total { font-family: var(--s-serif); font-size: 20px; }
.gfo-s-stickybuy__total small { display: block; font-family: var(--s-sans); font-size: 13px; color: #D9CFC6; }
.gfo-s-stickybuy .gfo-s-btn { min-height: 44px; margin: 0; padding: 0 26px; background: #fff; color: var(--s-ink); font-size: 17px; }

/* ---------- B: the lines stand on the velvet like the bestsellers ---------- */
.gfo-s-cart--tray .gfo-s-lines { margin: 18px -14px 0; padding: 18px 14px 20px; border: 0; display: grid; gap: 12px;
	background-color: #D95A16; background-image: var(--s-velvet-tile, var(--s-velvet)); background-size: 100% auto; background-repeat: repeat-y; }
.gfo-s-cart--tray .gfo-s-line { padding: 10px 12px; border: 1px solid var(--s-gold-deep); border-radius: 10.5px; background: var(--s-card);
	box-shadow: 0 0 0 1.5px var(--s-cream), 0 0 0 2px rgba(200, 145, 70, 0.85); }

/* ---------- C: the total and Checkout come first ---------- */
.gfo-s-cart--first .gfo-s-totals { margin-top: 14px; }
.gfo-s-cart--first .gfo-s-lines { margin-top: 20px; }
.gfo-s-cart__subhead { margin: 22px 0 0; font-family: var(--s-serif); font-weight: 400; font-size: 22px; color: var(--s-ink); }

/* ---------- Empty cart: an honest empty state that leads back to the bestsellers ---------- */
.gfo-s-empty { padding: 28px 14px 6px; text-align: center; }
.gfo-s-empty__title { margin: 0; font-family: var(--s-serif); font-weight: 400; font-size: 32px; line-height: 1.15; color: var(--s-ink); }
.gfo-s-empty__text { width: fit-content; max-width: 300px; margin: 8px auto 0; font-size: 17px; line-height: 1.45; color: var(--s-ink-soft); }

/* ---------- The drawer (salon pages): the same counter, compact ---------- */
.gfo-s-drawer { position: fixed; inset: 0; z-index: 90; background: rgba(22, 19, 17, 0.42); }
.gfo-s-drawer[hidden] { display: none; }
.gfo-s-drawer__panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(90%, 400px); display: flex; flex-direction: column; background: var(--s-porcelain); box-shadow: -12px 0 30px rgba(22, 19, 17, 0.18); }
.gfo-s-drawer__top { display: flex; align-items: center; justify-content: space-between; padding: 6px 6px 6px 18px; border-bottom: 1px solid var(--s-gold); }
.gfo-s-drawer__title { font-family: var(--s-serif); font-size: 22px; color: var(--s-ink); }
.gfo-s-drawer__body { flex: 1; overflow-y: auto; padding: 4px 16px 12px; }
.gfo-s-drawer__body .gfo-s-lines { margin-top: 0; border-top: 0; }
.gfo-s-drawer__body .gfo-s-line { grid-template-columns: 64px minmax(0, 1fr) auto; }
.gfo-s-drawer__body .gfo-s-line img { width: 64px; }
.gfo-s-drawer__foot { padding: 12px 16px calc(14px + env(safe-area-inset-bottom)); border-top: 1px solid var(--s-gold); background: var(--s-card); }
.gfo-s-drawer__foot .gfo-s-totals__row--total { margin: 0; padding: 0; border: 0; font-size: 22px; }
.gfo-s-drawer__view { display: flex; align-items: center; justify-content: center; min-height: 44px; margin-top: 4px; font-size: 16px; color: var(--s-ink); text-decoration: underline; text-underline-offset: 3px; }

/* ---------- The live cart page: WooCommerce's classic markup set as option A (every hook still fires) ---------- */
.gfo-s-cart-page .woocommerce-notices-wrapper:empty, .gfo-s-cart-page .cart_totals > h2, .gfo-s-cart-page table.cart thead,
.gfo-s-cart-page td.actions, .gfo-s-cart-page td.product-price, .gfo-s-cart-page td.product-quantity { display: none; }
.gfo-s-cart-page .woocommerce { margin: 0; }
.gfo-s-cart-page .woocommerce td::before { display: none !important; }
.gfo-s-cart-page .woocommerce-cart-form { margin: 18px 0 0; }
.gfo-s-cart-page .woocommerce table.shop_table { width: 100%; margin: 0; border: 0; border-radius: 0; border-collapse: collapse; }
.gfo-s-cart-page .woocommerce table.cart, .gfo-s-cart-page .woocommerce table.cart tbody { display: block; }
.gfo-s-cart-page .woocommerce table.cart { border-top: 1px solid var(--s-gold); }
.gfo-s-cart-page .woocommerce tr.cart_item {
	display: grid; grid-template-columns: 84px minmax(0, 1fr) auto; grid-template-areas: "img name price" "img remove remove";
	gap: 2px 14px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--s-gold);
}
.gfo-s-cart-page .woocommerce tr.cart_item td { display: block; padding: 0; border: 0; background: none; }
.gfo-s-cart-page .woocommerce td.product-thumbnail { grid-area: img; width: auto; }
.gfo-s-cart-page .woocommerce td.product-thumbnail img { display: block; width: 84px; height: auto; aspect-ratio: 1; object-fit: contain; object-position: 50% 100%; filter: drop-shadow(0 4px 5px rgba(90, 30, 5, 0.16)); }
.gfo-s-cart-page .woocommerce td.product-name { grid-area: name; }
.gfo-s-cart-page .woocommerce td.product-name a.gfo-s-line__name { display: block; text-decoration: none; }
.gfo-s-cart-page .woocommerce td.product-name .gfo-s-line__pack { display: block; margin-top: 2px; }
.gfo-s-cart-page .woocommerce td.product-name dl.variation { margin: 4px 0 0; font-size: 14px; color: var(--s-ink-soft); }
.gfo-s-cart-page .woocommerce td.product-subtotal { grid-area: price; align-self: start; font-family: var(--s-serif); font-size: 18px; color: var(--s-ink); }
.gfo-s-cart-page .woocommerce td.product-remove { grid-area: remove; }
.gfo-s-cart-page .woocommerce td.product-remove a.gfo-s-line__remove { margin: -6px 0 -12px; }
.gfo-s-cart-page .woocommerce .cart-collaterals { display: flex; flex-direction: column; width: 100%; }
.gfo-s-cart-page .woocommerce .cart-collaterals .cart_totals {
	float: none; width: auto; margin: 18px 0 0; padding: 16px 16px 14px;
	background: var(--s-card); border: 1px solid var(--s-gold-deep); border-radius: 10.5px; box-shadow: 0 0 0 1.5px var(--s-cream), 0 0 0 2px rgba(200, 145, 70, 0.85);
}
.gfo-s-cart-page .woocommerce .cart_totals table.shop_table, .gfo-s-cart-page .woocommerce .cart_totals tbody { display: block; }
.gfo-s-cart-page .woocommerce .cart_totals tr { display: flex; justify-content: space-between; gap: 12px; padding: 4px 0; border: 0; }
.gfo-s-cart-page .woocommerce .cart_totals th, .gfo-s-cart-page .woocommerce .cart_totals td { padding: 0; border: 0; background: none; font-weight: 400; font-size: 16px; line-height: 1.4; color: var(--s-ink); text-align: left; }
.gfo-s-cart-page .woocommerce .cart_totals td { text-align: right; }
.gfo-s-cart-page .woocommerce .cart_totals tr.order-total { margin-top: 6px; padding-top: 10px; border-top: 1px solid var(--s-gold); }
.gfo-s-cart-page .woocommerce .cart_totals tr.order-total th, .gfo-s-cart-page .woocommerce .cart_totals tr.order-total td { font-family: var(--s-serif); font-size: 24px; }
.gfo-s-cart-page .woocommerce .cart_totals tr.order-total td strong { font-weight: 400; }
.gfo-s-cart-page .woocommerce .cart_totals ul#shipping_method { margin: 0; padding: 0; list-style: none; }
.gfo-s-cart-page .woocommerce .wc-proceed-to-checkout { padding: 0; }
.gfo-s-cart-page .woocommerce .wc-proceed-to-checkout a.checkout-button {
	display: flex; align-items: center; justify-content: center; width: 100%; min-height: 52px; margin: 14px 0 0; padding: 0 12px; border-radius: 4px;
	background: var(--s-ink); color: #fff; font-family: var(--s-serif); font-weight: 400; font-size: 19px; line-height: 1.2; text-decoration: none;
}
.gfo-s-cart-page .woocommerce .wc-proceed-to-checkout a.checkout-button:hover { background: #2A2320; }
.gfo-s-cart-page .woocommerce #awx-express-checkout-wrapper { margin: 12px 0 0; }
.gfo-s-cart-page .gfo-s-stack { margin: 14px 0 0; padding: 12px 0 0; border-top: 1px solid rgba(200, 150, 79, 0.45); }
.gfo-s-cart-page .gfo-s-stack .gfo-cart-stack__delivery, .gfo-s-cart-page .gfo-s-stack li { position: relative; padding: 3px 0 3px 22px; font-size: 16px; line-height: 1.4; color: var(--s-ink); list-style: none; }
.gfo-s-cart-page .gfo-s-stack .gfo-cart-stack__delivery { font-weight: 600; }
.gfo-s-cart-page .gfo-s-stack ul { margin: 0; padding: 0; }
.gfo-s-cart-page .gfo-s-stack .gfo-cart-stack__delivery::before, .gfo-s-cart-page .gfo-s-stack li::before { content: ""; position: absolute; left: 3px; top: 9px; width: 10px; height: 5.5px; border-left: 1.6px solid var(--s-gold-deep); border-bottom: 1.6px solid var(--s-gold-deep); transform: rotate(-45deg); }
.gfo-s-stickybuy[hidden] { display: none; }
.gfo-s-cart-page .gfo-s-stickybuy { position: fixed; left: 0; right: 0; bottom: 0; margin: 0; }
.gfo-s-drawer__loading { margin: 24px 0; text-align: center; font-size: 16px; color: var(--s-ink-soft); }
.gfo-s-drawer__content { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.gfo-s-drawer__note { margin: 4px 0 0; font-size: 13.5px; line-height: 1.4; color: var(--s-ink-soft); }
.gfo-s-drawer__body--empty { display: flex; flex-direction: column; align-items: center; gap: 16px; padding-top: 32px; text-align: center; }
.gfo-s-drawer .gfo-s-line__name { text-decoration: none; }
.gfo-s-pair__name { text-decoration: none; }
.gfo-s-pair__add[aria-busy="true"] { opacity: 0.6; pointer-events: none; }

@container salon (min-width: 760px) {
	.gfo-s-cart-page { max-width: 720px; margin: 0 auto; padding-left: 32px; padding-right: 32px; }
	.gfo-s-cart-page .gfo-s-stickybuy { display: none; }
}

/* preview-test fixes: the hidden cells must beat the cell display rule; WooCommerce's shipping note stays out */
.gfo-s-cart-page .woocommerce tr.cart_item td.product-price, .gfo-s-cart-page .woocommerce tr.cart_item td.product-quantity { display: none; }
.gfo-s-cart-page .woocommerce .woocommerce-shipping-destination, .gfo-s-cart-page .woocommerce .woocommerce-shipping-calculator,
.gfo-s-cart-page .woocommerce .shipping-calculator-button, .gfo-s-cart-page .woocommerce .woocommerce-shipping-contents { display: none; }
.gfo-s-cart-page .woocommerce .cart_totals td { min-width: 0; overflow-wrap: anywhere; }

/* pre-review fixes (0.8.2): WooCommerce's own cell rules drew split hairlines between the totals rows (the rows carry the
   rules); the pairing's pack reads like the lines' pack; WooCommerce's notices ("“LIVEON” removed. Undo?") sit on the counter */
.gfo-s-cart-page .woocommerce .cart-collaterals .cart_totals tr th, .gfo-s-cart-page .woocommerce .cart-collaterals .cart_totals tr td { border: 0; }
.gfo-s-pair__pack { font-family: var(--s-sans); font-size: 14px; color: var(--s-ink-soft); }
.gfo-s-cart-page .woocommerce-message, .gfo-s-cart-page .woocommerce-info, .gfo-s-cart-page .woocommerce-error {
	display: block; margin: 16px 0 0; padding: 10px 14px; list-style: none; background: var(--s-card); border: 1px solid var(--s-gold);
	border-radius: 8px; box-shadow: none; color: var(--s-ink); font-family: var(--s-sans); font-size: 16px; line-height: 1.45; text-align: left;
}
.gfo-s-cart-page .woocommerce-error { border-color: #B3261E; }
.gfo-s-cart-page .woocommerce-message::before, .gfo-s-cart-page .woocommerce-info::before, .gfo-s-cart-page .woocommerce-error::before { display: none; }
/* 0.8.4 + review: WooCommerce's line data (the ZENSO "Free gift: SPIRO Plus" and flavour rows), each label and its value
   as one line that wraps under itself, on the page and in the drawer */
.gfo-s-cart-page .woocommerce td.product-name dl.variation, .gfo-s-drawer .gfo-s-line dl.variation {
	display: block; grid-column: 2; margin: 4px 0 0; padding: 0; border: 0; font-size: 14px; line-height: 1.4; color: var(--s-ink-soft);
}
.gfo-s-cart-page .woocommerce td.product-name dl.variation :where(dt, dd, dd p), .gfo-s-drawer .gfo-s-line dl.variation :where(dt, dd, dd p) { display: inline; float: none; clear: none; margin: 0; padding: 0; }
.gfo-s-cart-page .woocommerce td.product-name dl.variation dt, .gfo-s-drawer .gfo-s-line dl.variation dt { margin-right: 0.3em; font-weight: 600; color: var(--s-ink); } /* LiteSpeed strips the space between dt and dd on the page */
.gfo-s-cart-page .woocommerce td.product-name dl.variation dd::after, .gfo-s-drawer .gfo-s-line dl.variation dd::after { content: ""; display: block; }
/* WooCommerce's "View cart" button inside a notice is a dead end on the cart page itself */
.gfo-s-cart-page :is(.woocommerce-error, .woocommerce-message, .woocommerce-info) a.wc-forward[href*="/cart"] { display: none; }
.gfo-s-cart-page .woocommerce-message a, .gfo-s-cart-page .woocommerce-info a, .gfo-s-cart-page .woocommerce-error a {
	display: inline-flex; align-items: center; min-height: 44px; margin: -12px 0; padding: 0; float: none; border: 0; background: none;
	color: var(--s-ink); font-weight: 600; text-decoration: underline; text-underline-offset: 3px;
}
/* 0.9.0, owner pick B (1 Oct 2026): the arrival band. The delivery date between two gold hairlines, right above Checkout
   on the page and in the drawer's foot; it carries the tracked delivery, so the list below Checkout is one line shorter */
.gfo-s-eta { margin: 14px 0 0; padding: 12px 0 13px; border-top: 1px solid var(--s-gold); border-bottom: 1px solid var(--s-gold); text-align: center; }
.gfo-s-eta__date { margin: 0; font-family: var(--s-serif); font-size: 21px; line-height: 1.2; color: var(--s-ink); }
.gfo-s-eta__note { margin: 4px 0 0; font-family: var(--s-sans); font-size: 14px; line-height: 1.35; color: var(--s-ink-soft); }
.gfo-s-drawer__foot .gfo-s-eta { margin: 8px 0 0; padding: 8px 0 9px; }
.gfo-s-drawer__foot .gfo-s-eta__date { font-size: 18px; }
/* review (0.8.7): the empty cart sits on the page, not on a card (cat.css gives .gfo-s-empty one); the sticky bar gets the
   system's gold top hairline, so at the end of the page it reads apart from the dark footer */
.gfo-s-cart-page .gfo-s-empty { background: none; border-radius: 0; box-shadow: none; }
.gfo-s-cart-page .gfo-s-stickybuy { border-top: 1px solid var(--s-gold); }
/* 0.10.2: the drawer's "Adding to your cart…" line (shown by the product-page drawer from the tap until the reply) */
.gfo-s-drawer__adding { margin: 32px 16px; text-align: center; font-family: var(--s-serif); font-size: 20px; line-height: 1.3; color: var(--s-ink); }

/* The Private Salon, wave 5: the reading and service pages (policies, About, Contact, Verify, The Science, Track my
   order, 404, search). Read mode first: the page answers its question plainly on porcelain, the way back to the shop is
   one tap away. Loaded after salon.css; tokens from salon.css. Owner's pick 1 Oct 2026: A, the contents list
   (the mock round's B and C styles are kept in page.mock.css). */

.gfo-s-pmain { display: block; }
.gfo-s-page { padding: 18px 16px 8px; }
.gfo-s-page :where(h1, h2, h3, p, ul:not(.gfo-s-grid), ol, dl, figure) { margin: 0; } /* the product grid keeps the room its packs rise into */
.gfo-s-page :where(h2, h3) { font-weight: 400; }

/* ---------- Page head: where you are, the page's own title, what it answers ---------- */
.gfo-s-crumb { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; font-size: 14px; line-height: 1.4; color: var(--s-ink-soft); }
.gfo-s-crumb a { color: inherit; text-underline-offset: 3px; }
.gfo-s-phead__title { font-family: var(--s-serif); font-weight: 400; font-size: 32px; line-height: 1.12; color: var(--s-ink); }
.gfo-s-phead__lede { margin-top: 8px; font-size: 17px; line-height: 1.5; color: var(--s-ink-soft); }
.gfo-s-langnote { margin: 12px 0 0; padding: 10px 14px; background: var(--s-porcelain-hi); border: 1px solid var(--s-gold); border-radius: 4.3px; font-size: 16px; line-height: 1.45; color: var(--s-ink-soft); }
html[data-gfo-lang="en"] .gfo-s-langnote, html:not([data-gfo-lang]) .gfo-s-langnote { display: none; } /* 中文 and BM only */

/* ---------- The summary card: four promises, each one line and a link (owner ruling 29 Sep) ---------- */
.gfo-s-summary { margin: 18px 0 0; padding: 6px 16px; background: var(--s-card); border: 1px solid var(--s-gold-deep); border-radius: 10.5px;
	box-shadow: 0 0 0 1.5px var(--s-cream), 0 0 0 2px rgba(200, 145, 70, 0.85); list-style: none; }
.gfo-s-summary li { border-top: 1px solid rgba(200, 150, 79, 0.45); }
.gfo-s-summary li:first-child { border-top: 0; }
.gfo-s-summary a { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; align-items: center; min-height: 56px; padding: 10px 0; color: var(--s-ink); text-decoration: none; }
.gfo-s-summary__k { font-family: var(--s-serif); font-size: 18px; line-height: 1.2; }
.gfo-s-summary__v { grid-column: 1; font-size: 15px; line-height: 1.4; color: var(--s-ink-soft); }
.gfo-s-summary a::after { content: ""; grid-column: 2; grid-row: 1 / span 2; width: 8px; height: 8px; border-right: 1.5px solid var(--s-gold-deep); border-top: 1.5px solid var(--s-gold-deep); transform: rotate(45deg); }

/* ---------- "On this page": a contents list of the page's own sections ---------- */
.gfo-s-toc { margin: 22px 0 0; padding: 14px 0 6px; border-top: 1px solid var(--s-gold); border-bottom: 1px solid var(--s-gold); }
.gfo-s-toc__title { font-family: var(--s-serif); font-size: 20px; line-height: 1.2; color: var(--s-ink); }
.gfo-s-toc ol { margin: 8px 0 0; padding: 0; list-style: none; counter-reset: toc; }
.gfo-s-toc li { counter-increment: toc; }
.gfo-s-toc a { display: grid; grid-template-columns: 2.1em 1fr; align-items: baseline; min-height: 44px; padding: 10px 0; border-top: 1px solid rgba(200, 150, 79, 0.3); font-size: 16px; line-height: 1.35; color: var(--s-ink); text-decoration: none; }
.gfo-s-toc a.is-caps { text-transform: capitalize; } /* only the page's all-caps headings, shown in title case */
.gfo-s-toc li:first-child a { border-top: 0; }
.gfo-s-toc a::before { content: counter(toc); font-family: var(--s-serif); color: var(--s-gold-deep); }
.gfo-s-toc--own a { grid-template-columns: 1fr; }
.gfo-s-toc--own a::before { content: none; }

/* ---------- The legal text: the page's own words, at the reading floor ---------- */
.gfo-s-legal { margin: 24px 0 0; max-width: 40rem; font-size: 17px; line-height: 1.6; color: var(--s-ink); overflow-wrap: anywhere; }
.gfo-s-legal :where(p, ul, ol, table, figure, blockquote) { margin: 0 0 14px; }
.gfo-s-legal :where(ul, ol) { padding-left: 1.25em; }
.gfo-s-legal li { margin: 0 0 6px; }
.gfo-s-legal a { color: var(--s-ink); text-decoration: underline; text-decoration-color: var(--s-gold-deep); text-underline-offset: 3px; }
.gfo-s-legal :where(h2, .gfo-s-h2) { margin: 30px 0 10px; padding-top: 18px; border-top: 1px solid var(--s-gold); font-family: var(--s-serif); font-weight: 400; font-size: 23px; line-height: 1.25; color: var(--s-ink); scroll-margin-top: 84px; }
.gfo-s-legal > :first-child :where(h2):first-child, .gfo-s-legal > h2:first-child { margin-top: 0; }
.gfo-s-legal .gfo-s-h2 { text-transform: capitalize; } /* the page's own capitals, shown in title case (the words are unchanged) */
.gfo-s-legal h3 { margin: 22px 0 8px; font-family: var(--s-serif); font-weight: 400; font-size: 20px; line-height: 1.3; }
.gfo-s-legal header { display: block; } /* the content's own wrappers (Shipping, Returns) stay in the flow */
.gfo-s-totop { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; margin: 0 0 6px; font-size: 14px; color: var(--s-ink-soft); text-decoration: underline; text-underline-offset: 3px; }
.gfo-s-totop::after { content: ""; width: 7px; height: 7px; margin-top: 4px; border-left: 1.5px solid var(--s-gold-deep); border-top: 1.5px solid var(--s-gold-deep); transform: rotate(45deg); }

/* ---------- The way on: back to the shop, or a real person ---------- */
.gfo-s-next { margin: 30px -16px 0; padding: 26px 16px 28px; background: var(--s-card); border-top: 1px solid var(--s-gold); text-align: center; }
.gfo-s-next__title { font-family: var(--s-serif); font-size: 24px; line-height: 1.2; color: var(--s-ink); }
.gfo-s-next__text { margin: 6px auto 0; max-width: 22rem; font-size: 16px; line-height: 1.5; color: var(--s-ink-soft); }
.gfo-s-next .gfo-s-btn { margin: 16px auto 0; max-width: 22rem; min-height: 52px; font-size: 18px; }
.gfo-s-next__chat { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; margin-top: 10px; font-size: 16px; font-weight: 600; color: var(--s-ink); text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Contact: chat first, then email, then the details ---------- */
.gfo-s-cards { display: grid; gap: 12px; margin: 20px 0 0; }
.gfo-s-card { display: grid; gap: 6px; padding: 16px; background: var(--s-card); border: 1px solid var(--s-gold); border-radius: 10.5px; }
.gfo-s-card__k { font-family: var(--s-serif); font-size: 21px; line-height: 1.2; color: var(--s-ink); }
.gfo-s-card__v { font-size: 16px; line-height: 1.5; color: var(--s-ink-soft); }
.gfo-s-card .gfo-s-btn { margin: 8px 0 0; min-height: 52px; font-size: 18px; }
.gfo-s-card__mail { display: inline-flex; align-items: center; min-height: 44px; font-size: 18px; font-weight: 600; color: var(--s-ink); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.gfo-s-tip { margin: 16px 0 0; padding: 12px 16px; background: var(--s-porcelain-hi); border: 1px solid var(--s-gold); border-radius: 4.3px; font-size: 16px; line-height: 1.5; color: var(--s-ink); }
.gfo-s-links { margin: 22px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--s-gold); }
.gfo-s-links a { display: flex; align-items: center; justify-content: space-between; min-height: 52px; border-bottom: 1px solid rgba(200, 150, 79, 0.45); font-size: 17px; color: var(--s-ink); text-decoration: none; }
.gfo-s-links a::after { content: ""; width: 8px; height: 8px; border-right: 1.5px solid var(--s-gold-deep); border-top: 1.5px solid var(--s-gold-deep); transform: rotate(45deg); }
.gfo-s-entity { margin: 24px 0 0; padding: 14px 16px; border: 1px solid var(--s-gold); font-size: 15px; line-height: 1.55; color: var(--s-ink); }
.gfo-s-entity__k { display: block; margin-bottom: 4px; font-family: var(--s-serif); font-size: 18px; line-height: 1.3; }

/* ---------- Track my order: WooCommerce's own lookup and sign-in, in the salon's dress ---------- */
.gfo-s-page .woocommerce { margin: 0; }
.gfo-s-page .woocommerce form.track_order { display: grid; gap: 14px; margin: 20px 0 0; padding: 16px; background: var(--s-card); border: 1px solid var(--s-gold-deep); border-radius: 10.5px;
	box-shadow: 0 0 0 1.5px var(--s-cream), 0 0 0 2px rgba(200, 145, 70, 0.85); }
.gfo-s-page .woocommerce form.track_order > p:empty, .gfo-s-page .woocommerce form.track_order .clear { display: none; }
.gfo-s-page .woocommerce form .form-row { float: none; width: auto; margin: 0; padding: 0; }
.gfo-s-page .woocommerce form.login .form-row, .gfo-s-page .woocommerce form.register .form-row { margin: 0 0 14px; }
.gfo-s-page .woocommerce form .form-row label { display: block; margin: 0 0 6px; font-size: 16px; font-weight: 600; line-height: 1.4; color: var(--s-ink); }
.gfo-s-page .woocommerce form .form-row .required { color: #9F2A1E; text-decoration: none; }
.gfo-s-page .woocommerce form .form-row input.input-text { box-sizing: border-box; width: 100%; height: 50px; margin: 0; padding: 0 14px; border: 1.5px solid #B9A58A; border-radius: 4px; background: #fff; box-shadow: none; font: 400 17px/1.2 var(--s-sans); color: var(--s-ink); }
.gfo-s-page .woocommerce form .form-row input.input-text:focus { outline: 2px solid var(--s-ink); outline-offset: 1px; border-color: var(--s-ink); }
.gfo-s-page .woocommerce form .gfo-s-form__hint { display: block; margin-top: 6px; font-size: 14px; line-height: 1.4; color: var(--s-ink-soft); }
.gfo-s-page .woocommerce button.gfo-s-btn, .gfo-s-page .woocommerce button.gfo-s-btn:hover { display: flex; align-items: center; justify-content: center; float: none; width: 100%; min-height: 52px; margin: 0; padding: 0 20px;
	border: 0; border-radius: 4px; background: var(--s-ink); box-shadow: none; text-shadow: none; color: #fff; font-family: var(--s-serif); font-size: 18px; font-weight: 400; line-height: 1.2; }
.gfo-s-page .woocommerce button.gfo-s-btn:hover { background: #2A2320; }
.gfo-s-page .woocommerce form .form-row label.woocommerce-form__label-for-checkbox { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; margin: 0 0 6px; font-weight: 400; }
.gfo-s-page .woocommerce form .woocommerce-form__input-checkbox { width: 20px; height: 20px; margin: 0; accent-color: var(--s-ink); }
/* WooCommerce’s show-password toggle: its rules (and these two icons) live in woocommerce-layout.css, which the theme does not load */
.gfo-s-page .woocommerce form .password-input { position: relative; display: flex; flex-direction: column; justify-content: center; }
.gfo-s-page .woocommerce form .password-input input.input-text { padding-right: 52px; }
.gfo-s-page .woocommerce form .password-input input::-ms-reveal { display: none; }
.gfo-s-page .woocommerce form .show-password-input { position: absolute; top: 50%; right: 3px; display: grid; place-items: center; width: 44px; height: 44px; margin: 0; padding: 0; border: 0; border-radius: 4px;
	background: transparent; cursor: pointer; transform: translateY(-50%); -webkit-appearance: none; appearance: none; }
.gfo-s-page .woocommerce form .show-password-input::before { content: ""; display: block; width: 22px; height: 22px; background-repeat: no-repeat; background-size: contain; background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M17.3 3.3C16.9 2.9 16.2 2.9 15.7 3.3L13.3 5.7C12.2437 5.3079 11.1267 5.1048 10 5.1C6.2 5.2 2.8 7.2 1 10.5C1.2 10.9 1.5 11.3 1.8 11.7C2.6 12.8 3.6 13.7 4.7 14.4L3 16.1C2.6 16.5 2.5 17.2 3 17.7C3.4 18.1 4.1 18.2 4.6 17.7L17.3 4.9C17.7 4.4 17.7 3.7 17.3 3.3ZM6.7 12.3L5.4 13.6C4.2 12.9 3.1 11.9 2.3 10.7C3.5 9 5.1 7.8 7 7.2C5.7 8.6 5.6 10.8 6.7 12.3ZM10.1 9C9.6 8.5 9.7 7.7 10.2 7.2C10.7 6.8 11.4 6.8 11.9 7.2L10.1 9ZM18.3 9.5C17.8 8.8 17.2 8.1 16.5 7.6L15.5 8.6C16.3 9.2 17 9.9 17.6 10.8C15.9 13.4 13 15 9.9 15H9.1L8.1 16C8.8 15.9 9.4 16 10 16C13.3 16 16.4 14.4 18.3 11.7C18.6 11.3 18.8 10.9 19.1 10.5C18.8 10.2 18.6 9.8 18.3 9.5ZM14 10L10 14C12.2 14 14 12.2 14 10Z" fill="%23111111"/></svg>'); }
.gfo-s-page .woocommerce form .show-password-input.display-password::before { background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M18.3 9.49999C15 4.89999 8.50002 3.79999 3.90002 7.19999C2.70002 8.09999 1.70002 9.29999 0.900024 10.6C1.10002 11 1.40002 11.4 1.70002 11.8C5.00002 16.4 11.3 17.4 15.9 14.2C16.8 13.5 17.6 12.8 18.3 11.8C18.6 11.4 18.8 11 19.1 10.6C18.8 10.2 18.6 9.79999 18.3 9.49999ZM10.1 7.19999C10.6 6.69999 11.4 6.69999 11.9 7.19999C12.4 7.69999 12.4 8.49999 11.9 8.99999C11.4 9.49999 10.6 9.49999 10.1 8.99999C9.60003 8.49999 9.60003 7.69999 10.1 7.19999ZM10 14.9C6.90002 14.9 4.00002 13.3 2.30002 10.7C3.50002 8.99999 5.10002 7.79999 7.00002 7.19999C6.30002 7.99999 6.00002 8.89999 6.00002 9.89999C6.00002 12.1 7.70002 14 10 14C12.2 14 14.1 12.3 14.1 9.99999V9.89999C14.1 8.89999 13.7 7.89999 13 7.19999C14.9 7.79999 16.5 8.99999 17.7 10.7C16 13.3 13.1 14.9 10 14.9Z" fill="%23111111"/></svg>'); }
.gfo-s-page .woocommerce .lost_password { margin: 6px 0 0; }
.gfo-s-page .woocommerce .lost_password a, .gfo-s-alt a { display: inline-flex; align-items: center; min-height: 44px; color: var(--s-ink); text-decoration: underline; text-underline-offset: 3px; }
.gfo-s-page .woocommerce :is(form.login, form.register) { margin: 10px 0 0; padding: 16px; background: var(--s-card); border: 1px solid rgba(200, 150, 79, 0.6); border-radius: 10.5px; }
.gfo-s-page .woocommerce :is(form.login, form.register) > p:not([class]) { margin: 0 0 14px; font-size: 15px; line-height: 1.5; color: var(--s-ink-soft); }
.gfo-s-page .woocommerce .woocommerce-privacy-policy-text p { margin: 0 0 14px; font-size: 14px; line-height: 1.5; color: var(--s-ink-soft); }
.gfo-s-account h2 { margin: 18px 0 0; font-family: var(--s-serif); font-size: 21px; line-height: 1.25; color: var(--s-ink); }
.gfo-s-alt { margin: 14px 0 0; font-size: 16px; line-height: 1.5; color: var(--s-ink); }
.gfo-s-login { margin: 18px 0 0; border-top: 1px solid var(--s-gold); border-bottom: 1px solid var(--s-gold); }
.gfo-s-login > summary { position: relative; display: block; min-height: 52px; padding: 14px 30px 13px 0; list-style: none; cursor: pointer; font-size: 16px; line-height: 1.5; color: var(--s-ink); }
.gfo-s-login > summary::-webkit-details-marker { display: none; }
.gfo-s-login > summary::after { content: ""; position: absolute; right: 8px; top: 50%; width: 9px; height: 9px; margin-top: -7px; border-right: 1.5px solid var(--s-gold-deep); border-bottom: 1.5px solid var(--s-gold-deep); transform: rotate(45deg); }
.gfo-s-login[open] > summary::after { margin-top: -2px; transform: rotate(-135deg); }
.gfo-s-login__cta { font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.gfo-s-account { padding: 0 0 18px; }
/* WooCommerce's notices on these pages (a lookup that found nothing, a failed sign-in) sit on the card stock */
.gfo-s-page :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) {
	display: block; margin: 16px 0 0; padding: 10px 14px; list-style: none; background: var(--s-card); border: 1px solid var(--s-gold);
	border-radius: 8px; box-shadow: none; color: var(--s-ink); font-family: var(--s-sans); font-size: 16px; line-height: 1.45; text-align: left;
}
.gfo-s-page .woocommerce-error { border-color: #B3261E; }
.gfo-s-page :is(.woocommerce-message, .woocommerce-info, .woocommerce-error)::before { display: none; }
.gfo-s-page :is(.woocommerce-message, .woocommerce-info, .woocommerce-error):focus { outline: none; } /* WooCommerce moves focus to its notice for screen readers; it is not a control */
.gfo-s-page :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) a { color: var(--s-ink); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
/* The lookup's answer: WooCommerce's status line, the courier's tracking and the order */
.gfo-s-track .order-info { margin: 20px 0 0; padding: 14px 16px; background: var(--s-card); border: 1px solid var(--s-gold-deep); border-radius: 10.5px; font-size: 17px; line-height: 1.5; color: var(--s-ink); }
.gfo-s-track mark { padding: 0; background: none; color: var(--s-ink); font-weight: 600; }
.gfo-s-track h2, .gfo-s-track h3 { margin: 26px 0 10px; font-family: var(--s-serif); font-size: 23px; line-height: 1.2; color: var(--s-ink); }
.gfo-s-page .gfo-s-track table { width: 100%; margin: 0 0 14px; border: 0; border-radius: 0; border-collapse: collapse; font-size: 15.5px; line-height: 1.45; }
.gfo-s-page .gfo-s-track table :is(th, td) { padding: 10px 6px; border: 0; border-top: 1px solid rgba(200, 150, 79, 0.45); background: none; text-align: left; vertical-align: top; }
.gfo-s-page .gfo-s-track table.woocommerce-table--order-details { border: 1px solid var(--s-gold); border-radius: 10.5px; border-collapse: separate; border-spacing: 0; background: var(--s-card); overflow: hidden; }
.gfo-s-page .gfo-s-track table.woocommerce-table--order-details :is(th, td) { padding: 12px 14px; }
.gfo-s-page .gfo-s-track table.woocommerce-table--order-details thead :is(th, td) { border-top: 0; font-size: 14px; font-weight: 600; color: var(--s-ink-soft); }
.gfo-s-page .gfo-s-track table.woocommerce-table--order-details td.product-name { width: 68%; }
.gfo-s-page .gfo-s-track table.woocommerce-table--order-details tfoot th { font-weight: 400; color: var(--s-ink-soft); }
.gfo-s-page .gfo-s-track table.woocommerce-table--order-details :is(td.product-total, tfoot td) { text-align: right; }
.gfo-s-page .gfo-s-track table.woocommerce-table--order-details :is(td.product-total, tfoot td) .amount { font-family: var(--s-serif); font-size: 18px; font-weight: 400; white-space: nowrap; }
.gfo-s-page .gfo-s-track table.woocommerce-table--order-details tfoot td:not(:has(.amount)) { text-align: left; } /* the payment method and the order note read as text */
.gfo-s-page .gfo-s-track table.woocommerce-table--order-details tfoot tr:last-child :is(th, td) { font-weight: 400; }
.gfo-s-page .gfo-s-track .woocommerce-table--order-details .product-quantity { font-weight: 400; }
.gfo-s-track address { padding: 14px 16px; border: 1px solid rgba(200, 150, 79, 0.6); border-radius: 10.5px; font-style: normal; line-height: 1.55; }
.gfo-s-track ol.notes { margin: 0; padding: 0; list-style: none; }
.gfo-s-track ol.notes li { padding: 10px 0; border-top: 1px solid rgba(200, 150, 79, 0.45); }
.gfo-s-track a { color: var(--s-ink); text-underline-offset: 3px; overflow-wrap: anywhere; }
/* The courier's tracking (Advanced Shipment Tracking prints it into WooCommerce's answer): one card, its Track link a button */
.gfo-s-track .fluid_section { margin: 0 0 18px; padding: 14px 16px; background: var(--s-card); border: 1px solid var(--s-gold-deep); border-radius: 10.5px; }
.gfo-s-track .fluid_container { display: grid; gap: 12px; }
.gfo-s-track .tracking_provider { display: block; font-family: var(--s-serif); font-size: 19px; font-weight: 400; }
.gfo-s-page .woocommerce a.button.track-button { display: flex; align-items: center; justify-content: center; min-height: 52px; margin: 0; padding: 0 22px; border: 0; border-radius: 4px;
	background: var(--s-ink); color: #fff; font-family: var(--s-serif); font-size: 18px; font-weight: 400; line-height: 1.2; text-decoration: none; }

/* ---------- Wave 5b: Track my order opened from the order emails (owner, 1 Oct 2026: layout A). The order in its own
   steps: Confirmed → Packed → Shipped, the parcels under Shipped with each courier's button. No dated estimate, no "Delivered". */
/* ---------- The status card: where the order is now, in one word, and what that means ---------- */
.gfo-s-tk__hello { margin: 16px 0 0; font-size: 17px; line-height: 1.45; color: var(--s-ink); } /* owner: the buyer sees the order is theirs (first name + town + postcode only) */
.gfo-s-tk__hello + .gfo-s-tk__status { margin-top: 10px; }
.gfo-s-tk__status { margin: 18px 0 0; padding: 16px 18px 17px; background: var(--s-card); border: 1px solid var(--s-gold-deep); border-radius: 10.5px;
	box-shadow: 0 0 0 1.5px var(--s-cream), 0 0 0 2px rgba(200, 145, 70, 0.85); }
.gfo-s-tk__eyebrow { font-size: 14px; line-height: 1.4; color: var(--s-ink-soft); }
.gfo-s-tk__now { margin-top: 2px; font-family: var(--s-serif); font-size: 28px; line-height: 1.15; color: var(--s-ink); }
.gfo-s-tk__note { margin-top: 6px; font-size: 16px; line-height: 1.5; color: var(--s-ink-soft); }

/* the steps as a vertical line, parcels under "Shipped" */
.gfo-s-tk__steps { margin: 22px 0 0; padding: 0; list-style: none; }
.gfo-s-tk__step { position: relative; display: grid; grid-template-columns: 30px 1fr auto; align-items: baseline; gap: 0 12px; padding: 0 0 24px; }
.gfo-s-tk__step:last-child { padding-bottom: 0; }
.gfo-s-tk__step::after { content: ""; position: absolute; left: 11px; top: 26px; bottom: 2px; width: 1.5px; background: var(--s-gold); }
.gfo-s-tk__step:last-child::after { display: none; }
.gfo-s-tk__step.is-todo::after, .gfo-s-tk__step.is-now::after { background: rgba(200, 150, 79, 0.35); }
.gfo-s-tk__dot { position: relative; align-self: start; width: 24px; height: 24px; margin-top: 1px; border-radius: 50%; border: 1.5px solid var(--s-gold-deep); background: var(--s-porcelain); }
.gfo-s-tk__step.is-done .gfo-s-tk__dot { background: var(--s-ink); border-color: var(--s-ink); }
.gfo-s-tk__step.is-done .gfo-s-tk__dot::after { content: ""; position: absolute; left: 7px; top: 6px; width: 9px; height: 5px; border-left: 1.8px solid #fff; border-bottom: 1.8px solid #fff; transform: rotate(-45deg); }
.gfo-s-tk__step.is-now .gfo-s-tk__dot { background: var(--s-ink); border-color: var(--s-ink); box-shadow: 0 0 0 4px rgba(200, 145, 70, 0.35); }
.gfo-s-tk__step.is-now .gfo-s-tk__dot::after { content: ""; position: absolute; inset: 7px; border-radius: 50%; background: #fff; }
.gfo-s-tk__label { font-family: var(--s-serif); font-size: 20px; line-height: 1.25; color: var(--s-ink); }
.gfo-s-tk__step.is-todo .gfo-s-tk__label { color: var(--s-ink-soft); }
.gfo-s-tk__date { font-size: 15px; line-height: 1.4; color: var(--s-ink-soft); white-space: nowrap; }
.gfo-s-tk__sub { grid-column: 2 / -1; margin-top: 4px; font-size: 16px; line-height: 1.5; color: var(--s-ink-soft); }
.gfo-s-tk__parcels { grid-column: 2 / -1; display: grid; gap: 10px; margin: 12px 0 0; padding: 0; list-style: none; }

/* ---------- A parcel: the courier, the number, the courier's own tracking ---------- */
.gfo-s-tk__parcel { display: grid; gap: 4px; padding: 14px 16px; background: var(--s-card); border: 1px solid rgba(200, 150, 79, 0.6); border-radius: 10.5px; }
.gfo-s-tk__pk { font-size: 14px; line-height: 1.4; color: var(--s-ink-soft); }
.gfo-s-tk__courier { font-family: var(--s-serif); font-size: 20px; line-height: 1.25; color: var(--s-ink); }
.gfo-s-tk__num { font-size: 17px; line-height: 1.4; color: var(--s-ink); font-variant-numeric: tabular-nums; letter-spacing: 0.02em; overflow-wrap: anywhere; user-select: all; }
.gfo-s-tk__parcel .gfo-s-btn { margin: 8px 0 0; min-height: 52px; font-size: 18px; }
.gfo-s-tk__nolink { margin-top: 4px; font-size: 15px; line-height: 1.45; color: var(--s-ink-soft); }
.gfo-s-track a.gfo-s-btn { color: #fff; text-decoration: none; } /* the courier button inside the lookup answer */

/* ---------- Verify: numbered steps, one picture each, the two limits in one notice ---------- */
.gfo-s-steps { margin: 22px 0 0; padding: 0; list-style: none; counter-reset: step; }
.gfo-s-steps > li { counter-increment: step; display: grid; grid-template-columns: 40px 1fr; gap: 4px 14px; padding: 16px 0; border-top: 1px solid var(--s-gold); }
.gfo-s-steps > li::before { content: counter(step); grid-row: 1 / span 3; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--s-gold-deep); font-family: var(--s-serif); font-size: 19px; color: var(--s-ink); }
.gfo-s-steps__k { font-family: var(--s-serif); font-size: 20px; line-height: 1.25; color: var(--s-ink); }
.gfo-s-steps__v { font-size: 16px; line-height: 1.5; color: var(--s-ink-soft); }
.gfo-s-steps img { grid-column: 2; width: auto; max-width: 100%; height: auto; margin-top: 8px; border: 1px solid rgba(200, 150, 79, 0.45); border-radius: 4px; background: #fff; }
.gfo-s-steps .gfo-s-steps__btn { grid-column: 2; margin: 8px 0 0; min-height: 52px; font-size: 18px; }
.gfo-s-limits { margin: 4px 0 0; padding: 14px 16px; background: #FFF8EE; border: 1px solid var(--s-gold-deep); border-radius: 8px; font-size: 16px; line-height: 1.5; color: var(--s-ink); }
.gfo-s-limits strong { display: block; margin-bottom: 4px; font-family: var(--s-serif); font-weight: 400; font-size: 19px; }
.gfo-s-results { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 8px 0 0; grid-column: 2; }
.gfo-s-results figure { display: grid; align-content: start; gap: 6px; font-size: 14px; line-height: 1.35; color: var(--s-ink-soft); }
.gfo-s-results img { grid-column: auto; width: 100%; margin: 0; }

/* ---------- About: four promises, the board at the reading floor ---------- */
.gfo-s-promises { margin: 20px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--s-gold); }
.gfo-s-promises li { padding: 14px 0; border-bottom: 1px solid rgba(200, 150, 79, 0.45); }
.gfo-s-promises__k { display: block; font-family: var(--s-serif); font-size: 20px; line-height: 1.25; color: var(--s-ink); }
.gfo-s-promises__v { display: block; margin-top: 4px; font-size: 16px; line-height: 1.5; color: var(--s-ink-soft); }
.gfo-s-promises__v a { color: var(--s-ink); font-weight: 600; text-underline-offset: 3px; }
.gfo-s-sect { margin: 30px 0 0; font-family: var(--s-serif); font-size: 25px; line-height: 1.2; color: var(--s-ink); }
.gfo-s-sect__lede { margin: 8px 0 0; font-size: 16px; line-height: 1.5; color: var(--s-ink-soft); }
.gfo-s-board { display: grid; gap: 12px; margin: 16px 0 0; padding: 0; list-style: none; }
.gfo-s-board li { display: grid; grid-template-columns: 72px 1fr; gap: 4px 14px; align-items: start; padding: 14px; background: var(--s-card); border: 1px solid rgba(200, 150, 79, 0.6); border-radius: 10.5px; }
.gfo-s-board img, .gfo-s-board__ini { grid-row: 1 / span 3; width: 72px; height: 72px; border-radius: 50%; object-fit: cover; object-position: 50% 0; background: #EFE6DC; }
.gfo-s-board__ini { display: grid; place-items: center; font-family: var(--s-serif); font-size: 24px; color: var(--s-ink); }
.gfo-s-board__name { font-family: var(--s-serif); font-size: 19px; line-height: 1.2; color: var(--s-ink); }
.gfo-s-board__cred { font-size: 14px; line-height: 1.4; font-weight: 600; color: var(--s-ink); }
.gfo-s-board__bio { font-size: 15px; line-height: 1.5; color: var(--s-ink-soft); }

/* ---------- The Science: the references as cards on a phone ---------- */
.gfo-s-refs { display: grid; gap: 12px; margin: 16px 0 0; padding: 0; list-style: none; }
.gfo-s-refs li { padding: 14px 16px; background: var(--s-card); border: 1px solid rgba(200, 150, 79, 0.6); border-radius: 10.5px; }
.gfo-s-refs__k { font-family: var(--s-serif); font-size: 20px; line-height: 1.2; color: var(--s-ink); }
.gfo-s-refs__row { display: block; margin-top: 6px; font-size: 15.5px; line-height: 1.45; color: var(--s-ink); }
.gfo-s-refs__row b { font-weight: 600; }
.gfo-s-refs a { color: var(--s-ink); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.gfo-s-disclaimer { margin: 18px 0 0; font-size: 15px; line-height: 1.55; color: var(--s-ink-soft); font-style: italic; }

/* ---------- Search, 404: search again, then the bestsellers ---------- */
.gfo-s-search { display: grid; grid-template-columns: 1fr auto; gap: 8px; margin: 16px 0 0; }
.gfo-s-search input[type="search"] { min-width: 0; height: 52px; padding: 0 14px; border: 1.5px solid #B9A58A; border-radius: 4px; background: #fff; font: 400 17px/1.2 var(--s-sans); color: var(--s-ink); }
.gfo-s-search input[type="search"]:focus { outline: 2px solid var(--s-ink); outline-offset: 1px; border-color: var(--s-ink); }
.gfo-s-search .gfo-s-btn { margin: 0; min-height: 52px; padding: 0 20px; border: 0; font-size: 18px; }
.gfo-s-noresults { margin: 16px 0 0; font-size: 17px; line-height: 1.5; color: var(--s-ink); }
.gfo-s-rhead { margin: 26px 0 10px; font-family: var(--s-serif); font-size: 23px; line-height: 1.2; color: var(--s-ink); }
.gfo-s-guides { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--s-gold); }
.gfo-s-guides li { padding: 14px 0; border-bottom: 1px solid rgba(200, 150, 79, 0.45); }
.gfo-s-guides a { display: block; font-family: var(--s-serif); font-size: 19px; line-height: 1.3; color: var(--s-ink); text-decoration: none; }
.gfo-s-guides p { margin-top: 4px; font-size: 15.5px; line-height: 1.5; color: var(--s-ink-soft); }
.gfo-s-pmain > .gfo-s-band--best { margin-top: 24px; }
.gfo-s-orchat { margin: 0; padding: 16px 16px 8px; text-align: center; }

@container salon (min-width: 760px) {
	.gfo-s-page { max-width: 760px; margin: 0 auto; padding-left: 32px; padding-right: 32px; }
	.gfo-s-next { margin-left: 0; margin-right: 0; border: 1px solid var(--s-gold); }
	.gfo-s-cards { grid-template-columns: 1fr 1fr; }
	.gfo-s-refs { grid-template-columns: 1fr 1fr; }
}

/* ---------- The shopping menu (wave 6; owner's pick C, 1 Oct 2026) ----------
   The store's bestsellers on the velvet, as the homepage shows them, then every range with its pack and count, then
   the info links. Cards are the appointment card (card stock, Deep Gold edge, blind emboss); the button on the velvet
   is the Porcelain button; white words on the velvet sit on their soft fold. The menu's own link rule
   (.gfo-s-menu__nav a) is outweighed on purpose: these links are cards and rows, not menu lines. */
.gfo-s-menu__best {
	margin: 4px -22px 0; padding: 4px 22px 22px;
	background-color: #D95A16; background-image: var(--s-velvet-tile, url("velvet-tile.webp"));
	background-size: 100% auto; background-position: center top; background-repeat: repeat-y;
}
.gfo-s-menu__h { margin: 22px 0 8px; font-family: var(--s-serif); font-weight: 400; font-size: 24px; line-height: 1.15; color: var(--s-ink); }
.gfo-s-menu__best .gfo-s-menu__h {
	width: fit-content; max-width: 100%; margin: 0 auto; padding: 14px 40px; text-align: center; font-size: 26px; color: #fff;
	background: radial-gradient(closest-side, rgba(140, 40, 4, 0.62) 0 70%, rgba(140, 40, 4, 0) 100%);
}
.gfo-s-menu__cards { list-style: none; margin: 6px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.gfo-s-menu__nav .gfo-s-menu__cards li, .gfo-s-menu__nav .gfo-s-menu__cards li + li { border-top: 0; }
.gfo-s-menu__nav a.gfo-s-menu__card {
	display: flex; flex-direction: column; height: 100%; padding: 8px 10px 11px;
	background: var(--s-card); border: 1px solid var(--s-gold-deep); border-radius: 10.5px;
	box-shadow: 0 0 0 1.5px var(--s-cream), 0 0 0 2px rgba(200, 145, 70, 0.85);
	font-family: var(--s-serif); font-size: 16px; line-height: 1.15; color: var(--s-ink); text-decoration: none;
}
.gfo-s-menu__card img {
	display: block; width: 100%; height: auto; aspect-ratio: 1296 / 920; margin: 0 0 6px;
	object-fit: contain; object-position: 50% 100%; filter: drop-shadow(0 4px 5px rgba(90, 30, 5, 0.16));
}
.gfo-s-menu__card-price { margin-top: auto; padding-top: 4px; font-family: var(--s-sans); font-size: 14px; line-height: 1.3; color: var(--s-ink-soft); }
.gfo-s-menu__nav a.gfo-s-menu__all {
	display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; margin: 14px 0 0; padding: 0 16px;
	background: var(--s-card); border: 1px solid var(--s-gold-deep); border-radius: 4px;
	box-shadow: 0 0 0 1.5px var(--s-cream), 0 0 0 2px rgba(200, 145, 70, 0.85);
	font-family: var(--s-serif); font-size: 17px; line-height: 1.2; color: var(--s-ink); text-decoration: none;
}
.gfo-s-menu__nav a.gfo-s-menu__all:hover { background: #FFFDFA; }
.gfo-s-menu__all::after { content: ""; flex: none; width: 7px; height: 7px; border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; transform: rotate(45deg); }
.gfo-s-menu__ranges { list-style: none; margin: 0; padding: 0; }
.gfo-s-menu__nav .gfo-s-menu__ranges li + li { border-top: 1px solid rgba(200, 150, 79, 0.45); }
.gfo-s-menu__nav .gfo-s-menu__ranges a {
	display: grid; grid-template-columns: 52px 1fr auto; align-items: center; column-gap: 12px; min-height: 58px; padding: 5px 0;
	font-family: var(--s-serif); font-size: 19px; line-height: 1.2; color: var(--s-ink); text-decoration: none;
}
.gfo-s-menu__range-img { display: block; width: 52px; height: 37px; }
.gfo-s-menu__range-img img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: 50% 100%; }
.gfo-s-menu__range-n { display: block; font-family: var(--s-sans); font-size: 13.5px; line-height: 1.3; color: var(--s-ink-soft); }
.gfo-s-menu__nav .gfo-s-menu__ranges a::after { content: ""; width: 8px; height: 8px; margin-right: 4px; border-top: 1.5px solid var(--s-gold-deep); border-right: 1.5px solid var(--s-gold-deep); transform: rotate(45deg); }
.gfo-s-menu__info { border-top: 1px solid var(--s-gold); }


/* ======================================================================
   WordPress-only additions: the live page's own markup (theme menus, payment marks,
   brand link mesh, WooCommerce cart fragment, SEO official-store line) in the salon's dress.
   ====================================================================== */
.gfo-s-root:not(.gfo-s-msgr-on) .gfo-chat { display: none !important; } /* switch off: the GFO advisor badge is the chat button */
/* Owner, 1 Oct 2026 (switch gfo_salon_msgr_mode): the store's own Messenger widget is the chat button on salon pages, as on
   every other page, always in view as before. It only steps aside while the email slide-in is open (yield), and on
   phones it rises above a bottom bar (the post's product bar, the cart's total bar), as the theme already does above
   the product page's add bar. The salon's menu and drawer cover it. */
.gfo-s-msgr-on:has(.gfo-s-dock[data-state="yield"]) .gfo-chat { visibility: hidden; opacity: 0; }
@media (max-width: 759px) {
	.gfo-s-msgr-on:has(.gfo-s-dock[data-state="bar"]) .gfo-chat, .gfo-s-msgr-on:has(.gfo-s-stickybuy:not([hidden])) .gfo-chat { bottom: 84px; }
}
.gfo-s-msgr-on .gfo-s-dock__bar { padding-right: 16px; } /* the bar no longer shares its corner with a badge */
.gfo-s-msgr-on .gfo-s-menu { z-index: 10000; }
.gfo-s-msgr-on .gfo-s-drawer { z-index: 10001; }
.gfo-s-msgr { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: radial-gradient(circle at 25% 100%, #09f 0%, #a033ff 60%, #ff5280 90%, #ff7061 100%); box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.35); }
.gfo-s-offlink strong { font-weight: 400; }
.gfo-s-sale a { white-space: normal; overflow: visible; text-overflow: clip; text-align: center; line-height: 1.35; }
.gfo-s-cart .gfo-cart-btn__count { font-family: var(--s-sans); font-size: 12.3px; line-height: 1; font-weight: 400; margin-top: 1px; }
.gfo-s-lede { font-size: 17px; }

/* Products without a pack cutout: the product photo sits inside the card instead of rising out of it */
.gfo-s-band:has(.gfo-s-pcard--flat) { padding-top: 24px; }
.gfo-s-pcard--flat .gfo-s-pcard__img { width: 100%; max-width: 300px; height: auto; margin: 16px auto 0; object-fit: contain; filter: none; }

/* Footer: theme menus, payment marks and the brand link mesh */
.gfo-s-foot__list { list-style: none; margin: 0; padding: 0; }
.gfo-s-foot__paylogos { display: flex; flex-wrap: wrap; gap: 6px; }
.gfo-s-foot .gfo-paylogo { display: inline-flex; align-items: center; padding: 3px 5px; background: #FAF4EE; border-radius: 3px; }
.gfo-s-foot .gfo-paylogo svg { display: block; height: 22px; width: auto; }
.gfo-s-foot .gfo-visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.gfo-s-foot .gfo-footer__disc { max-width: 62rem; margin: 0 auto; padding: 0; border-top: 1px solid rgba(200, 150, 79, 0.55); border-bottom: 1px solid rgba(200, 150, 79, 0.55); }
.gfo-s-foot .gfo-footer__disc summary { display: flex; align-items: center; justify-content: space-between; min-height: 48px; font-size: 15px; cursor: pointer; list-style: none; color: #F3EEE8; }
.gfo-s-foot .gfo-footer__disc summary::-webkit-details-marker { display: none; }
.gfo-s-foot .gfo-footer__disc summary::after { content: ""; width: 8px; height: 8px; margin-right: 4px; border-right: 1.5px solid var(--s-gold); border-bottom: 1.5px solid var(--s-gold); transform: rotate(45deg); transition: transform 0.25s; }
.gfo-s-foot .gfo-footer__disc details[open] summary::after { transform: rotate(-135deg); }
.gfo-s-foot .gfo-footer__disc-body { padding: 4px 0 18px; }
.gfo-s-foot .gfo-footer__disc .gfo-eyebrow { margin: 14px 0 6px; font-family: var(--s-sans); font-weight: 600; font-size: 13px; line-height: 1.3; letter-spacing: 0.16em; text-transform: uppercase; color: var(--s-gold); }
.gfo-s-foot .gfo-footer__disc ul { list-style: none; margin: 0; padding: 0; }
.gfo-s-foot .gfo-footer__disc li a { display: flex; align-items: center; min-height: 44px; padding: 0; font-size: 15px; line-height: 1.35; color: #D9CFC6; text-decoration: none; }
.gfo-s-foot .gfo-footer__disc li a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* The drawer's primary menu (wp_nav_menu) */
.gfo-s-menu__nav .menu { list-style: none; margin: 0; padding: 0; }

/* Products with no clean pack photo: a text-only card and tray (never the ad-poster featured image) */
.gfo-s-pcard--flat { padding-top: 20px; }
.gfo-s-pcard--flat .gfo-s-pcard__name { margin-top: 0; }
.gfo-s-tray--noimg { grid-template-columns: 1fr; }

/* Malaysia: the language switch (EN · 中文 · BM), one quiet row under the header, 44 px tap targets. Its links are
   real ?lang= links (they work without JavaScript); salon.js switches in place and remembers the choice. */
.gfo-s-langs { display: flex; justify-content: flex-end; gap: 0; padding: 0 6px; background: var(--s-porcelain); }
.gfo-s-langs__opt {
	display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 8px;
	font-family: var(--s-sans); font-size: 13.5px; line-height: 1; letter-spacing: 0.02em; color: var(--s-ink-soft); text-decoration: none;
}
/* The shown language is marked from html[data-gfo-lang] (set by the head script), so it is right before any script runs. */
html[data-gfo-lang="en"] .gfo-s-langs__opt[data-set-lang="en"], html:not([data-gfo-lang]) .gfo-s-langs__opt[data-set-lang="en"],
html[data-gfo-lang="zh"] .gfo-s-langs__opt[data-set-lang="zh"], html[data-gfo-lang="ms"] .gfo-s-langs__opt[data-set-lang="ms"] {
	color: var(--s-ink); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px;
}
.gfo-s-langs__opt:hover { color: var(--s-ink); }
.gfo-s-langs + main .gfo-s-post__title, .gfo-s-langs + main .gfo-s-crumbs { margin-top: 2px; }
/* Chinese lines: no closing punctuation at the start of a line; headings break only at spaces, punctuation or a
   marked point (U+200B), never inside a word, unless a run cannot fit the line at all (a post title carries no
   marks): then it breaks where it must instead of running off the phone (owner, 1 Oct 2026). */
:lang(zh-Hans-MY) { line-break: strict; }
:is(h1, h2, h3) :lang(zh-Hans-MY), :is(h1, h2, h3):lang(zh-Hans-MY) { word-break: keep-all; overflow-wrap: break-word; }

/* Indonesia (1 Oct 2026): payment methods without a drawn logo (DANA, COD) as text chips beside the theme's logos,
   the same 28 px white face. */
.gfo-s-foot__paylogos .gfo-s-paytext { display: inline-flex; align-items: center; height: 28px; padding: 0 10px; border-radius: 3px; background: #FFFFFF; color: #161311; font: 600 13px/1 'Open Sans', 'Segoe UI', system-ui, sans-serif; letter-spacing: .02em; }

/* Indonesia (1 Oct 2026): its theme stylesheet pulls in the theme main.css, whose "+" marker sits before the product directory; SG shows none. */
.gfo-s-foot .gfo-footer__disc summary::before { content: none; }

/* Hong Kong (1 Oct 2026): Traditional Chinese, as Malaysia's Chinese column: strict line breaks; headings keep words whole but may wrap a long run. */
:lang(zh-HK) { line-break: strict; }
:is(h1, h2, h3):lang(zh-HK) { word-break: keep-all; overflow-wrap: break-word; }

/* Wave 6 + the SG flash sale (1 Oct 2026): a campaign's sale line hides itself at its deadline (the theme's countdown script and
   the flash-sale boot set [hidden] on [data-gfo-offerbar]); the strip's own display would otherwise keep it on screen. */
.gfo-s-sale[hidden] { display: none; }