/* Shared readability and interaction roles for Beau Seat's light catalogue UI. */
:root {
  --bg-secondary: #f7f5f1;
  --canvas: #f3f0ea;
  --off-white: #fbfaf7;
  --line: #e3ded5;
  --line-subtle: #ede9e1;
  --sans: "Inter", "PingFang SC", "Microsoft YaHei UI", "Microsoft YaHei", Arial, sans-serif;
  --display: var(--sans);
  --accent: #ad3b14;
  --accent-hover: #9f340d;
  --accent-soft: #b83d12;
  --bg-accent: #b83d12;
  --accent-text: #ad3b14;
  --accent-action: #b83d12;
  --accent-action-hover: #9f340d;
  --muted: #625e58;
  --muted-light: #706c65;
  --global-search-accent: #b83d12;
  color-scheme: light;
  accent-color: var(--accent-action);
  caret-color: var(--accent-action);
}

::selection { color: #fff; background: var(--accent-action); }
html[lang^="en"] .locale-zh { display: none !important; }
html:not([lang^="en"]) .locale-en { display: none !important; }
:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--accent-action);
  outline-offset: 3px;
}

.header .nav a,
.header .bag-trigger,
.header-tools #langToggle { min-width: 44px; min-height: 44px; font-size: 13px; }
.header .nav a { display: inline-flex; align-items: center; }
.header .header-search,
.header .header-tools .menu-trigger { min-width: 44px; min-height: 44px; place-items: center; }
.brand small { font-size: 11px !important; letter-spacing: .02em; }
.footer-column h3 { font-size: 12px !important; }
.footer-column a,
.footer-column span,
.footer-contact-label,
.footer-contact-value { font-size: 13px !important; }
.footer-bottom { color: #625e58 !important; font-size: 11px !important; }
.global-search-eyebrow,
.global-search-section-title,
.global-search-shortcut { color: var(--muted); font-size: 11px; }
.global-search-input::placeholder,
.global-search-input-wrap > svg { color: #68645e; }
.global-search-input::placeholder { opacity: 1; }
.global-search-count { color: #625e58; }
input::placeholder,
textarea::placeholder { color: #68645e !important; opacity: 1; }

:is(.checkout, .pd-form-submit, .pd-primary-cta, .quick-add,
    .form-submit, .modal-add-button, .bag-count) {
  background: var(--accent-action) !important;
  border-color: var(--accent-action) !important;
  color: #fff !important;
}
.product-page .filter[aria-pressed="true"] {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--accent-action) !important;
}
:is(.checkout, .pd-form-submit, .pd-primary-cta, .quick-add,
    .form-submit, .modal-add-button):hover {
  background: var(--accent-action-hover) !important;
  border-color: var(--accent-action-hover) !important;
}
.add-to-list {
  min-height: 44px !important;
  padding: 10px 12px !important;
  border: 1px solid var(--accent-text) !important;
  background: #fff !important;
  color: var(--accent-text) !important;
  font-size: 12px !important;
  letter-spacing: .01em !important;
}
.add-to-list:hover,
.add-to-list[aria-pressed="true"] {
  background: var(--accent-action-hover) !important;
  border-color: var(--accent-action-hover) !important;
  color: #fff !important;
}
.product-card .quick-add {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
}
.footer-column h3,
.footer-column a:hover,
.section-topline,
.home-collection-eyebrow,
.catalog-search > span,
.product-count,
.global-search-eyebrow { color: var(--accent-text) !important; }
.catalog-search > span,
.section-topline { font-size: 12px !important; }
.global-search-result:hover .global-search-result-arrow { color: var(--accent-text); }
.about-page { --about-orange: #ad3b14; --about-orange-bright: #b83d12; }
.home-page .home-collection-eyebrow,
.home-page .hero-index { font-size: 11px !important; }
.home-page .home-collection-lead,
.home-page .home-category-count { color: #625e58 !important; }
.home-page .home-category-count b { color: var(--accent-text) !important; }
.home-page .ticker-inner span { font-size: 11px !important; }
.home-page .footer-brand .brand {
  background: none !important;
  color: #17191c !important;
  -webkit-text-fill-color: #17191c !important;
}
.home-page .footer-brand .brand small,
.home-page .footer-brand p,
.home-page .footer-column a,
.home-page .footer-column span,
.home-page .footer-bottom { color: #625e58 !important; }
.home-page .footer-brand .brand small { font-size: 11px !important; }
.home-page .footer-column h3 { font-size: 12px !important; }
.home-page .footer-column a,
.home-page .footer-column span { font-size: 12px !important; }
.home-page .footer-bottom { font-size: 11px !important; }
.global-search-shortcut,
.global-search-result-copy span { color: #625e58; }

.mobile-nav a {
  min-height: 44px;
  align-content: center;
  font-size: 14px;
}
.filter { min-height: 44px; font-size: 13px; }
.catalog-search input,
.pd-field input,
.pd-field select,
.pd-field textarea,
.inquiry-form input,
.inquiry-form select,
.inquiry-form textarea { min-height: 44px; font-size: 16px; }
.pd-field textarea,
.inquiry-form textarea { min-height: 112px; }
.contact-method-options label,
.pd-method-options label { min-height: 44px; }
.inquiry-data-note {
  margin: 12px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.7;
}
.inquiry-data-note a {
  color: var(--accent-text);
  text-decoration: underline;
  text-underline-offset: .18em;
}
.home-product-status {
  width: min(100% - 40px, 1320px);
  margin: 16px auto 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.6;
}
.home-product-status a { color: var(--accent-text); text-underline-offset: .18em; }

.hero-product-proof {
  position: absolute;
  z-index: 2;
  top: 50%;
  right: max(32px, calc((100% - 1400px) / 2));
  display: grid;
  width: clamp(218px, 25vw, 340px);
  overflow: hidden;
  transform: translateY(-46%);
  border: 1px solid rgb(255 255 255 / 72%);
  background: #fff;
  box-shadow: 0 18px 52px rgb(0 0 0 / 28%);
  color: #17191c;
  text-decoration: none;
}
.hero-product-proof img {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  background: #f8f7f4;
}
.hero-product-proof > span {
  display: flex;
  min-height: 42px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 14px;
  color: #17191c;
  font-size: 12px;
  font-weight: 650;
}
.hero-product-proof > span::after { content: "↗"; color: var(--accent-text); }
.hero-product-proof:hover img { background: #f1efea; }
.hero-product-proof:focus-visible { outline-color: #fff; outline-offset: 5px; }

.catalog-browse-details { margin: 2px 0 22px; }
.catalog-browse-details > summary {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: 10px;
  padding: 0 14px;
  border: 1px solid var(--line);
  color: var(--ink);
  cursor: pointer;
  font-size: 13px;
  font-weight: 650;
  list-style: none;
}
.catalog-browse-details > summary::-webkit-details-marker { display: none; }
.catalog-browse-details > summary::after { content: "+"; color: var(--accent-text); font-size: 18px; }
.catalog-browse-details[open] > summary::after { content: "−"; }
.catalog-browse-details .catalog-carousel { margin-top: 18px; }

.pd-form-submit,
.pd-primary-cta,
.inquiry-form button[type="submit"] { min-height: 48px; }
.product-page .product-count { min-height: 44px; display: inline-flex; align-items: center; }
.contact-page h1,
.contact-page .section-title,
.pd-inquiry-intro h2 { text-wrap: balance; }

@media (max-width: 900px) {
  .hero-product-proof { right: 5%; width: clamp(190px, 29vw, 270px); }
  .header .nav a,
  .header .bag-trigger,
  .header-tools #langToggle { font-size: 11px; }
}

@media (max-width: 760px) {
  .brand small { font-size: 11px !important; letter-spacing: 0 !important; }
  .footer .footer-column a,
  .footer .footer-column span,
  .footer .footer-contact-label,
  .footer .footer-contact-value { font-size: 12px !important; }
  .footer-bottom { font-size: 11px !important; }
  .hero-product-proof {
    top: auto;
    right: 18px;
    bottom: 112px;
    width: clamp(132px, 39vw, 190px);
    transform: none;
  }
  .hero-product-proof > span { min-height: 38px; padding-inline: 10px; font-size: 11px; }
  .catalog-browse-details > summary { width: 100%; justify-content: space-between; }
  .home-product-status { width: calc(100% - 40px); font-size: 12px; }
  .shop-controls .filters { gap: 5px 10px; flex-wrap: wrap; }
  .filter { padding-inline: 4px; }
}

@media (max-width: 390px) {
  .hero-product-proof { right: 12px; bottom: 114px; width: 126px; }
  .hero-product-proof > span { font-size: 11px; }
  .brand small { max-width: 142px; white-space: normal; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-product-proof img,
  .catalog-browse-details > summary { transition: none !important; }
}

.catalog-note { border-left: 0; padding: 0; background: transparent; border-radius: 0; }

/* Unify the site's warm neutral surfaces and type roles without changing its brand voice. */
body.home-page main .hero h1 {
  max-width: 16ch;
  margin: 28px 0 22px;
  font-size: clamp(52px, 7vw, 96px);
  letter-spacing: -.035em;
  line-height: 1.04;
}
body.home-page main .hero h1 em { letter-spacing: -.025em; }
body.home-page.hero-sequence-active main .hero-art::after {
  animation-duration: 1360ms;
}
body.home-page.hero-sequence-active main #heroTitle > .hero-title-line:first-child,
body.home-page.hero-sequence-active main #heroTitle .hero-title-line--split > span,
body.home-page.hero-sequence-active main #heroTitle .hero-title-line--split > em {
  animation-duration: 760ms;
}
body.home-page.hero-sequence-active main #heroTitle .hero-title-line--split > span { animation-delay: 150ms; }
body.home-page.hero-sequence-active main #heroTitle .hero-title-line--split > em { animation-delay: 300ms; }
@media (max-width: 640px) {
  body.home-page main .hero h1 {
    margin: 24px 0 20px;
    font-size: clamp(31px, 9.2vw, 56px);
    letter-spacing: -.035em;
    line-height: 1.06;
  }
}
@media (max-width: 360px) {
  body.home-page main .hero h1 { font-size: 38px; }
}

/* The selection count is secondary navigation metadata, so keep it neutral. */
.header .header-tools .bag-trigger .bag-count {
  min-width: 18px !important;
  height: 18px !important;
  margin-left: 2px;
  padding: 0 5px !important;
  border: 1px solid var(--line) !important;
  border-radius: 999px !important;
  background: var(--canvas) !important;
  color: var(--muted) !important;
  font-size: 10px !important;
  font-weight: 600;
  line-height: 1;
}
.header .header-tools .bag-trigger:hover .bag-count {
  background: var(--off-white) !important;
  color: var(--ink) !important;
}

/* Keep long Chinese page titles balanced across the shared editorial grid. */
.process-page .process-hero h1 {
  max-width: 100%;
  font-size: clamp(48px, 6vw, 88px);
  letter-spacing: -.035em;
  line-height: 1.04;
  text-wrap: balance;
}
.contact-page .contact-hero h1 {
  max-width: 100%;
  font-size: clamp(48px, 5.7vw, 78px);
  letter-spacing: -.035em;
  line-height: 1.07;
  text-wrap: balance;
}

/* Keep the About page's process story content-led, with no empty media frames. */
.about-page .about-case-grid { gap: clamp(24px, 5vw, 64px); }
.about-page .about-case-card,
.about-page .about-case-card-square {
  padding-top: 20px;
  border-top: 1px solid var(--line);
}
.about-page .about-case-media { display: none; }
.about-page .about-case-kicker {
  margin-top: 0;
  color: var(--muted);
  font-size: 11px;
  letter-spacing: .06em;
}
.about-page .about-case-card h3 {
  max-width: 22em;
  font-size: clamp(18px, 2vw, 25px);
  letter-spacing: -.03em;
}
.about-page .about-case-description {
  max-width: 52ch;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.8;
}
.about-page .about-flow-footer > span { color: var(--muted); font-size: 13px; }

@media (max-width: 640px) {
  .process-page .process-hero h1 {
    font-size: clamp(38px, 10vw, 54px);
    letter-spacing: -.03em;
    line-height: 1.08;
  }
  .contact-page .contact-hero h1 {
    max-width: 100%;
    font-size: clamp(38px, 10vw, 54px);
    letter-spacing: -.03em;
    line-height: 1.08;
  }
  .about-page .about-case-card,
  .about-page .about-case-card-square { padding-top: 17px; }
  .about-page .about-case-card h3 { font-size: 19px; }
  .about-page .about-case-description { font-size: 14px; }
}

.about-contact-label { color: var(--muted) !important; }
.product-detail-page .pd-story-index { color: var(--muted); }
.catalog-load-more { display: block; min-width: 44px; min-height: 44px; margin: 44px auto 0; padding: 10px 22px; border: 1px solid var(--line); border-radius: 999px; background: transparent; color: var(--ink); font: inherit; cursor: pointer; transition: background-color .2s ease, border-color .2s ease; }
.catalog-load-more:hover { border-color: var(--ink); background: var(--off-white); }
.catalog-load-more[hidden] { display: none; }