/* Sizeha phase 3 pages on Taraz 0.2 (source file): product, tutorial, size chart,
   information pages and 404. From handoff-p3 and its frames; values are Taraz
   tokens. Sizes the tokens do not cover are named once below. */

:root {
  --sz-measure: 720px;       /* readable text column (handoff-p3: max-width 720) */
  --sz-split-min: 440px;     /* two-column rows fold under this column width */
  --sz-toc-w: 280px;         /* tutorial table of contents */
  --sz-toc-w-page: 260px;    /* long information pages */
  --sz-size-min: 88px;       /* size choice buttons */
  --sz-review-photo: 72px;
  --sz-404-max: 560px;
  --sz-faq-max: 800px;
}

/* ---------- shared layout ---------- */
.sz-flush { margin: 0; }
.sz-strong { font-weight: 600; }
.sz-regular { font-weight: 400; }
.sz-start { justify-self: start; align-self: flex-start; }
.sz-center { align-items: center; }
.sz-pretty { text-wrap: pretty; }
.sz-stack-8, .sz-stack-12, .sz-stack-16, .sz-stack-24 { display: grid; align-content: start; min-width: 0; }
.sz-stack-8 { gap: var(--space-8); }
.sz-stack-12 { gap: var(--space-12); }
.sz-stack-16 { gap: var(--space-16); }
.sz-stack-24 { gap: var(--space-24); }
.sz-wrap-8 { display: flex; flex-wrap: wrap; gap: var(--space-8); }
.sz-headrow { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--space-8); }
.sz-split { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--sz-split-min)), 1fr)); gap: var(--space-48); align-items: start; }
.sz-split--400 { --sz-split-min: 400px; }
.sz-grid-200, .sz-grid-240, .sz-grid-280 { display: grid; gap: var(--space-24); }
.sz-grid-200 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: var(--space-16); }
.sz-grid-240 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
.sz-grid-280 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
.sz-grid--start { align-items: start; }
.sz-cards { margin: 0; padding: 0; list-style: none; }
.sz-align-start { align-content: start; }
.sz-list { margin: 0; padding-inline-start: 20px; display: grid; gap: var(--space-4); }
.sz-panel { padding: var(--space-24); border: 1px solid var(--line-subtle); border-radius: var(--radius-frame); background: var(--bg-surface); }
.sz-panel--strong { border-color: var(--line-default); }
.sz-anchor { scroll-margin-top: var(--space-24); }
.sz-plainlink { color: inherit; text-decoration: none; }
.sz-plainlink:hover { text-decoration: underline; }
.sz-main a:not([class*="tz-btn"]):not(.sz-linkcard):not(.sz-plainlink):not(.sz-toc__link):not(.sz-breadcrumb__link):not(.sz-gsi) { color: var(--brand-text); }
.sz-main a:not([class*="tz-btn"]):not(.sz-linkcard):not(.sz-plainlink):not(.sz-toc__link):not(.sz-breadcrumb__link):not(.sz-gsi):hover { color: var(--text-primary); }

/* media frames (aspect ratios of the frames) */
.sz-media-45 { aspect-ratio: 4 / 5; }
.sz-media-43 { aspect-ratio: 4 / 3; }
.sz-media-11 { aspect-ratio: 1; border-radius: var(--radius-control); }
.sz-media-1610 { aspect-ratio: 16 / 10; }
.sz-media-45 img, .sz-media-43 img, .sz-media-11 img, .sz-media-1610 img, .sz-hero img, .sz-gallery__main img, .sz-gallery__thumb img, .sz-linkcard__media img, .sz-review__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.sz-figure { margin: 0; display: grid; gap: var(--space-8); }

/* ---------- page headers ---------- */
.sz-pagehead { display: grid; gap: var(--space-16); max-width: var(--sz-measure); }
.sz-pagehead--wide { max-width: none; }
.sz-byline { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-8) var(--space-16); }
/* On narrow screens the dates take a line of their own (handoff-p3, 390). Beside the names they
   decided the wrap by a few pixels, and the fallback font and Peyda decided it differently. */
@media (max-width: 959.98px) { .sz-byline__dates { flex-basis: 100%; } }

/* ---------- table of contents beside an article ---------- */
.sz-withtoc { display: grid; grid-template-columns: var(--sz-toc-w) minmax(0, 1fr); gap: var(--space-48); align-items: start; }
.sz-withtoc--260 { --sz-toc-w: var(--sz-toc-w-page); }
.sz-toc { display: grid; gap: var(--space-8); padding: var(--space-24); border: 1px solid var(--line-subtle); border-radius: var(--radius-frame); background: var(--bg-surface); position: sticky; top: var(--space-24); }
.sz-toc__list { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--space-4); }
.sz-toc__link { display: flex; gap: var(--space-8); align-items: center; min-height: var(--control-sm); color: var(--text-secondary); text-decoration: none; border-radius: var(--radius-indicator); }
.sz-toc__link:hover, .sz-toc__link[aria-current="true"] { color: var(--text-primary); }
.sz-toc__n { font-size: 14px; color: var(--text-tertiary); }
.sz-withtoc > :only-child { grid-column: 1 / -1; }
@media (max-width: 959.98px) {
  .sz-withtoc { grid-template-columns: minmax(0, 1fr); }
  .sz-toc { position: static; }
}
.sz-article { display: grid; gap: var(--space-40); min-width: 0; max-width: var(--sz-measure); }
.sz-article--32 { gap: var(--space-32); }
.sz-steptitle { display: flex; gap: var(--space-12); align-items: baseline; }
.sz-stepnum { width: 28px; height: 28px; flex: none; }

/* ---------- running text from the editor ---------- */
.sz-prose { min-width: 0; overflow-wrap: anywhere; }
.sz-prose > :first-child { margin-top: 0; }
.sz-prose > :last-child { margin-bottom: 0; }
.sz-prose p, .sz-prose li { font-size: 16px; line-height: 28px; }
.sz-prose p { margin: 0 0 var(--space-16); }
.sz-prose h2 { font-size: 20px; line-height: 28px; font-weight: 600; margin: var(--space-32) 0 var(--space-12); scroll-margin-top: var(--space-24); }
.sz-prose h3 { font-size: 17px; font-weight: 600; margin: var(--space-24) 0 var(--space-8); }
.sz-prose h4 { font-size: 16px; line-height: 28px; font-weight: 600; margin: var(--space-16) 0 var(--space-8); }
.sz-prose ul, .sz-prose ol { margin: 0 0 var(--space-16); padding-inline-start: 20px; display: grid; gap: var(--space-4); }
.sz-prose img { border-radius: var(--radius-control); }
/* A Markdown table, as the size table: a frame that scrolls sideways when the table is wider than the text. */
.sz-prose__table { overflow-x: auto; overflow-y: hidden; min-width: 0; max-width: 100%; margin: 0 0 var(--space-16); border: 1px solid var(--line-subtle); border-radius: var(--radius-control); background: var(--bg-surface); }
.sz-prose__table:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.sz-prose__table table { border-collapse: separate; border-spacing: 0; width: 100%; font-variant-numeric: tabular-nums; }
.sz-prose__table th, .sz-prose__table td { padding: var(--space-8) var(--space-16); border-bottom: 1px solid var(--line-subtle); text-align: start; vertical-align: top; font-size: 14px; line-height: 22px; overflow-wrap: normal; }
.sz-prose__table td { min-width: 6em; }
.sz-prose__table thead th { background: var(--bg-sunken); color: var(--text-secondary); font-weight: 500; white-space: nowrap; }
.sz-prose__table tbody tr:last-child > * { border-bottom: 0; }
.sz-prose--sections h2:first-child { margin-top: 0; }
.sz-measure { max-width: var(--sz-measure); }

/* ---------- product ---------- */
.sz-gallery { display: grid; gap: var(--space-8); min-width: 0; }
.sz-gallery__main { aspect-ratio: 4 / 5; border-radius: var(--radius-frame); }
.sz-gallery__thumbs { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: var(--space-8); }
.sz-gallery__thumb { aspect-ratio: 1; border: 1px solid transparent; }
.sz-gallery__thumb.is-current { border-color: var(--text-primary); }
.sz-facts { margin: 0; display: grid; grid-template-columns: repeat(var(--sz-facts, 3), minmax(0, 1fr)); border: 1px solid var(--line-subtle); border-radius: var(--radius-control); background: var(--bg-surface); }
.sz-facts__item { display: grid; padding: var(--space-12) var(--space-16); min-width: 0; }
.sz-facts__item + .sz-facts__item { border-inline-start: 1px solid var(--line-subtle); }
.sz-buy { display: grid; gap: var(--space-16); padding: var(--space-24); border: 1px solid var(--line-subtle); border-radius: var(--radius-frame); background: var(--bg-surface); min-width: 0; }
.sz-buy__form { display: grid; gap: var(--space-16); min-width: 0; }
.sz-buy__group { border: 0; margin: 0; padding: 0; display: grid; gap: var(--space-8); min-width: 0; }
.sz-buy__legend { padding: 0; margin-bottom: var(--space-8); display: flex; gap: var(--space-8); }
.sz-buy__shapes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-8); }
.sz-buy__sizes { display: grid; grid-template-columns: repeat(auto-fill, minmax(var(--sz-size-min), 1fr)); gap: var(--space-8); }
.sz-buy__help { justify-self: start; }
.sz-buy__total { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--space-8); padding-top: var(--space-16); border-top: 1px solid var(--line-subtle); }
.sz-buy__price { display: flex; align-items: baseline; gap: var(--space-4); }
.sz-buy__notify:empty { display: none; }
/* Out of stock size: looks disabled, stays focusable so «خبرم کن» can be reached (EXCEPTIONS SZ-8). */
.sz-buy__sizes .tz-btn.is-disabled:not([aria-pressed="true"]) { cursor: pointer; }
.sz-buy__sizes .tz-btn.is-disabled[aria-pressed="true"] { background: var(--button-primary-bg); color: var(--button-primary-fg); opacity: 0.72; }
.sz-lines { margin: 0; padding: 0; list-style: none; display: grid; border-top: 1px solid var(--line-subtle); }
.sz-lines li { display: flex; justify-content: space-between; gap: var(--space-16); padding: var(--space-8) 0; border-bottom: 1px solid var(--line-subtle); }
.sz-datatable { overflow-x: auto; border: 1px solid var(--line-subtle); border-radius: var(--radius-control); background: var(--bg-surface); }
.sz-datatable table { border-collapse: separate; border-spacing: 0; width: 100%; }
.sz-datatable thead th { background: var(--bg-sunken); color: var(--text-secondary); text-align: start; padding: var(--space-8) var(--space-16); border-bottom: 1px solid var(--line-subtle); }
.sz-datatable tbody th, .sz-datatable td { text-align: start; padding: var(--space-8) var(--space-16); border-bottom: 1px solid var(--line-subtle); }
.sz-datatable td { font-weight: 400; }
.sz-datatable tbody tr:last-child > * { border-bottom: 0; }
.sz-review { display: grid; gap: var(--space-12); padding: var(--space-24); border: 1px solid var(--line-subtle); border-radius: var(--radius-frame); background: var(--bg-surface); }
.sz-review__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--space-8); }
.sz-review__photo { width: var(--sz-review-photo); aspect-ratio: 4 / 5; }

/* tutorial link card (raw tz-card surface, TR-1) */
.sz-linkcard { display: grid; gap: var(--space-16); align-content: start; padding: var(--space-24); border: 1px solid var(--line-subtle); border-radius: var(--radius-frame); background: var(--bg-surface); color: var(--text-primary); text-decoration: none; transition: border-color var(--duration-hover, 160ms) var(--ease-standard); }
.sz-linkcard:hover { border-color: var(--line-default); }
.sz-linkcard:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.sz-linkcard__media { aspect-ratio: 16 / 9; }

/* ---------- tutorial ---------- */
.sz-video { aspect-ratio: 16 / 9; }
.sz-video video, .sz-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: var(--bg-sunken); }
.sz-deflist { margin: 0; display: grid; gap: var(--space-8); }
.sz-deflist > div { display: flex; flex-wrap: wrap; gap: var(--space-4) var(--space-8); }

/* ---------- about, contact, long pages ---------- */
.sz-hero { aspect-ratio: 21 / 9; border-radius: var(--radius-frame); }
@media (max-width: 959.98px) { .sz-hero { aspect-ratio: 4 / 3; } }
.sz-registry { max-width: 520px; }
.sz-registry__title { margin-bottom: var(--space-8); }
.sz-pairs { margin: 0; display: grid; gap: var(--space-8); }
.sz-pairs > div { display: flex; justify-content: space-between; gap: var(--space-16); }
.sz-pairs dd { text-align: end; }
.sz-contact { margin: 0; display: grid; border: 1px solid var(--line-subtle); border-radius: var(--radius-frame); background: var(--bg-surface); padding: var(--space-8) var(--space-24); }
.sz-contact__row { display: flex; gap: var(--space-16); align-items: flex-start; padding: var(--space-16) 0; }
.sz-contact__row + .sz-contact__row { border-top: 1px solid var(--line-subtle); }
.sz-contact__row dd[dir="ltr"] { text-align: end; }
.sz-textarea .tz-field__box { height: auto; padding: 0; }
.sz-textarea textarea.tz-field__input { min-height: 128px; padding: var(--space-12) var(--space-16); resize: vertical; font: inherit; line-height: 26px; }
.sz-shipfacts { margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); border: 1px solid var(--line-subtle); border-radius: var(--radius-frame); background: var(--bg-surface); overflow: hidden; }
.sz-shipfacts__item { display: grid; padding: var(--space-16) var(--space-24); border-bottom: 1px solid var(--line-subtle); margin-bottom: -1px; }
.sz-faq { display: grid; gap: var(--space-40); max-width: var(--sz-faq-max); }
.sz-404 { display: grid; gap: var(--space-24); justify-items: start; max-width: var(--sz-404-max); padding-bottom: var(--space-48); }
.sz-404__search { width: 100%; }
.sz-404__search .tz-field__help:empty { display: none; }

@media (max-width: 959.98px) {
  .sz-main { padding-inline: var(--space-16); }
}

/* ---------- archives (handoff-p4) ---------- */
.sz-grow { flex: 1 1 auto; min-width: 0; }
.sz-headrow--center { align-items: center; }
.sz-grid-300 { display: grid; gap: var(--space-24); grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.sz-grid-420 { display: grid; gap: var(--space-24); grid-template-columns: repeat(auto-fill, minmax(min(100%, 420px), 1fr)); }
.sz-catalog { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-32); align-items: start; }
.sz-catalog--filters { grid-template-columns: var(--sz-toc-w-page) minmax(0, 1fr); }
.sz-filters { display: grid; gap: var(--space-24); padding: var(--space-24); border: 1px solid var(--line-subtle); border-radius: var(--radius-frame); background: var(--bg-surface); position: sticky; top: var(--space-24); min-width: 0; }
.sz-filters__group { margin: 0; }
.sz-filters__open { display: none; }
@media (max-width: 959.98px) {
  .sz-catalog--filters { grid-template-columns: minmax(0, 1fr); }
  .sz-filters { position: static; display: none; }
  .sz-filters.is-open { display: grid; }
  .sz-filters__open { display: inline-flex; }
}
.sz-sort { position: relative; }
.sz-sort__menu { position: absolute; inset-inline-end: 0; top: calc(100% + var(--space-4)); z-index: var(--z-floating, 10); margin: 0; padding: var(--space-8); list-style: none; min-width: 180px; background: var(--bg-raised); border: 1px solid var(--line-default); border-radius: var(--radius-control); box-shadow: var(--shadow-floating, 0 8px 24px rgb(0 0 0 / 0.12)); display: grid; gap: var(--space-4); }
.sz-sort__item { display: flex; align-items: center; gap: var(--space-8); min-height: var(--control-sm); padding: 0 var(--space-8); border-radius: var(--radius-indicator); color: var(--text-primary); text-decoration: none; }
.sz-sort__item:hover { background: var(--bg-hover); }
.sz-sort__item[aria-current="true"] { font-weight: 600; }
.sz-pages { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: var(--space-8); }
.sz-pages__gap { min-width: var(--control-sm); text-align: center; }
.sz-rowlist { margin: 0; padding: 0; list-style: none; display: grid; border-top: 1px solid var(--line-subtle); }
.sz-rowlink { display: flex; align-items: center; gap: var(--space-16); min-height: var(--sz-row-h-xl); padding: var(--space-8) 0; border-bottom: 1px solid var(--line-subtle); color: var(--text-primary); text-decoration: none; }
.sz-rowlink:hover .tz-body-strong { text-decoration: underline; }
.sz-rowlink:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.sz-rowlink--wrap { flex-wrap: wrap; gap: var(--space-8) var(--space-16); }
.sz-rowlink__title { flex: 1 1 200px; min-width: 0; }
.sz-searchform { display: flex; gap: var(--space-8); align-items: flex-start; }
.sz-searchform .tz-field__help:empty { display: none; }
.sz-search-none { max-width: var(--sz-measure); }
.sz-profile { display: grid; grid-template-columns: minmax(0, 280px) minmax(0, 1fr); gap: var(--space-32); align-items: start; }
.sz-profile--solo { grid-template-columns: minmax(0, 1fr); }
.sz-profile__photo { aspect-ratio: 1; max-width: 280px; border-radius: var(--radius-frame); }
.sz-profile__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 639.98px) { .sz-profile { grid-template-columns: minmax(0, 1fr); } }

/* ---------- home (handoff-p5 SizehaMobile under 960, SizehaDesktop from 960) ---------- */
:root {
  --sz-home-card-w: 272px;   /* a pattern card in the phone's scrolling row */
  --sz-home-thumb: 96px;     /* a «coming soon» row card's picture, phone */
  --sz-home-thumb-wide: 128px;
  --sz-home-tut-media: 128px;
  --sz-seam-line: 2px;
  /* One of the hero's two columns on the widest page: the text keeps this width without pictures. */
}
@media (max-width: 959.98px) {
  .sz-main.sz-main--home { padding: var(--space-16) var(--space-24) 0; }
  .sz-wide-only { display: none !important; }
}
@media (min-width: 960px) { .sz-narrow-only { display: none !important; } }
.sz-main--home > .sz-stories { justify-content: space-between; gap: var(--space-8); }
@media (min-width: 960px) { .sz-main--home > .sz-stories { justify-content: flex-start; flex-wrap: wrap; gap: var(--space-24); overflow: visible; } }

/* seam between two sections: needle, dashed line, spool */
.sz-seamline { display: flex; align-items: center; gap: var(--space-8); color: var(--brand-text); }
.sz-seamline__line { flex: 1; height: 0; border-top: var(--sz-seam-line) dashed var(--brand-text); }

/* hero */
.sz-home-hero { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-24); }
.sz-home-hero__text { display: flex; flex-direction: column; gap: var(--space-24); min-width: 0; }
.sz-home-hero__title { text-wrap: balance; }
.sz-home-hero__ctas { display: grid; gap: var(--space-8); }
.sz-home-hero__ctas .tz-btn { width: 100%; }
.sz-home-hero__pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-16); }
@media (max-width: 959.98px) {
  .sz-home-hero__title.tz-display { font-size: var(--type-title-size); line-height: var(--type-title-line); font-weight: var(--type-title-weight); }
}
@media (min-width: 960px) {
  .sz-home-hero { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-48); align-items: center; }
  .sz-home-hero__text { gap: var(--space-32); }
  .sz-home-hero__ctas { display: flex; flex-wrap: wrap; }
  .sz-home-hero__ctas .tz-btn { width: auto; }
}
/* hero.title_mark: a seam sewn once under it on load, by clip-path only (no layout change);
   without motion it is there from the start, whole. */
.sz-mark { position: relative; display: inline-block; }
.sz-mark__seam { position: absolute; inset-inline: 0; bottom: -4px; height: 8px; pointer-events: none; }
.sz-sew { display: block; width: 100%; height: 100%; overflow: visible; animation: sz-sew 1.6s cubic-bezier(.2, 0, 0, 1) .3s both; }
.sz-sew path { fill: none; stroke: var(--brand); stroke-width: 2.5; stroke-dasharray: 8 6; stroke-linecap: round; vector-effect: non-scaling-stroke; }
@keyframes sz-sew { from { clip-path: inset(0 0 0 100%); } to { clip-path: inset(0); } }
@media (prefers-reduced-motion: reduce) { .sz-sew { animation: none; } }

/* section heads: title, subtitle, «همه» */
.sz-home-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--space-8) var(--space-16); }
.sz-home-head__title { grid-column: 1; grid-row: 1; }
.sz-home-head__sub { grid-column: 1 / -1; grid-row: 2; }
.sz-home-more { grid-column: 2; grid-row: 1; }
@media (min-width: 960px) {
  .sz-home-head { align-items: end; }
  .sz-home-head__sub { grid-column: 1; }
  .sz-home-more { grid-row: 1 / span 2; }
}

.sz-home-products__row, .sz-home-soon__cards, .sz-home-tutorials { margin: 0; padding: 0; list-style: none; }

/* patterns: a row that scrolls on the phone, a grid of three from 960 */
.sz-home-products { display: grid; gap: var(--space-24); min-width: 0; }
.sz-home-products__row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-24); align-items: start; }
@media (max-width: 959.98px) {
  .sz-home-products__row { display: flex; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: x mandatory; scroll-padding-inline: var(--space-24); margin-inline: calc(var(--space-24) * -1); padding: 0 var(--space-24) var(--space-8); scrollbar-width: none; }
  .sz-home-products__row::-webkit-scrollbar { display: none; }
  .sz-home-products__row > li { flex: 0 0 var(--sz-home-card-w); scroll-snap-align: start; }
}
.sz-home-soon { display: grid; gap: var(--space-16); min-width: 0; }
.sz-home-soon__cards { display: grid; gap: var(--space-24); --sz-row-thumb: var(--sz-home-thumb); }
.sz-home-soon__cards + .sz-home-soon__form { margin-top: var(--space-8); }
@media (min-width: 960px) {
  .sz-home-soon { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: auto 1fr; column-gap: var(--space-24); align-items: stretch; }
  .sz-home-soon__title { grid-column: 1 / span 2; grid-row: 1; }
  .sz-home-soon__cards { grid-column: 1 / span 2; grid-row: 2; grid-template-columns: repeat(2, minmax(0, 1fr)); --sz-row-thumb: var(--sz-home-thumb-wide); }
  .sz-home-soon__cards + .sz-home-soon__form { grid-column: 3; grid-row: 2; margin-top: 0; }
  .sz-home-soon__form > .sz-notify { height: 100%; box-sizing: border-box; }
  .sz-home-soon--form { grid-template-rows: auto; }
  .sz-home-soon--form .sz-home-soon__form { grid-column: 1 / span 2; }
  .sz-home-soon--cards .sz-home-soon__title, .sz-home-soon--cards .sz-home-soon__cards { grid-column: 1 / -1; }
  .sz-home-soon--cards .sz-home-soon__cards, .sz-home-soon__cards--own { grid-template-columns: repeat(3, minmax(0, 1fr)); --sz-row-thumb: var(--sz-home-thumb-wide); }
}
.sz-home-soon__cards > li { min-width: 0; }
.sz-home-notify { width: 100%; max-width: var(--sz-search-max); }

/* size guide card on brand-soft */
.sz-home-promo { --bg-surface: var(--brand-soft); --bg-sunken: oklch(from var(--brand) 0.9 calc(c * 0.35) h); }
.sz-home-promo__card { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-24); align-items: center; }
.sz-home-promo__icon { display: flex; }
.sz-home-promo__cta .tz-btn { width: 100%; }
@media (min-width: 960px) {
  .sz-home-promo__card { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); grid-template-rows: 1fr auto auto auto 1fr; column-gap: var(--space-48); row-gap: var(--space-24); }
  .sz-home-promo__icon { grid-column: 1; grid-row: 2; }
  .sz-home-promo__text { grid-column: 1; grid-row: 3; }
  .sz-home-promo__cta { grid-column: 1; grid-row: 4; }
  .sz-home-promo__table { grid-column: 2; grid-row: 1 / -1; }
  .sz-home-promo--solo .sz-home-promo__card { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
  .sz-home-promo--solo .sz-home-promo__card > * { grid-column: 1; grid-row: auto; }
  .sz-home-promo__cta .tz-btn { width: auto; height: var(--control-md); min-width: var(--control-md); padding: 0 var(--space-16); }
}

/* tutorials: rows on the phone, three cards from 960 */
.sz-home-tutorials { display: grid; gap: var(--space-24); }
.sz-linkcard--home { grid-template-columns: var(--sz-home-tut-media) minmax(0, 1fr); align-items: center; column-gap: var(--space-16); row-gap: var(--space-8); }
.sz-linkcard--home .sz-linkcard__media { grid-row: 1 / span 2; align-self: center; }
.sz-linkcard--home .sz-linkcard__title { font-size: var(--type-body-size); line-height: var(--type-body-line); font-weight: var(--type-body-strong-weight); align-self: end; }
.sz-linkcard--home > :last-child:not(.sz-linkcard__title) { align-self: start; }
@media (min-width: 960px) {
  .sz-home-tutorials { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
  .sz-linkcard--home { grid-template-columns: minmax(0, 1fr); row-gap: var(--space-16); align-items: start; }
  .sz-linkcard--home .sz-linkcard__media { grid-row: auto; }
  .sz-linkcard--home .sz-linkcard__title { font-size: var(--type-heading-size); line-height: var(--type-heading-line); font-weight: var(--type-heading-weight); align-self: start; }
  .sz-linkcard--home .sz-linkcard__title + * { margin-top: calc(var(--space-8) - var(--space-16)); }
}

/* ---------- hubs (handoff-p5) ---------- */
.sz-linkcard--step { gap: var(--space-12); height: 100%; box-sizing: border-box; }
.sz-linkcard--chart { gap: var(--space-12); }
.sz-rowlink--56 { min-height: var(--sz-row-h-lg); padding: 0; }

/* ---------- Phase 6: cart, checkout, order received, sign-in, account (handoff-p6) ---------- */
.sz-shop { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: var(--space-32); align-items: start; }
@media (max-width: 959.98px) { .sz-shop { grid-template-columns: minmax(0, 1fr); } }
.sz-shop__aside { min-width: 0; }
.sz-minw0 { min-width: 0; }
.sz-narrow { max-width: 720px; }
.sz-strong { font-weight: 600; }
.sz-bare { margin: 0; padding: 0; list-style: none; }
.sz-actions { display: flex; flex-wrap: wrap; gap: var(--space-8); }
.sz-notices { display: grid; gap: var(--space-8); }

.sz-cart { padding-block: 0; }
.sz-cart__row { display: flex; gap: var(--space-16); padding: var(--space-24) 0; border-bottom: 1px solid var(--line-subtle); }
.sz-cart__row:last-child { border-bottom-color: transparent; }
.sz-cart__media { flex: none; width: 80px; aspect-ratio: 4 / 5; }
.sz-cart__media > img { position: absolute; inset: 0; }
.sz-cart__body { flex: 1 1 auto; min-width: 0; display: grid; gap: var(--space-8); align-content: start; }
.sz-cart__top { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-8); }
.sz-cart__foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--space-8); }
.sz-cart__price { white-space: nowrap; }
.sz-qty { display: inline-flex; align-items: center; gap: var(--space-4); border: 1px solid var(--line-control); border-radius: var(--radius-control); padding: 0 var(--space-4); }
.sz-qty__n { min-width: 24px; text-align: center; }

.sz-sums { margin: 0; display: grid; }
.sz-sums__row { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-8); padding: var(--space-8) 0; }
.sz-sums__row dd { margin: 0; text-align: end; }
.sz-sums__total { padding-top: var(--space-16); border-top: 1px solid var(--line-subtle); }
.sz-coupon { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-8); align-items: end; }
.sz-coupon .tz-field__help:empty { display: none; }
.sz-coupon__applied { display: flex; justify-content: space-between; gap: var(--space-8); }

.sz-fieldset { margin: 0; min-width: 0; }
.sz-fieldset__legend { float: right; width: 100%; padding: 0; margin: 0 0 var(--space-8); }
.sz-fieldset__legend + * { clear: both; }
.sz-select select.tz-field__input { appearance: none; -webkit-appearance: none; cursor: pointer; }
.sz-select .tz-field__adorn { pointer-events: none; }
.sz-choice { display: flex; align-items: center; gap: var(--space-12); min-height: 56px; padding: 0 var(--space-16); border-radius: var(--radius-control); border: 1px solid var(--line-subtle); cursor: pointer; }
.sz-choice input { accent-color: var(--text-primary); width: 20px; height: 20px; margin: 0; flex: none; }
.sz-choice:has(input:checked) { background: var(--selection-bg); border-color: var(--selection-line); box-shadow: var(--selection-shadow); }
.sz-choice:focus-within { outline: 2px solid var(--focus); outline-offset: 2px; }
.payment_box { padding: var(--space-8) var(--space-16) 0; }
.sz-check { display: flex; align-items: flex-start; gap: var(--space-8); }
.sz-check input { accent-color: var(--text-primary); width: 20px; height: 20px; margin: 0; flex: none; }
.sz-trust { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-12); padding-top: var(--space-8); border-top: 1px solid var(--line-subtle); }
.sz-trust__enamad { flex: none; }
.sz-trust__line { display: inline-flex; align-items: center; gap: var(--space-8); }
.sz-order-lines { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--space-8); }
.sz-order-lines li { display: flex; justify-content: space-between; gap: var(--space-8); }
.sz-order-lines li > :last-child { flex: none; }
.sz-order-total { display: flex; justify-content: space-between; gap: var(--space-8); padding-top: var(--space-12); border-top: 1px solid var(--line-subtle); }
.sz-order-to { padding-top: var(--space-12); border-top: 1px solid var(--line-subtle); }

.sz-login { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: var(--space-32); align-items: start; }
.sz-stack-4 { display: grid; gap: var(--space-4); align-content: start; min-width: 0; }
.sz-login__ways { display: flex; flex-wrap: wrap; gap: var(--space-8); }
.sz-login__resend { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-8); min-height: var(--control-sm); }
.sz-linkbtn { padding: 0; border: 0; background: none; font: inherit; color: var(--brand-text); text-decoration: underline; cursor: pointer; }
.sz-linkbtn:hover { color: var(--text-primary); }
.sz-linkbtn:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: 4px; }
/* «Sign in with Google», light theme, rectangular (Google branding guidelines):
   white fill, #747775 outline, #1F1F1F text, 40px high, 12px sides, 10px between logo and text. */
.sz-gsi { justify-self: start; display: inline-flex; align-items: center; gap: 10px; height: 40px; padding: 0 12px; box-sizing: border-box; background: #fff; border: 1px solid #747775; border-radius: 4px; color: #1f1f1f; font-size: 14px; line-height: 20px; font-weight: 500; text-decoration: none; }
.sz-gsi:hover { background: #f7f8f8; box-shadow: 0 1px 2px rgba(60, 64, 67, .3), 0 1px 3px 1px rgba(60, 64, 67, .15); }
.sz-gsi:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.sz-gsi__logo { display: inline-flex; width: 20px; height: 20px; }

.sz-account { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: var(--space-32); align-items: start; }
@media (max-width: 959.98px) { .sz-account { grid-template-columns: minmax(0, 1fr); } }
.sz-account__nav { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); padding: var(--space-8); }
.sz-track { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-8) var(--space-16); padding: var(--space-12) var(--space-16); border-radius: var(--radius-control); background: var(--bg-sunken); }
.sz-track__label { flex-basis: 100%; }
.sz-track__code { flex: 1 1 auto; min-width: 0; overflow-x: auto; text-align: left; white-space: nowrap; user-select: all; -webkit-user-select: all; font-size: 15px; }

/* WooCommerce screens shown inside the frame (account endpoints, order-pay, password reset). */
.sz-wc { min-width: 0; display: grid; gap: var(--space-16); }
.sz-wc > * { margin: 0; }
.sz-wc table { width: 100%; border-collapse: collapse; font-size: 14px; }
.sz-wc th, .sz-wc td { padding: var(--space-8); border-bottom: 1px solid var(--line-subtle); text-align: start; vertical-align: top; }
.sz-wc .woocommerce-orders-table { display: block; overflow-x: auto; }
.sz-wc label { display: block; margin-bottom: var(--space-4); font-size: 14px; }
.sz-wc input[type="text"], .sz-wc input[type="email"], .sz-wc input[type="tel"], .sz-wc input[type="password"], .sz-wc select, .sz-wc textarea { width: 100%; box-sizing: border-box; min-height: var(--control-md, 40px); padding: 0 var(--space-12); border: 1px solid var(--line-control); border-radius: var(--radius-control); background: var(--bg-raised); color: inherit; font: inherit; }
.sz-wc .form-row { margin: 0 0 var(--space-16); }
.sz-wc .button, .sz-wc button[type="submit"]:not(.tz-btn) { display: inline-flex; align-items: center; justify-content: center; min-height: var(--control-md, 40px); padding: 0 var(--space-16); border: 1px solid var(--button-secondary-line); border-radius: var(--radius-control); background: var(--button-secondary-bg); color: var(--text-primary); font: inherit; font-weight: 500; text-decoration: none; cursor: pointer; }
.sz-wc address { font-style: normal; }
.woocommerce-error, .woocommerce-message, .woocommerce-info { margin: 0 0 var(--space-8); padding: var(--space-12) var(--space-16); border-radius: var(--radius-control); list-style: none; font-size: 14px; line-height: 20px; }
.woocommerce-error { background: var(--danger-soft); color: var(--danger); }
.woocommerce-message { background: var(--success-soft); color: var(--success); }
.woocommerce-info { background: var(--info-soft); color: var(--info); }
.woocommerce-NoticeGroup-checkout { grid-column: 1 / -1; }