/* Good Founders, the owner pages at /owner/. Same look as the branded sign-in page: paper, ink, square corners. */

:root {
	--paper: #F3F0E7; --card: #FAF7F2; --ink: #0A151B; --ink-2: #4A5458; --line: #D6D1C4;
	--red: #DD1F3B; --teal: #1E7C86; --teal-wash: #DFEDED; --pink-wash: #FFEEF2;
	--display: 'Bebas Neue', Impact, sans-serif; --mono: 'DM Mono', ui-monospace, monospace;
	--sans: 'DM Sans', system-ui, sans-serif; --serif: 'Instrument Serif', Georgia, serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body.gfo { margin: 0; background: var(--paper); color: var(--ink); font: 400 17px/1.55 var(--sans); }
body.gfo::before { content: ''; display: block; height: 8px; background: linear-gradient(90deg, #FCA9BD, #FF5A85 55%, #FA4B46); }
.gfo a { color: var(--ink); text-decoration-color: #FF5A85; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.gfo a:hover { color: var(--red); }
[hidden] { display: none !important; }

.gfo-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; max-width: 1040px; margin: 0 auto; padding: 22px 16px 0; }
.gfo-brand { display: flex; flex-direction: column; text-decoration: none; }
.gfo-brand__word { font: 400 40px/.9 var(--display); letter-spacing: .02em; }
.gfo-brand__sub { margin-top: 4px; font: 400 11px/1 var(--mono); letter-spacing: .2em; text-transform: uppercase; color: var(--teal); }
.gfo-who { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; font: 400 12px/1.4 var(--mono); letter-spacing: .08em; }
.gfo-who form { margin: 0; }
.gfo-link { padding: 0; border: 0; background: none; color: var(--ink); font: inherit; text-transform: uppercase; letter-spacing: .16em; border-bottom: 1.5px solid #FF5A85; cursor: pointer; }
.gfo-link:hover { color: var(--red); }

.gfo-wrap { max-width: 560px; margin: 0 auto; padding: 28px 16px 80px; }
.gfo-wrap--wide { max-width: 1040px; }
.gfo h1 { margin: 0 0 16px; font: 400 clamp(40px, 7vw, 56px)/.95 var(--display); letter-spacing: .01em; }
.gfo h2 { margin: 0 0 14px; font: 400 30px/1 var(--display); letter-spacing: .02em; }
.gfo p { margin: 0 0 14px; }

.gfo-card { margin-top: 20px; padding: 26px 24px 24px; background: var(--card); border-top: 6px solid var(--ink); }
.gfo-card--state { border-top-color: var(--teal); }
.gfo-head { margin-top: 8px; }
.gfo-crumb { font: 400 11px/1.4 var(--mono); letter-spacing: .16em; text-transform: uppercase; }

.gfo-form { display: grid; gap: 10px; margin: 18px 0; }
.gfo label, .gfo-label { display: block; font: 400 11px/1.4 var(--mono); letter-spacing: .16em; text-transform: uppercase; }
.gfo input[type=email], .gfo input[type=text], .gfo input[type=url], .gfo input[type=tel], .gfo select, .gfo textarea {
	width: 100%; min-height: 48px; padding: 10px 12px; margin-top: 6px; border: 1.5px solid var(--ink); border-radius: 0; background: #FFFFFF; color: var(--ink);
	font: 400 17px/1.45 var(--sans);
}
.gfo textarea { resize: vertical; }
.gfo input:focus, .gfo select:focus, .gfo textarea:focus { outline: 0; border-color: var(--teal); box-shadow: 0 0 0 3px #A4DBDE; }
.gfo-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.gfo-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 22px; border: 0; border-radius: 0; background: var(--red); color: #FFFFFF;
	font: 400 13px/1 var(--mono); letter-spacing: .18em; text-transform: uppercase; text-decoration: none; cursor: pointer; transition: background .25s; }
.gfo a.gfo-btn { color: #FFFFFF; }
.gfo-btn:hover, .gfo-btn:focus-visible { background: var(--ink); color: #FFFFFF; }
.gfo-btn:disabled { opacity: .5; cursor: default; }
.gfo-btn--ghost, .gfo a.gfo-btn--ghost { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--ink); }
.gfo-btn--ghost:hover, .gfo a.gfo-btn--ghost:hover { background: var(--ink); color: #FFFFFF; }
.gfo-btn--sm { min-height: 38px; padding: 0 12px; font-size: 11px; letter-spacing: .12em; }
.gfo-btn:focus-visible, .gfo-link:focus-visible, .gfo a:focus-visible { outline: 3px solid #A4DBDE; outline-offset: 2px; }

.gfo-msg { padding: 12px 14px; border-left: 4px solid var(--teal); background: var(--teal-wash); }
.gfo-msg--warn { border-left-color: var(--red); background: var(--pink-wash); }
.gfo-small { margin-top: 18px; font-size: 14px; color: var(--ink-2); }
.gfo-hint { margin: 6px 0 0; font-size: 14px; color: var(--ink-2); }
.gfo-hint.is-over, .gfo-hint.is-error, .gfo-status.is-error { color: var(--red); font-weight: 700; }

.gfo-state { display: inline-block; padding: 3px 8px; border: 1.5px solid var(--ink-2); font: 400 11px/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); }
.gfo-state--live { border-color: var(--teal); color: var(--teal); }

.gfo-list { margin: 0; padding: 0; list-style: none; }
.gfo-list li { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.gfo-list__name { flex: 1 1 200px; font: 400 26px/1 var(--display); letter-spacing: .02em; }

.gfo-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.gfo-row input { flex: 1 1 220px; margin-top: 0; }
.gfo-check { display: flex !important; align-items: flex-start; gap: 10px; margin: 8px 0; font: 400 16px/1.45 var(--sans) !important; letter-spacing: 0 !important; text-transform: none !important; cursor: pointer; }
.gfo-check input { width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--teal); flex: 0 0 auto; }
.gfo-check--big { margin: 18px 0 22px; font-size: 17px !important; }
.gfo-publish { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.gfo-publish .gfo-btn { margin-top: 8px; }

.gfo-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 24px; }
.gfo-actions--end { margin-top: 28px; }
.gfo-status { font-size: 15px; color: var(--ink-2); }
.gfo-grid { display: grid; gap: 22px 28px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.gfo-f { min-width: 0; }
.gfo-f--full { grid-column: 1 / -1; }
.gfo-checks { display: flex; flex-wrap: wrap; gap: 4px 28px; }

.gfo-single__prev { width: 160px; min-height: 0; margin: 8px 0 10px; }
.gfo-single__prev img { display: block; max-width: 100%; height: auto; background: #FFFFFF; }
.gfo-gallery { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); margin: 12px 0 14px; padding: 0; list-style: none; }
.gfo-gallery li { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 8px; background: #FFFFFF; border: 1px solid var(--line); }
.gfo-gallery img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.gfo-gallery__tag { display: none; position: absolute; top: 14px; left: 14px; padding: 3px 8px; background: var(--red); color: #FFFFFF; font: 400 11px/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.gfo-gallery li:first-child .gfo-gallery__tag { display: block; }
.gfo-gallery li:first-child [data-gfo-feature] { display: none; }
.gfo-gallery__btns { display: flex; flex-wrap: wrap; gap: 6px; }

.gfo-emails { margin: 8px 0 18px; padding: 0; list-style: none; }
.gfo-emails li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.gfo-emails li > span:first-child { font: 400 15px/1.4 var(--mono); word-break: break-all; }
.gfo-add { margin-top: 8px; }

/* Ask for reviews: the link, share buttons, the website button code and its preview. */
.gfo-card--reviews { border-top-color: var(--red); }
.gfo-card--reviews .gfo-f + .gfo-f, .gfo-card--reviews .gfo-f + .gfo-row { margin-top: 16px; }
.gfo-h3 { margin: 28px 0 10px; padding-top: 22px; border-top: 1px solid var(--line); font: 400 24px/1 var(--display); letter-spacing: .02em; }
.gfo-share { margin-top: 14px; }
.gfo-row--top { margin-top: 10px; }
.gfo textarea.gfo-code { font: 400 13px/1.5 var(--mono); background: #FFFFFF; word-break: break-all; }
.gfo-rev-preview { margin-top: 8px; padding: 24px; background: #FFFFFF; border: 1px dashed var(--line); }

@media (max-width: 560px) {
	.gfo-card { padding: 22px 16px 20px; }
	.gfo-brand__word { font-size: 34px; }
}
@media (prefers-reduced-motion: reduce) { .gfo-btn { transition: none; } }
.gfo-tag { display: inline-block; margin-left: 8px; padding: 1px 6px; border: 1px solid #1E7C86; background: #E3F2F3; color: #0F4E55; font: 500 9.5px/1.5 "DM Mono", monospace; letter-spacing: .06em; text-transform: uppercase; vertical-align: middle; }

/* Branded drop-down lists (assets/js/hq-pick.js), the same as in the HQ (Willem, 17 Oct 2026). */
:root { --blue: #1E7C86; --orange: #FBA30B; }
/* ── the HQ's own drop-down list (assets/js/hq-pick.js), on every screen ─────────────────── */

.hq-pick { position: relative; display: block; width: 100%; max-width: 100%; vertical-align: middle; }
select.hq-pick__native { position: absolute !important; left: 0; bottom: 0; width: 1px !important; height: 1px !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; opacity: 0; pointer-events: none; }
.hq-pick__btn { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 44px; margin: 0; padding: 9px 12px; border: 1.5px solid var(--ink); border-radius: 0; background: var(--card); color: var(--ink); font: 500 15px/1.3 "DM Sans", system-ui, sans-serif; text-align: left; cursor: pointer; }
.hq-pick__text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hq-pick__btn::after { content: ""; flex: 0 0 auto; width: 8px; height: 8px; margin: 0 4px 4px 0; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); transform: rotate(45deg); }
.hq-pick__btn:hover, .hq-pick__btn[aria-expanded="true"] { background: #FFFFFF; }
.hq-pick__btn[aria-expanded="true"]::after { margin: 4px 4px 0 0; transform: rotate(-135deg); }
.hq-pick__btn:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.hq-pick__btn:disabled { opacity: .4; cursor: default; }
.hq-pick__list { position: fixed; z-index: 60; margin: 0; padding: 0; list-style: none; overflow: auto; overscroll-behavior: contain; background: var(--card); border: 1.5px solid var(--ink); box-shadow: 5px 5px 0 var(--ink); }
.hq-pick__opt { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px; border-top: 1px solid var(--line); color: var(--ink); font: 400 12px/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; cursor: pointer; }
.hq-pick__opt:first-child { border-top: 0; }
.hq-pick__opt.is-selected::after { content: ""; flex: 0 0 8px; width: 8px; height: 8px; border-radius: 50%; background: var(--red); }
.hq-pick__opt.is-active { background: var(--ink); color: #F3F0E7; }
.hq-pick__opt.is-active.is-selected::after { background: #F3F0E7; }
.hq-pick__opt.is-disabled { color: var(--ink-2); cursor: default; }

/* A nomination's status keeps its colour bar on the list's button. */
.gfs-item[data-status="new"] .hq-pick__btn { border-left: 6px solid var(--orange); }
.gfs-item[data-status="selected"] .hq-pick__btn { border-left: 6px solid var(--blue); }
.gfo-f .hq-pick { display: block !important; width: 100% !important; }

/* Owner edit page, wider and calmer: two even columns, labels on one line, roomy inputs. */
.gfo-wrap--wide { max-width: 1240px; }
.gfo-top { max-width: 1240px; }
.gfo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 36px; align-items: start; }
@media (max-width: 820px) { .gfo-grid { grid-template-columns: minmax(0, 1fr); } }
.gfo-f > label { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 22px; }
.gfo input:not([type=checkbox]):not([type=radio]):not([type=file]), .gfo textarea { width: 100%; }

/* Photos: four across, dragged into order (Willem, 17 Oct 2026). */
.gfo-gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 820px) { .gfo-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.gfo-gallery li { position: relative; cursor: grab; user-select: none; -webkit-user-select: none; transition: opacity .2s, box-shadow .2s; }
.gfo-gallery li img { pointer-events: none; -webkit-user-drag: none; }
.gfo-gallery li.is-dragging { opacity: .55; box-shadow: 0 0 0 3px #1E7C86; cursor: grabbing; }
.gfo-gallery.is-sorting li:not(.is-dragging) { box-shadow: 0 0 0 1px #D6D1C4; }
.gfo-gallery__btns .gfo-btn { touch-action: manipulation; }
/* Make featured and Remove sit side by side on one line (Willem, 19 Oct 2026). */
.gfo-gallery__btns { flex-wrap: nowrap; }
.gfo-gallery__btns .gfo-btn { flex: 1 1 auto; min-width: 0; padding: 0 6px; font-size: 10.5px; letter-spacing: .06em; white-space: nowrap; }
.gfo-gallery__grip { position: absolute; top: 10px; right: 10px; width: 34px; height: 34px; background: #0A151B url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cg fill='%23F3F0E7'%3E%3Ccircle cx='4' cy='3' r='1.4'/%3E%3Ccircle cx='10' cy='3' r='1.4'/%3E%3Ccircle cx='4' cy='7' r='1.4'/%3E%3Ccircle cx='10' cy='7' r='1.4'/%3E%3Ccircle cx='4' cy='11' r='1.4'/%3E%3Ccircle cx='10' cy='11' r='1.4'/%3E%3C/g%3E%3C/svg%3E") center / 16px no-repeat; touch-action: none; cursor: grab; }

/* The dock: Save, Preview and Publish float on the right; a bar along the bottom on phones (Willem, 17 Oct 2026). */
.gfo-dock { position: fixed; z-index: 40; right: 24px; bottom: 24px; width: 260px; display: flex; flex-direction: column; gap: 10px; padding: 16px; background: var(--card); border: 1.5px solid var(--ink); border-top: 6px solid var(--ink); box-shadow: 0 10px 30px rgba(10, 21, 27, .14); }
.gfo-dock .gfo-btn { width: 100%; justify-content: center; text-align: center; }
.gfo-dock .gfo-status { font-size: 13px; line-height: 1.4; color: var(--ink-2); }
.gfo-dock .gfo-status:empty { display: none; }
.gfo-dock__publish { display: flex; flex-direction: column; gap: 10px; margin: 6px 0 0; padding-top: 12px; border-top: 1.5px solid var(--line); }
.gfo-dock__publish .gfo-check { font-size: 14px; line-height: 1.35; }
.gfo-dock__publish .gfo-hint:empty { display: none; }
@media (min-width: 821px) { .gfo-wrap--wide { padding-right: 300px; } }
@media (min-width: 1840px) { .gfo-wrap--wide { padding-right: 16px; } }
@media (max-width: 820px) {
	.gfo-dock { left: 0; right: 0; bottom: 0; width: auto; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); border-left: 0; border-right: 0; border-bottom: 0; box-shadow: 0 -6px 20px rgba(10, 21, 27, .12); }
	.gfo-dock .gfo-btn { width: auto; flex: 1 1 auto; }
	.gfo-dock .gfo-status { flex-basis: 100%; order: 9; }
	.gfo-dock__publish { flex-basis: 100%; flex-direction: row; flex-wrap: wrap; align-items: center; margin: 0; padding-top: 8px; }
	.gfo-dock__publish .gfo-check { flex: 1 1 60%; font-size: 13px; }
	body.gfo { padding-bottom: 170px; }
}

/* Remove your listing: kept quiet but clear. */
.gfo-card--danger { border-top-color: var(--red); }
.gfo-card--danger form { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.gfo-btn--danger { background: transparent; color: var(--red); border: 1.5px solid var(--red); }
.gfo-btn--danger:hover, .gfo-btn--danger:focus-visible { background: var(--red); color: #FFFFFF; }
.gfo-dock form { margin: 0; }

/* Line-up fixes (Willem, 19 Oct 2026): a drop-down sits the same distance under its label and is the same height as a
   typed box, so Town and New town, Sub-category and New sub-category, Province and Address line up; the Add button
   sits level with its email box. */
.gfo-f .hq-pick { margin-top: 6px; }
.gfo-f .hq-pick__btn { min-height: 48px; box-sizing: border-box; }
.gfo .gfo-row > input { margin-top: 0; }
.gfo .gfo-row > input + .gfo-btn { min-height: 48px; }

/* The logo as its own card after the last photo (Willem, 19 Oct 2026). The photo list keeps its own element for
   dragging but lays its photos into the same grid as the logo card. */
.gfo-photos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 12px 0 14px; }
@media (max-width: 820px) { .gfo-photos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.gfo-photos > .gfo-gallery { display: contents; }
.gfo-f.gfo-logo-card { display: flex; flex-direction: column; gap: 8px; align-self: start; padding: 8px; background: #FFFFFF; border: 1px dashed var(--ink); }
.gfo-logo-card .gfo-label { margin: 0; }
.gfo-logo-card .gfo-single__prev { display: flex; align-items: center; justify-content: center; width: 100%; aspect-ratio: 4 / 3; margin: 0; background: #FFFFFF; }
.gfo-logo-card .gfo-single__prev img { max-width: 100%; max-height: 100%; width: auto; object-fit: contain; }
.gfo-logo-card .gfo-row { flex-wrap: nowrap; gap: 6px; }
.gfo-logo-card .gfo-row > .gfo-btn { flex: 1 1 auto; min-width: 0; min-height: 38px; padding: 0 6px; font-size: 10.5px; letter-spacing: .06em; white-space: nowrap; }
.gfo-logo-card .gfo-hint { font-size: 13px; line-height: 1.4; margin: 0; }
.gfo-unpub { margin: 0 0 22px; }

/* Review button choices: wording, size and colour (Willem, 19 Oct 2026). */
.gfo-revopts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 28px; margin: 6px 0 18px; }
@media (max-width: 820px) { .gfo-revopts { grid-template-columns: minmax(0, 1fr); } }
.gfo-revopts fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.gfo-revopts legend { padding: 0; margin-bottom: 4px; }
.gfo-revopts__colour { display: flex; align-items: center; gap: 10px; margin: 8px 0; }
.gfo-revopts__colour input[type="color"] { width: 56px; height: 38px; padding: 2px; border: 1.5px solid var(--ink); background: #FFFFFF; cursor: pointer; }
.gfo-revopts[hidden] { display: none; }
.gfo-revopts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 820px) { .gfo-revopts { grid-template-columns: minmax(0, 1fr); } }

/* Colour swatch, hex code box and reset on one line (Willem, 19 Oct 2026). */
.gfo .gfo-revopts__colour input[type="color"] { flex: 0 0 56px; width: 56px; height: 48px; }
.gfo .gfo-revopts__colour .gfo-hex { flex: 1 1 auto; width: auto; min-width: 0; margin-top: 0; font-family: var(--mono); text-transform: uppercase; }
.gfo .gfo-revopts__colour .gfo-hex.is-bad { border-color: var(--red); }
.gfo .gfo-revopts__colour .gfo-btn { flex: 0 0 auto; min-height: 48px; white-space: nowrap; }

/* The tick boxes beside the opening hours, one under the other (Willem, 19 Oct 2026). */
.gfo-grid > .gfo-checks:not(.gfo-f--full) { flex-direction: column; flex-wrap: nowrap; gap: 0; }
.gfo-grid > .gfo-checks .gfo-label { margin-bottom: 4px; }
/* Badge and review tag: space between the two parts. */
.gfo-revwrap .gfo-h3 + p { margin-top: 0; }
.gfo-revwrap .gfo-f + .gfo-h3 { margin-top: 40px; padding-top: 28px; border-top: 1.5px solid var(--line); }
.gfo-revwrap .gfo-f + .gfo-f { margin-top: 18px; }

/* Required fields: a bold red asterisk after the label (Willem, 20 Oct 2026); empty ones go red on Save. */
.gfo-req { margin-left: 4px; color: var(--red); font-weight: 700; font-size: 1.35em; line-height: 0; vertical-align: -.1em; }
.gfo-reqkey { margin: 0 0 16px; font: 400 14px/1.5 var(--sans, inherit); }
.gfo-reqkey .gfo-req { margin: 0 4px 0 0; }
.gfo-f.is-missing input, .gfo-f.is-missing select, .gfo-f.is-missing textarea { border-color: var(--red); box-shadow: 0 0 0 2px var(--red); }
.gfo-f.is-missing > label, .gfo-f.is-missing > .gfo-label { color: var(--red); }
.gfo-f > label .gfo-req { margin: 0 auto 0 -6px; }
/* Tick boxes: the words sit straight after the box (the field label rule spread them across the row). */
.gfo-f > label.gfo-check { justify-content: flex-start; }
.gfo-oneof { margin: 0; padding: 14px 18px 18px; border: 1.5px solid var(--ink); min-width: 0; }
.gfo-oneof > legend { padding: 0 8px; margin-left: -8px; }
.gfo-oneof > legend em, .gfo-label em { margin-left: 6px; font-style: normal; text-transform: none; letter-spacing: .04em; opacity: .75; }
.gfo-oneof--grid { margin: 18px 0; }
.gfo-oneof.is-missing { border-color: var(--red); box-shadow: 0 0 0 2px var(--red); }
.gfo-oneof.is-missing > legend { color: var(--red); }

/* Field headings (Willem, 20 Oct 2026): 4px bigger than before (11px to 15px), red and bold. */
.gfo label:not(.gfo-check), .gfo-label { font: 700 15px/1.35 var(--mono); letter-spacing: .1em; color: var(--red); }
.gfo-label em, .gfo-oneof > legend em { color: var(--ink); font: 400 12px/1.3 var(--mono); }
.gfo-f > label .gfo-req, .gfo-label .gfo-req { margin-left: -4px; }
.gfo-f > label .gfo-req { margin-right: auto; }

/* Photos and logo (Willem, 20 Oct 2026): one row of photo slots, cover first; the logo in its own panel under it. */
.gfo-photos { grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: start; }
@media (max-width: 820px) { .gfo-photos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.gfo-photos > .gfo-slots { display: contents; }
.gfo-gallery img { aspect-ratio: 3 / 4; }
.gfo-gallery__tag { font-size: 10.5px; }
.gfo-gallery__btns { flex-direction: column; }
.gfo-gallery__btns .gfo-btn { min-height: 34px; }
.gfo .gfo-slot { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; width: 100%; aspect-ratio: 3 / 4; margin: 0; padding: 12px; border: 1.5px dashed rgba(10, 21, 27, .45); border-radius: 0; background: #FFFFFF; color: var(--ink); font: 400 11px/1.3 var(--mono); letter-spacing: .1em; text-transform: uppercase; text-align: center; cursor: pointer; transition: border-color .2s, background .2s; }
.gfo .gfo-slot.is-needed { border-color: var(--ink); }
.gfo .gfo-slot:hover, .gfo .gfo-slot:focus-visible { border-style: solid; border-color: var(--red); background: var(--pink-wash); outline: 0; }
.gfo-slot__plus { font: 300 34px/1 var(--sans); color: var(--red); }
.gfo-slot em { font-style: normal; color: var(--red); font-size: 10px; }
.gfo-f.is-missing .gfo-slot.is-needed { border-color: var(--red); border-style: solid; }
.gfo-f.gfo-logo-card { display: grid; grid-template-columns: 170px minmax(0, 1fr); grid-template-rows: auto 1fr; gap: 6px 22px; align-items: start; margin-top: 10px; padding: 18px; background: #FFFFFF; border: 1px solid var(--line); }
.gfo-logo-card > .gfo-label { grid-column: 1 / -1; margin: 0 0 6px; }
.gfo-logo-card .gfo-single { display: contents; }
.gfo-logo-card .gfo-single__prev { grid-column: 1; grid-row: 2 / span 3; width: 170px; aspect-ratio: 1; margin: 0; border: 1.5px dashed rgba(10, 21, 27, .45); }
.gfo-logo-card .gfo-single__prev:has(img) { border-style: solid; border-color: var(--line); }
.gfo-logo-card .gfo-single__prev img { padding: 12px; box-sizing: border-box; }
.gfo-logo-card .gfo-row { grid-column: 2; justify-content: flex-start; }
.gfo-logo-card .gfo-row > .gfo-btn { flex: 0 0 auto; min-height: 40px; padding: 0 22px; font-size: 11px; }
.gfo-logo-card .gfo-hint { grid-column: 2; font-size: 14px; }
@media (max-width: 560px) { .gfo-f.gfo-logo-card { grid-template-columns: 110px minmax(0, 1fr); } .gfo-logo-card .gfo-single__prev { width: 110px; } }

/* Live or not, as a flag sitting on the Save panel's black top edge (Willem, 20 Oct 2026). */
.gfo-dock__flag { position: absolute; left: -1.5px; bottom: calc(100% + 6px); display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px 6px; background: var(--red); color: #FFFFFF; font: 700 12px/1 var(--mono); letter-spacing: .14em; text-transform: uppercase; white-space: nowrap; }
.gfo-dock__flag::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.gfo-dock__flag.is-live { background: var(--teal); }
/* More room between a heading and its asterisk (Willem, 20 Oct 2026). */
.gfo-label .gfo-req, .gfo-oneof > legend .gfo-req { margin-left: 7px; }
.gfo-f > label .gfo-req { margin-left: -3px; }

/* Sign-in addresses in bold red, with the founder name(s) above them (Willem, 20 Oct 2026). */
.gfo-emails li > span:first-child { font-weight: 700; color: var(--red); }
.gfo-emails__who { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin: 14px 0 0; }
.gfo-emails__who strong { font: 700 20px/1.3 var(--sans); color: var(--ink); }
.gfo-signin-phone { margin: 14px 0 6px; }
.gfo-emails__head { margin-top: 10px; }
/* The contact number takes the full width, so its heading stays on one line; the box itself stays phone-number sized. */
.gfo-signin-phone .gfo-f--full input { max-width: 420px; }

/* Headings and sign-in addresses in blue instead of red (Willem, 20 Oct 2026); asterisks and empty-field warnings stay red. */
.gfo label:not(.gfo-check), .gfo-label { color: var(--teal); }
.gfo-emails li > span:first-child { color: var(--teal); }
.gfo-req { color: var(--red); }
.gfo-f.is-missing > label, .gfo-f.is-missing > .gfo-label, .gfo-oneof.is-missing > legend { color: var(--red); }

/* "Your listings" as a button with a line under it (Willem, 20 Oct 2026). */
.gfo-crumb { margin: 0 0 26px; padding: 0 0 20px; border-bottom: 2px solid var(--ink); }
.gfo .gfo-crumb a.gfo-crumb__btn { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 22px; border: 2px solid var(--ink); background: #FFFFFF; color: var(--ink); font: 700 15px/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; text-decoration: none; box-shadow: none; transition: background .2s, color .2s; }
.gfo .gfo-crumb a.gfo-crumb__btn span { font: 400 20px/1 var(--sans); letter-spacing: 0; }
.gfo .gfo-crumb a.gfo-crumb__btn:hover, .gfo .gfo-crumb a.gfo-crumb__btn:focus-visible { background: var(--ink); color: #FFFFFF; }
.gfo-crumb + h1, .gfo-crumb + * { margin-top: 34px !important; }

/* Jump to a section (Willem, 20 Oct 2026). Wide screens: a column on the left that stays in view. Smaller screens:
   a row of tabs that sticks to the top while scrolling. The section in view is marked. */
html { scroll-behavior: smooth; }
.gfo-has-jump [id^="gfo-s-"] { scroll-margin-top: 24px; }
.gfo-jump ul { margin: 0; padding: 0; list-style: none; }
.gfo-jump a { display: block; color: var(--ink); text-decoration: none; font: 700 15px/1.3 var(--sans); }
.gfo-jump a:hover { color: var(--teal); }
.gfo-jump a.is-on { color: var(--teal); }
@media (min-width: 1180px) {
	.gfo-wrap--wide.gfo-has-jump { max-width: 1500px; display: grid; grid-template-columns: 210px minmax(0, 1fr); column-gap: 44px; align-items: start; }
	.gfo-has-jump > * { grid-column: 2; }
	.gfo-has-jump > .gfo-jump { grid-column: 1; grid-row: 1 / span 40; position: sticky; top: 24px; align-self: start; padding-top: 4px; }
	.gfo-jump li { border-top: 1px solid var(--line); }
	.gfo-jump li:last-child { border-bottom: 1px solid var(--line); }
	.gfo-jump a { padding: 11px 0 11px 14px; border-left: 4px solid transparent; }
	.gfo-jump a.is-on { border-left-color: var(--teal); background: var(--teal-wash); }
}
@media (max-width: 1179px) {
	.gfo-has-jump [id^="gfo-s-"] { scroll-margin-top: 72px; }
	.gfo-jump { position: sticky; top: 0; z-index: 30; margin: 0 -16px 18px; padding: 0 16px; background: var(--paper); border-bottom: 2px solid var(--ink); }
	.gfo-jump ul { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; }
	.gfo-jump ul::-webkit-scrollbar { display: none; }
	.gfo-jump a { padding: 14px 12px 11px; white-space: nowrap; border-bottom: 4px solid transparent; }
	.gfo-jump a.is-on { border-bottom-color: var(--teal); }
	.gfo-has-jump > .gfo-jump { order: -1; }
}

/* Edit page header (Willem, 20 Oct 2026): one bar across the page. Your listings on the left, the logo in the middle,
   the account on the right, a line under it. The section list and the content start level below it. */
.gfo-top.gfo-top--edit { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px 24px; max-width: 1500px; padding: 18px 16px 18px; border-bottom: 2px solid var(--ink); }
.gfo-top--edit .gfo-top__back { justify-self: start; }
.gfo-top--edit .gfo-brand { justify-self: center; align-items: center; text-align: center; }
.gfo-top--edit .gfo-who { justify-self: end; justify-content: flex-end; text-align: right; }
.gfo-top--edit .gfo-crumb__btn { display: inline-flex; align-items: center; gap: 10px; min-height: 46px; padding: 0 20px; border: 2px solid var(--ink); background: #FFFFFF; color: var(--ink); font: 700 14px/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; text-decoration: none; transition: background .2s, color .2s; }
.gfo-top--edit .gfo-crumb__btn span { font: 400 20px/1 var(--sans); letter-spacing: 0; }
.gfo-top--edit .gfo-crumb__btn:hover, .gfo-top--edit .gfo-crumb__btn:focus-visible { background: var(--ink); color: #FFFFFF; }
.gfo-has-jump { padding-top: 32px; }
.gfo-head--edit { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin: 0 0 22px; }
.gfo-head--edit h1 { margin: 0; line-height: .95; }
.gfo-head--edit .gfo-state { padding: 6px 12px; font-size: 13px; font-weight: 500; }
@media (min-width: 1180px) { .gfo-has-jump > .gfo-jump { padding-top: 0; } }
@media (max-width: 820px) {
	.gfo-top.gfo-top--edit { grid-template-columns: 1fr auto; grid-template-areas: "brand who" "back back"; }
	.gfo-top--edit .gfo-brand { grid-area: brand; justify-self: start; align-items: flex-start; text-align: left; }
	.gfo-top--edit .gfo-who { grid-area: who; }
	.gfo-top--edit .gfo-top__back { grid-area: back; }
	.gfo-top--edit .gfo-who__mail { display: none; }
}