:root {
  --chiora-ink: #111;
  --chiora-paper: #fff;
  --chiora-soft: #f5f3f0;
  --chiora-muted: #6f6f6f;
  --chiora-line: #dedede;
  --chiora-shadow: 0 24px 70px rgba(17, 17, 17, .14);
}

body.chiora-modal-open { overflow: hidden; }

.chiora-category-section { padding: 74px 0 84px; }
.chiora-category-section__title { margin: 0 0 36px; font-size: clamp(32px, 4vw, 54px); line-height: 1.05; font-weight: 500; letter-spacing: -.035em; }
.chiora-category-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 20px; }
.chiora-category-card { position: relative; overflow: hidden; min-width: 0; aspect-ratio: 2 / 3; color: #fff; background: #eee; text-decoration: none; isolation: isolate; }
.chiora-category-card:hover { color: #fff; }
.chiora-category-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.chiora-category-card::after { content: ''; position: absolute; inset: 45% 0 0; z-index: 1; background: linear-gradient(transparent, rgba(0,0,0,.72)); }
.chiora-category-card span { position: absolute; left: 20px; right: 20px; bottom: 20px; z-index: 2; color: #fff; font-size: clamp(17px, 1.45vw, 22px); line-height: 1.16; }
.chiora-category-card:hover img, .chiora-category-card:focus-visible img { transform: scale(1.025); }
.chiora-category-card:focus-visible { outline: 3px solid #111; outline-offset: 4px; }

.single-product .chiora-colours { margin: 0 0 18px; padding: 0 0 18px; border-bottom: 1px solid var(--chiora-line); }
.single-product .chiora-product-label { display: block; margin-bottom: 10px; font-size: 12px; font-weight: 400; letter-spacing: .04em; text-transform: uppercase; }
.single-product .chiora-product-label strong { font-weight: 600; }
.chiora-colours__list { display: flex; flex-wrap: wrap; gap: 8px; }
.chiora-colour-link { width: 42px; height: 42px; display: inline-grid; place-items: center; flex: 0 0 42px; border: 1px solid transparent; border-radius: 50%; color: var(--chiora-ink); background: #fff; text-decoration: none; }
.chiora-colour-link:hover, .chiora-colour-link.is-current { color: var(--chiora-ink); border-color: #111; }
.chiora-colour-link:focus-visible { outline: 2px solid #111; outline-offset: 2px; }
.chiora-colour-link__swatch { width: 26px; height: 26px; display: block; border: 1px solid #b9b9b9; border-radius: 50%; background: var(--chiora-colour, #d6d6d6); }
.single-product form.variations_form { display: block; }

.single-product .variations select.chiora-size-select { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important; }
.chiora-size-options { display: flex; flex-wrap: wrap; gap: 9px; }
.chiora-size-option { min-width: 66px; min-height: 46px; padding: 10px; border: 1px solid var(--chiora-line); color: var(--chiora-ink); background: #fff; cursor: pointer; }
.chiora-size-option:not(:disabled):hover, .chiora-size-option:not(:disabled):focus-visible, .chiora-size-option.is-selected { color: #fff; border-color: #111; background: #111; }
.chiora-size-option:disabled { color: var(--chiora-muted); border-color: var(--chiora-line); background: var(--chiora-soft); cursor: not-allowed; opacity: .62; text-decoration: line-through; }
.chiora-size-guide-trigger { margin: 8px 0 18px; padding: 0; border: 0; border-bottom: 1px solid currentColor; color: var(--chiora-ink); background: none; cursor: pointer; }
.chiora-delivery-note { margin-top: 20px; padding: 20px; display: grid; gap: 7px; background: var(--chiora-soft); font-size: 14px; }
.chiora-delivery-note span { color: var(--chiora-muted); }

.chiora-size-guide[hidden] { display: none; }
.chiora-size-guide { position: fixed; inset: 0; z-index: 100000; display: grid; place-items: center; padding: 20px; }
.chiora-size-guide__backdrop { position: absolute; inset: 0; background: rgba(17,17,17,.68); }
.chiora-size-guide__dialog { position: relative; width: min(720px, 100%); max-height: min(820px, calc(100vh - 40px)); overflow: auto; padding: clamp(28px, 5vw, 56px); background: #fff; box-shadow: var(--chiora-shadow); }
.chiora-size-guide__close { position: absolute; top: 16px; right: 18px; width: 42px; height: 42px; padding: 0; border: 0; color: #111; background: transparent; font-size: 34px; line-height: 1; cursor: pointer; }
.chiora-size-guide__eyebrow { color: var(--chiora-muted); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; }
.chiora-size-guide h2 { margin: 10px 0 28px; font-size: 38px; font-weight: 500; }
.chiora-size-guide__scroll { overflow-x: auto; }
.chiora-size-guide table { width: 100%; min-width: 520px; border-collapse: collapse; }
.chiora-size-guide th, .chiora-size-guide td { padding: 15px 10px; border-bottom: 1px solid var(--chiora-line); text-align: center; white-space: nowrap; }
.chiora-size-guide thead th { font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
.chiora-size-guide__hint { margin: 24px 0 0; color: var(--chiora-muted); font-size: 13px; line-height: 1.5; }

@media (max-width: 1023px) {
  .chiora-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  .home .card-slider-container { display: none !important; }
  .chiora-category-section { padding: 50px 0 58px; }
  .chiora-category-section__title { margin-bottom: 26px; }
  .chiora-category-grid { gap: 12px 10px; }
  .chiora-category-card span { left: 12px; right: 12px; bottom: 12px; font-size: 15px; }
  .chiora-size-guide { padding: 0; align-items: end; }
  .chiora-size-guide__dialog { width: 100%; max-height: 90vh; padding: 38px 20px 28px; }
  .chiora-size-guide h2 { font-size: 30px; }
}
