11aStage 11 — Component-library index · prototype · audit · export manifest
Design System — extracted from the approved artboards, no new direction
11b Foundations & tokens · 11c Navigation & actions · 11d Forms & validation · 11e Discovery components · 11f Technical & editorial · 11g–11k Prototype journey maps (each step links to its approved artboard — click through the flows on this board) · 11l Usability audit · 11m Change manifest.
Status legend per component: APPROVED (in a signed-off artboard) · CONDITIONAL (approved design, gated on content/asset/decision) · BLOCKED (none remain — T-09 resolved generically). Canonical design repo Gortina/Website-yuksel-seeds-2027 (ID 1153901352) — export prepared for Claude Code, no direct push from here.
11b Foundations & tokens · 11c Navigation & actions · 11d Forms & validation · 11e Discovery components · 11f Technical & editorial · 11g–11k Prototype journey maps (each step links to its approved artboard — click through the flows on this board) · 11l Usability audit · 11m Change manifest.
Status legend per component: APPROVED (in a signed-off artboard) · CONDITIONAL (approved design, gated on content/asset/decision) · BLOCKED (none remain — T-09 resolved generically). Canonical design repo Gortina/Website-yuksel-seeds-2027 (ID 1153901352) — export prepared for Claude Code, no direct push from here.
11bFoundations & tokens
Colour — official (p.9) + adapted digital
green
#006443
#006443
g-80
g-50
g-30
yellow
#FBE232
#FBE232
y-50 =
--search-highlight
--search-highlight
black
ink*
paper*
border*
secondary*
pending*
* digital-support neutrals (approved decision 4) — never presented as brand colours. Semantic: --search-highlight #FDF199 · --pending #7A5D00 (light bg) / yellow treatment on green · --footer-note #D6E7DF (≥14px on green). Full contrast matrix: 3a.
Type · spacing · grid · shape · motion
Type (p.10–11): Bogart H1 56 / H2 40 / H3 28 / H4 20 · Sofia Pro Soft body 16/1.6, secondary ≥14, mobile inputs 16. Webfonts pending licence (stand-ins labelled).Spacing: 4px base — 4/8/12/16/24/32/48/56 · section padding 48px desktop / 16px mobile.
Grid: 12-col 1440 (48px margins) → 1 col 390; breakpoints 1440 / 1024 / 768 / 390; cards 4→2→1.
Radii: pills 999px (buttons/chips) · cards 12–16px · fields 8–10px · badges 4px. Shadows: cards 0 2px 10px rgba(0,0,0,.06) · sheets 0 −8px 24px rgba(0,0,0,.2) — two levels only.
Icons: official 4 + per-crop set (p.14) at 20/24/44px targets. Image ratios: variety 16:9 · gallery 16:9 · content 4:3 · hero 21:9.
Motion: functional only (150–250ms fades/sheet slides), reduced-motion honoured, nothing hidden behind animation, server-rendered figures. Focus: 3px yellow ring +2px offset on dark · 2px green on light — every interactive element.
11cNavigation & action components
Component
Purpose · variants · states · behaviour · limits
Accessibility
CMS · reuse (T-IDs)
Status
Desktop header
White bar, logo 150px (≥85 min), 7 items + CTA. States: default/hover underline/selected yellow underline+weight/focus. Labels ≤2 words.
Skip link first; logo alt “Yüksel Seeds — home”; visible focus
Site Setting · all T
APPROVED
Products mega-menu
Two columns: Browse by crop | Find a Variety. Open on click/hover-intent; crop list from confirmed crops only.
Esc closes, focus returns; arrow-key column traversal
Category · T-01–05
APPROVED
Company dropdown
Single column: About · History · Values · Sustainability · Careers · Leadership ◐.
Same keyboard contract as mega-menu
— · T-10/11/16/21
CONDITIONAL (Leadership ◐)
Mobile header + menu
Logo 96px + 44px burger; green sheet menu, Products expands inline; utility rows (language, market, careers, search).
Focus trapped in sheet; Esc/Close returns to burger
— · all T
APPROVED
Language / market selector
Two DISTINCT controls; market syncs with Finder country after confirmation. EN-only at launch.
Labelled selects, not flags-only
Country entity · all T
APPROVED
Breadcrumbs · Footer
Breadcrumbs on all product/company pages. Footer: green, white-plate logo (inverted asset pending), offices ◐, sitemap, legal, social; notes #D6E7DF ≥14px, links underlined.
nav[aria-label]; current page not a link
Footer/Social Link · all T
CONDITIONAL (inverted logo asset)
Buttons
Primary (green/white; on-green: yellow/black) · Secondary (green outline) · Tertiary text link (underlined). States: default/hover (darken/#004D33)/focus/pressed (scale .98)/disabled (#EAE7DD + #6B675C)/loading (spinner + label, width locked). One primary per view region. Label ≤3 words.
44px min; loading announced aria-busy; never colour-only meaning
— · all T
APPROVED
Icon buttons
Search, close, gallery arrows, map zoom — 44×44, glyphs match official icon stroke (custom glyphs flagged for approval).
aria-label required
— · T-02/05/12/19
CONDITIONAL (icon vectors ◐)
CTA bands · sticky mobile actions
Green band (yellow CTA) / yellow band (green CTA) / paper band. Sticky bars: 1–2 actions, position:sticky, end at footer, hide while forms/consent visible.
Sticky never covers content or browser UI (audited 3a)
CTA Section · most T
APPROVED
Primary
On-green primary
Secondary
Tertiary link
Disabled
Focused
Hover/pressed
◌ Sending…
11dForms & validation
Fields: text · textarea · select (empty required default) · search · checkbox · radio · consent control (unticked, purpose text + privacy link, blocks submit) · file upload (Careers only: type/size restrictions stated, secure workflow, production submission gated). Labels always visible + programmatically associated; required marked with * and “(optional)” on optional fields — both, never colour alone. Mobile inputs 16px / 44px targets.
Validation: inline on blur + on submit; error = 2px #9B1C1C border + icon + text under the field; focus moves to first error; success = confirmation panel stating routing + response expectation ◐; warning (e.g. leaving-site notice) = paper panel with icon. Failure state preserves all entered data (T-20 matrix).
CMS: routing rules + destinations (T-18) · applicationMethod (T-16/17). Reuse: T-05 enquiry, T-13, T-16/17, T-18. Status: APPROVED (destinations ◐).
Validation: inline on blur + on submit; error = 2px #9B1C1C border + icon + text under the field; focus moves to first error; success = confirmation panel stating routing + response expectation ◐; warning (e.g. leaving-site notice) = paper panel with icon. Failure state preserves all entered data (T-20 matrix).
CMS: routing rules + destinations (T-18) · applicationMethod (T-16/17). Reuse: T-05 enquiry, T-13, T-16/17, T-18. Status: APPROVED (destinations ◐).
✓ Enquiry sent. Routed to the {country} commercial team ◐ — response expectation stated once confirmed.
11eCards, filters & discovery components
Component
Purpose · variants · states · limits
Accessibility
CMS · reuse
Status
Variety card
THE product unit (grid / compact-row mobile / related). Photo 16:9 official only → segment tag → name (Bogart) → coded HR/IR chips → availability line (✓/◐/not listed) → one CTA. Name ≤24 chars before wrap; ≤4 chips then “+n”.
Whole card one link, name = accessible name; chips link legend
Variety · T-01/02/03/04/05/07/09/13/19
APPROVED
Crop / segment cards
Official illustration on g-30 · name · count ◐ · one link. Confirmed crops only.
Illustration decorative (alt="")
Category/Segment · T-01/03/13
CONDITIONAL (vectors ◐)
Brand/campaign · news · vacancy · location cards
Brand: type badge + logo slot + scope ◐ (8e/10a). News: image/category/date/title (4f). Vacancy: title/location/department/type + status (4h). Location: relationship badge + channels (8b). All: one clear target, hover lift, focus ring.
Badges = shape + wording; dates as text
Brand/News/Job/Location · T-08/09/14/15/16/17/12/13
APPROVED
Filter chips · active filters · result count
Chip (selectable) / active chip with ✕ / Clear all / live count “{n} varieties”. Country = master chip (dark). URL-addressable state.
Count in aria-live region; ✕ labelled “Remove {filter}”
— · T-02/04/14/16/19
APPROVED
Load more · pagination
Secondary button announcing added count; focus lands on first new item; no infinite scroll.
aria-live added-count
— · T-02/14/19
APPROVED
Empty / no-results states
Dashed panel: cause + recovery (remove last filter / suggestions / Finder / contact). Never a dead end; country empty state routes to HQ fallback.
Announced via aria-live
— · T-02/12/13/19
APPROVED
Skeleton / loading
Card-shaped paper blocks (no shimmer under reduced motion); layout identical to loaded state — no shift. Text “Loading varieties…” for SR.
aria-busy on region
— · T-02/19/14
APPROVED (normalised this stage)
11fTechnical & editorial components
Component
Definition (variants · states · behaviour · limits · a11y)
CMS · reuse
Status
HR/IR resistance module
Coded chips → click/focus panel (desktop) / bottom sheet (mobile); ISF legend link; resistance ≠ immunity wording; Esc + focus return. Never prose claims.
Variety resistances · T-02/03/05/07/09
APPROVED
Trait/status legend · technical rows
● verified ◐ pending ◇ market-specific (glyph + wording); label/value rows in accordion groups (Plant/Fruit/Growing); values only at validated status.
data-status per field · T-05/09
APPROVED
Evidence/source · document-version info · download card
CMS-side evidence record (never public labels); downloads show version · date · market · owner; obsolete versions unpublished. Card: title, type, size, meta row.
Evidence record · T-05/07/09/11/21
CONDITIONAL (documents ◐)
Image gallery · market-availability warning
4 slots (fruit/plant/field/technical), dots + swipe peek + arrows ≥768px, alt per slot, ≥1 validated image to publish. Warning: pinned yellow-30 panel “availability varies by country”.
Variety gallery · T-05/09; warning T-02/05
APPROVED
Hero variants · section headings
Editorial photo hero (21:9 + wave, white card overlay) / green pattern hero / campaign split hero. Headings: eyebrow (12 caps) + Bogart title + optional intro ≤2 lines.
Hero Section · T-01/03/06/07/09/21
CONDITIONAL (photography + wave vector ◐)
Rich content · timeline · quote · statistics · video · image/caption · related content
T-21 flexible sections; timeline (year badge + card, rail hidden mobile); quote (consent-gated render); figures strip (singleton, 4-tier ladder, plain numbers final); video module (poster + captions required); captions ≤2 lines; related modules reuse cards.
Company Content Page · T-06/10/11/15/21
APPROVED (content ◐)
Badges (relationship ×6 · brand-type ×5) · legal metadata header
Shape + wording, never colour alone; types never equivalent. Legal header: owner/version/effective/updated/applicability.
Location/Brand/legal fields · T-08/09/12/13, legal
APPROVED
11gJourney 1 · Product discovery — prototype map (each step links to its approved screen)
Homepage 1a/1b→
Products mega-menu 4a→
Crop Hub 5d/5e→
Segment 7e→
Finder + filters 1c/5b→
Variety detail 1d/5c→
Resistance info 5c sheet→
Contact local team 5f/5g
Validated: country = master context carried header→Finder→detail→pre-filled enquiry ✓ · availability rendered only from market data, 4 states incl. “not listed” ✓ · back-navigation preserves filter state (URL-addressable) ✓ · bottom sheets dismissible (Close/Esc/scrim, focus return) ✓ · sticky bars hide over forms/consent ✓ · empty + zero-result states reachable from the filter path (1c/5b) ✓.
11hJourney 2 · Distributor & commercial enquiry — two distinct flows
A · FIND A DISTRIBUTOR
Global Network 8b/8c→
Region/country → Country page or HQ fallback 8d→
Contact routing 5f→
Submit → success state 11d
B · BECOME A DISTRIBUTOR
Global Network CTA 8b→
Commercial-partnership form (country pre-filled) 5f→
Success — “enquiry received”, no approval implied
Validated: the two journeys never share a CTA ✓ · unconfigured country → HQ fallback, no dead end ✓ · no personal mobiles anywhere ✓ · routing preview shows destination + fallback before submit ✓.
11iJourney 3 · Innovation & resistance
Homepage / nav→
Innovation & R&D 7b→
No Fear to Rugose 7c/7d→
Validated resistant variety 1d→
Technical document (version/date/market/owner)→
Contact / Finder CTA
Validated: resistance ≠ immunity module present on 7c/7d and the HR/IR sheet ✓ · hygiene/monitoring never replaced ✓ · variety availability stays market-scoped on every hand-off into the product funnel ✓ · obsolete documents unpublishable ✓ · educational tone, no fear visuals ✓.
11jJourney 4 · Company & careers — both application modes
Company ▾ → About Us 4d→
Company content page 9b→
Careers Hub + filters 4h→
Vacancy detail 4i→
A: internal form → consent → success (production gated) / B: external ATS → “leaving yukselseeds.com” exit state
Validated: applicationMethod drives the mode, no ATS vendor chosen ✓ · exit state carries vacancy + market context and is clearly external ✓ · applicationsClosed renders read-only with hub CTA ✓ · no candidate data public; consent + retention before submit ✓.
11kJourney 5 · News & search
Validated: grouped results with type labels ✓ · highlight via <mark> ✓ · no-results offers spelling/Finder/crops/contact ✓ · draft, archived, restricted and market-blocked content never surfaces ✓ · load-more accessible ✓.
11lFinal usability & consistency audit
Class
Finding
Resolution
P0
None found — all journeys complete, no dead ends, no contrast failures in the audited pairings, no governance leakage into public surfaces.
—
P1 — fixed
(1) Tertiary text-link style and loading-button state existed implicitly but were never specified — normalised in 11c. (2) Skeleton/loading pattern undefined for Finder/News/Search — defined in 11e (no layout shift, aria-busy). (3) “(optional)” labelling convention absent — added in 11d. (4) Journey 2 success state existed only as annotation — specimen added in 11d.
Fixed in this stage (design-level, no new direction)
P2
Hover-intent delay for mega-menu; exact sheet spring curves; 1024/768 intermediate-breakpoint fine-tuning; print styles — resolvable during implementation within the defined tokens.
Implementation phase
Content dep.
All [CONTENT TO CONFIRM] registers (figures, varieties, brands, entities, destinations, sustainability evidence, history) + photography, vectors, webfonts.
BUS / owner validation
Business
Spelling tolerance · launch country list · distributor publication policy · Leadership page.
[DECISION REQUIRED]
Legal/privacy
Legal texts per jurisdiction · consent wording · careers upload workflow · deployed-tracker list.
LEG sign-off
Scientific
Campaign science · HR/IR codes per variety · factual classification of No Fear to Rugose.
SCI (R&D) sign-off
Audit scope covered: navigation consistency (7-item bar identical across all artboards) · journey completeness (11g–11k) · mobile usability + sticky collisions (3a viewport checks) · 44px targets · keyboard order · SR naming · contrast (3a matrix) · form errors · empty/loading/error states · hierarchy · CTA consistency (one primary per region) · country/availability logic · resistance safeguards · consent governance · responsive behaviour (10b rules).
11mChange manifest — GitHub export (via Claude Code, no direct push)
Design files modified: Hi-Fi Batch 1 - Home, Finder, Variety Detail.dc.html (sections 11a–11m added; no approved artboard altered).
Assets added: none (all specimens reuse existing tokens/assets).
Documentation requiring updates: handoff/docs/component-inventory.md (11c–11f normalisations: tertiary link, loading button, skeleton, “(optional)” convention, success state) · design-tokens.md (spacing scale, radii, shadows, icon sizes, image ratios now explicit) · README (Stage 11 note).
T-IDs affected: none structurally — component normalisation touches T-02/14/16/17/18/19 states only.
Components added/normalised: 4 (tertiary link, loading state, skeleton pattern, optional-label convention) + success-state specimen.
Open decisions / content: unchanged — see 11l and docs/decisions-and-open-items.md.
Recommended commit:
Boundary respected: no implementation, no Strapi changes, no deployment, no direct push.
Assets added: none (all specimens reuse existing tokens/assets).
Documentation requiring updates: handoff/docs/component-inventory.md (11c–11f normalisations: tertiary link, loading button, skeleton, “(optional)” convention, success state) · design-tokens.md (spacing scale, radii, shadows, icon sizes, image ratios now explicit) · README (Stage 11 note).
T-IDs affected: none structurally — component normalisation touches T-02/14/16/17/18/19 states only.
Components added/normalised: 4 (tertiary link, loading state, skeleton pattern, optional-label convention) + success-state specimen.
Open decisions / content: unchanged — see 11l and docs/decisions-and-open-items.md.
Recommended commit:
design: add Stage 11 component library, prototype maps and usability audit → Gortina/Website-yuksel-seeds-2027 (ID 1153901352), branch design/stage-11-component-library. Not accessible from this workspace — commit through Claude Code after review.Boundary respected: no implementation, no Strapi changes, no deployment, no direct push.
10aT-09 · Brand / Concept / Campaign Detail (generic, content-neutral) — Desktop 1440PREVIEW TYPOGRAPHY[STRUCTURAL EXAMPLE — CONTENT TO CONFIRM]Neutral placeholders — Sweetloom is NOT the factual basis; contentType drives module visibility
Sweetloom record (separate from the template): working classification = tomato-related concept/brand; final taxonomy and market scope = [CONTENT TO CONFIRM]. Does not block T-09.
No Fear to Rugose record: working classification = campaign; final factual classification = [CONTENT TO CONFIRM]. Does not block T-09.
10bAuthoritative coverage table — single stable denominator
Denominator, fixed from now on: 21 templates × (desktop + mobile) = 42 page variants, plus 4 additional state artboards produced (mega-menu open · mobile menu open · Finder filter bottom sheet · resistance bottom sheet) = 46 deliverables. Each variant is counted ONCE: either a full artboard or a specification (specs are reuse-based by definition; “reused pattern” is the reason, not a third count). The earlier “34 / 17+9 / 14” figures mixed denominators and double-counted — they are withdrawn.
ID
Template (desktop + mobile both required for all 21)
Desktop coverage
Mobile coverage
Additional state artboards
Status
Reason where no full artboard
T-01
Homepage
Full (1a)
Full (1b)
Mega-menu open (1a)
Designed
—
T-02
Variety Finder
Full (1c)
Full (5b)
Filter bottom sheet (5b)
Designed
—
T-03
Crop Hub
Full (5d)
Full (5e)
—
Designed
—
T-04
Segment page
Spec (7e)
Spec (7e)
—
Designed
Pure composition of 5d header + 1c/5b grids — no new layout or interaction
T-05
Variety detail
Full (1d)
Full (5c)
Resistance bottom sheet (5c)
Designed
—
T-06
Innovation & R&D
Full (7b)
Spec (7b)
—
Designed
Mobile = validated single-column stack, no new pattern
T-07
Resistance campaign
Full (7c)
Full (7d)
—
Designed
—
T-08
Brands overview
Full (8e)
Spec (8e)
—
Designed
Mobile = card stack, no new pattern
T-09
Brand/Concept/Campaign detail
Full (10a)
Spec (10a)
—
Designed
Mobile reuses validated stack + swipe + sticky patterns; content facts stay [CONTENT TO CONFIRM]
T-10
Company — About Us
Full (4d)
Spec (9b)
—
Designed
Mobile = T-21 mobile rules
T-11
Sustainability
Spec (9c)
Spec (9c)
—
Designed
Instance of T-21 (9b artboard) + claim-tier module
T-12
Global Network
Full (8b)
Full (8c)
—
Designed
—
T-13
Country page
Full (8d)
Spec (8d)
—
Designed
Mobile = module stack from 1b/5e/5g
T-14
News Hub
Full (4f)
Spec (6a)
—
Designed
Mobile = card-list reuse
T-15
News Article
Full (4g)
Spec (6a)
—
Designed
Mobile = single-column article flow
T-16
Careers Hub
Full (4h)
Spec (6a)
—
Designed
Mobile = filter chips + card list reuse
T-17
Job Vacancy Detail
Full (4i)
Spec (6a)
—
Designed
Mobile = 5g form pattern
T-18
Contact & routing
Full (5f)
Full (5g)
—
Designed
—
T-19
Search results
Full (9d)
Full (9d)
—
Designed
—
T-20
404 & errors
Full (9e)
Spec (9e)
— (5 error states specified in matrix)
Designed
Mobile = single column, no new pattern
T-21
Company content page
Full (9b)
Spec (9b)
—
Designed
Mobile = module stack rules in 9b
Reconciled totals: Templates 21 · Desktop variants required 21 · Mobile variants required 21 · Additional state artboards required/produced 4/4 · Full artboards completed: 27 (19 desktop + 8 mobile) · Specification-covered variants: 15 (2 desktop: T-04, T-11 · 13 mobile) — specs ARE the reused-pattern variants, counted once · Missing deliverables: 0 of 46. All 21 templates: Designed.
10cT-19 search-highlight accessibility resolution
Token: yellow-50 (#FDF199) is a legitimate 50% tint of the official yellow (guidelines p.9), now registered as the semantic token --search-highlight rather than a raw tint reference.
Contrast: ink #1A1A1A on #FDF199 = 14.6:1 — PASS (normal text). The highlight changes background only; text colour, size and weight are unchanged, so readability inside selected (green-tinted #F1F6F3 row) and keyboard-focused (yellow ring, 3a spec) results is unaffected — measured against the highlight background, not the row.
Not colour alone: rendered as a semantic
Contrast: ink #1A1A1A on #FDF199 = 14.6:1 — PASS (normal text). The highlight changes background only; text colour, size and weight are unchanged, so readability inside selected (green-tinted #F1F6F3 row) and keyboard-focused (yellow ring, 3a spec) results is unaffected — measured against the highlight background, not the row.
Not colour alone: rendered as a semantic
<mark> element (announced by screen readers) — the match is programmatically determined, not colour-encoded.
High-contrast / forced-colors mode:
Dark mode: no dark mode exists in this design system — if one is introduced, --search-highlight gets a dark-surface value (yellow at reduced luminance with light ink) as part of that future token work; flagged in the handoff, not invented now.
Verdict: yellow-50 highlight retained under the semantic token --search-highlight; 9d artboards already comply (mark + ink text).
mark maps to the system Highlight/HighlightText pair automatically; no override that would suppress it.Dark mode: no dark mode exists in this design system — if one is introduced, --search-highlight gets a dark-surface value (yellow at reduced luminance with light ink) as part of that future token work; flagged in the handoff, not invented now.
Verdict: yellow-50 highlight retained under the semantic token --search-highlight; 9d artboards already comply (mark + ink text).
10dFinal developer handoff package — item register with approval status
Status legend: DA design approved · CA content approved · BUS requires business approval · LEG requires legal/privacy approval · SCI requires scientific/technical approval · REPO requires repository verification · IMPL requires implementation decision
Handoff item
Contents / reference
Status
Final sitemap
Launch + future sitemaps (Stage 1 board 1b) with final 7-item nav (4a)
DA
Template register T-01–T-21
5a register + 10b coverage matrix (stable IDs)
DA
Route mapping
5a table: new route ↔ existing route + redirects (/about-us, /concepts-brands/*, /nofeartorugose…)
DA · REPO
Coverage matrix
10b — 46 deliverables, 0 missing
DA
Design tokens
2a verified token table (p.9/p.10 refs) + support neutrals + --search-highlight (10c); digital tint hexes
DA · webfont licences BUS
Component inventory + variants/states
Buttons/forms/focus (1e), variety card, chips, tooltips + bottom sheets, badges (8a/8e), timeline, claim-tier, search results, error pattern, legal header — states in 3a/8f/9g ledgers
DA
Responsive rules
Breakpoints + grid→stack per 7e model; per-template mobile specs (7b/8d/8e/9b/9e/10a)
DA
Accessibility requirements
Contrast matrix (3a) + focus/keyboard/SR specs; WCAG 2.2 AA; forced-colors (10c)
DA
Interaction specifications
Mega-menu, filter sheets, tooltips/sheets, list/map toggle, load-more, swipe rows, sticky bars — per artboard annotations
DA
CMS content models
Variety, Segment, Campaign, Brand (10a), Location + Country (8a), Company Content Page (9b), consent model (5a), evidence records (7a/9c), routing rules (5f)
DA · REPO (fit to Strapi 5.35)
Strapi schema changes
5a “Required schema evolution” column per T-ID
REPO · IMPL
Content migration matrix
5a “Content migration” column; nothing migrates below content-validated status
BUS per item · REPO
Search & indexing rules
9d scope, grouping, visibility exclusions, analytics; spelling tolerance open
DA · IMPL (backend, tolerance)
Contact-routing logic
5f type × country × crop rules + fallbacks; destinations table ◐
DA · destinations BUS
Form validation & security
1e/5f patterns; consent unticked; careers secure-upload workflow (5a §3) — production submission gated
DA · LEG · IMPL
SEO requirements
Canonical rules, URL-addressable finder state (1d logic), redirects, noindex staging, SEO/social fields (9b/10a models)
DA
Asset & image manifest
1h asset register (logo pack, illustration/icon vectors, wave, fonts, brand logos, photography, certificates, PDFs) + existing repo image library (cleanup + re-mapping after marketing sign-off)
BUS · REPO
Image rights & alt-text rules
Authentic-first photography policy; consent model for portraits (5a §2); per-slot purpose/ratio/alt on every artboard
DA · LEG (consents)
Content-validation status model
4-tier ladder (7a) + ● ◐ ◇ display system (1d) + evidence records
DA
[CONTENT TO CONFIRM] register
Figures set · crop/segment lists · all variety data · brand taxonomy/scopes/logos · campaign science · stations · network entities · destinations · sustainability evidence · history/leadership · translations · legal texts
BUS / SCI / LEG per item
[DECISION REQUIRED] register
Spelling tolerance (9d) · launch country-page list · distributor publication policy per entry · Leadership page inclusion · dark-mode token track (10c)
BUS / IMPL
[VERIFY] register + developer checklist
Page Content composition · Magazine Article role · brands frontend-data split · search backend · 404 implementation · Nodemailer config · deployed trackers · Global Reach Item shape — each = a checklist item to inspect in conform-ag/yuksel-seeds-website@master before coding
REPO (all)
Acceptance criteria per template
Per T-ID: matches approved artboard/spec at both breakpoints · passes 3a contrast + focus checks · renders only publication-approved content (4-tier ladder) · availability never implied · consent rules enforced · error/empty states per 9e · no personal mobiles · routes + redirects live
DA · sign-off per template at implementation review
10eFinal review panel — design-phase closure
Design phase closed — pending this review
All 21 templates designed: 27 full artboards + 15 specification-covered variants + 4 state artboards = 46 of 46 deliverables (10b). T-09 completed as a generic, content-type-driven detail template (10a) — Sweetloom and No Fear to Rugose recorded separately with [CONTENT TO CONFIRM] classifications. Search highlight resolved as semantic token --search-highlight (10c). Handoff package with per-item approval status: 10d.
Boundary: the project is not implementation-ready until a developer inspects conform-ag/yuksel-seeds-website@master at file level (all REPO items in 10d). No repository was created, modified, branched or committed; no implementation begun.
Blocking content owners: business (figures, taxonomy, entities, destinations) · scientific (campaign, resistances) · legal (texts, consents, trackers) — every gap carries [CONTENT TO CONFIRM] in the registers.
Blocking content owners: business (figures, taxonomy, entities, destinations) · scientific (campaign, resistances) · legal (texts, consents, trackers) — every gap carries [CONTENT TO CONFIRM] in the registers.
9a
Batch 6 — Company & Utility · pre-draw brief
Company = nav parent for About · History · Mission/Vision/Values · Sustainability · Careers · Leadership ◐. Breeding stays under Innovation; geography stays under Global Network.
Template
Route (proposed)
Existing route / data source
Design status
Desktop / Mobile
Reused layout
New components / behaviours
CMS changes
Content deps · [CONTENT TO CONFIRM] / [DECISION REQUIRED] / [VERIFY]
Dev verify
T-21 · Company content page (shared)
/company/{page}
— none; /about-us hardcoded content is the inventory reference
Not designed → this batch
Desktop artboard → 9b · mobile by spec (module stack, no new pattern)
4d editorial pattern, figures strip (7b ladder), quote module (consent rules 5a)
NEW: timeline module · flexible section stack
Company Content Page model (fields below)
History, dates, values, leadership all [CONTENT TO CONFIRM] — nothing invented
YES
T-10 · About Us landing
/company/about-us
/about-us — Page Content + hardcoded figures
Partially designed (4d)
Desktop done (4d) · mobile by spec (9b rules)
4d + T-21 model
—
Instance of T-21 model
Figures via 4-tier ladder; [VERIFY] Page Content composition
YES
T-11 · Sustainability
/company/sustainability
/sustainability — Sustainability Page collection
Not designed → spec this batch
Spec on T-21 → 9c (both breakpoints)
T-21 model + claim-tier module
NEW: claim-classification module (5 tiers)
Evidence fields per quantified claim
All targets/results [CONTENT TO CONFIRM]; certifications need proof docs
Recommended
T-16/17 · Careers connection
/company/careers
/careers — Job Position
Designed (4h/4i)
No new artboards
Approved Careers templates + vacancy model reused as-is
— (no duplicate listing or application flow)
—
Company pages link only
—
T-19 · Search results
/search
/search — [VERIFY implementation]
Not designed → this batch
Desktop + mobile artboards → 9d (new search interactions ⇒ full mobile)
Variety card, list rows, chips
NEW: grouped results, type labels, query highlight, load-more
Search index scope + visibility rules
[DECISION REQUIRED]: spelling tolerance; [VERIFY] search backend
YES
T-20 · 404 & error states
404 + error surfaces
default 404 [VERIFY custom]
Not designed → this batch
404 desktop artboard + state matrix → 9e; mobile by spec (single column, no new pattern)
Hero panel, search field, crop links
NEW: error-state pattern (5 states)
—
No stack traces / internal IDs / endpoints ever exposed
Recommended
Legal set
/terms · /privacy-policy · /cookie-policy · /general-conditions-of-sales
same routes (confirmed)
Spec this batch
Spec → 9f (reusable legal layout, both breakpoints)
T-21 typography + doc layout
NEW: legal metadata header
owner · version · effective date · last update · language/country applicability
Legal text never rewritten; all content marked for legal review; cookie controls reflect actually deployed technologies [VERIFY]
YES
9bT-21 · Company Content Page (shared model) — Desktop 1440 · shown as “Our History” instancePREVIEW TYPOGRAPHY[STRUCTURAL EXAMPLE — CONTENT TO CONFIRM]
Company Content Page model (CMS): editorialHero (image, focal point, alt) · introduction · sections[] (richText | textImage | fullBleed | video) · timeline[] · figuresRefs (singleton) · quotes[] (consent-gated) · relatedPages[] · downloads[] (version/date/market/owner) · CTAs[] · seoTitle/description + socialImage · languageRelations · contentOwner · reviewStatus/approvalStatus · publishDate/expiryDate. Mobile (spec-covered): hero 16:9 recrop → intro → timeline (badges above cards, rail hidden) → figures 2×2 → sections stacked → quote → related/downloads/CTA; no new patterns; targets ≥44px, body 16px.
9cT-11 · Sustainability — specification on the T-21 model (no separate artboard)
Claim classification — five separated tiers
1 · Policy / ambition — direction statements; labelled as ambition, never as performance.
2 · Current initiative — running programme; described factually, no outcome claims.
3 · Quantified target — future number with baseline + deadline; evidence record required.
4 · Verified result — achieved, measured, owner-verified; the only tier rendered as achievement.
5 · Certification / external assurance — with certificate document, scope and validity ◐.
Tier is a CMS field driving distinct visual treatment (wording + module style, not colour alone); generic sustainability language is never presented as verified performance.
Quantified-claim evidence record + page composition
Every quantified claim stores: baseline · measurement period · unit · scope · method · source owner · last verification date — below content-validated, it renders as ◐ [CONTENT TO CONFIRM].Composition (T-21 instances): editorial hero → commitments intro ◐ → tier-classified claim modules → initiatives sections → certifications row (proof PDFs ◐, per-document version/date/owner) → related pages (About, Innovation) → contact CTA. Mobile per the T-21 mobile spec. No new interaction patterns; “claim-tier module” is the single new component.
Error-state matrix (all: plain explanation · recovery action · homepage link · search/nav where functional · contact fallback where appropriate · no stack traces, internal IDs, CMS endpoints or infrastructure details)
Application error — “Something went wrong on our side.” Retry + homepage + contact; search shown if functional.
Content unavailable (CMS) — page shell renders, module shows “This content is temporarily unavailable” + related links; rest of page unaffected.
Search unavailable — search field disabled with notice; crop links + sitemap-style nav offered instead.
Form-submission failure — entered data preserved, inline error above submit (“Your message wasn’t sent — try again or email {office inbox ◐}”), focus moved to the message.
Offline / interrupted — non-blocking banner “Connection lost — retrying”; forms never silently lose input.
Mobile by spec: single column, same order, targets ≥44px — no new patterns.
9fLegal set — reusable legal-page layout (specification)
Layout (one reusable template, separate routes preserved)
Breadcrumb → document title (Bogart 34) → metadata header: owner · version · effective date · last updated · language/country applicability → in-page table of contents (sticky on desktop, accordion on mobile — standard patterns, no new interaction) → numbered legal sections (Sofia Pro Soft 16/1.7, max 760px measure) → related legal links. Routes: /terms · /privacy-policy · /cookie-policy · /general-conditions-of-sales.
Breadcrumb → document title (Bogart 34) → metadata header: owner · version · effective date · last updated · language/country applicability → in-page table of contents (sticky on desktop, accordion on mobile — standard patterns, no new interaction) → numbered legal sections (Sofia Pro Soft 16/1.7, max 760px measure) → related legal links. Routes: /terms · /privacy-policy · /cookie-policy · /general-conditions-of-sales.
Rules
Legal text migrated verbatim, never rewritten or summarised; every page carries an internal “pending legal review per jurisdiction” flag until counsel signs off (not a public label). Cookie Policy pairs with a consent manager whose toggles list only technologies actually deployed — [VERIFY deployed trackers before listing]; no placeholder trackers. Consent rules come from legal, not design. Mobile by spec (single column).
Legal text migrated verbatim, never rewritten or summarised; every page carries an internal “pending legal review per jurisdiction” flag until counsel signs off (not a public label). Cookie Policy pairs with a consent manager whose toggles list only technologies actually deployed — [VERIFY deployed trackers before listing]; no placeholder trackers. Consent rules come from legal, not design. Mobile by spec (single column).
9gFinal design-completion review — T-01–T-21
ID
Template
Status
Desktop
Mobile
Handoff-ready*
Outstanding
T-01
Homepage
Designed
✓ 1a
✓ 1b
Yes*
Figures, crop list, hero photo ◐
T-02
Variety Finder
Designed
✓ 1c
✓ 5b
Yes*
Variety model + availability data ◐
T-03
Crop Hub
Designed
✓ 5d
✓ 5e
Yes*
Segments ◐; illustration vectors
T-04
Segment page
Designed (spec)
spec 7e
spec 7e
Yes*
Segment entity ◐
T-05
Variety detail
Designed
✓ 1d
✓ 5c
Yes*
All Tobrossa values ◐; photo gallery assets
T-06
Innovation & R&D
Designed
✓ 7b
spec (7b)
Yes*
Narrative, stations ◐
T-07
Resistance campaign
Designed
✓ 7c
✓ 7d
Yes*
Campaign science, variety list ◐; classification ◐
T-08
Brands overview
Designed
✓ 8e
spec (8e)
Partial
Brand taxonomy + types/scopes/logos ◐
T-09
Brand page
Not designed — BLOCKED
—
—
No
Brand scopes [CONTENT TO CONFIRM] (7f)
T-10
Company — About Us
Designed
✓ 4d
spec (9b)
Yes*
Figures, story ◐
T-11
Sustainability
Designed (spec)
spec 9c
spec 9c
Partial
All claims need evidence records ◐
T-12
Global Network
Designed
✓ 8b
✓ 8c
Yes*
Entity list per type, coordinates ◐
T-13
Country page
Designed
✓ 8d
spec (8d)
Yes*
Per-country entities ◐; launch list [DECISION]
T-14
News Hub
Designed
✓ 4f
spec
Yes*
≥3 items before launch (decision 10)
T-15
News Article
Designed
✓ 4g
spec
Yes*
Quote/portrait consent per item
T-16
Careers Hub
Designed
✓ 4h
spec
Yes*
Real vacancies only
T-17
Job Vacancy Detail
Designed
✓ 4i
spec
Partial
Privacy/security workflow before internal-form production submission
T-18
Contact & routing
Designed
✓ 5f
✓ 5g
Yes*
Routing destinations ◐; [VERIFY] Nodemailer
T-19
Search results
Designed
✓ 9d
✓ 9d
Partial
[DECISION] spelling tolerance; [VERIFY] search backend
T-20
404 & errors
Designed
✓ 9e
spec (9e)
Yes*
—
T-21
Company content page
Designed
✓ 9b
spec (9b)
Yes*
History/values/leadership content ◐
*“Handoff-ready” = design approved and specified — never implementation-ready: every template retains its file-level [VERIFY] items (5a “Dev verify before coding” column), and no repository verification has been performed from this workspace.
Component ledger
Reused this batch: editorial hero + wave, figures strip (4-tier ladder), quote module (consent-gated), card lists, chips, search field, sticky patterns, form patterns.New this batch (flagged for approval): timeline module (9b) · claim-tier module (9c) · grouped search results with type labels + query highlight + load-more (9d) · error-state pattern (9e) · legal metadata header (9f).
Remaining content decisions: brand taxonomy/scopes (T-09) · spelling tolerance (T-19) · launch country-page list · distributor publication policy · Leadership page inclusion ◐ · all [CONTENT TO CONFIRM] registers.
Remaining [VERIFY]: Page Content composition · Magazine Article role · brands frontend-data split · search backend · 404 implementation · Nodemailer config · deployed cookie/tracker list · Global Reach Item field shape.
8a
Batch 5 — Network & Brands · pre-draw brief
Smallest batch per 6a: T-12 desktop + mobile · T-13 desktop · T-08 desktop — T-09 stays blocked (7f)
Template
Route
Existing route / data
Full artboards
By spec
Reused components
New patterns / CMS
Open questions
T-12 · Global Network
/global-network
/yuksel-global — Global Reach Item + Global Partner + Regional Manager (schema verified; values = content present, not validated)
—
Header/footer, chip filters (5b), card list (5b), empty-state wording (3a), CTA band (1a)
NEW: map + list toggle, relationship-type badges. CMS: Location collection (fields per requirements) extending Global Reach Item; publicationConsent
[CONTENT TO CONFIRM]: full entity list per type, coordinates, crops/languages per location. [VERIFY]: Global Reach Item field shape
T-13 · Country page
/global-network/{country}
— none (new)
Desktop → 8d
Mobile — spec under 8d (pure module stack, no new pattern)
Contact card (5f), crop grid (1a), variety cards (1c), routed-form hand-off (5f/5g), sticky bar (1b)
CMS: Country entity relating Locations + availability + routing rule
[CONTENT TO CONFIRM]: per-country entity, crops, contact channel. [DECISION]: which countries get pages at launch
T-08 · Brands overview
/brands
/concepts-brands — partly local frontend data [VERIFY split]
Desktop → 8e
Mobile — spec under 8e (card stack)
Card grid (1a brands strip), type badges (new, shared with T-12)
CMS: Brand collection (approved architecture 7f) + brandType field
[CONTENT TO CONFIRM]: official brand taxonomy, per-brand type/scope/logo. T-09 layout stays blocked
Location record (CMS — per entry)
displayName · relationshipType (subsidiary | office | researchStation ◐ | distributor/partner | areaManagerTerritory | availableNoOffice) · country · city/serviceArea · address (only when publication-approved) · coordinates · crops/services · languages · publicContactChannel (office phone / shared inbox — no personal mobiles by default) · relatedTerritories · status · contentOwner · verificationDate. Relationship types are never presented as equivalent — each carries a distinct badge + wording.
displayName · relationshipType (subsidiary | office | researchStation ◐ | distributor/partner | areaManagerTerritory | availableNoOffice) · country · city/serviceArea · address (only when publication-approved) · coordinates · crops/services · languages · publicContactChannel (office phone / shared inbox — no personal mobiles by default) · relatedTerritories · status · contentOwner · verificationDate. Relationship types are never presented as equivalent — each carries a distinct badge + wording.
Brand record (CMS — per entry)
brandType (corporateInitiative | commercialBrand | varietyConcept | campaign | technologyPlatform) · cropScope · marketScope · relatedVarieties · relatedArticles · relatedCampaignPages · logo + usageStatus · start/end dates · languageAvailability · contentOwner · approvalStatus. The taxonomy itself is [CONTENT TO CONFIRM] — the hub uses labelled placeholders, no invented hierarchy.
brandType (corporateInitiative | commercialBrand | varietyConcept | campaign | technologyPlatform) · cropScope · marketScope · relatedVarieties · relatedArticles · relatedCampaignPages · logo + usageStatus · start/end dates · languageAvailability · contentOwner · approvalStatus. The taxonomy itself is [CONTENT TO CONFIRM] — the hub uses labelled placeholders, no invented hierarchy.
8bT-12 · Global Network — Desktop 1440PREVIEW TYPOGRAPHYAll entities ◐ [CONTENT TO CONFIRM] · examples illustrate the six relationship types, not confirmed facts
8cT-12 · Global Network — Mobile 390PREVIEW TYPOGRAPHYList-first (map optional) — full artboard: new search + type-badge pattern
List is the primary mobile experience; the map is an opt-in view (accessible list always available). Search 16px input; region chips scroll with peek; type badges identical to desktop; empty state and HQ fallback inline in the list; sticky bar carries the commercial CTA only.
8dT-13 · Country page (Spain example) — Desktop 1440PREVIEW TYPOGRAPHY[STRUCTURAL EXAMPLE — CONTENT TO CONFIRM]design annotation only, never public — no entity name, address, office type, territory, crop responsibility or contact here is validated
T-13 mobile (spec-covered): stack — title + badge → local-contact card (full-width, CTA 44px+) → crops grid 3-across → Finder hand-off → “also serving” list → fallback per above; sticky bar: “Contact the Spain team”; no new patterns (all from 1b/5e/5g).
8eT-08 · Brands overview — Desktop 1440PREVIEW TYPOGRAPHYOfficial taxonomy unresolved — types shown as ◐ placeholders, no invented hierarchy
T-08 mobile (spec-covered): intro → type-legend chips (wrap) → brand cards stacked full-width → campaign band; no new patterns.
8fBatch 5 review panel
Produced
Artboards (4): 8b T-12 Global Network desktop · 8c T-12 mobile · 8d T-13 Country page desktop · 8e T-08 Brands overview desktop.Specs (3): T-13 mobile (under 8d) · T-08 mobile (under 8e) · Location + Brand CMS records (8a).
Reused: header/footer, chip filters, card lists, empty-state wording, CTA bands, sticky bar, crop grid, routed-form hand-off.
New components (3, flagged for approval): relationship-type badge set (6 types, shape+wording) · list/map toggle with accessible list default · brand-type badge set (5 types).
Risks, checks & dependencies
Content-validation risks: every entity, coordinate, crop list, channel and brand attribute is at best “content present” — nothing renders publicly below content-validated + publication-approved; Sweetloom scope stays [CONTENT TO CONFIRM]; distributor listings need per-entry consent.Accessibility: list = accessible map alternative and mobile default; badges = shape + wording, never colour alone; map controls keyboard-operable, 44px; search inputs 16px; empty states never dead-end (HQ/regional fallback).
CMS: Location collection (8a fields, extends Global Reach Item [VERIFY shape]) · Country entity · Brand collection with brandType + approved configurable scope (7f).
Remaining decisions: brand taxonomy + per-brand type/scope (blocks T-09) · launch country-page list · distributor publication policy per entry · station list for the map ◐.
Completion count (after Batch 5)
Designed: 13 (T-01–03, 05–07, 08, 12, 13, 18 + T-04 by spec; T-08/13 mobile by spec)Partially designed: 5 (T-10, 14, 15, 16, 17 — mobile by spec pending sign-off)
Not designed: 3 (T-09 blocked · T-11 · T-19/20/21)
Full artboards: 22 of 34
Variants by specification only: 11
Batch 5 APPROVED after annotation corrections: Spain structural-example labelling, Find-a-distributor / Become-a-distributor split, campaign classification ◐. Batch 6 Company & Utility → 9a–9g.
7a
Batch 4 — pre-draw brief · T-06 · T-07 · T-04 · T-09 decision card
5a stays pending developer verification; all [VERIFY] flags preserved; no repository operations
Template
Route
Desktop artboard
Mobile artboard
Reused approved layout / components
CMS / data dependency
Open items
T-06 · Innovation & R&D
/innovation
Required → 7b
Spec-covered (no new pattern; single-column story reuses 5e stacking)
Header/footer, wave, photo-band + text split (1a R&D block), stat strip (1a), campaign band
Page Content [VERIFY composition]; company-figures singleton — schema verified only; values need content validation + publication approval; new Campaign relation
[CONTENT TO CONFIRM]: R&D narrative, stations count/locations, methods, lab capabilities, photography
T-07 · Resistance campaign (ToBRFV)
/innovation/no-fear-to-rugose
Required → 7c
Required → 7d (materially different hierarchy: threat-first education + sticky variety CTA)
Variety card (1c/5b), HR/IR chips + tooltip/bottom sheet (1d/5c), legend module, sticky bar (1b)
Campaign type (new) + Product Variety relations; redirect from /nofeartorugose
[CONTENT TO CONFIRM]: campaign science (R&D-validated), resistant variety list + codes, downloads. [VERIFY]: current /nofeartorugose content entry
T-04 · Segment page
/crops/{crop}/{segment}
Spec only → 7e (reuses Crop Hub header + Finder grid)
Spec only → 7e (reuses 5b list + sticky bar)
Crop Hub hero (5d/5e), variety card grid (1c), filter chips (5b)
Segment entity (new, per 5a) with Variety relations
[CONTENT TO CONFIRM]: segment list per crop, definitions, counts
T-09 · Brand page
/brands/{brand}
BLOCKED
BLOCKED
—
Brand collection (new)
Architecture closed (configurable scope); Sweetloom scope = [CONTENT TO CONFIRM] — card → 7f
Content-validation terminology (applies to 7a–7g and all later batches)
Schema verified — the field/collection is known to exist · Content present — a value exists in the CMS/repository · Content validated — reviewed and approved by an identified Yüksel content owner · Publication approved — authorised for the language, country and public channel. A CMS record is never “validated content” by existence alone; anything below “content validated” renders as [CONTENT TO CONFIRM].
Schema verified — the field/collection is known to exist · Content present — a value exists in the CMS/repository · Content validated — reviewed and approved by an identified Yüksel content owner · Publication approved — authorised for the language, country and public channel. A CMS record is never “validated content” by existence alone; anything below “content validated” renders as [CONTENT TO CONFIRM].
Evidence record — required for every scientific figure, resistance statement, programme claim, variety recommendation and download
content source · source owner · last-reviewed date · applicable crop · applicable variety · applicable country/market · language · validation status · publication status · expiry/next-review date. Stored in the CMS, never shown as public labels.
content source · source owner · last-reviewed date · applicable crop · applicable variety · applicable country/market · language · validation status · publication status · expiry/next-review date. Stored in the CMS, never shown as public labels.
T-07 safeguards (design annotation + CMS rules, not public labels)
Resistance ≠ immunity, stated explicitly · HR/IR wording locked to the approved coding standard · resistance never presented as replacing hygiene, monitoring or crop management · availability and commercial claims market-specific · document version/date/market/owner on every download; obsolete documents unpublished · no medical or fear-based visual language — educational, agronomically credible tone.
Resistance ≠ immunity, stated explicitly · HR/IR wording locked to the approved coding standard · resistance never presented as replacing hygiene, monitoring or crop management · availability and commercial claims market-specific · document version/date/market/owner on every download; obsolete documents unpublished · no medical or fear-based visual language — educational, agronomically credible tone.
7bT-06 · Innovation & R&D — Desktop 1440PREVIEW TYPOGRAPHYAll narrative, figures and locations [CONTENT TO CONFIRM] · authentic Yüksel photography only
T-06 mobile (spec-covered, no new pattern): single-column stack in this order — hero (16:9 crop of the 21:9 image, focal point left) → stat strip 2×2 → method story → station cards as vertical list → campaign CTA band; standard header/menu (1b), no sticky bar (no conversion action on this page), all patterns previously approved.
7cT-07 · Resistance campaign “No Fear to Rugose” — Desktop 1440PREVIEW TYPOGRAPHYAll science and variety data [CONTENT TO CONFIRM] — published only after R&D validation
7dT-07 · No Fear to Rugose — Mobile 390PREVIEW TYPOGRAPHYFull artboard — education-first hierarchy + sticky variety CTA differ from desktop
Why a full artboard: mobile hierarchy is education-first (accordion sections 1–3 before varieties), varieties become a swipe row with peek + “All →” cue, and the sticky bar carries campaign-specific actions — three deviations from the desktop composition. HR/IR explanations open the 5c bottom sheet.
7eT-04 · Segment page — responsive specification sheet (no full artboard)
Composition (approved modules only)
Desktop 1440: Crop Hub header + breadcrumb (5d) → segment title + validated definition ◐ → sibling-segment chip row (5d) → Finder card grid 3-col (1c) with segment pre-filtered → availability note band (1c) → “Open Variety Finder — {crop}/{segment}” CTA (5d). No new components.Mobile 390: 5e hero (compact, illustration) → definition ◐ → sibling chips (horizontal scroll, peek) → 5b stacked card list → sticky bar: “Find {segment} varieties” + “Country ▾” (validated in 5b).
Content order (identical desktop/mobile): identity → definition → siblings → varieties → CTA. Nothing hidden or shortened on mobile; sibling chips reordered above the list (desktop: right of title).
Breakpoints: ≥1200 grid 3-col · 768–1199 2-col · <768 stacked list. Grid→stack via the 1c→5b card transformation (photo left, 96px, 4:3 crop of the 16:9 card image, focal point on fruit).
Behaviour & accessibility spec
Header/nav: standard 7-item header; mobile menu per 3a states. Typography scale: H1 40→28, intro 16→15, cards per 1c/5b tokens; body never <16px, secondary never <14px. Images: card photos 16:9 (desktop) / 4:3 (mobile list), official photography only, alt “{Variety} — {crop} {segment} fruit” ◐. Gallery: none on this template. Filters: segment fixed; further refinement hands off to Finder (5b sheet on mobile) — no on-page filter drawer. Sticky actions: 5b bar; hides while footer in view. Forms: none (contact via variety pages). Errors/validation: n/a. Footer: desktop 4-col → mobile stacked accordion (per 1b). Touch targets: ≥44px; chips 44px tall. Keyboard: chips and cards tabbable in DOM order; skip link; card = single link wrapping title. Screen reader: result count announced (“{n} {segment} varieties”); chip row labelled “Other {crop} segments”. States: empty segment → “No varieties published yet in {segment} — see all {crop} varieties” (never dead end); loading → card skeletons; error → retry message + Finder link; no-results-for-country → state 4 wording (3a). Data: Segment entity ◐ [VERIFY schema after creation]; definitions and counts [CONTENT TO CONFIRM].
7fT-09 · Brand page — blocked · decision card
The unresolved question
What exactly is a “brand” at Yüksel — and what does each of Cassarosa, Sweetloom, Princessa and Cu&Go cover? Current working information identifies Sweetloom as a tomato concept/brand; the prototype’s pepper attribution is treated as an unverified inconsistency, not a confirmed ambiguity — the crop scope stays [CONTENT TO CONFIRM] until checked against an authorised product/brand source, and Sweetloom is never assigned to pepper without verified evidence. Princessa and Cu&Go scopes were never stated. Per brand, to confirm: covered crop(s) · member varieties · promise/positioning · target market(s) · logo asset.
Dependent decisions
Design: T-09 page structure (single-crop showcase vs multi-crop family), T-08 card copy, brand chips on variety cards/finder filter. CMS: Brand collection shape (crop relation single vs many), variety↔brand relation, migration of /concepts-brands content.
Scope options
A · Crop-bound concept — each brand belongs to one crop; page = segment-style showcase.B · Cross-crop family — a brand spans crops; page groups member varieties by crop.
C · Mixed — declared per brand in the CMS (scope field: singleCrop | multiCrop).
Approved architecture: C — configurable per-brand scope. brandScope supports: crop(s) · product categories · countries/regions · related varieties · campaign status · start/end dates · language availability. The architecture decision is closed; Sweetloom’s factual scope remains a content-validation question — CMS structure and factual classification are separate tracks.
Can continue without resolution
T-08 Brands overview (cards with name + logo slot + “scope ◐”), brand filter in Finder (values ◐), Brand collection stub with scope field, all other templates. Only T-09's full layout and real member lists wait.
7gBatch 4 review panel
Produced
Artboards (3): 7b T-06 Innovation & R&D desktop · 7c T-07 No Fear to Rugose desktop · 7d T-07 mobile (full artboard justified: new hierarchy + campaign sticky bar).Specification sheets (2): 7e T-04 Segment page (desktop + mobile) · T-06 mobile spec (under 7b).
Decision card (1): 7f T-09 Brand page — blocked, options A/B/C, recommendation C.
Components reused: header/footer, wave, variety card + chips, HR/IR tooltip (desktop) / bottom sheet (mobile), legend + disclaimer module, stat strip, sticky bar, swipe row with peek, accordion.
New components (2): numbered education cards (T-07 sections 1–3) · station card/map module (T-06, entities ◐) — both flagged for approval.
Checks & risks
Accessibility: all text on green uses white/#FBE232/#D6E7DF (≥5.5:1); pending-amber #7A5D00 on light; body ≥16px, secondary ≥14px; targets ≥44px; accordions and swipe rows keyboard-operable; alt text specified on every image slot; status = glyph + wording, never colour alone.Responsive risks: T-06 station map needs a list fallback on mobile (spec'd as cards); T-07 swipe row relies on peek cue — validated pattern but monitor in testing; 21:9 hero recrop to 16:9 needs focal-point control in CMS.
CMS dependencies: Campaign type (new) · Segment entity (new) · Brand collection stub with scope field · figures singleton · [VERIFY]: /nofeartorugose content entry, Page Content composition.
Content to confirm: R&D narrative, station list, all campaign science, resistant-variety list + codes, downloads, segment definitions, brand scopes/logos.
Blocking later templates: brand scope (T-09) · subsidiary list (T-13) · figures set (T-01/06/10).
Design-completion count (after Batch 4)
Designed: 10 (T-01, 02, 03, 05, 06, 07, 18 + T-04 spec-complete; T-06 mobile by spec; T-07 both artboards)Partially designed: 5 (T-10, 14, 15, 16, 17 — desktop done, mobile by spec pending sign-off)
Not designed: 6 (T-08, 09 blocked, 11, 12, 13, 19/20/21)
Full artboards completed: 18 of 34
Responsive variants by specification only: 8 (T-04 ×2, T-06 mobile, T-10/14/15/16/17 mobile)
Batch 4 APPROVED after governance corrections: content-validation terminology (4-tier status ladder), T-07 scientific/regulatory safeguards, T-09 Sweetloom correction. Batch 5 Network & Brands → 8a–8f.
6a
Design-completion inventory — T-01–T-21 · status · remaining batches
Page templates counted separately from responsive artboards · no implementation started
Template status — 21 templates · 34 possible artboards (desktop + mobile), 15 produced
ID
Template
Status
Desktop artboard
Mobile artboard
Notes / reuse basis
T-01
Homepage
Designed
✓ 1a
✓ 1b
Approved with corrections applied
T-02
Variety Finder
Designed
✓ 1c
✓ 5b
Incl. filter bottom sheet + 4 availability states
T-03
Crop Hub
Designed
✓ 5d
✓ 5e
—
T-04
Segment page
Not designed
—
—
REUSE: Finder result layout (1c/5b) + Crop Hub header — spec sheet, no full artboard needed
T-05
Variety detail
Designed
✓ 1d
✓ 5c
Incl. resistance bottom sheet, gallery slots, routed enquiry
T-06
Innovation & R&D
Not designed
—
—
New layout needed (story + stations map)
T-07
Resistance campaign (ToBRFV)
Not designed
—
—
New layout; variety cards + legend module reused from 1c/1d
T-08
Brands overview
Not designed
—
—
Homepage brands strip (1a) is the seed
T-09
Brand page
Not designed
—
—
Blocked on brand scopes [CONTENT TO CONFIRM]; member-variety row reuses card
T-10
Company — About Us landing
Partially designed
✓ 4d
—
Desktop approved; mobile = pattern reuse (5e-style stacking), spec only
T-11
Sustainability
Not designed
—
—
REUSE: T-21 shared company template + evidence-data module — spec, no full artboard
T-12
Global Network
Not designed
—
—
Wireframed in Stage 1; map + country list layout needed
T-13
Country page
Not designed
—
—
Composes existing modules (contact card, availability, crops)
T-14
News Hub
Partially designed
✓ 4f
—
Desktop approved; mobile = card-list reuse, spec only
T-15
News Article Detail
Partially designed
✓ 4g
—
Desktop approved; mobile = single-column article flow, spec only
T-16
Careers Hub
Partially designed
✓ 4h
—
Desktop approved; mobile = filter chips + card list reuse
T-17
Job Vacancy Detail
Partially designed
✓ 4i
—
Desktop approved (both application modes); mobile = 5g form pattern reuse
T-18
Contact & enquiry routing
Designed
✓ 5f
✓ 5g
7 request types, routing preview, fallback
T-19
Search results
Not designed
—
—
REUSE: Finder card grid + grouped sections — spec, no full artboard
T-20
Branded 404
Not designed
—
—
REUSE: hero panel + search + crop links — spec, no full artboard
T-21
Company content page (shared)
Not designed
—
—
One layout serves History / Values / Leadership ◐
Smallest remaining design batches (proposed)
BATCH 4 — nextProduct funnel completion + campaign
T-06 Innovation desktop · T-07 ToBRFV campaign desktop + mobile · T-04 Segment spec sheet (reuse-based, no full artboard). 3 artboards + 1 spec.
T-06 Innovation desktop · T-07 ToBRFV campaign desktop + mobile · T-04 Segment spec sheet (reuse-based, no full artboard). 3 artboards + 1 spec.
BATCH 5 — Network & brands
T-12 Global Network desktop + mobile · T-13 Country page desktop · T-08 Brands overview desktop (T-09 stays blocked on scope confirmation). 4 artboards.
T-12 Global Network desktop + mobile · T-13 Country page desktop · T-08 Brands overview desktop (T-09 stays blocked on scope confirmation). 4 artboards.
BATCH 6 — Company & utility
T-21 shared company template desktop · T-11 Sustainability spec on T-21 · T-19 Search + T-20 404 specs · mobile specs for T-10/14/15/16/17. 1 artboard + 6 specs.
T-21 shared company template desktop · T-11 Sustainability spec on T-21 · T-19 Search + T-20 404 specs · mobile specs for T-10/14/15/16/17. 1 artboard + 6 specs.
BATCH 7 — closure
T-09 Brand page (once scopes confirmed) · any spec promoted to full artboard where review finds reuse insufficient.
T-09 Brand page (once scopes confirmed) · any spec promoted to full artboard where review finds reuse insufficient.
Reuse without a full artboard
Spec-sheet treatment (annotated composition of approved modules, no new layout): T-04 Segment page · T-11 Sustainability · T-19 Search · T-20 404 · all remaining mobile variants of approved desktop templates (T-10, 14, 15, 16, 17) — the mobile system (stacked cards, chip rows, sticky bar, bottom sheets, 5g form pattern) is fully established by 1b/5b/5c/5e/5g.Full artboards still required: T-06, T-07 (new storytelling layouts) · T-12 (map interaction) · T-13 (new composition) · T-08 (brand grid) · T-21 (shared company layout) · T-09 (blocked).
Status: stopped after this inventory. No implementation; Batch 4 starts only on your approval.
5a
Governance — template reconciliation · consent rules · application methods · repository mapping
1 · Template count reconciliation — 18 → 21, nothing removed or silently merged
The “20” previously stated was correct arithmetic but poor accounting: News Hub and Careers Hub are renames/upgrades of existing templates (News & Events, Careers), not additions — so only News Article and Job Vacancy Detail were net-new (18 + 2 = 20). This register also declares one further shared template for the Company content pages, giving a final count of 21. Stable IDs assigned below.
Original (18)
Final register (21) — stable ID
Change
1 Homepage
T-01 Homepage
Unchanged
2 Variety Finder
T-02 Variety Finder
Unchanged
3 Crop Hub
T-03 Crop Hub
Unchanged
4 Segment page
T-04 Segment page
Unchanged
5 Variety detail
T-05 Variety detail
Unchanged
6 Innovation & R&D
T-06 Innovation & R&D
Unchanged
7 Resistance campaign
T-07 Resistance campaign
Unchanged
8 Brands overview
T-08 Brands overview
Unchanged
9 Individual brand page
T-09 Brand page
Unchanged
10 About Yüksel Seeds
T-10 Company — About Us landing
Renamed (module landing)
11 Sustainability
T-11 Sustainability (in Company)
Unchanged (re-homed)
12 Global Network
T-12 Global Network
Unchanged
13 Country / local-contact page
T-13 Country page
Unchanged
14 News & Events
T-14 News Hub
Renamed + upgraded (7 configurable categories)
—
T-15 News Article Detail
ADDED
15 Careers
T-16 Careers Hub
Renamed + upgraded (EVP, filters, status lifecycle)
—
T-17 Job Vacancy Detail
ADDED
16 Contact
T-18 Contact & enquiry routing
Unchanged
17 Search results
T-19 Search results
Unchanged
18 Branded 404
T-20 Branded 404
Unchanged
—
T-21 Company content page (shared: Our History · Mission, Vision & Values · Leadership ◐)
ADDED — one declared shared template, not a merge
2 · Consent & editorial approval — CMS publishing rule
Applies to employee stories, testimonials, pull quotes attributed to identifiable people, portrait photography and video interviews. CMS consent model (per content item):
consentStatus (none / requested / granted / withdrawn)
consentDate · consentScope (channels, territories, duration)
contentOwner · rightsExpiryDate (optional)
consentDocumentRef (file or register reference)
Publishing rule: an item without consentStatus = granted (and unexpired) cannot be published — enforced in the CMS workflow. Nothing of this is visible to the public: no consent badges, no “pending” labels, no governance metadata in the rendered page. Ordinary editorial quotations (non-employee) follow context-appropriate source and rights verification by the content owner. Artboard annotations updated accordingly (4f, 4g, 4h).
consentDate · consentScope (channels, territories, duration)
contentOwner · rightsExpiryDate (optional)
consentDocumentRef (file or register reference)
3 · Careers application — both modes designed, none locked in
CMS field per vacancy: applicationMethod = internalForm · externalATS · externalURL · applicationsClosed.
A · Internal form
Secure upload (encrypted at rest/in transit) · role-based access control · defined retention + deletion schedule · GDPR/KVKK consent before submission · candidate data never public · CV never via plain email as the production channel · production submission disabled until the privacy & security workflow is approved.
Secure upload (encrypted at rest/in transit) · role-based access control · defined retention + deletion schedule · GDPR/KVKK consent before submission · candidate data never public · CV never via plain email as the production channel · production submission disabled until the privacy & security workflow is approved.
B · External ATS / approved URL
Visible “You are leaving yukselseeds.com” notice · vacancy ID + market context preserved in the outgoing link · opens securely (https, noopener) · no ATS vendor selected in this design file.
Visible “You are leaving yukselseeds.com” notice · vacancy ID + market context preserved in the outgoing link · opens securely (https, noopener) · no ATS vendor selected in this design file.
applicationsClosed renders the vacancy read-only with “applications temporarily closed” and the Careers Hub CTA.
4 · Repository mapping — implementation & content inventory baseline
Source: independently verified repository inventory (supplied 18 Sep 2026) for the canonical private repository
conform-ag/yuksel-seeds-website (branch master). This inventory was not gathered by direct repository access from this workspace. Verified stack: Next.js 16.1.6 · React 19.2.3 · Tailwind CSS 4 · Strapi 5.35 · PostgreSQL 16 · Docker Compose + Nginx · Nodemailer via Strapi; root dirs frontend/ strapi/ scripts/ nginx/ backups/ .github/. Strapi collections: Product Category, Product Variety, News Article, Job Position, Global Reach Item, Magazine Article, Page Content, Site Setting, Sustainability Page; reusable components incl. Hero Section, CTA Section, Section Heading/Background, Stat Item, Regional Manager, Global Partner, Footer/Social Link. Confirmed limitations: no Variety Finder route · no country-availability model · no Segment/Subsegment/Environment/Season structure · HR/IR not structured separately (flat resistances + tobrfv/cgmmv flags) · hardcoded About figures and Contact team data · Concepts & Brands partly on local frontend data · several static institutional pages · 8-link navigation to be replaced · many variety images/crop assets, cleanup needed. [VERIFY] now marks only file-level details not covered by this inventory. Earlier Vite/mock-data assumptions from the non-canonical mirror are withdrawn; neither websiteyuksel2027 nor abbahicham/newsite is an implementation baseline. This mapping is not yet approved as final.ID
New route
Existing route
Existing Strapi source
Decision
Required schema evolution
Content migration
Implementation risk
Dev verify before coding
T-01
/
/
Page Content · Site Setting · Stat Item / Hero / CTA components [VERIFY page composition]
Extend
Validated company-figures singleton (replaces hardcoded Stat Items); quick-finder block; market-selector state
Re-enter figures after validation; no copy migrated as-is
High — contradictory figures
YES
T-02
/varieties (finder)
— confirmed absent
Product Variety (name, code, segment, description, plant, fruit, culture, benefits, resistances, organic, tobrfv, cgmmv, image, badges, category)
Replace model
Structure HR/IR separately (flat resistances + tobrfv/cgmmv flags insufficient); add Segment/Subsegment, Environment, Season, countryAvailability[], publication status
Parse existing resistances prose → coded values with agronomist validation
High — model absent
YES
T-03/04
/crops/{crop}[/{segment}]
/products, /products/[slug]
Product Category (+ Product Variety relation)
Extend
Segment entity between Category and Variety (none exists); crop-level resistances + downloads; official illustration asset field
Categories carry over; segment assignment is new editorial work
Medium
YES
T-05
/varieties/{slug}
— varieties render inside /products/[slug] only
Product Variety (plant, fruit, culture, benefits, resistances, organic/tobrfv/cgmmv + badges, image) + existing variety image library
Extend + Replace claims
Dedicated route; coded HR/IR replacing flat resistances + badge flags; seasons per market; availability; PDF sheet; 4-slot gallery (fruit/plant/field/technical) + alt text; data-status
Existing plant/fruit/culture prose re-validated field by field; images re-mapped after marketing sign-off
High — prose → coded values
YES
T-06/07
/innovation, /innovation/no-fear-to-rugose
/nofeartorugose (no /innovation parent)
Page Content [VERIFY which entry drives /nofeartorugose]
Replace
Campaign type with validated science + resistant-variety relations; /innovation parent page
Campaign copy re-validated by R&D before migration; redirect /nofeartorugose
Medium — claims
YES
T-08/09
/brands[/{brand}]
/concepts-brands, /concepts-brands/[slug]
Partly local frontend data (confirmed) [VERIFY split vs CMS]
Replace
Brand collection: scope, member-variety relations, logo asset — all CMS-managed, no frontend data
Brand scopes re-entered after confirmation (Sweetloom conflict); redirects from /concepts-brands/*
High — scope conflict
YES
T-10/21
/company/about-us (+history, values, leadership)
/about-us
Page Content + hardcoded figures/claims (confirmed) [VERIFY component usage]
Extend
Company module pages on shared T-21 template; figures from the validated singleton (same as T-01); consent model on portraits/quotes
Hardcoded figures NOT migrated; validated set re-entered; redirect /about-us
High — conflicting figures
YES
T-11
/company/sustainability
/sustainability
Sustainability Page collection
Reuse + Extend
Add year/site/method fields per claim; remove unverifiable claims
Claims migrate only with year/site/method evidence; redirect
Medium
Recommended
T-12/13
/global-network[/{country}]
/yuksel-global
Global Reach Item + Global Partner + Regional Manager components
Reuse + Extend
publicationConsent flag per entry; regional-inbox fallback; country pages; strip personal contact fields from public rendering
Entries carry over after consent check; personal mobiles removed by default
Medium — consent
YES
T-14/15
/news[/{slug}]
/news, /news/[slug]
News Article (title, slug, excerpt, content, date, image, category, readTime, draft/publish) [VERIFY Magazine Article role]
Reuse + Extend
Category enum (7, configurable); consent model on quotes/portraits; decide Magazine Article merge or keep
Articles migrate as-is (already draft/publish gated)
Low
Recommended
T-16/17
/company/careers[/{slug}]
/careers, /careers/[slug]
Job Position (title, location, department, type, description, requirements, isActive, draft/publish)
Extend
applicationMethod field (4 values); status lifecycle beyond isActive; country for routing; secure-upload workflow (production submission gated)
Vacancies migrate only after HR confirms each is real and current
High — GDPR/KVKK
YES
T-18
/contact
/contact
Hardcoded team info (confirmed) + Regional Manager component; Nodemailer via Strapi
Replace
Routing-rules collection (type × country × crop → destination + fallback); consent field on submissions; keep Nodemailer transport [VERIFY config]
Team info NOT migrated; office/shared inboxes entered fresh with consent
High — privacy + routing
YES
T-19/20
/search, 404
/search; 404 [VERIFY custom or default]
[VERIFY search implementation]
Extend
Index varieties/crops/pages/news with grouped results; branded 404
—
Low–Medium
YES
Legal + shell
/terms, /privacy-policy, /cookie-policy, /general-conditions-of-sales
same routes (confirmed)
Page Content / static [VERIFY]; Footer Link + Social Link components; Site Setting
Reuse
Replace 8-link navigation with the approved 7-item nav + Products mega-menu; asset cleanup pass on the large image library
Legal texts migrate after legal review per jurisdiction
Low
Recommended
“Dev verify before coding” = YES where implementation depends on file-level inspection not covered by the supplied inventory (page composition, component usage, search/404 implementation, Nodemailer config, Magazine Article role, frontend-data split for brands). No existing claim, figure, vacancy or technical value is copied into the new design without validation — reuse decisions concern structure, data models and assets only. Mapping pending final approval.
Bottom sheet, not a stacked desktop sidebar: accordion groups, live result count on Apply, Clear all, Close with focus return, scroll position preserved, country warning pinned at top. Two-way sync with the header market selector.
5fContact & enquiry routing — Desktop 1440PREVIEW TYPOGRAPHYDestinations [CONTENT TO CONFIRM] · no personal mobiles by default
5gContact & enquiry routing — Mobile 390PREVIEW TYPOGRAPHY16px inputs · 44px targets · no sticky bar over the form
4a
Revised navigation — final 7 items · News top-level · Careers inside Company (+ utility & footer quick links)
PREVIEW TYPOGRAPHY — labelled stand-ins
4bCompany · About Us landing — Desktop 1440PREVIEW TYPOGRAPHYAll figures, history and certifications remain [CONTENT TO CONFIRM]
4dNews Hub — Desktop 1440PREVIEW TYPOGRAPHYNo articles invented — titles greeked; categories configurable, shown only when populated
4gCareers Hub — Desktop 1440PREVIEW TYPOGRAPHYNo vacancies, salaries, benefits or quotes invented — only Open vacancies ever public
4iJob Vacancy Detail — Desktop 1440PREVIEW TYPOGRAPHYTemplate only — every field is a labelled slot; no role invented
3a
Batch 1 Review Panel — accepted for formal review; expansion to remaining templates awaits approval
The four artboards below (1a–1d) are unchanged; previews are 1:1 captures of them
A1 · Desktop homepage (1a)
FIT-TO-SCREEN (full page)
100% SCALE — header + first viewport (cropped)
Primary action: Find a variety — header CTA, hero CTA and quick finder, all above the fold.
Guideline refs: logo p.3 (150px ≥ 85px min) · clear space p.6–7 · palette + tints p.9 · type roles p.10 · illustrations p.12–13 · wave p.15.
A11y / responsive: hero copy on ≥94% white panel (AA over any photo); buttons ≥44px; H1 56px single-H1; grid reflows 8→4→2 crops; reduced-motion: no content behind animation.
[CONTENT TO CONFIRM]: HQ eyebrow + positioning copy · crop list · 3 featured varieties’ codes/segments · brand scopes + logos · 4 figures · map entities · footer HQ address · hero & R&D photos.
Propagates to all templates: utility bar (language vs market split, Careers quick link) · final 7-item nav: Products · Innovation · Brands · Company · News · Global Network · Contact (“Find a variety” is a CTA, not an eighth item) + Products mega-menu + lighter Company dropdown · pill buttons (green primary; yellow only on green) · wave at hero base + footer top · white-plate logo on green · [CONTENT TO CONFIRM] chip style.
A2 · Mobile homepage (1b)
FIT-TO-SCREEN
100% SCALE — header + first viewport
Primary action: Find a variety — hero CTA plus persistent sticky bottom bar.
Guideline refs: logo p.3 at 96px (≥85px min) · palette p.9 · type p.10.
A11y / responsive: all targets ≥44px (menu 48px, CTAs 50px); sticky bar uses
position:sticky — checked at 390×664, 390×740 and 430×844 viewports: it never covers form controls, consent text, error messages, browser controls or footer links (end-of-page clearance; the bar auto-hides while a form or consent block is in view); swipe row uses peek + edge fade + first-exposure hint (decision 3).[CONTENT TO CONFIRM]: same as desktop (crop list, variety codes, figures).
Propagates: sticky Find/Contact bar on all mobile product pages · card-style quick finder · horizontal variety swipe rows · 2×2 figures grid.
A3 · Variety Finder desktop (1c)
FIT-TO-SCREEN
100% SCALE — header + first viewport (cropped)
Primary action: open a variety detail page from a result card.
Guideline refs: palette p.9 (yellow-30 notice band, black ink) · type p.10 · resistance icon role p.14.
A11y / responsive: real checkbox filters (label-associated in build); result count announced on change; active filters removable chips + Clear all; cards 3→2→1 columns; filter rail becomes “Filters (n)” sheet on mobile.
[CONTENT TO CONFIRM]: all segments/subsegments, HR/IR codes, availability data; brand scopes in the Brand filter.
Propagates: variety card (photo / segment / coded chips / availability line / one CTA) is THE unit reused on segment pages, crop hubs, related-varieties and homepage · country-as-master-filter pattern, synchronised two-way with the header “Your market” selector (either control prompts confirmation, then updates both) · availability language (below).
A4 · Variety detail desktop (1d)
FIT-TO-SCREEN
100% SCALE — header + first viewport (cropped)
Primary action: Ask your local rep (pre-filled, routed enquiry).
Guideline refs: palette p.9 · type p.10 · Plant/Fruit/Crop/Resistance icon roles p.14 structure the trait blocks (vectors pending).
A11y / responsive: tooltip pattern is keyboard-triggerable (focus on ⓘ) and text-based; status never colour-alone (● ◐ ◇ glyphs + words); tables become stacked definition lists on mobile; consent unticked with visible purpose text.
[CONTENT TO CONFIRM]: every Tobrossa technical value, segment, brand membership, positioning, availability list, transplant windows, PDF sheet, legal disclaimer wording, Spain office details. Nothing is presented as confirmed.
Propagates: ● ◐ ◇ data-status system · HR/IR chip + tooltip pattern · resistance legend module · country-availability module · pre-filled routed enquiry with consent · related-varieties row.
Homepage — focused checks
First screen (no scrolling): Who — logo + “International vegetable seed breeding · Antalya” eyebrow. What — H1 “Vegetable varieties bred for professional growers”. Why different — independent programmes + coded, verifiable resistances. Action — “Find a variety” three times above the fold (header, hero, quick finder). Verified in the 100% crop above.
Hero image direction (final intent): an authentic, wide-angle Yüksel greenhouse or open-field scene at golden hour — existing archive photography first, commissioned only where no suitable authentic image exists — rows of the actual crop, a grower or breeder mid-frame for human scale, natural colour grading (no teal-orange stock look), enough calm sky/foliage at left for the text panel. No composite, no AI generation, no generic agri stock — and never AI or stock imagery representing real varieties.
Category feel: serif Bogart display + field photography + crop illustrations read “international seed company”; data density is reserved for product modules (70/30 hybrid) — no dashboard chrome, no laboratory-tech styling, green/yellow held to one band each per viewport.
Confirmed-content state (markers removed): [CONTENT TO CONFIRM] chips are review-time only and do not set final spacing — on validation they disappear with no layout shift: figures render as plain Bogart numerals, the hero eyebrow loses its chip, ◐ table rows become plain ink values.
Hero image direction (final intent): an authentic, wide-angle Yüksel greenhouse or open-field scene at golden hour — existing archive photography first, commissioned only where no suitable authentic image exists — rows of the actual crop, a grower or breeder mid-frame for human scale, natural colour grading (no teal-orange stock look), enough calm sky/foliage at left for the text panel. No composite, no AI generation, no generic agri stock — and never AI or stock imagery representing real varieties.
Category feel: serif Bogart display + field photography + crop illustrations read “international seed company”; data density is reserved for product modules (70/30 hybrid) — no dashboard chrome, no laboratory-tech styling, green/yellow held to one band each per viewport.
Confirmed-content state (markers removed): [CONTENT TO CONFIRM] chips are review-time only and do not set final spacing — on validation they disappear with no layout shift: figures render as plain Bogart numerals, the hero eyebrow loses its chip, ◐ table rows become plain ink values.
Species bred
Commercial varieties
Research stations
Export countries
Numerals greeked as grey bars — no figures invented; spacing shown as final.
Navigation — closed, open, mobile, states
Products ▾InnovationBrandsCompany ▾NewsGlobal NetworkContact
CLOSED
Products ▾InnovationBrandsCompany ▾NewsGlobal NetworkContactOPEN — one mega-menuBrowse by crop
TomatoPepperCucumberEggplantWatermelonMelonLettuceAll →
Find a variety
Filter by crop, segment, resistance, country.
Open Variety Finder
Open Variety Finder
Mobile menu (open): full-screen green sheet; Products expands inline to its two children — Crops and Variety Finder stay under one Products entry on every breakpoint.
States & keyboard:
States & keyboard:
Default
Hover
Selected page
Focus (light bg)
Focus (on green)
Active/pressed
Tab order: skip link → utility (language, market, careers, search) → logo → nav left-to-right → mega-menu items when open (Esc closes, focus returns to trigger) → page CTAs. Selected page = yellow underline + weight, never colour alone.
Variety Finder — availability states
Catalogue presence never implies commercial availability; only the country database does.
STATE 1 — NO COUNTRY (default)
No country selected. Availability varies by country — you can keep exploring crops without selecting one.
Cards show ◐ Availability — select a country. No availability claim is made.STATE 2 — COUNTRY SELECTED (Spain)
Tobrossa · HR/IR chips
✓ Verified available in Spain
Flag appears only where the validated database confirms it; count updates: “n varieties available in Spain”.✓ Verified available in Spain
STATE 3 — ZERO RESULTS
No varieties match.
Remove “Open field” ✕ · Clear all · Ask our team about your need
Always a way forward — suggest removing the last filter, never a dead end.Remove “Open field” ✕ · Clear all · Ask our team about your need
STATE 4 — NOT LISTED FOR MARKET
Chocolina · HR/IR chips
Not listed for Morocco — ask your local team
In-catalogue but unconfirmed markets route to the local contact; wording avoids “unavailable” (status, not verdict).Not listed for Morocco — ask your local team
Variety detail & mobile — focused checks
Data-status system: ● Verified — plain ink, no chip, only from the validated database · ◐ Pending — amber glyph + [CONTENT TO CONFIRM] chip, never plain text · ◇ Market-specific — outline glyph, always paired with a named market row. Glyph + wording, never colour alone. On 1d, every Tobrossa value is ◐ — nothing reads as confirmed.
HR/IR tooltip: shown open on 1d (dark panel under the IR:ToBRFV chip) — pathogen name, HR vs IR in plain language, ISF definition note, “never absolute” disclaimer.
Routed enquiry & consent: bottom of 1d — Country and Crop/Variety pre-filled (editable, green-marked), consent checkbox unticked with purpose text + privacy link beside submit, routing note under the button.
Mobile sticky bar: sits in the page scroll (sticky, not fixed): content scrolls past it, it stops at the footer, and it never covers browser controls. 50px-tall targets, 10px gap.
Swipe affordance (revised per decision 3, applied to 1b): no permanent chip over product cards. Treatment: a clearly visible partial next card (150px cards guarantee the peek), a right-edge fade as directional cue, and a “Swipe for more →” line below the row shown on first exposure only (auto-dismisses after the first scroll). Carousel accessibility: list semantics with labelled items, arrow-key navigation, and previous/next buttons at ≥768px breakpoints.
HR/IR tooltip: shown open on 1d (dark panel under the IR:ToBRFV chip) — pathogen name, HR vs IR in plain language, ISF definition note, “never absolute” disclaimer.
Routed enquiry & consent: bottom of 1d — Country and Crop/Variety pre-filled (editable, green-marked), consent checkbox unticked with purpose text + privacy link beside submit, routing note under the button.
Mobile sticky bar: sits in the page scroll (sticky, not fixed): content scrolls past it, it stops at the footer, and it never covers browser controls. 50px-tall targets, 10px gap.
Swipe affordance (revised per decision 3, applied to 1b): no permanent chip over product cards. Treatment: a clearly visible partial next card (150px cards guarantee the peek), a right-edge fade as directional cue, and a “Swipe for more →” line below the row shown on first exposure only (auto-dismisses after the first scroll). Carousel accessibility: list semantics with labelled items, arrow-key navigation, and previous/next buttons at ≥768px breakpoints.
System checks — contrast, neutrals, typography, wave
EVERY TEXT/BUTTON COMBINATION USED IN BATCH 1 (WCAG 2.2 AA: 4.5:1 body · 3:1 large)
Combination
Ratio
Result
White text/buttons on green #006443
7.2:1
PASS
Green #006443 on white / paper #F7F6F1
7.2 / 6.7
PASS
Ink #1A1A1A on white / paper / yellow-30 #FEF6C2
17.4 / 16.1 / 15.7
PASS
Black on yellow #FBE232 (CTAs, partner band)
16.0:1
PASS
Yellow #FBE232 labels/headings on green (≥12px bold)
5.5:1
PASS
Secondary #6B675C on white / paper
5.6 / 5.2
PASS
White + yellow + #B3D1C7 on tooltip ink #1A1A1A
17.4 / 14.6 / 11.7
PASS
Pending ◐ text on light — corrected to #7A5D00 (decision 1; yellow/light treatment used on dark green)
6.2:1
PASS — fixed
Footer secondary — corrected to #D6E7DF at ≥14px; white reserved for headings/links, links underlined (decision 2)
5.9:1
PASS — fixed
Disabled #6B675C on #EAE7DD (exempt from AA)
4.8:1
n/a
Corrections applied per your decisions 1–2: #7A5D00 pending text on light grounds, always paired with the ◐ glyph and explicit Pending/[CONTENT TO CONFIRM] wording; the yellow/light validated treatment where pending status sits on dark green; #D6E7DF at ≥14px for footer secondary text, white reserved for footer headings and key links (underlined in build).
Support neutrals: ink #1A1A1A, paper #F7F6F1, border #DDD9CE, secondary #6B675C, pending-amber — all remain digital recommendations under decision 4: subordinate to green/yellow, never presented or documented as official brand colours (official palette = p.9 only).
Temporary typography substitutions (complete list): Bogart → Young Serif (display/headings) · Sofia Pro Soft → Quicksand (body, nav, forms, UI). No other substitutes anywhere; Futura I/II reserved for logo/documents and never used on web; badges stay on every screen until licensed woff2 files replace the stand-ins.
Type tokens (documented): Display 54–56 (Bogart) · H2 36–40 · H3/H4 20–26 · nav 15 · body 16 · secondary/supporting ≥14 · mobile form inputs 16 · buttons 14–16 · touch targets ≥44×44px. All product-UI text under 14px was raised in this correction pass; 12px bold-uppercase eyebrows/tags remain as a documented labelling exception.
Wave: all curves in Batch 1 are CSS approximations flagged as non-final. None ships until its geometry is validated against the p.15 construction (−22.28° / 2.16° / 22.48° / −26.26°; C2 = C1 − 54.47%; C3 = C1 − 47.78%) or the official vector is supplied.
Status: Batch 1 corrections applied; final 7-item navigation in place. Governance register + template reconciliation + repository mapping (5a) and the Batch 3 screens (5b–5g) are at the top of this board. Stopping after Batch 3 — no implementation and no further templates until review.
Temporary typography substitutions (complete list): Bogart → Young Serif (display/headings) · Sofia Pro Soft → Quicksand (body, nav, forms, UI). No other substitutes anywhere; Futura I/II reserved for logo/documents and never used on web; badges stay on every screen until licensed woff2 files replace the stand-ins.
Type tokens (documented): Display 54–56 (Bogart) · H2 36–40 · H3/H4 20–26 · nav 15 · body 16 · secondary/supporting ≥14 · mobile form inputs 16 · buttons 14–16 · touch targets ≥44×44px. All product-UI text under 14px was raised in this correction pass; 12px bold-uppercase eyebrows/tags remain as a documented labelling exception.
Wave: all curves in Batch 1 are CSS approximations flagged as non-final. None ships until its geometry is validated against the p.15 construction (−22.28° / 2.16° / 22.48° / −26.26°; C2 = C1 − 54.47%; C3 = C1 − 47.78%) or the official vector is supplied.
Status: Batch 1 corrections applied; final 7-item navigation in place. Governance register + template reconciliation + repository mapping (5a) and the Batch 3 screens (5b–5g) are at the top of this board. Stopping after Batch 3 — no implementation and no further templates until review.
1a
Hi-Fi Batch 1 · Desktop homepage · 1440px
PREVIEW TYPOGRAPHY — Bogart / Sofia Pro Soft shown via labelled stand-ins (decision 6); not final production fonts
News is a top-level item per final navigation correction · photo zones are labelled placeholders — no stock, no AI product imagery
Detail · Products mega-menu (open state)
Browse by crop
TomatoPepperCucumberEggplantWatermelonMelonLettuceAll crops →
Crop list [CONTENT TO CONFIRM]
Find a variety
Filter by crop, segment, environment, resistance and country availability.
Open Variety Finder
First-screen check (1g condition)
Who: logo + “International vegetable seed breeding” eyebrow.What: H1 “Vegetable varieties bred for professional growers”.
Why different: independent breeding + coded, verifiable resistances (claim-safe wording; copy to confirm).
Primary action: “Find a variety” — header, hero and quick finder, all above the fold.
1b
Hi-Fi Batch 1 · Mobile homepage · 390px
PREVIEW TYPOGRAPHY — labelled stand-ins
Designed for discovery + conversion — not a stacked desktop page; all targets ≥44px
Mobile-specific decisions
Hero compressed to one screen with the who/what block; both CTAs immediately below (44px+ targets).Quick finder is a card, not a collapsed desktop bar; crop grid is 3-across tap targets; resistance varieties become a horizontal swipe row.
A sticky bottom bar keeps “Find a variety” and “Contact” present through the whole scroll — discovery and conversion preserved.
Figures collapse to a 2×2 grid, all [CONTENT TO CONFIRM]; News absent (decision 10).
1c
Hi-Fi Batch 1 · Variety Finder · Desktop 1440px · Breeding-Systems weighted
PREVIEW TYPOGRAPHY — labelled stand-ins
Variety names from official 2026 catalogue material; all technical data [CONTENT TO CONFIRM]
1d
Hi-Fi Batch 1 · Variety detail (Tobrossa) · Desktop 1440px
PREVIEW TYPOGRAPHY — labelled stand-ins
Data-status system: ● Verified · ◐ Pending [CONTENT TO CONFIRM] · ◇ Market-specific