/* Compact ordering interface, inspired by a print production catalogue. */
.catalog-page .catalog-shell { padding: 2.5rem 0 1.5rem; }
.catalog-page .catalog-intro { display:flex; justify-content:space-between; align-items:center; gap:2rem; padding-bottom:1.5rem; }
.catalog-page .catalog-intro h1 { font-size:clamp(2rem,3.5vw,3.5rem); line-height:1.08; letter-spacing:-.045em; }
.catalog-page .catalog-intro h1 br { display:none; }
.catalog-page .catalog-intro-copy { max-width:25rem; }
.catalog-page .catalog-intro-copy p { font-size:.85rem; line-height:1.55; margin-bottom:.5rem; }
.catalog-page .catalog-intro-copy a { font-size:.8rem; padding:.4rem 0; }
.catalog-page .catalog-marquee { display:none; }
.catalog-page .catalog-collection { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:.65rem; padding-top:0; }
.catalog-page .catalog-product:nth-child(n) { grid-column:auto; min-height:0; padding:.55rem; border-radius:.8rem; }
.catalog-page .catalog-product.selected { border-color:var(--catalog-gold); background:rgba(237,196,91,.08); }
.catalog-page .catalog-product:hover { transform:translateY(-3px); }
.catalog-page .product-top,.catalog-page .product-bottom p,.catalog-page .product-bottom>span { display:none; }
.catalog-page .catalog-product .product-object { flex:none; height:95px; min-height:0; margin:0 0 .7rem; border-radius:.5rem; }
.catalog-page .catalog-product .product-object>span,.catalog-page .product-object i { display:none; }
.catalog-page .product-bottom h2 { font-size:.9rem; text-align:center; margin:0 0 .35rem; letter-spacing:0; }
.catalog-page .catalog-calculator { padding:1.8rem 0 4rem; }
.catalog-page .calculator-head { margin-bottom:1.3rem; grid-template-columns:1fr 1fr; }
.catalog-page .calculator-head h2 { font-size:clamp(1.8rem,3vw,2.6rem); line-height:1.1; }
.catalog-page .calculator-head .eyebrow { display:none; }
.catalog-page .calculator-head p { font-size:.8rem; }
.catalog-page .catalog-nav { border-radius:.6rem; margin-bottom:1rem; }
.catalog-page .catalog-nav button { border-radius:.4rem; padding:.6rem .8rem; font-size:.82rem; }
.catalog-page .catalog-workspace { overflow:visible; border:0; background:transparent; box-shadow:none; gap:1.3rem; grid-template-columns:minmax(0,1fr) 300px; }
.catalog-page .catalog-form { border:1px solid rgba(255,255,255,.13); border-radius:1rem; background:#101111; min-width:0; }
.catalog-page .calculator-steps { display:none; }
.catalog-page .catalog-form-block { padding:1.5rem; }
.catalog-page .form-section-title { margin-bottom:1.2rem; }
.catalog-page .form-section-title>span,.catalog-page .form-section-title small { display:none; }
.catalog-page .form-section-title h3 { font-size:1.2rem; }
.catalog-page .catalog-choice label>span { min-height:4rem; padding:.7rem; }
.catalog-page .catalog-choice b { font-size:.8rem; }
.catalog-page .catalog-format-row { position:relative; grid-template-columns:1fr; }
.catalog-page .catalog-dimensions[hidden],.catalog-page label[hidden] { display:none; }
.catalog-page .custom-size-button { position:absolute; top:-.2rem; right:0; padding:0; border:0; background:none; color:var(--catalog-gold); text-decoration:underline; cursor:pointer; font:inherit; font-size:.78rem; }
.catalog-page .catalog-run { margin-top:1rem; padding-top:1rem; }
.catalog-page .catalog-summary { top:95px; border:1px solid rgba(237,196,91,.32); border-radius:1rem; padding:1.1rem; }
.catalog-page .summary-art .product-object { min-height:0; height:150px; }
.catalog-page .summary-title-row h3 { font-size:1.5rem; }
.catalog-page .summary-price { font-size:2.6rem; overflow-wrap:anywhere; }
.catalog-page .summary-label { font-size:.58rem; }
.catalog-page .catalog-summary .btn { font-size:.8rem; }
.catalog-page .catalog-upload { min-height:7rem; }
.catalog-page .catalog-upload i { display:none; }
.finish-disclosure>summary { cursor:pointer; color:var(--catalog-gold); font-size:1rem; font-weight:500; padding:.2rem 0; }
.finish-disclosure[open]>summary { margin-bottom:1.2rem; }
.fold-selector { padding:1.5rem; border-bottom:1px solid rgba(255,255,255,.1); }
.fold-selector h3 { margin:0 0 1rem; font-size:1.2rem; }
.fold-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.6rem; }
.fold-grid button { display:flex; flex-direction:column; align-items:center; border:1px solid rgba(255,255,255,.15); border-radius:.6rem; background:#080909; color:#eee; padding:.45rem; cursor:pointer; font:inherit; }
.fold-grid button.selected { border-color:#edc45b; background:rgba(237,196,91,.1); box-shadow:inset 0 0 0 1px #edc45b; }
.fold-grid svg { width:100%; height:64px; }
.fold-grid span { font-size:.65rem; padding:.25rem 0; }
@media(max-width:980px) {
 .catalog-page .catalog-workspace { grid-template-columns:minmax(0,1fr) 265px; }
 .catalog-page .catalog-collection { grid-template-columns:repeat(4,minmax(0,1fr)); }
 .catalog-page .catalog-intro { align-items:flex-start; }
 .fold-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media(max-width:700px) {
 .catalog-page .catalog-intro { display:block; }
 .catalog-page .catalog-intro-copy { margin-top:1rem; }
 .catalog-page .catalog-collection { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin:0; padding:0; overflow:visible; gap:.45rem; }
 .catalog-page .catalog-product:nth-child(n) { padding:.35rem; }
 .catalog-page .catalog-product .product-object { height:65px; }
 .catalog-page .product-bottom h2 { font-size:.62rem; }
 .catalog-page .catalog-workspace { grid-template-columns:1fr; }
 .catalog-page .catalog-summary { position:static; }
 .catalog-page .calculator-head { grid-template-columns:1fr; }
 .catalog-page .catalog-form-block,.fold-selector { padding:1rem; }
 .catalog-page .catalog-choice>div { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); overflow:visible; }
 .catalog-page .catalog-choice label { min-width:0; }
 .catalog-page .catalog-choice small { font-size:.62rem; }
}
/* PRINTbyDORIK product collection: black, gold and white only. */
.catalog-page {
  --catalog-black: #080909;
  --catalog-panel: #111212;
  --catalog-gold: #edc45b;
  --catalog-white: #f4f3ee;
  background: var(--catalog-black);
  color: var(--catalog-white);
}
.catalog-page main > .hero,
.catalog-page main > .section {
  display: none;
}
.catalog-page .catalog-shell,
.catalog-page .catalog-calculator {
  display: block;
}
.catalog-shell {
  padding: clamp(3.5rem, 7vw, 7rem) 0 6rem;
  overflow: hidden;
}
.catalog-intro {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(18rem, .6fr);
  align-items: end;
  gap: 4rem;
  padding-bottom: 3rem;
}
.catalog-intro h1 {
  margin: .65rem 0 0;
  font-size: clamp(4rem, 8vw, 8.5rem);
  line-height: .87;
  letter-spacing: -.075em;
}
.catalog-intro h1 em {
  color: var(--catalog-gold);
  font-style: normal;
  font-weight: 300;
}
.catalog-intro-copy {
  max-width: 31rem;
  padding-bottom: .5rem;
}
.catalog-intro-copy p {
  margin: 0 0 1.7rem;
  color: rgba(244, 243, 238, .68);
  font-size: 1.05rem;
  line-height: 1.75;
}
.catalog-intro-copy a {
  display: flex;
  justify-content: space-between;
  padding: .85rem 0;
  border-bottom: 1px solid rgba(237, 196, 91, .55);
  color: var(--catalog-white);
}
.catalog-marquee {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  border-block: 1px solid rgba(237, 196, 91, .22);
  overflow: hidden;
  white-space: nowrap;
}
.catalog-marquee span {
  display: block;
  width: max-content;
  padding: .75rem 0;
  color: var(--catalog-gold);
  font-size: .75rem;
  letter-spacing: .3em;
  animation: catalog-marquee 22s linear infinite;
}
@keyframes catalog-marquee { to { transform: translateX(-50%); } }
.catalog-collection {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 1.25rem;
  padding-top: 4rem;
}
.catalog-product {
  grid-column: span 4;
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 37rem;
  flex-direction: column;
  padding: 1.25rem;
  overflow: hidden;
  border: 1px solid rgba(244, 243, 238, .13);
  border-radius: 1.25rem;
  background: var(--catalog-panel);
  color: var(--catalog-white);
  transition: transform .45s cubic-bezier(.2,.75,.2,1), border-color .35s, box-shadow .35s;
}
.catalog-product:nth-child(1),
.catalog-product:nth-child(6) { grid-column: span 7; }
.catalog-product:nth-child(2),
.catalog-product:nth-child(7) { grid-column: span 5; }
.catalog-product:hover,
.catalog-product:focus-visible {
  transform: translateY(-.65rem);
  border-color: rgba(237, 196, 91, .72);
  box-shadow: 0 1.4rem 5rem rgba(237, 196, 91, .09);
  outline: none;
}
.product-top {
  display: flex;
  min-height: 2.5rem;
  justify-content: space-between;
  color: var(--catalog-gold);
  font-size: .72rem;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.product-top b { font-size: 1.2rem; font-weight: 300; }
.product-object {
  position: relative;
  flex: 1;
  min-height: 18rem;
  margin: 0 0 1.5rem;
  overflow: hidden;
  border-radius: .85rem;
  background: #000;
}
.product-object::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(140deg, rgba(237,196,91,.14), transparent 45%, rgba(0,0,0,.42));
  mix-blend-mode: screen;
}
.product-object img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(1) sepia(.42) contrast(1.2) brightness(.8);
  transition: transform .8s cubic-bezier(.2,.75,.2,1), filter .5s;
}
.catalog-product:hover .product-object img { transform: scale(1.045); filter: grayscale(1) sepia(.7) contrast(1.18) brightness(.92); }
.product-object > span {
  position: absolute;
  z-index: 2;
  right: 1rem;
  bottom: .8rem;
  color: var(--catalog-gold);
  font-size: .68rem;
  letter-spacing: .2em;
  text-transform: uppercase;
}
.summary-art .product-object { min-height: 13rem; margin: 0; }
.product-bottom h2 {
  margin: 0 0 .55rem;
  font-size: clamp(2rem, 3.4vw, 3.4rem);
  line-height: 1;
}
.product-bottom p {
  min-height: 4rem;
  margin: 0 0 1.25rem;
  color: rgba(244,243,238,.62);
  font-size: .95rem;
}
.product-bottom > span {
  display: flex;
  justify-content: space-between;
  padding-top: 1rem;
  border-top: 1px solid rgba(237,196,91,.3);
  color: var(--catalog-gold);
  font-size: .85rem;
}
.catalog-calculator {
  padding: 7rem 0;
  border-top: 1px solid rgba(237,196,91,.23);
  background: #0b0c0c;
  scroll-margin-top: 5rem;
}
.calculator-head {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 1rem 3rem;
  margin-bottom: 2.75rem;
}
.calculator-head .eyebrow { grid-column: 1 / -1; }
.calculator-head h2 { margin: 0; font-size: clamp(3.3rem, 6vw, 6.5rem); line-height: .95; }
.calculator-head p { align-self: end; max-width: 32rem; margin: 0; color: rgba(244,243,238,.58); font-size: 1rem; }
.catalog-nav {
  display: flex;
  gap: .4rem;
  margin-bottom: 1.4rem;
  padding: .42rem;
  overflow-x: auto;
  scrollbar-width: none;
  border: 1px solid rgba(244,243,238,.12);
  border-radius: 5rem;
}
.catalog-nav::-webkit-scrollbar { display: none; }
.catalog-nav button {
  flex: 1 0 auto;
  padding: .78rem 1.25rem;
  border: 0;
  border-radius: 3rem;
  background: transparent;
  color: rgba(244,243,238,.62);
  font: inherit;
  cursor: pointer;
}
.catalog-nav button.selected,
.catalog-nav button[aria-selected="true"] { background: var(--catalog-gold); color: #080909; }
.catalog-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(20rem, .62fr);
  align-items: start;
  overflow: hidden;
  border: 1px solid rgba(244,243,238,.14);
  border-radius: 1.5rem;
  background: var(--catalog-panel);
}
.catalog-form { padding: clamp(1.4rem, 4vw, 3.5rem); }
.form-section-title {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 0 0 1.4rem;
}
.form-section-title:not(:first-child) { margin-top: 3.3rem; }
.form-section-title span {
  display: grid;
  width: 2.1rem;
  height: 2.1rem;
  place-items: center;
  border: 1px solid var(--catalog-gold);
  border-radius: 50%;
  color: var(--catalog-gold);
  font-size: .72rem;
}
.form-section-title h3 { margin: 0; font-size: 1.65rem; }
.catalog-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 1rem;
}
.catalog-field { display: flex; min-width: 0; flex-direction: column; gap: .5rem; }
.catalog-field > span { color: rgba(244,243,238,.58); font-size: .8rem; letter-spacing: .06em; }
.catalog-field select,
.catalog-field input {
  width: 100%;
  min-height: 3.4rem;
  padding: 0 1rem;
  border: 1px solid rgba(244,243,238,.17);
  border-radius: .75rem;
  background: #080909;
  color: var(--catalog-white);
  font: inherit;
}
.catalog-field select:focus,
.catalog-field input:focus { border-color: var(--catalog-gold); outline: 2px solid rgba(237,196,91,.12); }
.quantity-presets { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .8rem; }
.quantity-presets button,
.catalog-text-button {
  padding: .55rem .8rem;
  border: 1px solid rgba(237,196,91,.3);
  border-radius: 3rem;
  background: transparent;
  color: var(--catalog-gold);
  font: inherit;
  font-size: .78rem;
  cursor: pointer;
}
.catalog-check {
  display: flex;
  align-items: center;
  gap: .7rem;
  min-height: 3.4rem;
  padding: 0 1rem;
  border: 1px solid rgba(244,243,238,.17);
  border-radius: .75rem;
  cursor: pointer;
}
.catalog-check input { accent-color: var(--catalog-gold); }
.catalog-hint { color: rgba(244,243,238,.48); font-size: .78rem; }
.catalog-upload {
  display: flex;
  min-height: 8rem;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  border: 1px dashed rgba(237,196,91,.48);
  border-radius: 1rem;
  background: rgba(237,196,91,.025);
  cursor: pointer;
}
.catalog-upload input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.catalog-upload b { color: var(--catalog-gold); font-weight: 500; }
.catalog-upload span { margin-top: .35rem; color: rgba(244,243,238,.48); font-size: .78rem; }
.catalog-summary {
  position: sticky;
  top: 6rem;
  min-height: 48rem;
  padding: 1.25rem;
  border-left: 1px solid rgba(237,196,91,.22);
  background: #080909;
}
.summary-label { margin-bottom: 1rem; color: var(--catalog-gold); font-size: .68rem; letter-spacing: .2em; }
.catalog-summary h3 { margin: 1.4rem 0 .35rem; font-size: 2.2rem; }
.catalog-summary > p { color: rgba(244,243,238,.56); }
.summary-price { margin: 2rem 0 .2rem; color: var(--catalog-gold); font-size: clamp(2.8rem, 5vw, 4.7rem); line-height: 1; letter-spacing: -.055em; }
.quote-facts { display: grid; grid-template-columns: 1fr 1fr; margin: 1.6rem 0; border-block: 1px solid rgba(244,243,238,.13); }
.quote-facts div { padding: 1rem 0; }
.quote-facts dt { color: rgba(244,243,238,.4); font-size: .7rem; }
.quote-facts dd { margin: .25rem 0 0; color: var(--catalog-white); }
.catalog-summary .btn { width: 100%; }
.catalog-summary .btn:disabled { cursor: wait; filter: grayscale(1); opacity: .48; }
.summary-cart { display: block; margin: 1rem 0 1.4rem; text-align: center; color: var(--catalog-white); font-size: .84rem; }
.catalog-text-button { width: 100%; }
.catalog-message { min-height: 1.5rem; margin-top: 1rem; color: var(--catalog-gold); }
#catalogPrices table { width: 100%; margin-top: 1rem; border-collapse: collapse; font-size: .8rem; }
#catalogPrices td, #catalogPrices th { padding: .55rem .2rem; border-bottom: 1px solid rgba(244,243,238,.1); text-align: left; }
#catalogPrices td:last-child, #catalogPrices th:last-child { text-align: right; color: var(--catalog-gold); }
@media (max-width: 980px) {
  .catalog-intro { grid-template-columns: 1fr; gap: 2rem; }
  .catalog-product, .catalog-product:nth-child(n) { grid-column: span 6; }
  .catalog-workspace { grid-template-columns: 1fr; }
  .catalog-summary { position: static; min-height: 0; border-top: 1px solid rgba(237,196,91,.22); border-left: 0; }
}
@media (max-width: 620px) {
  .catalog-shell { padding-top: 3rem; }
  .catalog-intro h1 { font-size: clamp(3.3rem, 17vw, 5rem); }
  .catalog-collection { display: flex; margin-right: calc(50% - 50vw); padding-right: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; }
  .catalog-product, .catalog-product:nth-child(n) { flex: 0 0 84vw; min-height: 31rem; scroll-snap-align: start; }
  .product-object { min-height: 15rem; }
  .calculator-head { grid-template-columns: 1fr; }
  .catalog-fields { grid-template-columns: 1fr; }
  .catalog-form { padding: 1.2rem; }
  .catalog-summary { padding: 1.2rem; }
}
@media (prefers-reduced-motion: reduce) {
  .catalog-marquee span { animation: none; }
  .catalog-product, .product-object img { transition: none; }
}

/* Premium product photography and streamlined calculator. */
.product-object img {
  filter: saturate(.86) contrast(1.04) brightness(.9);
}
.catalog-product:hover .product-object img {
  filter: saturate(1) contrast(1.04) brightness(1);
}
.product-object i {
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
}
.product-object-catalogs img { object-position: 58% center; transform: scale(1.08); }
.product-object-calendars img { object-position: 27% center; transform: scale(1.16); }
.product-object-postcards img { object-position: 72% center; transform: scale(1.14); }
.catalog-product:hover .product-object-catalogs img { transform: scale(1.13); }
.catalog-product:hover .product-object-calendars img { transform: scale(1.21); }
.catalog-product:hover .product-object-postcards img { transform: scale(1.19); }
.product-object-catalogs i::before,
.product-object-calendars i::before,
.product-object-postcards i::before {
  position: absolute;
  top: 1rem;
  left: 1rem;
  padding: .48rem .62rem;
  border: 1px solid rgba(237,196,91,.5);
  border-radius: 2rem;
  background: rgba(8,9,9,.72);
  color: var(--catalog-gold);
  font: 500 .58rem/1 Onest,sans-serif;
  letter-spacing: .14em;
  backdrop-filter: blur(8px);
}
.product-object-catalogs i::before { content: "РАЗВОРОТ"; }
.product-object-calendars i::before { content: "365 ДНЕЙ"; }
.product-object-postcards i::before { content: "ПЛОТНЫЙ КАРТОН"; }

.catalog-workspace {
  grid-template-columns: minmax(0,1.62fr) minmax(21rem,.62fr);
  border-color: rgba(237,196,91,.24);
  background: linear-gradient(145deg,#121313,#0d0e0e);
  box-shadow: 0 2.5rem 8rem rgba(0,0,0,.34);
}
.catalog-form { padding: 0; }
.calculator-steps {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  border-bottom: 1px solid rgba(244,243,238,.1);
}
.calculator-steps span {
  padding: 1.05rem clamp(1rem,3vw,2.4rem);
  color: rgba(244,243,238,.35);
  font-size: .66rem;
  letter-spacing: .14em;
}
.calculator-steps span + span { border-left: 1px solid rgba(244,243,238,.08); }
.calculator-steps .active { color: var(--catalog-gold); }
.catalog-form-block {
  padding: clamp(1.5rem,4vw,3.35rem);
  border-bottom: 1px solid rgba(244,243,238,.09);
}
.catalog-form-block:last-child { border-bottom: 0; }
.form-section-title { align-items: flex-start; }
.form-section-title small {
  display: block;
  margin-bottom: .35rem;
  color: rgba(237,196,91,.7);
  font-size: .6rem;
  letter-spacing: .17em;
}
.form-section-title h3 { font-size: clamp(1.45rem,2.4vw,2rem); }
.catalog-format-row {
  display: grid;
  grid-template-columns: 1fr 1.35fr;
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.catalog-dimensions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.catalog-fields-premium { align-items: stretch; }
.catalog-choice {
  grid-column: 1/-1;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.catalog-choice legend {
  margin-bottom: .6rem;
  color: rgba(244,243,238,.58);
  font-size: .8rem;
  letter-spacing: .06em;
}
.catalog-choice > div {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(8.5rem,1fr));
  gap: .6rem;
}
.catalog-choice label { position: relative; cursor: pointer; }
.catalog-choice input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}
.catalog-choice label > span {
  display: flex;
  min-height: 4.8rem;
  flex-direction: column;
  justify-content: space-between;
  padding: .9rem;
  border: 1px solid rgba(244,243,238,.14);
  border-radius: .8rem;
  background: #090a0a;
  transition: border-color .2s,background .2s,transform .2s;
}
.catalog-choice label:hover > span { border-color: rgba(237,196,91,.45); }
.catalog-choice input:checked + span {
  border-color: var(--catalog-gold);
  background: linear-gradient(145deg,rgba(237,196,91,.14),rgba(237,196,91,.03));
  box-shadow: inset 0 0 0 1px rgba(237,196,91,.13);
}
.catalog-choice input:focus-visible + span { outline: 2px solid var(--catalog-gold); outline-offset: 2px; }
.catalog-choice b { font-size: .88rem; font-weight: 500; }
.catalog-choice small { color: rgba(244,243,238,.42); font-size: .68rem; }
.catalog-run {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(10rem,.4fr);
  gap: 1rem;
  align-items: start;
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(244,243,238,.09);
}
.quantity-presets button { transition: color .2s,background .2s,border-color .2s; }
.quantity-presets button.active {
  border-color: var(--catalog-gold);
  background: var(--catalog-gold);
  color: #080909;
}
.catalog-finishing { background: rgba(0,0,0,.12); }
[data-hole-diameter][hidden] { display: none; }
.catalog-check { align-self: end; min-height: 4.45rem; }
.catalog-check > span { display: flex; flex-direction: column; gap: .18rem; }
.catalog-check b { font-size: .86rem; font-weight: 500; }
.catalog-check small { color: rgba(244,243,238,.42); font-size: .68rem; }
.catalog-upload {
  min-height: 10rem;
  border-style: solid;
  background: radial-gradient(circle at 50% 0,rgba(237,196,91,.09),transparent 65%);
  transition: border-color .2s,background .2s;
}
.catalog-upload:hover { border-color: var(--catalog-gold); background-color: rgba(237,196,91,.04); }
.catalog-upload i {
  display: grid;
  width: 2.6rem;
  height: 2.6rem;
  margin-bottom: .65rem;
  place-items: center;
  border: 1px solid rgba(237,196,91,.45);
  border-radius: 50%;
  color: var(--catalog-gold);
  font-style: normal;
}
.catalog-summary {
  min-height: 0;
  padding: 1.4rem;
  border-left-color: rgba(237,196,91,.3);
  background: linear-gradient(180deg,#090a0a,#050606);
}
.summary-art .product-object { min-height: 12.5rem; }
.summary-title-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.summary-title-row h3 { margin-bottom: .2rem; }
.summary-title-row > span {
  padding: .35rem .55rem;
  border: 1px solid rgba(237,196,91,.35);
  border-radius: 3rem;
  color: var(--catalog-gold);
  font-size: .6rem;
  text-transform: uppercase;
}
.summary-price { margin-top: 1.45rem; font-size: clamp(2.8rem,4.5vw,4.2rem); }
.catalog-summary .btn { display: flex; justify-content: space-between; }
.summary-note { padding-top: 1rem; border-top: 1px solid rgba(244,243,238,.1); }

@media (max-width:980px) {
  .catalog-workspace { grid-template-columns: 1fr; }
}
@media (max-width:620px) {
  .calculator-steps span { padding: .85rem .7rem; font-size: .52rem; letter-spacing: .08em; }
  .catalog-form-block { padding: 1.25rem; }
  .catalog-format-row,.catalog-run { grid-template-columns: 1fr; }
  .catalog-dimensions { gap: .7rem; }
  .catalog-choice > div { display: flex; padding-bottom: .25rem; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; }
  .catalog-choice label { flex: 0 0 9.5rem; scroll-snap-align: start; }
  .catalog-choice > div::-webkit-scrollbar { display: none; }
  .summary-art .product-object { min-height: 15rem; }
}

/* Точная форма заказа: живые состояния, раздельные макеты и превью. */
.catalog-page .calculator-steps {
  position: sticky;
  z-index: 5;
  top: 72px;
  display: grid;
  overflow: hidden;
  border-radius: 1rem 1rem 0 0;
  background: rgba(10,11,11,.94);
  backdrop-filter: blur(16px);
}
.catalog-page .calculator-steps span {
  position: relative;
  transition: color .35s ease, background-color .35s ease;
}
.catalog-page .calculator-steps span::after {
  position: absolute;
  right: 12%;
  bottom: 0;
  left: 12%;
  height: 2px;
  content: "";
  background: linear-gradient(90deg,transparent,var(--catalog-gold),transparent);
  transform: scaleX(0);
  transition: transform .45s cubic-bezier(.22,1,.36,1);
}
.catalog-page .calculator-steps span.active {
  color: var(--catalog-gold);
  background: linear-gradient(180deg,rgba(237,196,91,.08),transparent);
}
.catalog-page .calculator-steps span.active::after { transform: scaleX(1); }
.catalog-page .catalog-form-block,
.catalog-page .fold-selector {
  animation: calculator-section-in .55s cubic-bezier(.22,1,.36,1) both;
}
.catalog-page .catalog-form-block:nth-of-type(2) { animation-delay: .05s; }
.catalog-page .catalog-form-block:nth-of-type(3) { animation-delay: .1s; }
.catalog-page .catalog-form-block:nth-of-type(4) { animation-delay: .15s; }
@keyframes calculator-section-in {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}
.catalog-page .catalog-field select,
.catalog-page .catalog-field input,
.catalog-page .catalog-check,
.catalog-page .catalog-choice label > span {
  transition: border-color .25s ease, background-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.catalog-page .catalog-field select:hover,
.catalog-page .catalog-field input:hover,
.catalog-page .catalog-check:hover { border-color: rgba(237,196,91,.5); }
.catalog-page .catalog-choice label:hover > span { transform: translateY(-2px); }
.catalog-page .catalog-choice input:checked + span {
  box-shadow: inset 0 0 0 1px rgba(237,196,91,.16), 0 10px 26px rgba(0,0,0,.2);
}
.catalog-page [hidden] { display: none !important; }
.catalog-page .fold-selector {
  padding: clamp(1.5rem,4vw,3.35rem);
  background:
    radial-gradient(circle at 10% 0,rgba(237,196,91,.1),transparent 35%),
    #0d0e0e;
}
.catalog-page .fold-selector .form-section-title { margin-bottom: 1.4rem; }
.catalog-page .fold-selector .form-section-title h3 { margin: 0; font-size: clamp(1.45rem,2.4vw,2rem); }
.catalog-page .fold-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
.catalog-page .fold-grid button {
  min-height: 8rem;
  justify-content: space-between;
  border-radius: .85rem;
  background: linear-gradient(150deg,#111212,#080909);
  transition: border-color .25s ease, transform .3s cubic-bezier(.22,1,.36,1), box-shadow .3s ease;
}
.catalog-page .fold-grid button:hover {
  border-color: rgba(237,196,91,.55);
  transform: translateY(-3px);
}
.catalog-page .fold-grid button.selected {
  border-color: var(--catalog-gold);
  background: linear-gradient(145deg,rgba(237,196,91,.16),rgba(237,196,91,.025));
  box-shadow: inset 0 0 0 1px rgba(237,196,91,.25), 0 14px 35px rgba(0,0,0,.25);
}
.catalog-page .booklet-method { margin-top: 1.2rem; }
.catalog-page .layout-block {
  background:
    radial-gradient(circle at 85% 0,rgba(237,196,91,.07),transparent 38%),
    rgba(0,0,0,.14);
}
.layout-upload-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 1rem;
}
.layout-upload-grid.single { grid-template-columns: 1fr; }
.layout-slot {
  min-width: 0;
  padding: .55rem;
  border: 1px solid rgba(244,243,238,.08);
  border-radius: 1rem;
  background: rgba(0,0,0,.18);
}
.catalog-page .catalog-upload {
  min-height: 10.5rem;
  padding: 1.2rem;
  border: 1px dashed rgba(237,196,91,.46);
  border-radius: .8rem;
  text-align: center;
  background: radial-gradient(circle at 50% 0,rgba(237,196,91,.12),transparent 72%);
  transition: border-color .3s ease, background-color .3s ease, transform .3s cubic-bezier(.22,1,.36,1);
}
.catalog-page .catalog-upload:hover {
  border-color: var(--catalog-gold);
  background-color: rgba(237,196,91,.04);
  transform: translateY(-2px);
}
.catalog-page .upload-mark {
  display: grid;
  width: 2.8rem;
  height: 2.8rem;
  margin-bottom: .75rem;
  place-items: center;
  border: 1px solid rgba(237,196,91,.55);
  border-radius: 50%;
  color: var(--catalog-gold);
  background: rgba(237,196,91,.06);
}
.catalog-page .upload-mark svg { width: 1.25rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.5; }
.layout-previews { display: grid; gap: .55rem; margin-top: .55rem; }
.layout-preview {
  position: relative;
  display: grid;
  min-width: 0;
  grid-template-columns: 4.2rem minmax(0,1fr) 1.8rem;
  align-items: center;
  gap: .7rem;
  padding: .55rem;
  overflow: hidden;
  border: 1px solid rgba(244,243,238,.12);
  border-radius: .7rem;
  background: #080909;
  animation: preview-in .4s cubic-bezier(.22,1,.36,1) both;
}
@keyframes preview-in {
  from { opacity: 0; transform: scale(.97) translateY(5px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}
.layout-preview img,
.layout-preview object,
.file-extension {
  display: grid;
  width: 4.2rem;
  height: 3.2rem;
  place-items: center;
  object-fit: cover;
  overflow: hidden;
  border-radius: .45rem;
  background: #151616;
  color: var(--catalog-gold);
  font-size: .65rem;
  font-weight: 600;
}
.layout-preview div { min-width: 0; }
.layout-preview b {
  display: block;
  overflow: hidden;
  color: var(--catalog-white);
  font-size: .7rem;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.layout-preview small { display: block; margin-top: .2rem; color: rgba(244,243,238,.45); font-size: .62rem; }
.layout-preview small.error { color: var(--catalog-gold); }
.layout-preview button {
  width: 1.65rem;
  height: 1.65rem;
  padding: 0;
  border: 1px solid rgba(244,243,238,.14);
  border-radius: 50%;
  background: transparent;
  color: var(--catalog-white);
  cursor: pointer;
}
.layout-preview.is-loading::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 2px;
  content: "";
  background: linear-gradient(90deg,transparent,var(--catalog-gold),transparent);
  animation: upload-progress 1.2s ease-in-out infinite;
}
@keyframes upload-progress {
  from { transform: translateX(-100%); }
  to { transform: translateX(100%); }
}
.catalog-page .summary-price { position: relative; }
.catalog-page .summary-price.is-calculating {
  color: rgba(237,196,91,.45);
  animation: price-breathe 1s ease-in-out infinite alternate;
}
@keyframes price-breathe {
  to { color: var(--catalog-gold); text-shadow: 0 0 25px rgba(237,196,91,.22); }
}
.catalog-page .catalog-summary .btn:not(:disabled):hover span { transform: translateX(4px); }
.catalog-page .catalog-summary .btn span { transition: transform .25s ease; }

@media (max-width: 980px) {
  .catalog-page .fold-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 700px) {
  .catalog-page .calculator-steps { top: 62px; }
  .catalog-page .fold-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .layout-upload-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .catalog-page .catalog-form-block,
  .catalog-page .fold-selector,
  .layout-preview,
  .layout-preview.is-loading::after,
  .catalog-page .summary-price.is-calculating { animation: none; }
  .catalog-page .catalog-choice label:hover > span,
  .catalog-page .fold-grid button:hover,
  .catalog-page .catalog-upload:hover { transform: none; }
}
