/* Shared layout for the seven signature stores. Card colours, shapes and type families
   belong to the individual editions. A row always grows to fit the actual product copy. */
body.ec-signature {
  --atelier-inset: clamp(1rem, 3.8vw, 3.5rem);
  --atelier-card-type: clamp(1.125rem, 1rem + .75vw, 1.75rem);
  --atelier-label-type: .8125rem;
}

.ec-signature .shell {
  width: min(var(--max), calc(100% - var(--atelier-inset) * 2));
}

.ec-signature :is(.sig-side, .sig-hero-layout, .hero-copy, .sig-featured-copy,
  .sig-index-name, .contact-intro, .contact-links, .reviews-layout > *,
  .customer-review, .woocommerce-tabs .panel, .product_meta, .woocommerce-notices-wrapper) {
  min-width: 0;
}

.ec-signature :is(.sig-hero-title, .hero-copy, .sig-section-heading, .sig-featured-name,
  .sig-index-name, .contact-links > a > span, .customer-review, .comment-text,
  .woocommerce-breadcrumb, .product_title, .page-heading, .product_meta, .woocommerce-product-details__short-description) {
  overflow-wrap: anywhere;
}

.ec-signature :is(.sig-section-heading, .contact-links, .sig-hero-note) {
  flex-wrap: wrap;
}

.ec-signature .brand,
.ec-signature .sig-header .brand-logo {
  min-width: 0;
  max-width: 100%;
}

.ec-signature :is(.sig-index-number, .woocommerce-Price-amount, .es-cart-count) {
  font-variant-numeric: tabular-nums;
}

.ec-signature .sig-section-heading h2,
.ec-signature .contact-intro h2 {
  max-width: 100%;
  line-height: 1.13;
  text-wrap: balance;
}

/* The blurred poster used to extend six to nine percent beyond the stage, wider
   than the entire page gutter on a phone. Filter blur supplies the soft edge. */
body.ec-signature .signature-hero.hero .hero-media.ec-video-stage::before {
  inset-inline: -2%;
}

body.ec-signature.es-store ul.products {
  clear: both;
  align-items: stretch;
  grid-auto-rows: auto;
}

/* Sage's offset cards previously placed the middle action below its neighbours. */
body.ec-signature.ec-design-sage ul.products > li.product:nth-child(n) {
  margin-block: 0 !important;
}

body.ec-signature:not(.ec-design-journal) ul.products > li.product > .woocommerce-loop-product__link {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  align-items: stretch;
}

body.ec-signature:not(.ec-design-journal) ul.products > li.product > .woocommerce-loop-product__link > .price {
  margin-block-start: auto;
}

body.ec-signature.es-store ul.products > li.product .woocommerce-loop-product__title {
  max-width: 100%;
  padding-inline: 0;
  margin-block: 0 .45em;
  font-size: var(--atelier-card-type);
  line-height: 1.22;
  overflow-wrap: anywhere;
  word-break: normal;
}

body.ec-signature.es-store ul.products > li.product .price {
  max-width: 100%;
  margin-block-end: 0;
  font-size: var(--atelier-label-type);
  line-height: 1.45;
  overflow-wrap: anywhere;
}

body.ec-signature.es-store ul.products > li.product > .button {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 44px;
  max-width: 100%;
  height: auto;
  margin-block: .9rem 0;
  gap: .5em;
  font-size: .75rem;
  line-height: 1.32;
  letter-spacing: .035em;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: center;
}

body.ec-signature.ec-design-conservatory ul.products > li.product > .button {
  align-self: start;
}

body.ec-signature.ec-design-journal ul.products > li.product {
  grid-template-columns: minmax(0, .72fr) minmax(0, 1fr);
  grid-template-rows: minmax(min-content, 1fr) auto auto auto;
  column-gap: clamp(.875rem, 2vw, 2rem);
  align-content: start;
}

body.ec-signature.ec-design-journal ul.products > li.product > a img {
  align-self: start;
}

body.ec-signature.ec-design-journal ul.products > li.product .woocommerce-loop-product__title {
  align-self: start;
  margin: 0;
}

body.ec-signature.ec-design-journal ul.products > li.product > .button {
  margin-block-start: .2rem;
}

.ec-signature .store-main :is(.woocommerce-result-count, .woocommerce-ordering) {
  max-width: 100%;
  margin-block-end: 1.25rem;
  font-size: var(--atelier-label-type);
}

.ec-signature .store-main .woocommerce-ordering select {
  min-height: 44px;
  max-width: 100%;
  font-size: .875rem;
}

.ec-signature .store-main div.product .summary {
  min-width: 0;
  max-width: 100%;
}

.ec-signature .store-main div.product .product_title {
  font-size: clamp(2rem, 1.45rem + 2.4vw, 3.875rem);
  line-height: 1.08;
  text-wrap: balance;
}

.ec-signature div.product .summary :is(.woocommerce-product-details__short-description, .woocommerce-variation-description),
.ec-signature div.product .woocommerce-tabs .panel p {
  font-size: 1rem;
  line-height: 1.65;
  max-width: 65ch;
  overflow-wrap: anywhere;
}

body.ec-signature div.product .summary form.cart table.variations {
  width: 100%;
  max-width: 100%;
  table-layout: fixed;
}

body.ec-signature div.product .summary form.cart .variations th.label {
  width: 28%;
  vertical-align: middle;
}

.ec-signature div.product .summary .variations :is(th, td, select, .select2-container),
.ec-signature .woocommerce-checkout :is(fieldset, .form-row, .woocommerce-input-wrapper, .select2-container),
.ec-signature :is(.ec-review-upload, .ec-review-upload input, .ec-review-media, .ec-review-preview) {
  min-width: 0;
  max-width: 100%;
}

.ec-signature div.product .summary .variations select {
  min-height: 46px;
}

.ec-signature div.product form.cart .variations tr > :is(th, td),
.ec-signature .shop_table :is(.product-name, .variation, .wc-item-meta),
.ec-signature :is(.ec-manual-payment, .woocommerce-message, .woocommerce-info, .woocommerce-error) {
  overflow-wrap: anywhere;
}

.ec-signature div.product .summary .woocommerce-variation-add-to-cart {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .75rem;
}

.ec-signature div.product .summary .woocommerce-variation-add-to-cart :is(.quantity, .single_add_to_cart_button) {
  float: none;
  margin: 0;
  min-height: 46px;
  max-width: 100%;
}

.ec-signature div.product .woocommerce-tabs ul.tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0 clamp(1rem, 3vw, 2.5rem);
}

.ec-signature div.product .woocommerce-tabs ul.tabs li {
  max-width: 100%;
  margin-inline: 0;
}

.ec-signature div.product .woocommerce-tabs ul.tabs li a {
  min-height: 44px;
  font-size: .8rem;
  line-height: 1.4;
  letter-spacing: .05em;
  overflow-wrap: anywhere;
}

.ec-signature .ec-review-upload legend {
  max-width: 100%;
  white-space: normal;
}

.ec-signature .shop_table,
.ec-signature .woocommerce-checkout-review-order,
.ec-signature .woocommerce-orders-table {
  min-width: 0;
  max-width: 100%;
}

.ec-signature.woocommerce-checkout #payment :is(li, .payment_box, .place-order, li > label) {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.ec-signature.woocommerce-checkout .form-row label {
  margin-block-end: .35em;
  line-height: 1.45;
}

.ec-signature .sig-footer .contact-links > a {
  min-width: 0;
  max-width: 100%;
}

@media (max-width: 767px) {
  body.ec-signature {
    --atelier-card-type: clamp(1.0625rem, .85rem + .95vw, 1.5rem);
    padding-bottom: calc(66px + env(safe-area-inset-bottom, 0px));
  }

  /* The catalogue immediately below the film already contains the complete product list. */
  body.ec-signature .signature-hero :is(.sig-product-index, .sig-featured-list) {
    display: none;
  }

  body.ec-signature .signature-hero .sig-side {
    display: contents;
  }

  body.ec-signature .signature-hero .sig-hero-title {
    order: 0;
    width: 100%;
    margin: 0;
    font-size: clamp(2rem, 1.2rem + 4.7vw, 3.1rem);
    line-height: 1.07;
  }

  body.ec-signature .signature-hero .hero-copy {
    order: 1;
    width: 100%;
  }

  body.ec-signature .signature-hero .hero-media {
    order: 2;
    align-self: center;
    max-width: 100%;
  }

  /* Bound tall portrait video by the available screen, while preserving its native ratio. */
  body.ec-signature .signature-hero.hero .hero-media.ec-video-stage {
    width: min(100%, calc(59svh * var(--ec-native-ratio, 1))) !important;
  }

  body.ec-signature .sig-mobile-navigation {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  body.ec-signature .sig-mobile-navigation a {
    min-width: 0;
    min-height: 52px;
  }

  body.ec-signature .sig-mobile-navigation a span {
    font-size: .6875rem;
    line-height: 1.3;
  }

  body.ec-signature .sig-footer {
    padding-bottom: 2rem;
  }

  .ec-signature .store-main .woocommerce-ordering {
    float: none;
    clear: both;
  }

  .ec-signature .store-main .woocommerce-result-count {
    float: none;
    margin-bottom: .5rem;
  }

  .ec-signature .store-main .woocommerce-ordering select {
    width: 100%;
    max-width: 100%;
    font-size: 1rem;
  }

  body.ec-signature div.product .summary form.cart table.variations,
  body.ec-signature div.product .summary form.cart table.variations > tbody {
    display: block;
    width: 100%;
  }

  .ec-signature div.product form.cart table.variations tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .35rem;
    margin-block-end: .875rem;
  }

  body.ec-signature div.product .summary form.cart table.variations tr > :is(th.label, td.value) {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    padding: 0;
    text-align: start;
  }

  body.ec-signature div.product .summary form.cart table.variations td.value select {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    font-size: 1rem;
    margin-inline: 0;
  }

  .ec-signature .store-main .woocommerce-checkout .col2-set :is(.col-1, .col-2),
  .ec-signature .store-main .woocommerce-checkout .form-row :is(input.input-text, textarea, select) {
    width: 100%;
  }

  .ec-signature .store-main .woocommerce-checkout .form-row :is(input.input-text, textarea, select) {
    font-size: 1rem;
  }

  .ec-signature .woocommerce-checkout .shop_table :is(th, td) {
    padding-inline: clamp(.375rem, 2.3vw, .875rem);
  }

  .ec-signature.woocommerce-cart table.cart td.actions .coupon {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: stretch;
  }

  .ec-signature.woocommerce-cart table.cart td.actions .coupon :is(#coupon_code, button.button) {
    width: auto;
    min-width: 0;
    max-width: 100%;
    margin: 0;
    flex: 1 1 8rem;
  }
}

@media (max-width: 410px) {
  body.ec-signature .sig-header .header-inner {
    min-width: 0;
    column-gap: .625rem;
  }

  .ec-signature .store-main .woocommerce-checkout :is(.form-row-first, .form-row-last) {
    width: 100%;
    float: none;
  }
}