Size Guide

{% comment %}
VERACITY — INTERACTIVE SIZE FINDER

Recommendation is based on measured foot length.
Customers should still check model-specific fit notes.

Change the collection link below when needed.
{% endcomment %}

{% assign vct_size_shop_link = '/collections/all' %}

<header class="vct-size-finder__header">
<div>
<span class="vct-size-finder__eyebrow">
Less guessing. Better stepping.
</span>

<h2 id="VctSizeHeading-{{ section.id }}">
Find your size.
<em>Without the drama.</em>
</h2>

<p>
Measure your foot, choose how you like your sneakers to fit,
and we’ll give you a suggested starting size.
</p>
</div>

<div class="vct-size-finder__badge" aria-hidden="true">
<span>Two minutes</span>
<strong>Better fit</strong>
</div>
</header>

<article class="vct-size-guide">
<div class="vct-size-guide__top">
<span class="vct-size-guide__number">
01
</span>

<div>
<small>Before you begin</small>
<h3>Measure your foot</h3>
</div>
</div>

<text x="163" y="233">
heel to longest toe
</text>
</svg>
</div>

<ol class="vct-size-guide__steps">
<li>
Place a sheet of paper against a wall.
</li>

<li>
Stand on it with your heel gently touching the wall.
</li>

<li>
Mark the end of your longest toe.
</li>

<li>
Measure the distance in centimetres.
</li>
</ol>

<p>
Measure both feet and use the longer measurement.
Try measuring later in the day when feet are naturally fuller.
</p>
</div>
</article>

<article class="vct-size-tool">
<div class="vct-size-tool__progress">
<span>Fit helper</span>

<form
class="vct-size-tool__form"
data-vct-size-form
novalidate
>
<div class="vct-size-tool__field">
<label for="VctFootLength-{{ section.id }}">
Foot length
</label>

<small>
Enter a measurement between 22 and 31 cm.
</small>

<fieldset class="vct-size-tool__field">
<legend>
How do you like your sneakers to fit?
</legend>

<span>
<strong>Snug</strong>
<small>Close and secure</small>
</span>
</label>

<span>
<strong>Regular</strong>
<small>Balanced everyday fit</small>
</span>
</label>

<span>
<strong>Relaxed</strong>
<small>A little extra room</small>
</span>
</label>

</div>
</fieldset>

<fieldset class="vct-size-tool__field">
<legend>
Are your feet wider than average?
</legend>

</div>
</fieldset>

<button
type="submit"
class="vct-size-tool__submit"
>
Find my suggested size
<span aria-hidden="true">→</span>
</button>
</form>

<div
class="vct-size-result"
data-vct-size-result
hidden
aria-live="polite"
>
<span class="vct-size-result__eyebrow">
Your suggested starting point
</span>

<h3 data-vct-result-heading>
This should feel just right.
</h3>

<p data-vct-result-copy>
Start with this size and review the fit note on the product page.
</p>

<div class="vct-size-result__actions">
<a href="{{ vct_size_shop_link }}">
Shop available pairs
<span aria-hidden="true">→</span>
</a>

<button
type="button"
data-vct-size-reset
>
Measure again
</button>
</div>

<small class="vct-size-result__note">
This tool provides a general recommendation. Fit may differ
between sneaker models, materials and silhouettes.
</small>
</div>

</article>

</div>

<div class="vct-size-finder__footer">
<div>
<span aria-hidden="true">✓</span>
<p>
Still unsure? Choose your usual size and contact us before ordering.
</p>
</div>

<a href="/pages/contact">
Ask about sizing
<span aria-hidden="true">→</span>
</a>
</div>

</div>

position: relative;
width: 100%;
overflow: hidden;
padding: 70px 0 76px;
background: var(--vct-deep-olive);
color: var(--vct-cream);
}

#VctSizeFinder-{{ section.id }} * {
box-sizing: border-box;
}

#VctSizeFinder-{{ section.id }} button,
#VctSizeFinder-{{ section.id }} input {
font: inherit;
}

#VctSizeFinder-{{ section.id }} .vct-size-finder__container {
position: relative;
z-index: 2;
width: min(100% - 28px, 1320px);
margin: 0 auto;
}

#VctSizeFinder-{{ section.id }} .vct-size-finder__header {
display: grid;
gap: 24px;
margin-bottom: 33px;
}

#VctSizeFinder-{{ section.id }} .vct-size-finder__eyebrow {
display: block;
margin-bottom: 10px;
color: var(--vct-sage);
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 10px;
font-weight: 900;
letter-spacing: 0.18em;
text-transform: uppercase;
}

#VctSizeFinder-{{ section.id }} h2 {
margin: 0;
color: var(--vct-cream);
font-family: "Bebas Neue", "Arial Narrow", sans-serif;
font-size: clamp(52px, 14vw, 86px);
font-weight: 400;
line-height: 0.87;
text-transform: uppercase;
}

#VctSizeFinder-{{ section.id }} h2 em {
display: block;
margin-top: 8px;
color: var(--vct-coral);
font-family: "Caveat Brush", cursive;
font-size: 0.58em;
font-style: normal;
line-height: 1;
text-transform: none;
transform: rotate(-1.5deg);
transform-origin: left center;
}

#VctSizeFinder-{{ section.id }}
.vct-size-finder__header > div:first-child > p {
max-width: 510px;
margin: 18px 0 0;
color: rgba(241, 235, 223, 0.72);
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 14px;
line-height: 1.62;
}

#VctSizeFinder-{{ section.id }} .vct-size-finder__badge {
display: grid;
width: 115px;
height: 115px;
place-items: center;
align-content: center;
border-radius: 50%;
background: var(--vct-coral);
color: var(--vct-ink);
text-align: center;
transform: rotate(7deg);
}

#VctSizeFinder-{{ section.id }} .vct-size-finder__badge span {
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 8px;
font-weight: 900;
letter-spacing: 0.13em;
text-transform: uppercase;
}

#VctSizeFinder-{{ section.id }} .vct-size-finder__badge strong {
margin-top: 3px;
font-family: "Caveat Brush", cursive;
font-size: 22px;
font-weight: 400;
line-height: 0.9;
}

#VctSizeFinder-{{ section.id }} .vct-size-finder__layout {
display: grid;
gap: 15px;
}

#VctSizeFinder-{{ section.id }} .vct-size-guide,
#VctSizeFinder-{{ section.id }} .vct-size-tool {
padding: 23px;
border-radius: 24px;
}

#VctSizeFinder-{{ section.id }} .vct-size-guide {
background: var(--vct-sage);
color: var(--vct-ink);
}

#VctSizeFinder-{{ section.id }} .vct-size-tool {
background: var(--vct-soft-cream);
color: var(--vct-ink);
}

#VctSizeFinder-{{ section.id }} .vct-size-guide__top {
display: flex;
gap: 13px;
align-items: flex-start;
}

#VctSizeFinder-{{ section.id }} .vct-size-guide__number {
color: var(--vct-coral);
font-family: "Bebas Neue", "Arial Narrow", sans-serif;
font-size: 36px;
line-height: 1;
}

#VctSizeFinder-{{ section.id }} .vct-size-guide__top small {
display: block;
margin-bottom: 4px;
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 8px;
font-weight: 900;
letter-spacing: 0.15em;
opacity: 0.62;
text-transform: uppercase;
}

#VctSizeFinder-{{ section.id }} .vct-size-guide__top h3 {
margin: 0;
font-family: "Bebas Neue", "Arial Narrow", sans-serif;
font-size: 36px;
font-weight: 400;
line-height: 1;
text-transform: uppercase;
}

#VctSizeFinder-{{ section.id }} .vct-size-guide__illustration {
overflow: hidden;
margin: 21px 0;
border-radius: 17px;
background: rgba(241, 235, 223, 0.48);
}

#VctSizeFinder-{{ section.id }}
.vct-size-guide__illustration svg {
display: block;
width: 100%;
fill: none;
stroke: var(--vct-deep-olive);
stroke-width: 3;
stroke-linecap: round;
stroke-linejoin: round;
}

#VctSizeFinder-{{ section.id }}
.vct-size-guide__illustration text {
fill: var(--vct-deep-olive);
stroke: none;
font-family: Arial, sans-serif;
font-size: 12px;
letter-spacing: 1px;
text-transform: uppercase;
}

#VctSizeFinder-{{ section.id }} .vct-size-guide__steps {
display: grid;
gap: 12px;
margin: 0;
padding: 0;
counter-reset: vctsteps;
list-style: none;
}

#VctSizeFinder-{{ section.id }} .vct-size-guide__steps li {
display: grid;
grid-template-columns: 27px 1fr;
gap: 10px;
align-items: start;
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 12px;
line-height: 1.5;
counter-increment: vctsteps;
}

#VctSizeFinder-{{ section.id }}
.vct-size-guide__steps li::before {
display: grid;
width: 27px;
height: 27px;
place-items: center;
border-radius: 50%;
background: var(--vct-deep-olive);
color: var(--vct-cream);
content: counter(vctsteps);
font-size: 9px;
font-weight: 900;
}

#VctSizeFinder-{{ section.id }} .vct-size-guide__tip {
display: flex;
gap: 10px;
margin-top: 22px;
padding: 14px;
border-radius: 12px;
background: rgba(241, 235, 223, 0.5);
}

#VctSizeFinder-{{ section.id }} .vct-size-guide__tip > span {
color: var(--vct-coral);
font-size: 18px;
}

#VctSizeFinder-{{ section.id }} .vct-size-guide__tip p {
margin: 0;
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 10px;
line-height: 1.5;
}

#VctSizeFinder-{{ section.id }} .vct-size-tool__progress {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 28px;
}

#VctSizeFinder-{{ section.id }} .vct-size-tool__progress > span {
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 9px;
font-weight: 900;
letter-spacing: 0.15em;
text-transform: uppercase;
}

#VctSizeFinder-{{ section.id }}
.vct-size-tool__progress > div {
display: flex;
gap: 5px;
}

#VctSizeFinder-{{ section.id }}
.vct-size-tool__progress i {
display: block;
width: 23px;
height: 3px;
background: rgba(35, 35, 35, 0.14);
}

#VctSizeFinder-{{ section.id }}
.vct-size-tool__progress i:first-child {
background: var(--vct-coral);
}

#VctSizeFinder-{{ section.id }} .vct-size-tool__form {
display: grid;
gap: 25px;
}

#VctSizeFinder-{{ section.id }} .vct-size-tool__field {
min-width: 0;
margin: 0;
padding: 0;
border: 0;
}

#VctSizeFinder-{{ section.id }} .vct-size-tool__field > label,
#VctSizeFinder-{{ section.id }} .vct-size-tool__field legend {
display: block;
width: 100%;
margin-bottom: 10px;
color: var(--vct-ink);
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 12px;
font-weight: 900;
}

#VctSizeFinder-{{ section.id }} .vct-size-tool__input-wrap {
position: relative;
}

#VctSizeFinder-{{ section.id }} .vct-size-tool__input-wrap input {
width: 100%;
min-height: 58px;
padding: 14px 65px 14px 16px;
border: 1px solid rgba(35, 35, 35, 0.15);
border-radius: 8px;
outline: none;
background: #ffffff;
color: var(--vct-ink);
font-size: 16px;
font-weight: 800;
}

#VctSizeFinder-{{ section.id }}
.vct-size-tool__input-wrap input:focus {
border-color: var(--vct-deep-olive);
box-shadow: 0 0 0 3px rgba(174, 189, 152, 0.32);
}

#VctSizeFinder-{{ section.id }}
.vct-size-tool__input-wrap > span {
position: absolute;
top: 50%;
right: 16px;
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 10px;
font-weight: 900;
letter-spacing: 0.12em;
transform: translateY(-50%);
}

#VctSizeFinder-{{ section.id }}
.vct-size-tool__field > small {
display: block;
margin-top: 7px;
color: rgba(35, 35, 35, 0.55);
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 9px;
}

#VctSizeFinder-{{ section.id }} .vct-size-tool__error {
min-height: 16px;
margin: 5px 0 0;
color: #a63d2a;
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 10px;
font-weight: 700;
}

#VctSizeFinder-{{ section.id }} .vct-size-tool__options {
display: grid;
gap: 8px;
}

#VctSizeFinder-{{ section.id }} .vct-size-option {
position: relative;
display: block;
cursor: pointer;
}

#VctSizeFinder-{{ section.id }} .vct-size-option input {
position: absolute;
opacity: 0;
pointer-events: none;
}

#VctSizeFinder-{{ section.id }} .vct-size-option > span {
display: flex;
min-height: 57px;
align-items: center;
justify-content: space-between;
padding: 12px 14px;
border: 1px solid rgba(35, 35, 35, 0.12);
border-radius: 9px;
background: #ffffff;
transition:
border 180ms ease,
background 180ms ease,
color 180ms ease;
}

#VctSizeFinder-{{ section.id }} .vct-size-option strong,
#VctSizeFinder-{{ section.id }} .vct-size-option small {
display: block;
}

#VctSizeFinder-{{ section.id }} .vct-size-option strong {
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 11px;
}

#VctSizeFinder-{{ section.id }} .vct-size-option small {
color: rgba(35, 35, 35, 0.54);
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 9px;
}

#VctSizeFinder-{{ section.id }}
.vct-size-option input:checked + span {
border-color: var(--vct-deep-olive);
background: var(--vct-deep-olive);
color: var(--vct-cream);
}

#VctSizeFinder-{{ section.id }}
.vct-size-option input:checked + span small {
color: rgba(241, 235, 223, 0.66);
}

#VctSizeFinder-{{ section.id }} .vct-size-tool__binary {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 8px;
}

#VctSizeFinder-{{ section.id }} .vct-size-tool__binary label {
position: relative;
cursor: pointer;
}

#VctSizeFinder-{{ section.id }} .vct-size-tool__binary input {
position: absolute;
opacity: 0;
}

#VctSizeFinder-{{ section.id }} .vct-size-tool__binary span {
display: grid;
min-height: 48px;
place-items: center;
border: 1px solid rgba(35, 35, 35, 0.13);
border-radius: 8px;
background: #ffffff;
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 10px;
font-weight: 900;
text-transform: uppercase;
}

#VctSizeFinder-{{ section.id }}
.vct-size-tool__binary input:checked + span {
border-color: var(--vct-coral);
background: var(--vct-coral);
}

#VctSizeFinder-{{ section.id }} .vct-size-tool__submit {
display: flex;
width: 100%;
min-height: 55px;
align-items: center;
justify-content: space-between;
padding: 14px 18px;
border: 0;
border-radius: 6px;
background: var(--vct-deep-olive);
color: var(--vct-cream);
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 10px;
font-weight: 900;
letter-spacing: 0.12em;
text-transform: uppercase;
cursor: pointer;
}

#VctSizeFinder-{{ section.id }} .vct-size-result {
text-align: center;
}

#VctSizeFinder-{{ section.id }} .vct-size-result__eyebrow {
display: block;
margin-bottom: 18px;
color: var(--vct-olive);
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 9px;
font-weight: 900;
letter-spacing: 0.16em;
text-transform: uppercase;
}

#VctSizeFinder-{{ section.id }} .vct-size-result__size {
display: grid;
width: 150px;
height: 150px;
margin: 0 auto 22px;
place-items: center;
align-content: center;
border-radius: 50%;
background: var(--vct-coral);
color: var(--vct-ink);
transform: rotate(-3deg);
}

#VctSizeFinder-{{ section.id }} .vct-size-result__size small {
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 9px;
font-weight: 900;
letter-spacing: 0.15em;
}

#VctSizeFinder-{{ section.id }} .vct-size-result__size strong {
font-family: "Bebas Neue", "Arial Narrow", sans-serif;
font-size: 72px;
font-weight: 400;
line-height: 0.9;
}

#VctSizeFinder-{{ section.id }} .vct-size-result h3 {
margin: 0;
font-family: "Bebas Neue", "Arial Narrow", sans-serif;
font-size: 37px;
font-weight: 400;
line-height: 1;
text-transform: uppercase;
}

#VctSizeFinder-{{ section.id }} .vct-size-result > p {
max-width: 390px;
margin: 12px auto 22px;
color: rgba(35, 35, 35, 0.64);
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 12px;
line-height: 1.55;
}

#VctSizeFinder-{{ section.id }} .vct-size-result__actions {
display: grid;
gap: 9px;
}

#VctSizeFinder-{{ section.id }}
.vct-size-result__actions a,
#VctSizeFinder-{{ section.id }}
.vct-size-result__actions button {
display: flex;
min-height: 51px;
align-items: center;
justify-content: space-between;
padding: 13px 17px;
border-radius: 6px;
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 9px;
font-weight: 900;
letter-spacing: 0.12em;
text-decoration: none;
text-transform: uppercase;
}

#VctSizeFinder-{{ section.id }}
.vct-size-result__actions a {
background: var(--vct-deep-olive);
color: var(--vct-cream);
}

#VctSizeFinder-{{ section.id }}
.vct-size-result__actions button {
justify-content: center;
border: 1px solid rgba(35, 35, 35, 0.17);
background: transparent;
color: var(--vct-ink);
cursor: pointer;
}

#VctSizeFinder-{{ section.id }} .vct-size-result__note {
display: block;
margin-top: 18px;
color: rgba(35, 35, 35, 0.5);
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 8px;
line-height: 1.5;
}

#VctSizeFinder-{{ section.id }} .vct-size-finder__footer {
display: grid;
gap: 15px;
margin-top: 18px;
}

#VctSizeFinder-{{ section.id }}
.vct-size-finder__footer > div {
display: flex;
align-items: center;
gap: 10px;
}

#VctSizeFinder-{{ section.id }}
.vct-size-finder__footer > div > span {
display: grid;
flex: 0 0 auto;
width: 27px;
height: 27px;
place-items: center;
border-radius: 50%;
background: var(--vct-coral);
color: var(--vct-ink);
font-size: 11px;
font-weight: 900;
}

#VctSizeFinder-{{ section.id }} .vct-size-finder__footer p {
margin: 0;
color: rgba(241, 235, 223, 0.7);
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 10px;
line-height: 1.5;
}

#VctSizeFinder-{{ section.id }}
.vct-size-finder__footer > a {
display: flex;
min-height: 51px;
align-items: center;
justify-content: space-between;
padding: 13px 17px;
border: 1px solid rgba(241, 235, 223, 0.3);
border-radius: 6px;
color: var(--vct-cream);
font-family: var(--font-body-family, Inter, Arial, sans-serif);
font-size: 9px;
font-weight: 900;
letter-spacing: 0.12em;
text-decoration: none;
text-transform: uppercase;
}

#VctSizeFinder-{{ section.id }} .vct-size-finder__doodle {
position: absolute;
right: -65px;
bottom: 20px;
width: 220px;
color: rgba(139, 186, 217, 0.55);
transform: rotate(-7deg);
}

#VctSizeFinder-{{ section.id }} .vct-size-finder__doodle svg {
display: block;
width: 100%;
fill: none;
stroke: currentColor;
stroke-width: 3;
stroke-linecap: round;
stroke-linejoin: round;
}

@media screen and (min-width: 750px) {
#VctSizeFinder-{{ section.id }} {
padding: 110px 0 116px;
}

#VctSizeFinder-{{ section.id }} .vct-size-finder__header {
grid-template-columns: 1fr auto;
align-items: end;
gap: 60px;
margin-bottom: 45px;
}

#VctSizeFinder-{{ section.id }} .vct-size-finder__layout {
grid-template-columns: 0.92fr 1.08fr;
gap: 18px;
align-items: stretch;
}

#VctSizeFinder-{{ section.id }} .vct-size-guide,
#VctSizeFinder-{{ section.id }} .vct-size-tool {
padding: 34px;
}

#VctSizeFinder-{{ section.id }} .vct-size-tool__options {
grid-template-columns: repeat(3, 1fr);
}

#VctSizeFinder-{{ section.id }} .vct-size-option > span {
min-height: 90px;
flex-direction: column;
align-items: flex-start;
justify-content: center;
}

#VctSizeFinder-{{ section.id }} .vct-size-result__actions {
grid-template-columns: 1fr auto;
}

#VctSizeFinder-{{ section.id }}
.vct-size-result__actions button {
min-width: 155px;
}

#VctSizeFinder-{{ section.id }} .vct-size-finder__footer {
grid-template-columns: 1fr auto;
align-items: center;
margin-top: 25px;
}

#VctSizeFinder-{{ section.id }}
.vct-size-finder__footer > a {
min-width: 200px;
}

#VctSizeFinder-{{ section.id }} .vct-size-finder__doodle {
right: 2%;
width: 285px;
}
}

@media (prefers-reduced-motion: reduce) {
#VctSizeFinder-{{ section.id }} * {
scroll-behavior: auto !important;
}
}
</style>

if (!section || section.dataset.initialized === 'true') return;

section.dataset.initialized = 'true';

const form = section.querySelector('[data-vct-size-form]');
const footInput = section.querySelector('[data-vct-foot-length]');
const error = section.querySelector('[data-vct-size-error]');
const result = section.querySelector('[data-vct-size-result]');
const resultSize = section.querySelector('[data-vct-result-size]');
const resultHeading = section.querySelector(
'[data-vct-result-heading]'
);
const resultCopy = section.querySelector('[data-vct-result-copy]');
const resetButton = section.querySelector('[data-vct-size-reset]');

if (!form || !footInput || !result) return;

const sizeChart = [
{ max: 22.3, size: 36 },
{ max: 22.9, size: 37 },
{ max: 23.6, size: 38 },
{ max: 24.3, size: 39 },
{ max: 24.9, size: 40 },
{ max: 25.6, size: 41 },
{ max: 26.3, size: 42 },
{ max: 26.9, size: 43 },
{ max: 27.6, size: 44 },
{ max: 28.3, size: 45 },
{ max: 29.1, size: 46 },
{ max: 30, size: 47 },
{ max: 31, size: 48 }
];

const getBaseSize = (length) => {
const match = sizeChart.find((entry) => length <= entry.max);
return match ? match.size : null;
};

form.addEventListener('submit', (event) => {
event.preventDefault();

const length = Number.parseFloat(footInput.value);

if (!Number.isFinite(length) || length < 22 || length > 31) {
error.textContent =
'Please enter a valid foot length between 22 and 31 cm.';

footInput.focus();
return;
}

error.textContent = '';

const fitPreference =
form.querySelector(
'input[name="fit_preference"]:checked'
)?.value || 'regular';

const wideFoot =
form.querySelector(
'input[name="wide_foot"]:checked'
)?.value === 'yes';

let recommendedSize = getBaseSize(length);

if (!recommendedSize) return;

if (fitPreference === 'relaxed') {
recommendedSize += 1;
}

if (fitPreference === 'snug' && length < 29) {
recommendedSize -= 0;
}

if (wideFoot && fitPreference !== 'relaxed') {
recommendedSize += 1;
}

recommendedSize = Math.max(
36,
Math.min(48, recommendedSize)
);

resultSize.textContent = recommendedSize;

if (wideFoot) {
resultHeading.textContent =
'A little extra room should help.';

resultCopy.textContent =
`Start with EU ${recommendedSize}. Your width preference moved the recommendation up for a more comfortable fit.`;
} else if (fitPreference === 'relaxed') {
resultHeading.textContent =
'Room to move. No toe drama.';

resultCopy.textContent =
`Start with EU ${recommendedSize} for a more relaxed fit. Check the product page in case that model runs large.`;
} else if (fitPreference === 'snug') {
resultHeading.textContent =
'Close, secure and ready.';

resultCopy.textContent =
`Start with EU ${recommendedSize} for a closer fit. Avoid sizing down when the product note says the model runs small.`;
} else {
resultHeading.textContent =
'This should feel just right.';

resultCopy.textContent =
`Start with EU ${recommendedSize} for a balanced everyday fit. Review the individual product fit note before ordering.`;
}

form.hidden = true;
result.hidden = false;

result.scrollIntoView({
behavior: 'smooth',
block: 'nearest'
});
});

resetButton?.addEventListener('click', () => {
result.hidden = true;
form.hidden = false;
error.textContent = '';

window.setTimeout(() => {
footInput.focus();
}, 50);
});
};

if (document.readyState === 'loading') {
document.addEventListener(
'DOMContentLoaded',
initializeVeracitySizeFinder
);
} else {
initializeVeracitySizeFinder();
}

document.addEventListener(
'shopify:section:load',
initializeVeracitySizeFinder
);
})();
</script>

Size Guide

Let’s clear things up.

Your cart is empty

Your cart is empty