/* Product top (TODO 00001.5.15). FINAL design/product/inspiration/sections/top/r3/v1.png.
   Breadcrumb; gallery with a 72px left thumbnail column (section 8 product gallery; the composite puts the thumbnails
   left), buy box on white with the Readout L above the price, and the docked AI shopping assistant column
   (section 8 AI panel; the cited rows, section 7). 992+: gallery, buy box, assistant side by side from 1200
   (assistant under them 992-1199); under 992 everything stacks; under 600 the sticky add to cart bar. */
.p-product-top {
  box-sizing: border-box; background: var(--wp--preset--color--white);
  padding: var(--wp--preset--spacing--50) var(--wp--custom--gutter--desktop) 0;
}
.p-product-top *, .p-product-top *::before, .p-product-top *::after { box-sizing: border-box; }
.p-product-top__inner { max-width: var(--wp--custom--layout--wide); margin-inline: auto; }
.p-product-top .p-product-top__inner > * { margin-block: 0; }
.p-product-top a:focus-visible, .p-product-top button:focus-visible, .p-product-top input:focus-visible {
  outline: var(--wp--custom--focus--width) solid var(--wp--preset--color--orange); outline-offset: var(--wp--custom--focus--offset);
}

/* Breadcrumb (section 8): 14px slate links, chevron separators, current page ink. */
.p-product-top__crumbs, .p-product-top .woocommerce-breadcrumb {
  margin: 0; color: var(--wp--preset--color--ink); font-size: var(--wp--preset--font-size--small); line-height: 1.5;
}
.p-product-top .woocommerce-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; column-gap: var(--wp--preset--spacing--20); }
.p-product-top .woocommerce-breadcrumb a { display: inline-flex; align-items: center; min-height: var(--wp--custom--touch); color: var(--wp--preset--color--slate); text-decoration: none; }
.p-product-top .norvane-crumb-sep { display: inline-flex; color: var(--wp--preset--color--slate); }
@media (hover: hover) and (pointer: fine) { .p-product-top .woocommerce-breadcrumb a:hover { color: var(--wp--preset--color--navy); text-decoration: underline; } }
.p-product-top__notices:not(:empty) { margin-top: var(--wp--preset--spacing--50) !important; }

.p-product-top__grid {
  display: grid; grid-template-columns: minmax(0, 5.9fr) minmax(0, 3.4fr) minmax(0, 3.9fr);
  column-gap: var(--wp--preset--spacing--70); align-items: start; margin-top: var(--wp--preset--spacing--50) !important;
}
.p-product-top .p-product-top__grid > * { margin-block: 0; }

/* Gallery (WooCommerce product image gallery: flexslider + photoswipe lightbox on click, Esc closes). */
.p-product-top__gallery .wp-block-woocommerce-product-image-gallery { max-width: none; width: 100%; }
.p-product-top__gallery .woocommerce-product-gallery {
  position: relative; display: grid; grid-template-columns: 72px minmax(0, 1fr); column-gap: var(--wp--preset--spacing--50);
  width: 100%; float: none; margin: 0; opacity: 1 !important;
}
.p-product-top__gallery .flex-viewport, .p-product-top__gallery .woocommerce-product-gallery__wrapper { grid-column: 2; grid-row: 1; }
/* One photo, no thumbnails: the photo takes the whole gallery column. */
.p-product-top__gallery .woocommerce-product-gallery:not(:has(.flex-control-thumbs)) .woocommerce-product-gallery__wrapper { grid-column: 1 / -1; }
.p-product-top__gallery .woocommerce-product-gallery__wrapper { margin: 0; }
.p-product-top__gallery .woocommerce-product-gallery__image {
  background: var(--wp--preset--color--mist); border-radius: var(--wp--custom--radius--default); overflow: hidden;
}
.p-product-top__gallery .woocommerce-product-gallery__image a { display: block; }
.p-product-top__gallery .woocommerce-product-gallery__image img {
  display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; margin: 0;
}
.p-product-top__gallery .flex-viewport { border-radius: var(--wp--custom--radius--default); }
.p-product-top__gallery .flex-control-thumbs {
  grid-column: 1; grid-row: 1; display: flex; flex-direction: column; gap: var(--wp--preset--spacing--40);
  margin: 0; padding: 0; list-style: none;
}
.p-product-top__gallery .flex-control-thumbs li { width: 72px !important; margin: 0; float: none !important; }
.p-product-top__gallery .flex-control-thumbs img {
  display: block; width: 72px; height: 72px; object-fit: cover; cursor: pointer; opacity: 1 !important;
  background: var(--wp--preset--color--mist); border: 1px solid var(--wp--preset--color--line);
  border-radius: var(--wp--custom--radius--default);
}
.p-product-top__gallery .flex-control-thumbs img.flex-active { border: 2px solid var(--wp--preset--color--navy); }
@media (hover: hover) and (pointer: fine) {
  .p-product-top__gallery .flex-control-thumbs img:not(.flex-active):hover { border-color: var(--wp--preset--color--slate); }
}
/* The lightbox opens from the photo itself; the separate magnifier link is not drawn (the composite has none). */
.p-product-top__gallery .woocommerce-product-gallery__trigger { display: none; }

/* Buy box. */
.p-product-top__buy { padding-top: var(--wp--preset--spacing--30); }
.p-product-top .p-product-top__title {
  margin: 0; color: var(--wp--preset--color--navy); font-size: var(--wp--preset--font-size--h-1);
  font-weight: var(--wp--custom--font-weight--h-1); letter-spacing: var(--wp--custom--letter-spacing--h-1); line-height: 1.1;
}
.p-product-top .p-product-top__sub { margin: var(--wp--preset--spacing--30) 0 0; color: var(--wp--preset--color--ink); font-size: var(--wp--preset--font-size--body-l); line-height: 1.4; }
.p-product-top .p-product-top__readout {
  margin: var(--wp--preset--spacing--60) 0 0; color: var(--wp--preset--color--navy);
  font-size: var(--wp--preset--font-size--readout-l); font-weight: var(--wp--custom--font-weight--readout-l);
  letter-spacing: var(--wp--custom--letter-spacing--readout-l); line-height: 1; font-variant-numeric: tabular-nums;
}
.p-product-top .p-product-top__price { margin: var(--wp--preset--spacing--60) 0 0; }
.p-product-top .p-product-top__price, .p-product-top .p-product-top__price .amount {
  color: var(--wp--preset--color--navy); font-size: var(--wp--preset--font-size--h-2); font-weight: var(--wp--custom--font-weight--price); line-height: 1.2;
}
.p-product-top__form { margin-top: var(--wp--preset--spacing--60) !important; }
.p-product-top__form form.cart { display: flex; gap: var(--wp--preset--spacing--40); width: 100%; margin: 0; }
.p-product-top__form form.cart::before, .p-product-top__form form.cart::after { display: none !important; content: none !important; }
.p-product-top__form .quantity { position: relative; flex: none; margin: 0 !important; }
.p-product-top__form .quantity input.qty, .wc-block-add-to-cart-form.p-product-top__form .quantity .qty {
  width: 76px; height: var(--wp--custom--control); padding: 0 var(--wp--preset--spacing--30); margin: 0;
  background: var(--wp--preset--color--white); color: var(--wp--preset--color--ink);
  border: 1px solid var(--wp--preset--color--slate); border-radius: var(--wp--custom--radius--default);
  font: 500 var(--wp--preset--font-size--body) var(--wp--preset--font-family--montserrat); text-align: center; margin-right: 0;
}
.p-product-top__form .screen-reader-text {
  position: absolute !important; width: 1px !important; height: 1px !important; margin: 0 !important; padding: 0 !important;
  overflow: visible !important; white-space: nowrap; clip: auto !important; clip-path: inset(50%) !important; border: 0 !important;
}
.p-product-top__form .single_add_to_cart_button {
  flex: 1 1 auto; min-height: var(--wp--custom--control); margin: 0; padding: 0 var(--wp--preset--spacing--60);
  background: var(--wp--preset--color--orange) !important; color: var(--wp--preset--color--navy) !important; border: 0;
  border-radius: var(--wp--custom--radius--default); font: var(--wp--custom--font-weight--button) var(--wp--preset--font-size--button)/1 var(--wp--preset--font-family--montserrat);
  letter-spacing: var(--wp--custom--letter-spacing--button); cursor: pointer; transition: none;
}
/* Press (00001.5.22.13.b, the .12 rule): scale .98 at once, no transition; the hover ring lands at once. */
.p-product-top__form .single_add_to_cart_button:active { transform: scale(.98); }
@media (hover: hover) and (pointer: fine) {
  .p-product-top__form .single_add_to_cart_button:hover { box-shadow: inset 0 0 0 2px var(--wp--preset--color--navy); }
}
.p-product-top__more { margin-top: var(--wp--preset--spacing--40); }
.p-product-top__ask {
  display: flex; align-items: center; justify-content: center; gap: var(--wp--preset--spacing--30); width: 100%;
  min-height: var(--wp--custom--control); padding: 0 var(--wp--preset--spacing--60);
  background: var(--wp--preset--color--white); color: var(--wp--preset--color--ai); border: 1px solid var(--wp--preset--color--ai);
  border-radius: var(--wp--custom--radius--default); font: var(--wp--custom--font-weight--button) var(--wp--preset--font-size--button)/1 var(--wp--preset--font-family--montserrat);
  letter-spacing: var(--wp--custom--letter-spacing--button); cursor: pointer;
}
@media (hover: hover) and (pointer: fine) { .p-product-top__ask:hover { background: var(--wp--preset--color--ai-surface); } }
.p-product-top .p-product-top__ask:focus-visible { outline-color: var(--wp--preset--color--navy); }
.p-product-top__stock {
  display: flex; align-items: center; gap: var(--wp--preset--spacing--30); margin: var(--wp--preset--spacing--50) 0 0;
  color: var(--wp--preset--color--ink); font-size: var(--wp--preset--font-size--small); font-weight: 500; line-height: 1.5;
}
.p-product-top__stock .p-icon { color: var(--wp--preset--color--navy); }
.p-product-top__stock.is-outofstock { color: var(--wp--preset--color--slate); }

/* Docked AI shopping assistant (AI panel, section 8): ai-surface, 1px ai edge, 24px padding; small text ink or ai (B5). */
.p-product-top__ai {
  padding: var(--wp--preset--spacing--60); background: var(--wp--preset--color--ai-surface);
  border: 1px solid var(--wp--preset--color--ai); border-radius: var(--wp--custom--radius--default); color: var(--wp--preset--color--ink);
}
.p-product-top__ai:focus { outline: none; }
.p-product-top__ai:focus-visible { outline: var(--wp--custom--focus--width) solid var(--wp--preset--color--navy); outline-offset: var(--wp--custom--focus--offset); }
.p-product-top__ai p { margin: 0; }
.p-product-top .p-product-top__ai-label {
  display: flex; align-items: center; gap: var(--wp--preset--spacing--30); padding-bottom: var(--wp--preset--spacing--40);
  border-bottom: 1px solid var(--wp--preset--color--ai); color: var(--wp--preset--color--ai);
  font-size: var(--wp--preset--font-size--label); font-weight: var(--wp--custom--font-weight--label);
  letter-spacing: var(--wp--custom--letter-spacing--label); line-height: 1.3; text-transform: uppercase;
}
.p-product-top .p-product-top__ai-kicker, .p-product-top .p-product-top__ai-cap {
  margin-top: var(--wp--preset--spacing--60); color: var(--wp--preset--color--ai); font-size: var(--wp--preset--font-size--label);
  font-weight: var(--wp--custom--font-weight--label); letter-spacing: var(--wp--custom--letter-spacing--label); line-height: 1.3; text-transform: uppercase;
}
.p-product-top .p-product-top__ai-q {
  margin-top: var(--wp--preset--spacing--30); color: var(--wp--preset--color--navy); font-size: var(--wp--preset--font-size--h-4);
  font-weight: var(--wp--custom--font-weight--h-4); line-height: 1.35;
}
.p-product-top .p-product-top__ai-yes {
  display: flex; align-items: center; gap: var(--wp--preset--spacing--30); margin-top: var(--wp--preset--spacing--50);
  color: var(--wp--preset--color--navy); font-size: var(--wp--preset--font-size--h-3); font-weight: 700; line-height: 1.2;
}
.p-product-top__ai-yes .p-icon { color: var(--wp--preset--color--ai); }
.p-product-top__ai-rows { margin: var(--wp--preset--spacing--40) 0 0; }
.p-product-top__ai-rows > div {
  display: grid; grid-template-columns: 96px minmax(0, 1fr); align-items: center; column-gap: var(--wp--preset--spacing--40);
  min-height: 40px; border-top: 1px solid var(--wp--preset--color--line);
}
.p-product-top__ai-rows > div:last-child { border-bottom: 1px solid var(--wp--preset--color--line); }
.p-product-top__ai-rows dt {
  color: var(--wp--preset--color--ai); font-size: var(--wp--preset--font-size--label); font-weight: var(--wp--custom--font-weight--label);
  letter-spacing: var(--wp--custom--letter-spacing--label); text-transform: uppercase;
}
.p-product-top__ai-rows dd {
  display: flex; align-items: center; justify-content: space-between; gap: var(--wp--preset--spacing--30); margin: 0;
  color: var(--wp--preset--color--ink); font-size: var(--wp--preset--font-size--small); line-height: 1.5;
}
.p-product-top__tick { display: inline-flex; flex: none; color: var(--wp--preset--color--ai); }
.p-product-top__ai-source { margin-top: 0; }
.p-product-top .p-product-top__ai-doc {
  display: flex; align-items: center; gap: var(--wp--preset--spacing--30); margin-top: var(--wp--preset--spacing--20);
  font-size: var(--wp--preset--font-size--small); line-height: 1.5;
}
.p-product-top__ai-doc .p-icon { color: var(--wp--preset--color--ai); }
.p-product-top__ai a { color: var(--wp--preset--color--ai); }
.p-product-top__ai-doc a { min-height: var(--wp--custom--touch); display: inline-flex; align-items: center; text-underline-offset: 3px; }
.p-product-top .p-product-top__ai-note { margin-top: var(--wp--preset--spacing--20); color: var(--wp--preset--color--ink); font-size: var(--wp--preset--font-size--small); line-height: 1.5; }
.p-product-top .p-product-top__ai a:focus-visible { outline-color: var(--wp--preset--color--navy); }
.p-product-top__ai-more { margin: var(--wp--preset--spacing--20) 0 0; padding: 0; list-style: none; }
.p-product-top__ai-more li { border-top: 1px solid var(--wp--preset--color--line); }
.p-product-top__ai-more a {
  display: flex; align-items: center; justify-content: space-between; gap: var(--wp--preset--spacing--40); min-height: var(--wp--custom--touch);
  color: var(--wp--preset--color--ai); font-size: var(--wp--preset--font-size--small); line-height: 1.4; text-decoration: none;
}
@media (hover: hover) and (pointer: fine) { .p-product-top__ai-more a:hover { text-decoration: underline; } }

/* Sticky add to cart bar: phone only, shown by product.js once the buy box has scrolled away. */
.p-product-top__sticky { display: none; }
@media (max-width: 599px) {
  .p-product-top__sticky:not([hidden]) {
    position: fixed; z-index: 40; inset: auto 0 0 0; display: flex; align-items: center; justify-content: space-between;
    gap: var(--wp--preset--spacing--50); padding: var(--wp--preset--spacing--40) var(--wp--custom--gutter--phone);
    background: var(--wp--preset--color--white); border-top: 1px solid var(--wp--preset--color--line); box-shadow: var(--wp--custom--shadow);
  }
  .p-product-top__sticky p { margin: 0; }
  .p-product-top__sticky-text { min-width: 0; }
  .p-product-top__sticky-name { color: var(--wp--preset--color--ink); font-size: var(--wp--preset--font-size--small); line-height: 1.4; }
  .p-product-top__sticky-price, .p-product-top__sticky-price .amount { color: var(--wp--preset--color--navy); font-size: var(--wp--preset--font-size--price); font-weight: 700; line-height: 1.2; }
  .p-product-top__sticky-add {
    display: inline-flex; align-items: center; flex: none; min-height: var(--wp--custom--control); padding: 0 var(--wp--preset--spacing--60);
    background: var(--wp--preset--color--orange); color: var(--wp--preset--color--navy); border-radius: var(--wp--custom--radius--default);
    font-size: var(--wp--preset--font-size--button); font-weight: var(--wp--custom--font-weight--button); text-decoration: none;
  }
  .p-product-top__sticky-add:active { transform: scale(.98); }
}

@media (max-width: 1199px) {
  .p-product-top__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); row-gap: var(--wp--preset--spacing--70); }
  .p-product-top__ai { grid-column: 1 / -1; }
}
@media (max-width: 991px) {
  .p-product-top { padding-inline: var(--wp--custom--gutter--tablet); }
  .p-product-top__grid { grid-template-columns: minmax(0, 1fr); }
  .p-product-top__gallery .wp-block-woocommerce-product-image-gallery { max-width: none; width: 100%; }
.p-product-top__gallery .woocommerce-product-gallery { grid-template-columns: minmax(0, 1fr); row-gap: var(--wp--preset--spacing--40); }
  .p-product-top__gallery .flex-viewport, .p-product-top__gallery .woocommerce-product-gallery__wrapper { grid-column: 1; grid-row: 1; }
  .p-product-top__gallery .flex-control-thumbs { grid-column: 1; grid-row: 2; flex-direction: row; flex-wrap: wrap; }
}
@media (max-width: 599px) {
  .p-product-top { padding-inline: var(--wp--custom--gutter--phone); }
  .p-product-top__gallery .flex-control-thumbs li, .p-product-top__gallery .flex-control-thumbs img { width: 56px !important; height: 56px; }
  .p-product-top__ai { padding: var(--wp--preset--spacing--50); }
  .p-product-top__grid { row-gap: var(--wp--preset--spacing--50); }
  .p-product-top__buy { padding-top: 0; }
}

/* Motion (stage 10, 00001.5.22.9.a; design/FINDINGS.md "Motion inventory: product-top"). inc/motion.php makes the
   section root the one pinned hook (data-mo="hook", --mo-i:0, no delay) and names it product-top; every move is a
   hook-child. Start states live under html.mo and only until the root's .mo-in, so JS off, reduced motion and print
   show the approved look. The story: the Readout value settles 12 px down into place, 1.4 s on the settle ease (a
   readout lands); no pointer mark is drawn (the approved FINAL has none). On a one-photo product the main photo settles
   from 4 percent large inside its slide's existing clip; a multi-photo gallery stays still (flexslider re-inserts it
   after .mo-in and owns its motion). Then price, the Add to cart row and the Ask AI row with stock rise 8 px at 150,
   270 and 390 ms. Transform only: the photo, the Readout and the AI question are LCP elements, and price, stock and the
   AI text are never hidden. Breadcrumb, H1, subtitle, thumbnails, AI column, tabs and sticky bar stay still. The
   transitions are NOT scoped to :not(.mo-done): the root's .mo-done comes from the kit's 2.5 s timer (GO-043). */
.mo .p-product-top[data-mo] .p-product-top__readout { transition: transform 1.4s var(--mo-ease-settle) var(--mo-delay, 0ms); }
.mo .p-product-top[data-mo] .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:only-child img.wp-post-image {
  transition: transform 1.4s var(--mo-ease) var(--mo-delay, 0ms);
}
.mo .p-product-top[data-mo] .p-product-top__price { transition: transform var(--mo-dur) var(--mo-ease) calc(var(--mo-delay, 0ms) + 150ms); }
.mo .p-product-top[data-mo] .p-product-top__form { transition: transform var(--mo-dur) var(--mo-ease) calc(var(--mo-delay, 0ms) + 270ms); }
.mo .p-product-top[data-mo] .p-product-top__more { transition: transform var(--mo-dur) var(--mo-ease) calc(var(--mo-delay, 0ms) + 390ms); }
.mo .p-product-top[data-mo]:not(.mo-in) .p-product-top__readout { transform: translate3d(0, -12px, 0); }
.mo .p-product-top[data-mo]:not(.mo-in) .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:only-child img.wp-post-image { transform: scale(1.04); }
.mo .p-product-top[data-mo]:not(.mo-in) .p-product-top__price,
.mo .p-product-top[data-mo]:not(.mo-in) .p-product-top__form,
.mo .p-product-top[data-mo]:not(.mo-in) .p-product-top__more { transform: translate3d(0, 8px, 0); }