/* Card-local, centered color carousels. Document typography is unchanged. */
.variant-picker { --variant-step:32px; --variant-chip-size:20px; --variant-visible:5; min-width:0; margin:14px 0 0; color:#193b36; text-align:left; }
.variant-caption { display:flex; align-items:baseline; justify-content:space-between; gap:8px; font-size:12px; line-height:1.4; margin:0 0 7px; }
.variant-caption > span:first-child { font-weight:600; flex-shrink:0; }
.variant-caption [data-variant-name] { color:#475b54; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
.variant-rail { position:relative; display:flex; align-items:center; justify-content:center; min-width:0; gap:2px; }
.variant-track { position:relative; display:flex; min-width:0; max-width:100%; overflow-x:auto; overflow-y:hidden; scrollbar-width:none; overscroll-behavior-inline:contain; scroll-snap-type:x mandatory; padding-block:4px; touch-action:pan-x pan-y pinch-zoom; -webkit-overflow-scrolling:touch; }
.variant-track::-webkit-scrollbar { display:none; }
[data-variant-ready] .variant-track { flex:none; box-sizing:border-box; width:calc(var(--variant-visible) * var(--variant-step)); padding-inline:calc((var(--variant-visible) - 1) * var(--variant-step) / 2); overflow-anchor:none; }
/* A fixed odd number of full slots. The outer samples softly fade to hint at the loop. */
.variant-picker.is-looping .variant-track { cursor:default; mask-image:linear-gradient(90deg,rgba(0,0,0,.42),#000 23%,#000 77%,rgba(0,0,0,.42)); -webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,.42),#000 23%,#000 77%,rgba(0,0,0,.42)); }
.variant-choice { flex:0 0 var(--variant-step); width:var(--variant-step); height:44px; display:flex; align-items:center; justify-content:center; background:none; border:0; padding:0; border-radius:7px; color:inherit; cursor:inherit; scroll-snap-align:center; user-select:none; -webkit-user-select:none; -webkit-user-drag:none; }
.variant-choice:active { transform:none!important; }
.variant-chip { display:block; width:var(--variant-chip-size); height:var(--variant-chip-size); flex-shrink:0; border-radius:50%; background:var(--variant-color); border:1px solid #152e2626; box-shadow:0 1px 2px #152e2610; transition:box-shadow .18s,transform .18s; pointer-events:none; }
.variant-chip-art { background-color:var(--variant-paper); background-image:linear-gradient(135deg,transparent 47%,var(--variant-color) 48%); background-size:cover; }
.variant-choice:hover .variant-chip { box-shadow:0 0 0 3px #24645e20; }
.variant-choice.is-selected .variant-chip { transform:scale(1.05); box-shadow:0 0 0 1.5px #fff,0 0 0 3.5px #24645e; }
.variant-choice:focus-visible { outline:2px solid #24645e; outline-offset:-3px; }
.variant-track.is-dragging { cursor:default; scroll-snap-type:none; }
.variant-picker.is-single .variant-track { overflow:hidden; cursor:default; }
.variant-arrow { flex:0 0 24px; width:24px; min-width:24px; height:44px; display:flex; align-items:center; justify-content:center; padding:0; border:0; border-radius:5px; background:transparent; color:#4b6961; cursor:pointer; }
.variant-arrow svg { width:15px; height:15px; stroke-width:1.6; }
.variant-arrow:hover { color:#174e43; background:#24645e0a; }
.variant-arrow:active { transform:none!important; }
.variant-arrow:focus-visible { outline:2px solid #24645e; outline-offset:-2px; }
.variant-image { transition:opacity .14s; }
.variant-image.is-loading { opacity:.45; }

/* Catalogue, independent of the homepage carousel. */
[data-site-page="templates"] .site-template-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:72px 30px; }
[data-site-page="templates"] .site-template-card { min-width:0; }
[data-site-page="templates"] .site-template-preview { padding:13px; background:#f0f4ef; }
[data-site-page="templates"] .site-template-preview img { width:100%; height:auto; display:block; }
[data-site-page="templates"] .site-template-meta { margin-top:13px; flex-direction:row; flex-wrap:wrap; }
[data-site-page="templates"] .site-template-meta h3 { font-size:24px; }
[data-site-page="templates"] .site-template-meta h3 a { text-decoration:none; }
[data-site-page="templates"] .site-template-meta p { font-size:15px; margin-top:5px; }
[data-site-page="templates"] .site-column-label { font-size:12px; }
[data-site-page="templates"] .site-template-use { font-size:16px; min-height:44px; margin-top:16px; padding:12px 15px; }
[data-site-page="templates"] .site-template-use svg { width:18px; height:18px; }
[data-site-page="templates"] .site-catalog-header p { font-size:17px; }
[data-site-page="templates"] .site-catalog-filters a { font-size:14px; }
[data-site-page="templates"] .site-catalog-tools > p { font-size:14px; }
.site-dialog-copy .variant-picker { padding:14px 0; margin:8px 0 15px; max-width:400px; border-block:1px solid #dae4da; }
.site-dialog-copy .variant-caption { font-size:13px; }
.site-dialog-image img { width:100%; }

/* Editor: swatches are siblings of the selection button, never nested buttons. */
.template-option { min-width:0; border:1px solid #ccd7ce; border-radius:10px; background:#fff; overflow:hidden; }
.template-option.is-selected { border-color:#24645e; box-shadow:0 0 0 1px #24645e; }
.template-option > .template-card,.template-option > .template-card.selected { display:block; width:100%; margin:0; padding:0; border:0; box-shadow:none; border-radius:0; background:transparent; }
.template-option > .template-card:focus-visible { outline:3px solid #24645e; outline-offset:-4px; }
.template-option .template-image-wrap { aspect-ratio:8.5/11; padding:10px; background:#f1f5f0; }
.template-option .template-image-wrap img { width:100%; height:100%; object-fit:contain; object-position:top; transform:none; }
.template-option .template-meta { padding:12px 13px 4px; }
.template-option .template-meta h3 { font-size:19px; }
.template-option .template-meta span { font-size:12px; }
.template-option > .variant-picker { padding:0 2px 9px; margin:7px 0 0; }
.template-option .variant-caption { font-size:11px; padding-inline:8px; }
.template-option .template-radio { flex-shrink:0; }
.template-color-help { color:#40564f; font-size:14px; line-height:1.6; margin:0 0 20px; }
@media(max-width:767px) {
  [data-site-page="templates"] .site-template-grid { grid-template-columns:minmax(0,1fr); gap:60px; }
  [data-site-page="templates"] .site-template-card { max-width:520px; width:100%; margin-inline:auto; }
  [data-site-page="templates"] .site-template-meta h3 { font-size:24px; }
  .variant-caption { font-size:13px; }
  #form-content .template-grid { grid-template-columns:minmax(0,1fr); gap:24px; }
  .template-option .template-meta h3 { font-size:22px; }
  .template-option .template-meta span { font-size:14px; }
  .template-option > .variant-picker { padding:0 13px 10px; }
  .template-option .variant-caption { font-size:13px; padding-inline:0; }
}
/* Reduced motion changes animation only, never the chip geometry or palette. */
@media(prefers-reduced-motion:reduce) {
  .variant-chip,.variant-arrow,.variant-image { transition:none; }
}