/* Compact mobile reading, with flavor notes available on tap. */
.mobile-copy,
.mobile-company-intro { display: none; }
.flavors details { min-width: 0; }
.flavors summary { list-style: none; cursor: default; }
.flavors summary::-webkit-details-marker { display: none; }
.flavors summary:focus-visible { outline: 2px solid var(--green); outline-offset: 4px; }

@media (max-width: 760px) {
  .hero-intro { display: none; }
  .mobile-company-intro {
    display: block;
    font-size: 13px;
    line-height: 1.95;
    color: var(--muted);
    margin-bottom: 25px;
  }
  .mobile-copy { display: inline; }
  .desktop-copy { display: none; }
  .product-image { height: 28svh; }
  .bakery .product-image { height: 26svh; }
  .product-nav {
    z-index: 60;
    left: auto;
    right: var(--gutter);
    top: 55px;
    bottom: auto;
    transform: none;
    padding: 0;
    gap: 2px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
  }
  .product-nav a { width: 27px; height: 25px; font-size: 9px; }
  .product-copy { padding-bottom: 34px; }
  .flavors li { padding: 11px 0; }
  .flavors summary {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
  }
  .flavors summary::after {
    content: '+';
    font-size: 18px;
    color: var(--green);
    line-height: 1;
    font-weight: 300;
  }
  .flavors details[open] summary::after { content: '−'; }
  .flavors p { font-size: 14px; line-height: 1.8; padding: 8px 0 2px; }
  .coffee-products { margin-top: 17px; }
  .ingredient-tags { margin-top: 15px; }
  .product-description { font-size: 14px; }
}
@media (max-width: 360px) {
  .primary-nav { font-size: 10px; gap: 17px; }
  .product-nav a { width: 24px; }
}