/* css/blocks/182-lead-block.css */
/* =================== lead-block.css =================== */
/* lead-block — final CTA "Нужна консультация по проекту?". Used on /about,
 * /contacts, /delivery as the closing conversion block. Premium two-column
 * card: editorial copy on the left, phone-input + manager CTA + Telegram
 * pill on the right. Ink-tinted card so it stands out from the cream page
 * background. Strictly .lead-block / .lead-block__*. */

.lead-block {
  padding: clamp(44px, 5vw, 72px) 0;
}

.lead-block__card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: clamp(28px, 3vw, 48px);
  align-items: center;
  padding: clamp(36px, 3.6vw, 56px) clamp(28px, 3.2vw, 64px);
  background:
    radial-gradient(900px 540px at 0% 0%, rgba(var(--hc-gold-rgb), 0.18), transparent 58%),
    radial-gradient(700px 460px at 100% 100%, rgba(184, 154, 111, 0.12), transparent 62%),
    linear-gradient(160deg, #1f1a16 0%, #14110e 100%);
  border: 0.5px solid rgba(var(--hc-gold-rgb), 0.32);
  border-radius: clamp(20px, 1.8vw, 28px);
  box-shadow:
    0 2px 4px rgba(0, 0, 0, 0.14),
    0 36px 80px -26px rgba(20, 14, 8, 0.55),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  overflow: hidden;
  isolation: isolate;
  color: rgba(252, 248, 240, 0.92);
}
.lead-block__card::before {
  content: "";
  position: absolute;
  top: 0;
  left: clamp(28px, 3.2vw, 64px);
  right: clamp(28px, 3.2vw, 64px);
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--hc-gold-1, var(--hc-gold, var(--hc-gold))) 30%, var(--hc-gold-2, #b89a6f) 50%, var(--hc-gold-1, var(--hc-gold, var(--hc-gold))) 70%, transparent);
  opacity: 0.72;
  pointer-events: none;
}
.lead-block__card::after {
  content: "";
  position: absolute;
  bottom: -50%;
  right: -10%;
  width: 60%;
  height: 200%;
  background: radial-gradient(circle, rgba(var(--hc-gold-rgb), 0.10), transparent 60%);
  pointer-events: none;
  z-index: 0;
}

.lead-block__body {
  position: relative;
  z-index: 1;
  min-width: 0;
}

.lead-block__eyebrow {
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 18px;
  font-family: var(--hc-mono, "JetBrains Mono", monospace);
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--hc-gold-1, var(--hc-gold, var(--hc-gold)));
  background: rgba(var(--hc-gold-rgb), 0.08);
  border: 0.5px solid rgba(var(--hc-gold-rgb), 0.28);
  border-radius: 999px;
}

.lead-block__title {
  margin: 0 0 16px;
  font-family: var(--hc-serif, "Playfair Display", Georgia, serif);
  font-size: clamp(28px, 3.4vw, 44px);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -0.018em;
  color: var(--hc-paper);
}

.lead-block__desc {
  margin: 0;
  max-width: 48ch;
  font-size: clamp(14px, 1.05vw, 16px);
  line-height: 1.6;
  color: rgba(252, 248, 240, 0.68);
}

.lead-block__ctas {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
}

.lead-block__form {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

/* `input.hc-input` in 101-hc-input.css carries a tag in the selector, so it
   outranks a plain class no matter which file lands later — the dark card
   kept the light .hc-input background while only `color` came from here.
   Match that weight to win back the component's own field. */
input.lead-block__phone {
  width: 100%;
  height: 56px;
  padding: 16px 20px;
  font-family: var(--hc-mono, "JetBrains Mono", monospace);
  font-size: 15px;
  letter-spacing: 0.02em;
  color: var(--hc-paper);
  background: rgba(255, 252, 247, 0.06);
  border: 0.5px solid rgba(var(--hc-gold-rgb), 0.32);
  border-radius: 14px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
  transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}
input.lead-block__phone::placeholder {
  /* was 0.36 — a hint that faint is unreadable on the dark card */
  color: rgba(252, 248, 240, 0.62);
}
input.lead-block__phone:focus {
  outline: none;
  border-color: var(--hc-gold-1, var(--hc-gold, var(--hc-gold)));
  background: rgba(255, 252, 247, 0.10);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 0 0 3px rgba(var(--hc-gold-rgb), 0.22);
}

.lead-block__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  height: 56px;
  padding: 0 24px;
  font-family: var(--hc-sans, "Outfit", sans-serif);
  font-size: 14.5px;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: #2a2018;
  background: linear-gradient(135deg, #e8c896 0%, #c9a878 100%);
  border: 0.5px solid rgba(var(--hc-gold-rgb), 0.55);
  border-radius: 14px;
  cursor: pointer;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.32),
    0 12px 28px -10px rgba(var(--hc-gold-rgb), 0.45),
    0 1px 2px rgba(0, 0, 0, 0.14);
  transition: transform 0.22s ease, box-shadow 0.22s ease, background 0.22s ease;
}
.lead-block__btn:hover {
  transform: translateY(-2px);
  background: linear-gradient(135deg, #f0d4a8 0%, var(--hc-gold, var(--hc-gold)) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.45),
    0 18px 38px -10px rgba(var(--hc-gold-rgb), 0.60),
    0 2px 4px rgba(0, 0, 0, 0.18);
}

/* The consent line sits on the same dark card. Left to the browser default
   the box rendered as a bright system square with body-coloured text beside
   it — the one unstyled control in the block. */
.lead-block__consent {
  display: flex;
  align-items: center;
  gap: 10px;
  color: rgba(252, 248, 240, 0.72);
}
.lead-block__consent a {
  color: var(--hc-gold-1, var(--hc-gold));
  text-underline-offset: 3px;
}
.lead-block__check {
  flex: none;
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: var(--hc-gold-1, var(--hc-gold));
}

@media (max-width: 920px) {
  .lead-block__card {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}

/* css/blocks/020-contact-list.css */
/* =================== contact-list.css =================== */
.contact-list {list-style: none; padding: 0; display: grid; grid-template-columns: 1fr; gap: 10px; margin: 16px 0}
.contact-list > li {padding: var(--hc-sp-2) 0; border-bottom: 1px solid var(--hc-line)}
.contact-list a {display: flex; align-items: flex-start; gap: 3px; padding: 11px 15px; text-decoration: none; color: var(--hc-ink, #1a1714); background: rgba(255, 255, 255, 0.6); border: 0.5px solid var(--hc-line-2, rgba(180, 151, 115, 0.18)); border-radius: 12px; flex-direction: column; transition: border-color 0.22s ease, background 0.22s ease, transform 0.22s ease}
.contact-list a:last-child {border-bottom: none}
/* Set in Playfair while the identical rows in .hc-contact-channel next to it
   were sans — two typefaces for one kind of row, side by side. */
.contact-list a strong {flex-shrink: 0; font: 500 16px/1.3 var(--hc-sans, 'Outfit', sans-serif); color: var(--hc-ink, #1a1714)}
.contact-list a span {color: var(--hc-accent-dark, var(--hc-accent-dark)); font-weight: 500; font-size: 12px}
.contact-list a:hover {border-color: var(--hc-gold-border, rgba(var(--hc-gold-rgb), 0.5)); background: rgba(255, 255, 255, 0.95); transform: translateX(2px)}
.contact-list a:hover span {text-decoration: underline}
.contact-list strong {margin-right: 8px}

/* On ink-tinted cards (premium-surface--highlight) keep links readable. */
.premium-surface--highlight .contact-list a {
  color: rgba(252, 248, 240, 0.92);
  background: rgba(255, 252, 247, 0.04);
  border-color: rgba(var(--hc-gold-rgb), 0.22);
}
.premium-surface--highlight .contact-list a strong {color: var(--hc-paper)}
.premium-surface--highlight .contact-list a span {color: var(--hc-gold-1, var(--hc-gold, var(--hc-gold)))}
.premium-surface--highlight .contact-list a:hover {
  background: rgba(var(--hc-gold-rgb), 0.10);
  border-color: rgba(var(--hc-gold-rgb), 0.55);
}


/* B2B-реквизиты: строки «метка → значение» (были без стилей → текст слипался) */
.contact-legal-grid{ display:grid; gap:0; margin-top:clamp(16px,2vw,22px); max-width:660px; }
.contact-legal-row{ display:grid; grid-template-columns:minmax(110px,170px) 1fr; gap:4px 22px; align-items:baseline; padding:11px 0; border-bottom:1px solid var(--hc-line, rgba(26,23,20,.08)); }
.contact-legal-row:first-child{ padding-top:0; }
.contact-legal-row:last-child{ border-bottom:0; }
.contact-legal-row > span{ font-size:13px; color:var(--hc-ink-soft, rgba(26,23,20,.6)); }
.contact-legal-row > b{ font-weight:600; color:var(--hc-ink, #1a1714); font-variant-numeric:tabular-nums; letter-spacing:.01em; }
@media(max-width:520px){ .contact-legal-row{ grid-template-columns:1fr; gap:2px; padding:9px 0; } }

/* премиум-стрелка на ссылках-плитках адреса/доставки */
.contact-list a{ position:relative; padding-right:40px; }
.contact-list a::after{ content:"→"; position:absolute; right:16px; top:50%; transform:translateY(-50%); font-size:15px; color:var(--hc-gold, var(--hc-gold)); opacity:.55; transition:transform .22s ease, opacity .22s ease; }
.contact-list a:hover::after{ transform:translate(3px,-50%); opacity:1; }

/* css/blocks/012-auth-premium.css */
/* =================== auth-premium.css =================== */
/* auth-premium — premium auth page layout (2-col: form panel + value-prop
 * aside with benefits list). Single source of truth.
 *
 * NB: previously every rule was wrapped in `@media(max-width:920px)`,
 * which silently hid the 2-col grid on desktop. Rules moved to base scope. */

.auth-premium {
  padding: clamp(40px, 5vw, 80px) 0;
}

.auth-premium__grid {
  display: grid;
  grid-template-columns: minmax(0, 560px) minmax(260px, 320px);
  gap: clamp(28px, 3vw, 52px);
  align-items: start;
  justify-content: center;
  max-width: 1160px;
  margin: 0 auto;
}
.auth-premium__grid--single { grid-template-columns: minmax(0, 560px); }
.auth-premium__benefits + .hc-btn { margin-top: 16px; }

.auth-premium__panel {
  padding: clamp(28px, 3vw, 40px);
  background: var(--hc-paper, #ffffff);
  border: 0.5px solid var(--hc-gold-border, rgba(180, 151, 115, 0.32));
  border-radius: 18px;
  box-shadow:
    0 1px 2px rgba(40, 30, 15, 0.03),
    0 24px 60px -28px rgba(27, 20, 13, 0.18);
}

/* premium heading block */
.auth-premium__eyebrow {
  display: inline-block;
  margin-bottom: 10px;
  font: 600 11px/1 var(--hc-mono, "JetBrains Mono", monospace);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--hc-accent, var(--hc-accent));
}
.auth-premium__title {
  margin: 0 0 8px;
  font-family: var(--hc-serif, "Playfair Display", Georgia, serif);
  font-size: clamp(30px, 3.2vw, 44px);
  font-weight: 500;
  line-height: 1.04;
  letter-spacing: -0.01em;
  color: var(--hc-ink, #1a1714);
}
.auth-premium__lead {
  margin: 0 0 4px;
  max-width: 44ch;
  color: var(--hc-ink-mid, rgba(26, 23, 20, 0.62));
  font-size: 15px;
  line-height: 1.5;
}

/* premium full-width submit */
.auth-premium__panel .hc-btn--primary {
  min-height: 52px;
  margin-top: 4px;
  border-radius: 14px;
  letter-spacing: 0.01em;
  box-shadow: 0 14px 30px -12px rgba(26, 23, 20, 0.45);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.auth-premium__panel .hc-btn--primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 20px 40px -12px rgba(26, 23, 20, 0.52);
}

.auth-premium__aside {
  padding: clamp(24px, 2.6vw, 36px);
  background: linear-gradient(135deg, rgba(255, 252, 247, 0.95), rgba(248, 244, 237, 0.86));
  border: 0.5px solid rgba(180, 151, 115, 0.22);
  border-radius: 18px;
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.auth-premium__aside::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: radial-gradient(540px 280px at 80% -20%, rgba(var(--hc-gold-rgb), 0.30), transparent 60%);
  pointer-events: none;
}

.auth-premium__benefits {
  list-style: none;
  padding: 0;
  margin: 16px 0 0;
  display: grid;
  gap: 10px;
}
.auth-premium__benefits li {
  position: relative;
  padding-left: 28px;
  font-family: var(--hc-sans, "Outfit", sans-serif);
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--hc-ink-soft, rgba(26, 23, 20, 0.72));
}
.auth-premium__benefits li strong {
  display: block;
  font-weight: 600;
  color: var(--hc-ink, #1a1714);
}
.auth-premium__benefits li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 3px;
  width: 18px;
  height: 18px;
  background: linear-gradient(135deg, rgba(var(--hc-gold-rgb), 0.32), rgba(184, 154, 111, 0.14));
  border: 0.5px solid var(--hc-gold-border, rgba(var(--hc-gold-rgb), 0.45));
  border-radius: 50%;
}
.auth-premium__benefits li::after {
  content: "";
  position: absolute;
  left: 0;
  top: 3px;
  width: 18px;
  height: 18px;
  background-color: var(--hc-accent-dark, #7a6548);
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>");
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-size: 10px 10px;
          mask-size: 10px 10px;
}

.auth-consent {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin: 12px 0 18px;
  font-family: var(--hc-sans, "Outfit", sans-serif);
  font-size: 13px;
  line-height: 1.45;
  color: var(--hc-ink-soft, rgba(26, 23, 20, 0.74));
}

.auth-consent input[type="checkbox"] {
  margin-top: 2px;
  inline-size: 16px;
  block-size: 16px;
  accent-color: var(--hc-accent, var(--hc-accent));
}

.auth-consent a {
  color: var(--hc-accent-dark, #6a573f);
  text-decoration: underline;
}

.auth-consent--compact {
  margin: 6px 0 14px;
}






@media (max-width: 768px) {
  .auth-premium__grid {
    grid-template-columns: 1fr;
    gap: var(--hc-sp-4);
  }
}

/* css/blocks/208-premium-kpis.css */
/* =================== premium-kpis.css =================== */
/* premium-kpis — stat-row block: serif metric + uppercase mono label.
 * Used on /about ("Почему выбирают нас"), /delivery ("Доставим по России")
 * and other content cards. Adapts to ink context (premium-surface--highlight)
 * with cream metric + gold label so values stay visible on dark cards.
 * Strictly .premium-kpis / .premium-kpis__*. */

/* Flex sized each stat by its own content, so a long label ("рейтинг
   Яндекс.Карт · 111 отзывов") pushed the stat after it far to the right and
   the row read as three values scattered rather than three columns. Equal
   columns line the numbers up and let the long label wrap under its own. */
.premium-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: clamp(20px, 2.4vw, 32px);
  margin: 18px 0;
  padding: 18px 0;
  border-top: 0.5px solid rgba(180, 151, 115, 0.18);
  border-bottom: 0.5px solid rgba(180, 151, 115, 0.18);
}
.premium-kpis > div {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: flex-start;
  position: relative;
  padding-bottom: 4px;
}
.premium-kpis strong {
  display: block;
  margin: 0;
  font-family: var(--hc-serif, "Playfair Display", Georgia, serif);
  font-size: clamp(26px, 2.6vw, 36px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.015em;
  color: var(--hc-ink, #1a1714);
  font-variant-numeric: tabular-nums;
}
.premium-kpis span {
  display: block;
  margin-top: 2px;
  padding-top: 8px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--hc-ink-mid, rgba(26, 23, 20, 0.55));
  position: relative;
}
.premium-kpis span::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 28px;
  height: 1.5px;
  background: linear-gradient(90deg, var(--hc-gold-1, var(--hc-gold, var(--hc-gold))), var(--hc-gold-2, #b89a6f));
  border-radius: 999px;
}

/* Adaptation when KPIs live inside an ink-tinted card (premium-surface--highlight) */
.premium-surface--highlight .premium-kpis {
  border-top-color: rgba(var(--hc-gold-rgb), 0.22);
  border-bottom-color: rgba(var(--hc-gold-rgb), 0.22);
}
.premium-surface--highlight .premium-kpis strong {
  color: var(--hc-paper);
}
.premium-surface--highlight .premium-kpis span {
  color: rgba(252, 248, 240, 0.62);
}

/* css/blocks/013-auth.css */
/* auth base primitives used by premium auth layout and account forms */
/* The form was 480px centred inside a 716px panel, so the card had two left
   edges: the heading started at the panel padding and the EMAIL label 117px
   further in, with an uneven margin left and right of the fields. The form now
   fills its panel and the panel is what carries the reading width — see
   .auth-premium__grid. */
.auth__form {
  margin: var(--hc-sp-5) 0;
  display: grid;
  gap: 14px;
}

.auth__err {
  padding: var(--hc-sp-3);
  background: var(--hc-danger-soft);
  color: var(--hc-danger);
  border-radius: var(--hc-r-sm);
  margin-bottom: var(--hc-sp-3);
  font-size: var(--hc-fs-sm);
}

.auth__alt {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 0.5px solid rgba(180, 151, 115, 0.18);
  text-align: center;
  font-size: 13px;
  color: rgba(26, 23, 20, 0.65);
}

.auth__alt a {
  color: var(--hc-accent, var(--hc-accent));
  text-decoration: underline;
}

.auth__sep {
  margin-top: 6px;
  padding-top: 10px;
  border-top: 0.5px solid rgba(180, 151, 115, 0.18);
  font-family: var(--hc-mono, "JetBrains Mono", monospace);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(26, 23, 20, 0.58);
}

.auth__grid2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.auth-b2b-toggle {
  display: grid;
  gap: 3px;
  width: 100%;
  margin-top: 2px;
  padding: 14px 16px;
  text-align: left;
  background: linear-gradient(180deg, rgba(255, 253, 249, 0.96), rgba(248, 242, 232, 0.88));
  border: 1px solid rgba(141, 109, 71, 0.18);
  border-radius: 14px;
  color: var(--hc-ink, #1a1714);
  cursor: pointer;
}

.auth-b2b-toggle span {
  font-weight: 650;
}

.auth-b2b-toggle small {
  color: rgba(26, 23, 20, 0.62);
  line-height: 1.35;
}

.auth-b2b-toggle[aria-expanded="true"] {
  border-color: rgba(var(--hc-gold-rgb), 0.45);
  box-shadow: 0 12px 28px -22px rgba(78, 58, 35, 0.45);
}

.auth-b2b-fields {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(var(--hc-gold-rgb), 0.24);
  border-radius: 16px;
  background: rgba(255, 252, 247, 0.76);
}

@media (max-width: 640px) {
  .auth__grid2 {
    grid-template-columns: 1fr;
  }
}

/* css/blocks/032-fld.css */
/* =================== fld.css =================== */
.fld {display: flex; flex-direction: column; gap: 6px; margin-bottom: var(--hc-sp-3)}
.fld > label {font-size: var(--hc-fs-sm); font-weight: 500}


.auth-premium__panel .fld {
  display: grid;
  gap: 8px;
  margin-bottom: 16px;
}
.auth-premium__panel .fld span {
  font-family: var(--hc-mono, "JetBrains Mono", monospace);
  font-size: 11.5px;
  line-height: 1.2;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(26, 23, 20, 0.66);
}
/* v8.2 — auth panel uses .premium-surface--highlight (ink-tinted bg),
 * default ink-on-ink label colour is unreadable. Override to gold accent. */
.premium-surface--highlight.auth-premium__panel .fld span,
.premium-surface--highlight .auth-premium__panel .fld span {
  color: var(--hc-gold-1, var(--hc-gold, var(--hc-gold)));
}
.auth-premium__panel .fld input,
.auth-premium__panel .fld textarea,
.auth-premium__panel .fld select {
  width: 100%;
  min-height: 48px;
  padding: 0 14px;
  border-radius: 12px;
  border: 1px solid var(--sf-line-strong, rgba(141, 109, 71, 0.22));
  background: rgba(255, 252, 247, 0.98);
  color: var(--sf-ink, var(--hc-ink, #1a1714));
  font-family: var(--hc-sans, "Outfit", sans-serif);
  font-size: 15px;
  line-height: 1.35;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.62);
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}
.auth-premium__panel .fld input::placeholder,
.auth-premium__panel .fld textarea::placeholder {
  color: rgba(26, 23, 20, 0.38);
}
.auth-premium__panel .fld input:focus,
.auth-premium__panel .fld textarea:focus,
.auth-premium__panel .fld select:focus {
  outline: none;
  border-color: var(--hc-accent, var(--hc-accent));
  box-shadow: 0 0 0 3px rgba(var(--hc-gold-rgb), 0.22);
  background: var(--hc-paper, #ffffff);
}


/* Tracking-page field styling now lives in its own block (219-tracking.css),
 * co-located with the rest of that page's premium styling. */

/* v7.66 — password show/hide toggle */
.fld__pw { position: relative; display: block; }
.fld__pw input { padding-right: 44px; width: 100%; }
.fld__pw-toggle { position: absolute; right: 3px; top: 50%; transform: translateY(-50%); display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; color: var(--hc-accent, var(--hc-accent)); cursor: pointer; border-radius: 8px; }
.fld__pw-toggle:hover, .fld__pw-toggle[aria-pressed="true"] { color: var(--hc-ink, #1a1714); }

/* css/blocks/036-hc-accordion.css */
/* =================== hc-accordion.css =================== */
.hc-accordion {
border-radius: var(--hc-r-md);
  overflow: hidden;
  background: var(--hc-paper);
  box-shadow: var(--hc-sh-1);
}
.hc-accordion__item {
border-bottom: 1px solid var(--hc-line);
}
.hc-accordion__item:last-child {
border-bottom: none;
}
.hc-accordion__header {
display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--hc-sp-4) var(--hc-sp-5);
  background: transparent;
  border: none;
  width: 100%;
  cursor: pointer;
  font-size: var(--hc-fs-lg);
  font-weight: 600;
  color: var(--hc-ink);
  transition: all var(--hc-dur-base) var(--hc-ease);
  user-select: none;
}
.hc-accordion__header:hover {
background: rgba(var(--hc-gold-rgb), 0.08);
}
.hc-accordion__icon {
display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  transition: transform var(--hc-dur-base) var(--hc-ease);
  flex-shrink: 0;
}

.hc-accordion__content {
max-height: 0;
  overflow: hidden;
  transition: max-height var(--hc-dur-base) var(--hc-ease), padding var(--hc-dur-base) var(--hc-ease), opacity var(--hc-dur-base) var(--hc-ease);
  opacity: 0;
  padding: 0 var(--hc-sp-5);
}

.hc-accordion__body {
color: var(--hc-ink-soft);
  font-size: var(--hc-fs-md);
  line-height: var(--hc-lh-loose);
}

.hc-accordion__item.is-active .hc-accordion__content {
max-height: 600px;
  padding: 0 var(--hc-sp-5) var(--hc-sp-4) var(--hc-sp-5);
  opacity: 1;
}

.hc-accordion__item.is-active .hc-accordion__icon {
transform: rotate(180deg);
}

/* css/blocks/190-panel.css */
/* =================== panel.css =================== */
.panel {padding: clamp(20px, 2.4vw, 28px); background: linear-gradient(180deg, rgba(255, 252, 247, 1), rgba(248, 244, 237, 0.6)); border: 0.5px solid rgba(180, 151, 115, 0.18); border-radius: 14px; margin-bottom: clamp(16px, 2vw, 24px)}

/* css/blocks/229-account-inbox.css */
/* =================== account-inbox.css =================== */
/* Account support inbox + thread pages. Scoped to .acct-inbox__* and
 * .acct-thread__* to avoid cross-page cascade bleed. */

.acct-inbox {
  padding: clamp(16px, 2vw, 24px);
}

.acct-inbox__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.acct-inbox__head h2 {
  margin: 0;
  font-size: clamp(20px, 2.2vw, 28px);
}

.acct-inbox__list {
  display: grid;
  gap: 10px;
}

.acct-inbox__row {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid var(--hc-line, rgba(26, 23, 20, 0.08));
  border-radius: var(--hc-r-lg, 16px);
  text-decoration: none;
  color: inherit;
  background: var(--hc-paper, #ffffff);
  transition: border-color var(--hc-dur-base, 220ms) var(--hc-ease, ease),
    transform var(--hc-dur-fast, 140ms) var(--hc-ease-out, ease);
}

.acct-inbox__row:hover {
  border-color: var(--hc-accent, var(--hc-accent));
  transform: translateY(-1px);
}

.acct-inbox__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.acct-inbox__snippet {
  margin: 0;
  color: var(--hc-ink-soft, rgba(26, 23, 20, 0.7));
}

.acct-thread {
  padding: clamp(16px, 2vw, 24px);
  display: grid;
  gap: 16px;
}

.acct-thread__timeline {
  display: grid;
  gap: 10px;
}

.acct-thread__item {
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid var(--hc-line, rgba(26, 23, 20, 0.08));
  background: var(--hc-paper-2, var(--hc-paper-2));
}

.acct-thread__item.is-mine {
  border-color: rgba(var(--hc-accent-rgb), 0.35);
  background: rgba(var(--hc-gold-rgb), 0.12);
}

.acct-thread__item-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}

.acct-thread__item-title {
  margin: 0 0 6px;
  font-size: 15px;
}

.acct-thread__item-text {
  margin: 0;
  white-space: pre-wrap;
  line-height: 1.5;
}

.acct-thread__reply {
  border-top: 1px solid var(--hc-line, rgba(26, 23, 20, 0.08));
  padding-top: 14px;
  display: grid;
  gap: 12px;
}

/* css/blocks/230-account-documents.css */
/* =================== account-documents.css =================== */
/* Scoped styles for account documents matrix. */

.acct-docs-table th,
.acct-docs-table td {
  vertical-align: middle;
}

.acct-docs-table__actions {
  white-space: nowrap;
}

@media (max-width: 980px) {
  .acct-docs-table {
    min-width: 760px;
  }
}

@media (max-width: 700px) {
  .acct-docs-table {
    display: block;
    min-width: 0;
    border: 0;
    background: transparent;
    overflow: visible;
  }

  .acct-docs-table thead {
    display: none;
  }

  .acct-docs-table tbody,
  .acct-docs-table tr,
  .acct-docs-table td {
    display: block;
    width: 100%;
  }

  .acct-docs-table tr {
    margin: 0 0 12px;
    padding: 12px;
    border: 0.5px solid rgba(180, 151, 115, 0.22);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(31, 25, 18, 0.06);
  }

  .acct-docs-table td {
    display: grid;
    grid-template-columns: minmax(92px, 36%) minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 10px 0;
    border: 0;
    font-size: 14px;
    overflow-wrap: anywhere;
  }

  .acct-docs-table td + td {
    border-top: 0.5px solid rgba(26, 23, 20, 0.08);
  }

  .acct-docs-table td::before {
    content: attr(data-label);
    font-family: var(--hc-mono, "JetBrains Mono", monospace);
    font-size: 10px;
    line-height: 1.2;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--hc-ink-mid, rgba(26, 23, 20, 0.55));
  }

  .acct-docs-table__actions {
    white-space: normal;
  }

  .acct-docs-table__actions .hc-btn {
    width: 100%;
    justify-content: center;
    min-width: 0;
  }
}

/* css/blocks/231-account-wishlist-public.css */
/* =================== account-wishlist-public.css =================== */

.page-wishlist-public .hc-pgrid {
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: var(--hc-sp-4, 20px);
}

.page-wishlist-public .premium-surface {
  margin-bottom: var(--hc-sp-5, 24px);
}

.wl-public-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 100%;
  background: var(--hc-paper, #fff);
  border: 1px solid var(--hc-line, #e8e2da);
  border-radius: 16px;
  overflow: hidden;
}

.wl-public-card .hc-pcard__media {
  display: block;
  min-height: 200px;
  background: var(--hc-paper-2, var(--hc-paper-2));
}
.wl-public-card .hc-pcard__media img { display:block;width:100%;height:200px;object-fit:contain; }
.wl-public-card .hc-pcard__body { min-width:0;overflow-wrap:anywhere; }

.wl-public-card .hc-pcard__body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px;
  flex: 1;
}

.wl-public-card .hc-pcard__title { margin:0;font-size:18px;line-height:1.4; }
.wl-public-card .hc-pcard__title a { color:inherit;text-decoration:none; }

.wl-public-card .hc-pcard__bot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 8px;
}

/* css/blocks/232-account-approvals-bulk.css */
/* =================== account-approvals-bulk.css =================== */

.hc-approval-bulk {
  padding: 14px;
  margin-bottom: 14px;
  display: grid;
  gap: 10px;
}

.hc-approval-bulk__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.hc-approval-card__chk {
  margin-right: 8px;
  display: inline-flex;
  align-items: center;
}

.hc-approval-select {
  width: 18px;
  height: 18px;
}

/* css/blocks/233-account-legal-entities.css */
/* =================== account-legal-entities.css =================== */

.le-list {
  padding: 16px;
}

.le-list__grid {
  display: grid;
  gap: 10px;
}

.le-list__item {
  border: 1px solid var(--hc-line, rgba(26, 23, 20, 0.08));
  border-radius: var(--hc-r-lg, 16px);
  background: var(--hc-paper, #fff);
  padding: 12px;
}

.le-list__head {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: space-between;
}

.le-list__actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

/* css/blocks/234-account-shell.css */
/* =================== account-shell.css =================== */
/* Shared account layout primitives: hero, tabs, quick links and orders table. */

.acct,
.acct-premium {
  padding-top: var(--hc-sp-5, 24px);
  padding-bottom: var(--hc-sp-5, 24px);
}

.acct-premium__hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: clamp(14px, 2vw, 28px);
  flex-wrap: wrap;
  margin-bottom: var(--hc-sp-5, 24px);
}

.acct-premium__hero h1 {
  margin: 0;
  font-size: clamp(28px, 3vw, 40px);
}

.acct-premium__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 var(--hc-sp-5, 24px);
  padding: 10px;
  background: rgba(255, 255, 255, 0.72);
  border: 0.5px solid rgba(180, 151, 115, 0.22);
  border-radius: 14px;
}

.acct-premium__tabs > a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 36px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 0.5px solid rgba(180, 151, 115, 0.18);
  background: rgba(255, 255, 255, 0.86);
  color: var(--hc-ink-soft, rgba(26, 23, 20, 0.72));
  font-size: 13px;
  text-decoration: none;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.acct-premium__tabs > a:hover {
  color: var(--hc-ink, #1a1714);
  border-color: rgba(180, 151, 115, 0.42);
}

.acct-premium__tabs > a.is-active {
  background: linear-gradient(180deg, #1f1a15, #14110d);
  border-color: rgba(0, 0, 0, 0.34);
  color: #fff;
}

.hc-tab-badge {
  display: inline-block;
  margin-left: 2px;
  padding: 1px 8px;
  background: #b8860b;
  color: #fff;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.4;
}

.acct-premium__quick {
  margin: 0 0 var(--hc-sp-5, 24px);
}

.acct__orders {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 0.5px solid rgba(180, 151, 115, 0.22);
  border-radius: 14px;
  overflow: hidden;
  background: #fff;
}

.acct__orders th,
.acct__orders td {
  padding: 12px 14px;
  border-bottom: 0.5px solid rgba(26, 23, 20, 0.08);
  text-align: left;
  font-size: 13px;
}

.acct__orders th {
  font-family: var(--hc-mono, "JetBrains Mono", monospace);
  font-size: 10.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--hc-ink-mid, rgba(26, 23, 20, 0.55));
  background: var(--hc-paper-2, var(--hc-paper-2));
}

.acct__orders tbody tr:last-child td {
  border-bottom: 0;
}

.acct__orders .status {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(26, 23, 20, 0.08);
  color: var(--hc-ink-soft, rgba(26, 23, 20, 0.72));
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

@media (max-width: 960px) {
  .acct-premium__tabs {
    padding: 8px;
  }

  .acct__orders {
    display: block;
    overflow-x: auto;
  }
}

/* css/blocks/235-account-quick-order.css */
/* =================== account-quick-order.css =================== */
/* Quick-order page styles only. */

.hc-qo-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: var(--hc-sp-5, 28px);
  align-items: start;
}

.hc-qo-main {
  padding: var(--hc-sp-5, 28px);
}

.hc-qo__title {
  margin-bottom: var(--hc-sp-2, 10px);
}

.hc-qo__lede {
  margin: 0;
}

.hc-qo {
  margin-top: var(--hc-sp-5, 28px);
}

.hc-qo__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--hc-sp-2, 10px);
  margin-bottom: var(--hc-sp-3, 14px);
}

.hc-qo__upload {
  cursor: pointer;
  position: relative;
}

.hc-qo__file {
  display: none;
}

.hc-qo__hint {
  margin-left: auto;
}

.hc-qo-tbl {
  width: 100%;
  border-collapse: collapse;
}

.hc-qo-tbl thead tr {
  border-bottom: 2px solid rgba(26, 23, 20, 0.1);
}

.hc-qo-tbl__th {
  padding: 8px 4px;
  text-align: left;
  font-family: var(--hc-mono, "JetBrains Mono", monospace);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--hc-muted, rgba(26, 23, 20, 0.55));
}

.hc-qo-tbl__th--sku {
  width: 30%;
}

.hc-qo-tbl__th--qty {
  width: 100px;
  text-align: right;
}

.hc-qo-tbl__th--rm {
  width: 40px;
}

.hc-qo-tbl__tr {
  border-bottom: 1px solid rgba(26, 23, 20, 0.06);
}

.hc-qo-tbl__cell {
  padding: var(--hc-sp-2, 10px) 4px;
  vertical-align: top;
}

.hc-qo-tbl__cell--qty {
  text-align: right;
}

.hc-qo-tbl__cell--rm {
  text-align: center;
}

.hc-qo-tbl__sku-input {
  font-family: var(--hc-mono, "JetBrains Mono", monospace);
}

.hc-qo-tbl__qty-input {
  width: 80px;
  text-align: right;
}

.hc-qo-tbl__ok-name {
  display: block;
  margin-bottom: 2px;
  font-size: 13px;
  font-weight: 500;
}

.hc-qo-tbl__err {
  font-size: 11px;
}

.hc-qo__footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--hc-sp-3, 14px);
  margin-top: var(--hc-sp-5, 28px);
}

.hc-qo__footer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--hc-sp-2, 10px);
}

.hc-qo__error {
  margin: var(--hc-sp-3, 14px) 0 0;
  padding: 12px 14px;
  border: 1px solid color-mix(in srgb, var(--hc-danger, #b42318) 25%, transparent);
  border-radius: 10px;
  background: color-mix(in srgb, var(--hc-danger, #b42318) 7%, white);
  color: var(--hc-danger, #8f1d14);
  font-size: 14px;
  line-height: 1.45;
}

.hc-qo-hint {
  padding: var(--hc-sp-4, 20px);
}

.hc-qo-hint__text {
  margin-top: var(--hc-sp-2, 10px);
}

.hc-qo-hint__pre {
  margin-top: var(--hc-sp-2, 10px);
  padding: var(--hc-sp-2, 10px);
  border-radius: 8px;
  background: var(--hc-bg, var(--hc-bg));
  font-family: var(--hc-mono, "JetBrains Mono", monospace);
  font-size: 11px;
  white-space: pre-wrap;
  word-break: break-word;
}

.hc-qo-hint__note {
  margin-top: var(--hc-sp-2, 10px);
}

@media (max-width: 960px) {
  .hc-qo-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .hc-qo-main {
    padding: var(--hc-sp-4, 16px);
  }

  .hc-qo-tbl__th:nth-child(2),
  .hc-qo-tbl__cell:nth-child(2) {
    min-width: 180px;
  }
}

/* css/blocks/236-account-referrals.css */
/* =================== account-referrals.css =================== */
/* Referral page styles. */

.hc-ref-wrap {
  padding: 32px 0 64px;
  max-width: 820px;
}

.hc-ref__crumbs {
  margin-bottom: 8px;
  font-size: 12px;
  color: var(--hc-muted, rgba(26, 23, 20, 0.45));
}

.hc-ref__title {
  margin: 0 0 8px;
  color: var(--hc-ink, #1a1714);
  font-family: var(--hc-serif, "Playfair Display", Georgia, serif);
  font-size: 28px;
  font-weight: 500;
  letter-spacing: -0.01em;
}

.hc-ref__lede {
  margin: 0 0 28px;
  font-size: 14px;
  line-height: 1.55;
}

.hc-ref-share {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-bottom: 24px;
  padding: 28px 32px;
  border-radius: 18px;
  background: linear-gradient(135deg, #2c2820 0%, #4a3f30 100%);
  color: #fff;
}

.hc-ref-share__glow {
  position: absolute;
  top: -20%;
  right: -10%;
  width: 60%;
  height: 140%;
  background: radial-gradient(ellipse at center, rgba(var(--hc-gold-rgb), 0.22), transparent 60%);
  pointer-events: none;
}

.hc-ref-share__eyebrow {
  margin-bottom: 12px;
  opacity: 0.65;
  font-family: var(--hc-mono, "JetBrains Mono", monospace);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.hc-ref-share__code {
  margin-bottom: 16px;
  color: var(--hc-gold);
  font-family: var(--hc-mono, "JetBrains Mono", monospace);
  font-size: 32px;
  font-weight: 500;
  letter-spacing: 0.1em;
}

.hc-ref-share__row {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.hc-ref-share__input {
  flex: 1;
  min-width: 200px;
  padding: 10px 14px;
  border: 0.5px solid rgba(255, 255, 255, 0.18);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  font-family: var(--hc-mono, "JetBrains Mono", monospace);
  font-size: 13px;
}

.hc-ref-share__copy {
  padding: 10px 18px;
  border: 0;
  border-radius: 6px;
  background: #fff;
  color: #1a1714;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: transform 0.2s ease;
}

.hc-ref-share__copy:hover {
  transform: translateY(-1px);
}

.hc-ref-share__chips {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.hc-ref-share__chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 8px 14px;
  border: 0.5px solid rgba(255, 255, 255, 0.18);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  text-decoration: none;
  font-size: 12px;
  transition: background 0.2s ease;
}

.hc-ref-share__chip:hover {
  background: rgba(255, 255, 255, 0.14);
}

.hc-ref-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 28px;
}

.hc-ref-stat {
  border: 0.5px solid rgba(26, 23, 20, 0.08);
  border-radius: 10px;
  background: var(--hc-bg, #fff);
  padding: 16px 18px;
}

.hc-ref-stat__lbl {
  margin-bottom: 6px;
  color: var(--hc-muted, rgba(26, 23, 20, 0.5));
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.hc-ref-stat__val {
  color: var(--hc-ink, #1a1714);
  font-family: var(--hc-serif, "Playfair Display", Georgia, serif);
  font-size: 28px;
  font-weight: 500;
  line-height: 1;
}

.hc-ref-sub {
  margin: 28px 0 10px;
  font-family: var(--hc-serif, "Playfair Display", Georgia, serif);
  font-size: 16px;
  font-weight: 500;
}

.hc-ref-uses {
  border: 0.5px solid rgba(26, 23, 20, 0.08);
  border-radius: 10px;
  background: var(--hc-bg-2, var(--hc-paper-2));
  overflow: hidden;
}

.hc-ref-uses__row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 16px;
  border-bottom: 0.5px solid rgba(26, 23, 20, 0.08);
  font-size: 13px;
}

.hc-ref-uses__row:last-child {
  border-bottom: 0;
}

.hc-ref-uses__date {
  color: var(--hc-muted, rgba(26, 23, 20, 0.5));
  font-family: var(--hc-mono, "JetBrains Mono", monospace);
  font-size: 11.5px;
}

.hc-ref-uses__order {
  color: var(--hc-ink, #1a1714);
}

.hc-ref-uses__amt {
  color: var(--hc-success, #3d6b4f);
  font-weight: 500;
}

.hc-ref-uses--empty {
  padding: 32px 24px;
  border-style: dashed;
  text-align: center;
  color: var(--hc-muted, rgba(26, 23, 20, 0.5));
  font-size: 13px;
}

.hc-ref-how {
  padding-left: 20px;
  color: var(--hc-ink-soft, rgba(26, 23, 20, 0.72));
  font-size: 13.5px;
  line-height: 1.7;
}

@media (max-width: 560px) {
  .hc-ref-share {
    padding: 18px;
  }

  .hc-ref-share__code {
    font-size: 24px;
  }
}

@media (max-width: 760px) {
  .hc-ref-stats {
    grid-template-columns: 1fr;
  }
}

/* css/blocks/237-account-wishlist-detail.css */
/* =================== account-wishlist-detail.css =================== */
/* Wishlist detail page styles. */

.hc-wl__head {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: var(--hc-sp-3, 14px);
  margin-bottom: var(--hc-sp-5, 28px);
}

.hc-wl__head-main {
  min-width: 0;
}

.hc-wl__title {
  margin: 0;
  font-family: var(--hc-serif, "Playfair Display", Georgia, serif);
  font-size: clamp(26px, 3vw, 36px);
  font-weight: 400;
  line-height: 1.1;
}

.hc-wl__desc {
  margin-top: var(--hc-sp-2, 10px);
  max-width: 560px;
}

.hc-wl__meta {
  margin-top: var(--hc-sp-2, 10px);
}

.hc-wl__actions {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: var(--hc-sp-2, 10px);
}

.hc-wl__share-pop {
  position: absolute;
  right: 0;
  top: 100%;
  z-index: 5;
  min-width: 320px;
  margin-top: 8px;
  padding: var(--hc-sp-3, 14px);
  border: 1px solid rgba(26, 23, 20, 0.08);
  border-radius: 14px;
  background: var(--hc-bg, var(--hc-bg));
  box-shadow: 0 18px 60px rgba(26, 23, 20, 0.14);
}

.hc-wl__share-input {
  min-width: 320px;
  margin-top: 6px;
}

.page-wishlist .hc-wl-bulk.hc-bulk-bar {
  position: relative;
  inset: auto;
  z-index: 1;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--hc-sp-2, 10px);
  width: 100%;
  padding: var(--hc-sp-3, 14px);
  border: 1px solid rgba(26, 23, 20, 0.09);
  border-radius: 16px;
  color: var(--hc-text, #1a1714);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 12px 34px rgba(26, 23, 20, 0.07);
  opacity: 1;
  pointer-events: auto;
  transform: none;
}

.hc-wl-bulk__toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.hc-wl-bulk__toggle-input {
  margin-right: 6px;
}

.hc-wl-bulk__actions {
  margin-left: auto;
  display: flex;
  flex-wrap: wrap;
  gap: var(--hc-sp-2, 10px);
}

.hc-wl-bulk__remove {
  color: var(--hc-danger, #c9433a);
}

.hc-wl-bulk__feedback {
  flex-basis: 100%;
  margin: 0;
  color: var(--hc-danger, #c9433a);
  font-size: 13px;
}

.hc-wl-grid {
  margin-top: var(--hc-sp-4, 20px);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--hc-sp-4, 20px);
}

.hc-wl-item {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(26, 23, 20, 0.09);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(26, 23, 20, 0.06);
}

.hc-wl-item__check {
  position: absolute;
  left: 10px;
  top: 10px;
  z-index: 3;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid rgba(26, 23, 20, 0.1);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 6px 18px rgba(26, 23, 20, 0.09);
}

.hc-wl-item__link {
  display: block;
  flex: 1;
  color: inherit;
  text-decoration: none;
}

.hc-wl-item .hc-pcard__media {
  display: flex;
  width: 100%;
  aspect-ratio: 4 / 3;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 18px;
  background: #f3f2ef;
}

.hc-wl-item .hc-pcard__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.hc-wl-item .hc-pcard__body {
  padding: 18px 18px 12px;
}

.hc-wl-item .hc-pcard__title {
  min-height: 2.8em;
  font-size: 17px;
  line-height: 1.4;
}

.hc-wl-item .hc-pcard__price-row {
  margin-top: 12px;
}

.hc-wl-item__ctas {
  display: flex;
  gap: var(--hc-sp-2, 10px);
  align-items: stretch;
  padding: 0 18px 18px;
}

.hc-wl-item__atc {
  margin: 0;
  flex: 1;
}

.hc-wl-item__rm {
  margin: 0;
}

.hc-wl-item__rm-btn {
  width: 38px;
  height: 38px;
  color: var(--hc-danger, #c9433a);
}

.hc-wl-item__note {
  margin-top: 8px;
}

.hc-wl-move-modal {
  max-width: 460px;
  position: relative;
}

.hc-wl-move-modal__sub {
  margin-top: var(--hc-sp-1, 6px);
}

.hc-wl-move-modal__list {
  margin-top: var(--hc-sp-4, 20px);
  max-height: 320px;
  overflow-y: auto;
  border: 1px solid rgba(26, 23, 20, 0.08);
  border-radius: 12px;
}

.hc-wl-move-modal__empty {
  padding: var(--hc-sp-4, 20px);
  text-align: center;
  color: var(--hc-muted, rgba(26, 23, 20, 0.5));
  font-size: 13px;
}

.hc-wl-move-modal__row {
  display: flex;
  gap: var(--hc-sp-2, 10px);
  padding: var(--hc-sp-3, 14px);
  border-bottom: 1px solid rgba(26, 23, 20, 0.06);
  cursor: pointer;
  transition: background 0.2s ease;
}

.hc-wl-move-modal__row:last-child {
  border-bottom: 0;
}

.hc-wl-move-modal__row:hover {
  background: rgba(var(--hc-accent-rgb), 0.04);
}

.hc-wl-move-modal__row.is-selected {
  background: rgba(var(--hc-gold-rgb), 0.14);
}

.hc-wl-move-modal__row-body {
  flex: 1;
}

.hc-wl-move-modal__row-body strong {
  font-size: 14px;
  font-weight: 500;
}

.hc-wl-move-modal__footer {
  display: flex;
  align-items: center;
  gap: var(--hc-sp-2, 10px);
  margin-top: var(--hc-sp-4, 20px);
}

.hc-wl-move-modal__spacer {
  flex: 1;
}

@media (max-width: 640px) {
  .hc-wl__share-pop,
  .hc-wl__share-input {
    min-width: 0;
    width: min(92vw, 360px);
  }

  .page-wishlist .hc-wl-bulk.hc-bulk-bar,
  .hc-wl-bulk__actions {
    align-items: stretch;
  }

  .hc-wl-bulk__actions {
    width: 100%;
    margin-left: 0;
  }

  .hc-wl-bulk__actions .hc-btn {
    flex: 1 1 140px;
  }

  .hc-wl-grid {
    grid-template-columns: 1fr;
  }

  .hc-wl-item .hc-pcard__title {
    min-height: 0;
  }

  .hc-wl-move-modal__footer {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hc-wl-move-modal__footer > .hc-btn:first-child {
    grid-column: 1 / -1;
  }

  .hc-wl-move-modal__footer .hc-btn {
    width: 100%;
    min-width: 0;
  }

  .hc-wl-move-modal__spacer {
    display: none;
  }
}

@media (min-width: 641px) and (max-width: 980px) {
  .hc-wl-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* css/blocks/238-auth-social.css */
/* =================== auth-social.css =================== */
/* Quick channel row on auth screens. */

.auth-social {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 16px 0 6px;
}

.auth-social--links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  margin: 12px 0 10px;
}

.auth-social__link {
  color: var(--hc-accent-dark, #6a573f);
  font-size: 12px;
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.auth-social__link:hover {
  color: var(--hc-ink, #1a1714);
}

/* Premium chip treatment for the channel row on auth screens. */
.auth-social--links .auth-social__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  border-radius: 11px;
  border: 0.5px solid var(--hc-gold-border, rgba(180, 151, 115, 0.4));
  background: linear-gradient(135deg, rgba(255, 252, 247, 0.9), rgba(248, 244, 237, 0.68));
  color: var(--hc-ink, #1a1714);
  font-size: 12.5px;
  font-weight: 500;
  text-decoration: none;
  transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}
.auth-social--links .auth-social__link::before {
  content: "";
  flex: none;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--hc-gold-1, var(--hc-gold)), var(--hc-accent, var(--hc-accent)));
}
.auth-social--links .auth-social__link:hover {
  border-color: var(--hc-accent, var(--hc-accent));
  background: linear-gradient(135deg, rgba(var(--hc-gold-rgb), 0.2), rgba(184, 154, 111, 0.1));
  transform: translateY(-1px);
  box-shadow: 0 8px 18px -10px rgba(var(--hc-accent-rgb), 0.45);
  color: var(--hc-ink, #1a1714);
}

.auth-social__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 8px 10px;
  border-radius: 10px;
  border: 0.5px solid rgba(180, 151, 115, 0.26);
  background: rgba(255, 255, 255, 0.65);
  color: var(--hc-ink, #1a1714);
  font-size: 12px;
  font-weight: 500;
  text-decoration: none;
  transition: border-color 0.18s ease, background 0.18s ease;
}

.auth-social__btn:hover {
  border-color: rgba(180, 151, 115, 0.48);
  background: rgba(var(--hc-gold-rgb), 0.14);
}

@media (max-width: 560px) {
  .auth-social {
    grid-template-columns: 1fr;
  }
  .auth-social--links {
    display: grid;
    gap: 8px;
  }
}