/* ============================================================
   AE SPORTS - POLISH PASS
   Restraint over decoration: white product grounds, quieter
   badges, tighter type, more air between sections.
   ============================================================ */

/* ---- 1. The white gap under the header --------------------- */
/* Blocksy pads the content container 50px at the top; on the homepage
   the banner has to butt straight up against the header. */
body.home #main .ct-container-full,
body.home #main .ct-container{padding-top:0}
body.home #main{padding-top:0}

/* ---- 2. Sorting select: one arrow, room to breathe --------- */
.woocommerce .woocommerce-ordering{position:relative;display:inline-block}
.woocommerce .woocommerce-ordering select,
.woocommerce select.orderby{
  -webkit-appearance:none;
  appearance:none;
  padding-right:46px;
  padding-left:16px;
  background-image:none;
  text-overflow:ellipsis;
}
.woocommerce .woocommerce-ordering::after{
  content:'';
  position:absolute;
  right:18px;
  top:50%;
  width:9px;
  height:9px;
  margin-top:-7px;
  border-right:1.5px solid var(--ae-on-paper);
  border-bottom:1.5px solid var(--ae-on-paper);
  transform:rotate(45deg);
  pointer-events:none;
}
.woocommerce .woocommerce-ordering select::-ms-expand{display:none}

/* ---- 3. Product media on white, not grey ------------------- */
/* The photography is shot on white; a grey frame around a white photo
   reads as a mistake. One white ground for every card. */
.woocommerce ul.products li.product,
.woocommerce ul.products li.product > figure{
  background:var(--ae-paper-raised);
}
.woocommerce ul.products li.product > figure img{
  padding:clamp(6px,1vw,14px);
}

/* ---- 4. Card type: quieter and tighter --------------------- */
.woocommerce ul.products li.product > ul.entry-meta{
  margin-top:0;
  padding-top:var(--ae-s4);
}
.woocommerce ul.products li.product > ul.entry-meta a{
  font-size:var(--ae-l1);
  letter-spacing:.14em;
  color:var(--ae-on-paper-3);
}
.woocommerce ul.products li.product > h2.woocommerce-loop-product__title a{
  font-size:13.5px;
  line-height:1.35;
  letter-spacing:-.005em;
}
.woocommerce ul.products li.product > .price{
  font-size:14px;
  margin-top:var(--ae-s2);
}
.woocommerce ul.products li.product > .price del{font-size:11.5px}
.woocommerce ul.products li.product > .ae-card-sizes{
  font-size:var(--ae-l1);
  letter-spacing:.06em;
  color:var(--ae-on-paper-3);
}

/* ---- 5. Sale badge: a marker, not a sticker ---------------- */
.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale,
.woocommerce ul.products li.product > figure > span.onsale{
  top:12px;
  left:12px;
  right:auto;
  padding:0;
  min-width:0;
  min-height:0;
  background:transparent;
  color:var(--ae-mark);
  font-size:10.5px;
  font-weight:800;
  letter-spacing:.2em;
  line-height:1;
  border-radius:0;
}

/* ============================================================
   HOMEPAGE - the hand-coded sections
   ============================================================ */

/* ---- 6. Product cards on the homepage --------------------- */
.ae .aeCard{
  background:var(--ae-paper-raised);
  border:1px solid var(--ae-line-paper);
  border-radius:0;
  padding:0 0 18px;
  transition:border-color .3s cubic-bezier(.2,.6,.3,1);
}
.ae .aeCard:hover{border-color:var(--ae-on-paper)}
.ae .aeShot{
  background:var(--ae-paper-raised);
  padding:10px 10px 0;
}
.ae .aeCat,
.ae .aeName,
.ae .aePrice,
.ae .aeBuy{margin-inline:16px}

.ae .aeCat{
  font-size:10.5px;
  letter-spacing:.18em;
  color:var(--ae-on-paper-3);
  margin-top:14px;
}
.ae .aeName{
  font-size:13.5px;
  font-weight:700;
  line-height:1.35;
  color:var(--ae-on-paper);
  margin-top:5px;
}
.ae .aePrice{
  font-size:14px;
  font-weight:800;
  color:var(--ae-on-paper);
  margin-top:9px;
}
.ae .aePrice del{font-size:11.5px;font-weight:500;color:var(--ae-on-paper-3);margin-right:6px}

/* Sale marker, matched to the shop */
.ae .aeSale{
  background:transparent;
  color:var(--ae-mark);
  font-size:10.5px;
  font-weight:800;
  letter-spacing:.2em;
  padding:0;
  border-radius:0;
  top:12px;
  left:12px;
}

/* The card CTA becomes a quiet underlined link, not a boxed button */
.ae .aeBuy{
  display:inline-block;
  margin-top:14px;
  padding:0 0 3px;
  border:0;
  border-bottom:1px solid var(--ae-line-paper);
  background:none;
  border-radius:0;
  font-size:11px;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ae-on-paper);
  width:auto;
  transition:border-color .2s cubic-bezier(.2,.6,.3,1);
}
.ae .aeCard:hover .aeBuy{border-bottom-color:var(--ae-on-paper)}

/* ---- 7. Trust strip: drop the numerals, give it air -------- */
.ae .aeTg > .tr{
  padding:20px 18px;
  border:1px solid var(--ae-line-paper);
  background:var(--ae-paper-raised);
}
/* the counter is <span class="ic">; it adds height without adding meaning */
.ae .aeTg > .tr .ic{display:none}
/* the description is an <em>, which renders italic by default */
.ae .aeTg > .tr em{font-style:normal;display:block}
.ae .aeTg > .tr b{
  display:block;
  font-size:12px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--ae-on-paper);
  line-height:1.3;
}
.ae .aeTg > .tr p,
.ae .aeTg > .tr em{
  font-size:13px;
  line-height:1.55;
  color:var(--ae-on-paper-2);
  margin-top:7px;
}

/* ---- 8. Section rhythm ------------------------------------- */
.ae section.sec,
.ae section.aeA,
.ae section.aeP{padding-block:clamp(56px,7vw,104px)}
.ae section.aeSig{padding-block:clamp(64px,8vw,120px)}

.ae .h2,
.ae section h2{
  overflow-wrap:normal;
  word-break:keep-all;
  hyphens:none;
  text-wrap:balance;
  letter-spacing:-.025em;
}

.ae .lab{
  font-size:var(--ae-l1);
  font-weight:800;
  letter-spacing:.22em;
  color:var(--ae-seal-deep);
}

/* ---- 9. Mobile ---------------------------------------------- */
@media(max-width:767px){
  .ae .aeCard{padding-bottom:16px}
  .ae .aeCat,.ae .aeName,.ae .aePrice,.ae .aeBuy{margin-inline:12px}
  .ae .aeName{font-size:12.5px}
  .ae .aePrice{font-size:13.5px}
  .ae .aeBuy{font-size:10.5px}
  .ae .aeTg > .tr{padding:16px 14px}
  .ae .aeTg > .tr b{font-size:11px;letter-spacing:.08em}
  .ae .aeTg > .tr p,
  .ae .aeTg > .tr em{font-size:12.5px}

  .woocommerce ul.products li.product > h2.woocommerce-loop-product__title a{font-size:12.5px}
  .woocommerce ul.products li.product > .price{font-size:13px}
  .woocommerce .woocommerce-ordering,
  .woocommerce .woocommerce-ordering select{width:100%}
}

/* ------------------------------------------------------------
   The homepage wrapper is a direct child of a constrained block
   layout, which caps it at the content width and leaves paper
   either side of the full-width ink bands. Let it run edge to edge.
   ------------------------------------------------------------ */
body.home .entry-content > .ae,
body.home .entry-content.is-layout-constrained > .ae{
  max-width:none;
  width:100%;
  margin-left:0;
  margin-right:0;
}