/* =====================================================================
   Catalog design: product cards, product pages, family pages, estimators, home sections.
   Every product/family sets --accent (its catalog colour); everything else derives from it.
   ===================================================================== */
.pcard, .pp, .famcard, .fam-hero, .fam-row, .g-chip, .cmp tbody th, .catbook, .archive-cats a {
  --accent-dark: color-mix(in srgb, var(--accent, #C9A063) 72%, #10161D);
  --accent-tint: color-mix(in srgb, var(--accent, #C9A063) 11%, #F4F1EC);
}
.btn-accent { background: var(--accent, var(--gold)); color: var(--on-accent, #10161D); }
.btn-accent:hover { filter: brightness(1.08); transform: translateY(-1px); }

/* ---------- mega menu (families as columns) ---------- */
.mega { grid-template-columns: repeat(var(--n, 3), 1fr) 1.1fr; }
.mega .col { border-top: 3px solid var(--accent, var(--gold)); }
.mega ul li::before { background: var(--dot, var(--gold)); transform: none; border-radius: 50%; width: 7px; height: 7px; }
.mega ul li a:hover { color: var(--accent-dark, var(--gold-lo)); }

/* ---------- product card ---------- */
.pgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
.pgrid.big { grid-template-columns: repeat(2, 1fr); gap: 28px; }
.pcard { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; transition: transform .3s, box-shadow .3s, border-color .3s; }
.pcard:hover { transform: translateY(-5px); box-shadow: 0 30px 54px -32px rgba(16, 22, 29, .45); border-color: color-mix(in srgb, var(--accent) 55%, #fff); }
.pc-media { position: relative; aspect-ratio: 1 / 1.02; background: radial-gradient(70% 62% at 50% 40%, #fff 0%, var(--accent-tint) 100%); overflow: hidden; display: grid; place-items: center; }
.pc-media::before { content: ""; position: absolute; top: 0; bottom: 0; inset-inline-start: 6%; width: 30%; background: var(--accent); opacity: .14; transform: skewX(-29deg); }
.pc-pack .pc-media img { position: relative; height: 84%; width: auto; max-width: 80%; object-fit: contain; mix-blend-mode: multiply; transition: transform .6s cubic-bezier(.2, .7, .2, 1); }
.pcard:hover .pc-media img { transform: scale(1.05) translateY(-2%); }
.pc-photo .pc-media { aspect-ratio: 4 / 3; background: var(--ink); }
.pc-photo .pc-media::before { display: none; }
.pc-photo .pc-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .8s; }
.pgrid.big .pc-media { aspect-ratio: 16 / 10; }
.pc-body { padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 6px; flex: 1; border-top: 3px solid var(--accent); }
.pc-tag { align-self: flex-start; font-size: 12px; font-weight: 800; color: var(--accent-dark); background: color-mix(in srgb, var(--accent) 13%, #fff); padding: 3px 10px; border-radius: 2px; }
.pcard h3 { font-size: 20px; font-weight: 900; margin: 6px 0 0; line-height: 1.5; color: var(--ink); }
.pcard h3 em, .pp h1 em { font-style: normal; color: var(--accent-dark); }
.pc-latin { font-size: 10.5px; letter-spacing: .16em; color: var(--muted); font-weight: 600; text-transform: uppercase; }
.pc-stats { display: flex; gap: 20px; margin: 10px 0 0; padding: 0; list-style: none; flex-wrap: wrap; }
.pc-stats li { display: flex; flex-direction: column; }
.pc-stats b { font-size: 17px; color: var(--ink); line-height: 1.3; }
.pc-stats small { font-size: 11.5px; color: var(--muted); }
.pc-more { margin-top: auto; padding-top: 14px; font-size: 13px; font-weight: 800; color: var(--accent-dark); display: inline-flex; gap: 8px; align-items: center; }
.pc-more svg { width: 14px; height: 14px; transition: transform .3s; }
.pcard:hover .pc-more svg { transform: translateX(-4px); }
[dir="ltr"] .pcard:hover .pc-more svg { transform: scaleX(-1) translateX(-4px); }
[dir="ltr"] .pc-more svg { transform: scaleX(-1); }

/* tabs on the home page take each family's colour */
.cats a.on::after { background: var(--accent, var(--gold)); }
.cat-panel .pgrid { margin-top: 36px; }

/* ---------- product page ---------- */
.pp { background: var(--paper); }
.pp-hero { background: linear-gradient(180deg, #F3F0EB, var(--paper)); padding: 30px 0 100px; position: relative; overflow: hidden; }
.pp-hero::before { content: ""; position: absolute; top: 0; bottom: 0; inset-inline-end: -6%; width: 50%; background: color-mix(in srgb, var(--accent) 9%, transparent); transform: skewX(-29deg); }
.pp .crumbs { color: var(--muted); padding: 0 0 26px; position: relative; }
.pp .crumbs b { color: var(--accent-dark); }
.pp-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 64px; align-items: center; position: relative; }
.pp-tag { display: inline-block; background: var(--accent); color: var(--on-accent, #fff); font-weight: 800; font-size: 13px; padding: 6px 14px; border-radius: 3px; }
.pp h1 { font-size: clamp(40px, 5.2vw, 70px); font-weight: 900; line-height: 1.2; margin: 18px 0 8px; letter-spacing: -.01em; }
.pp-latin { font-size: 13px; letter-spacing: .22em; font-weight: 700; color: var(--accent-dark); text-transform: uppercase; }
.pp-lead { font-size: 18px; line-height: 2; color: #3A424B; max-width: 560px; margin: 22px 0; }
.pp-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 26px; }
.pp-chips span { background: #2A3540; color: #fff; padding: 7px 14px; border-radius: 999px; font-size: 13px; font-weight: 700; }
.pp-ctas { display: flex; gap: 12px; flex-wrap: wrap; }
.pp-ctas .btn-line { color: var(--ink); }
.pp-links { display: flex; gap: 22px; flex-wrap: wrap; margin-top: 20px; font-size: 14px; color: var(--muted); }
.pp-links a { display: inline-flex; gap: 8px; align-items: center; }
.pp-links a:hover { color: var(--accent-dark); }
.pp-links svg { width: 16px; height: 16px; }

.pp-visual { position: relative; }
.pv { position: relative; border-radius: 8px; overflow: hidden; }
.pv-pack { aspect-ratio: 1 / 1.08; background: radial-gradient(62% 56% at 50% 42%, #fff 0%, var(--accent-tint) 100%); display: grid; place-items: center; box-shadow: 0 40px 70px -46px rgba(16, 22, 29, .5); }
.pv-stripe { position: absolute; top: 0; bottom: 0; inset-inline-start: 7%; width: 24%; background: var(--accent); opacity: .17; transform: skewX(-29deg); }
.pv-stripe::after { content: ""; position: absolute; top: 0; bottom: 0; inset-inline-start: 190%; width: 36%; background: var(--accent); opacity: .7; }
.pv-img { position: relative; z-index: 1; height: 88%; width: auto; max-width: 82%; object-fit: contain; mix-blend-mode: multiply; }
.pv-shadow { position: absolute; bottom: 4%; inset-inline: 24%; height: 18px; background: radial-gradient(closest-side, rgba(16, 22, 29, .3), transparent); filter: blur(5px); }
.pv-chip { position: absolute; z-index: 2; inset-inline-start: 18px; bottom: 18px; background: var(--ink); color: #fff; padding: 10px 16px; font-size: 13px; font-weight: 700; border-inline-start: 3px solid var(--accent); border-radius: 2px; max-width: 70%; }
.pv-photo { aspect-ratio: 4 / 3.2; background: var(--ink); box-shadow: 0 40px 70px -46px rgba(16, 22, 29, .6); }
.pv-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pv-photo::after { content: ""; position: absolute; bottom: 0; inset-inline: 0; height: 6px; background: var(--accent); }
.pv-badge { position: absolute; top: 16px; inset-inline-start: 16px; background: rgba(16, 22, 29, .6); color: #fff; backdrop-filter: blur(10px); padding: 8px 14px; font-size: 12.5px; border-radius: 2px; }
.pv-thumbs { display: flex; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.pv-thumbs button { width: 70px; height: 70px; border: 2px solid transparent; border-radius: 4px; overflow: hidden; background: #F1EEE9; padding: 0; cursor: pointer; opacity: .72; transition: .2s; }
.pv-thumbs button:hover { opacity: 1; }
.pv-thumbs button.on { border-color: var(--accent); opacity: 1; }
.pv-thumbs img { width: 100%; height: 100%; object-fit: cover; }
.pv-thumbs .pack img { object-fit: contain; mix-blend-mode: multiply; padding: 4px; }

/* key figures */
.pp-stats { margin-top: -60px; position: relative; z-index: 2; }
.stats { display: grid; gap: 16px; }
.stats-4 { grid-template-columns: repeat(4, 1fr); }
.stats-3 { grid-template-columns: repeat(3, 1fr); }
.stats-2 { grid-template-columns: repeat(2, 1fr); }
.stats-1 { grid-template-columns: minmax(0, 420px); }
.stat { background: #fff; border-radius: 6px; padding: 24px 22px 22px; text-align: center; border-top: 4px solid var(--accent); box-shadow: 0 26px 46px -34px rgba(16, 22, 29, .4); }
.stat b { display: block; font-size: clamp(22px, 2.3vw, 34px); font-weight: 800; line-height: 1.15; color: var(--ink); white-space: nowrap; }
.stat em { font-style: normal; display: block; color: var(--accent-dark); font-weight: 800; font-size: 13px; margin-top: 6px; }
.stat span { display: block; color: var(--muted); font-size: 13.5px; margin-top: 6px; line-height: 1.7; }

.pp-body { padding: 84px 0 40px; }
.pp-cols { display: grid; grid-template-columns: 1.6fr 1fr; gap: 64px; align-items: start; }
.pp-h { font-size: 24px; font-weight: 900; margin: 0 0 18px; display: flex; align-items: center; gap: 12px; }
.pp-h::before { content: ""; width: 10px; height: 26px; background: var(--accent); transform: skewX(-12deg); flex: none; }
.pp-main .prose { font-size: 17px; line-height: 2.1; }
.pp-main > * + .pp-h, .pp-main .prose + .pp-h { margin-top: 48px; }
.diamonds { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.diamonds li { position: relative; padding-inline-start: 28px; line-height: 1.9; color: #2B323A; }
.diamonds li::before { content: ""; position: absolute; inset-inline-start: 4px; top: .78em; width: 9px; height: 9px; background: var(--accent); transform: rotate(45deg); }
.pp-aside { position: sticky; top: 24px; }
.tipcard { background: #fff; border: 1px solid var(--line); border-inline-start: 4px solid var(--accent); border-radius: 4px; padding: 22px 24px; }
.tipcard b { color: var(--accent-dark); font-size: 15px; }
.tipcard p { margin: 8px 0 0; line-height: 2; color: #2B323A; }
.packcard { background: var(--ink); color: #fff; border-radius: 6px; padding: 22px 24px 8px; margin-top: 16px; }
.packcard b { color: var(--gold-hi); font-size: 14px; display: block; }
.packcard p { margin: 6px 0 16px; line-height: 1.9; }
.pp-specs { padding: 40px 0 88px; }
.pp-specs table.tds { max-width: 860px; margin-top: 0; }
.pp-specs table.tds td.v small { color: var(--muted); font-weight: 400; margin-inline-start: 8px; }

/* estimator */
.pp-calc { background: var(--ink); color: var(--on-dark); padding: 92px 0; position: relative; overflow: hidden; }
.pp-calc::before { content: ""; position: absolute; top: 0; bottom: 0; inset-inline-end: -80px; width: 420px; background: repeating-linear-gradient(calc(90deg - var(--slope)), rgba(201, 160, 99, .08) 0 8px, transparent 8px 30px); }
.calc { display: grid; grid-template-columns: .9fr 1.1fr; gap: 28px 56px; align-items: start; position: relative; }
.calc-head { grid-row: span 3; }
.calc-head .lead { color: var(--on-dark-muted); }
.calc-form { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1); padding: 22px; border-radius: 6px; }
.cf span { display: block; font-size: 13px; color: var(--on-dark-muted); margin-bottom: 6px; }
.cf input, .cf select { width: 100%; height: 48px; background: #fff; color: var(--ink); border: 0; border-radius: 3px; padding: 0 14px; font: inherit; font-weight: 700; direction: ltr; text-align: start; }
.cf select { direction: inherit; }
.calc-out { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px; }
.out { background: rgba(255, 255, 255, .06); border-radius: 6px; padding: 18px 20px; border-top: 3px solid rgba(255, 255, 255, .22); }
.out.main { background: var(--accent, var(--gold)); color: var(--on-accent, #10161D); border-top-color: transparent; }
.out span { font-size: 13px; opacity: .85; display: block; }
.out b { display: block; font-size: 34px; font-weight: 800; line-height: 1.2; margin-top: 4px; font-family: Montserrat, sans-serif; direction: ltr; text-align: start; }
.out small { opacity: .82; font-size: 12.5px; }
.calc-note { color: var(--on-dark-muted); font-size: 13px; line-height: 1.95; margin: 0; }
.fam-products .pp-calc { border-radius: 8px; margin-top: 88px; padding: 60px 44px; }

/* catalog download */
.pp-catalog { background: var(--stone); padding: 96px 0; }
.pc-grid { display: grid; grid-template-columns: .55fr 1fr; gap: 72px; align-items: center; }
.pc-preview img { width: 100%; max-width: 380px; box-shadow: 0 40px 60px -30px rgba(16, 22, 29, .55); border-radius: 3px; transform: rotate(-2deg); transition: transform .4s; margin-inline: auto; }
.pc-preview:hover img { transform: rotate(0) translateY(-6px); }
.pc-text .pp-ctas { margin-top: 28px; }
.pc-text .btn-line { color: var(--ink); }
.pp-family { padding: 96px 0; background: var(--paper); }
.pp-family .head { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 40px; flex-wrap: wrap; }

/* ---------- family / catalog pages ---------- */
.fam-hero { border-bottom: 4px solid var(--accent, var(--gold)); }
.fam-hero h1 { max-width: 820px; }
.fam-actions { display: flex; gap: 12px; margin-top: 28px; flex-wrap: wrap; }
.fam-products { padding-top: 56px; }
.archive-cats a { display: inline-flex; align-items: center; gap: 8px; }
.archive-cats a i { width: 9px; height: 9px; background: var(--accent); border-radius: 50%; }
.archive-cats a small { color: var(--gold-lo); font-weight: 700; font-size: 11px; }
.archive-cats a.on small, .archive-cats a:hover small { color: var(--gold-hi); }
.fam-products .pgrid { margin-top: 8px; }
.fam-row + .fam-row { margin-top: 104px; }
.fam-row .cat-title .word { -webkit-text-stroke-color: var(--accent-dark); }
.fam-row .cat-title { margin-bottom: 32px; }
.fam-links { display: flex; gap: 24px; flex-wrap: wrap; margin-top: 16px !important; font-weight: 800; }
.fam-links a { color: var(--accent-dark); display: inline-flex; gap: 8px; align-items: center; }
.fam-links svg { width: 14px; height: 14px; }
.fam-block { margin-top: 96px; }
.fam-block .lead { margin-top: 10px; }
.guide { list-style: none; padding: 0; margin: 28px 0 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.guide li { display: flex; gap: 16px; background: #fff; border: 1px solid var(--line); border-radius: 6px; padding: 20px 22px; }
.guide li > i { font-style: normal; width: 38px; height: 38px; flex: none; display: grid; place-items: center; background: var(--ink); color: var(--gold-hi); border-radius: 50%; font-weight: 700; font-size: 14px; }
.guide b { display: block; font-size: 16px; line-height: 1.8; margin-bottom: 10px; }
.g-prods { display: flex; flex-wrap: wrap; gap: 8px; }
.g-chip { font-size: 13px; font-weight: 800; padding: 6px 12px; border-radius: 999px; background: color-mix(in srgb, var(--accent) 12%, #fff); color: var(--accent-dark); border: 1px solid color-mix(in srgb, var(--accent) 35%, #fff); transition: .2s; }
.g-chip:hover { background: var(--accent); color: var(--on-accent, #fff); }
.cmp-wrap { overflow-x: auto; margin-top: 26px; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.cmp { border-collapse: collapse; min-width: 780px; width: 100%; font-size: 14.5px; }
.cmp th, .cmp td { padding: 14px 16px; border-bottom: 1px solid var(--line); text-align: center; white-space: nowrap; }
.cmp thead th { background: var(--ink); color: var(--on-dark); font-weight: 700; font-size: 13px; white-space: normal; line-height: 1.6; }
.cmp thead th:first-child, .cmp tbody th { text-align: start; }
.cmp tbody th { position: sticky; inset-inline-start: 0; background: #fff; border-inline-start: 4px solid var(--accent); font-weight: 800; z-index: 1; }
.cmp tbody th a:hover { color: var(--accent-dark); }
.cmp tbody tr:nth-child(even) td, .cmp tbody tr:nth-child(even) th { background: #FCFBF9; }
.cmp td { font-weight: 600; }
.forms3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 28px; }
.form3 { background: #fff; border: 1px solid var(--line); border-radius: 6px; padding: 26px; border-top: 4px solid var(--gold); }
.form3 svg { width: 44px; height: 44px; color: var(--gold-lo); }
.form3 > span { display: block; margin-top: 14px; font-size: 11px; letter-spacing: .22em; color: var(--gold-lo); font-weight: 700; text-transform: uppercase; }
.form3 b { display: block; font-size: 22px; font-weight: 900; margin: 4px 0 8px; }
.form3 p { margin: 0 0 12px; color: var(--ink-soft); line-height: 1.9; }
.form3 small { color: var(--muted); font-size: 13px; line-height: 1.8; display: block; }

/* ---------- home: families, process, capacity, catalogs ---------- */
.families { background: var(--paper); padding: 112px 0; }
.famcards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.famcard { background: #fff; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; display: flex; flex-direction: column; transition: transform .35s, box-shadow .35s; }
.famcard:hover { transform: translateY(-6px); box-shadow: 0 36px 60px -36px rgba(16, 22, 29, .5); }
.fc-media { height: 300px; position: relative; overflow: hidden; background: radial-gradient(70% 70% at 50% 42%, #fff, var(--accent-tint)); }
.fc-media.photo { background: var(--ink); }
.fc-media.photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .9s; }
.famcard:hover .fc-media.photo img { transform: scale(1.06); }
.fc-media.bags::before { content: ""; position: absolute; top: 0; bottom: 0; inset-inline-start: 8%; width: 30%; background: var(--accent); opacity: .15; transform: skewX(-29deg); }
.fc-media.bags img { position: absolute; bottom: -6%; width: auto; mix-blend-mode: multiply; transition: transform .6s; }
.fc-media.bags .b1 { height: 74%; inset-inline-start: 5%; z-index: 3; }
.fc-media.bags .b2 { height: 68%; inset-inline-start: 34%; z-index: 2; bottom: -3%; }
.fc-media.bags .b3 { height: 62%; inset-inline-start: 62%; z-index: 1; bottom: 0; }
.fc-media.bags .b4 { display: none; }
.famcard:hover .fc-media.bags img { transform: translateY(-3%); }
.fc-body { padding: 26px 28px 30px; border-top: 4px solid var(--accent); flex: 1; display: flex; flex-direction: column; }
.fc-word { font-size: 11px; letter-spacing: .24em; color: var(--accent-dark); font-weight: 700; }
.famcard h3 { font-size: 26px; font-weight: 900; margin: 6px 0 8px; }
.famcard p { margin: 0; color: var(--muted); line-height: 1.95; font-size: 15px; }
.fc-list { list-style: none; margin: 16px 0 22px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13.5px; color: var(--ink-soft); }
.fc-list li::before { content: ""; display: inline-block; width: 8px; height: 8px; background: var(--dot); border-radius: 50%; margin-inline-end: 7px; }
.fc-list li.more { color: var(--muted); font-weight: 700; }
.fc-list li.more::before { display: none; }
.fc-cta { margin-top: auto; font-weight: 800; color: var(--accent-dark); display: inline-flex; gap: 8px; align-items: center; }
.fc-cta svg { width: 14px; height: 14px; }
.steps.s4 { grid-template-columns: repeat(4, 1fr); }
.cap { background: var(--night); color: var(--on-dark); position: relative; overflow: hidden; padding: 120px 0; }
.cap-photo { position: absolute; top: 0; bottom: 0; inset-inline-end: 0; width: 58%; background-size: cover; background-position: center; opacity: .6; }
.cap-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(270deg, rgba(16, 22, 29, 0), var(--night) 96%); }
[dir="ltr"] .cap-photo::after { background: linear-gradient(90deg, rgba(16, 22, 29, 0), var(--night) 96%); }
.cap-grid { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.cap .lead { color: var(--on-dark-muted); }
.cap-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.cap-stats div { background: rgba(16, 22, 29, .74); backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, .12); padding: 24px; border-radius: 4px; }
.cap-stats b { display: block; font-size: 46px; font-weight: 800; color: var(--gold-hi); line-height: 1.1; }
.cap-stats span { font-size: 14px; color: var(--on-dark-muted); line-height: 1.8; display: block; margin-top: 6px; }
.catalogs { padding: 112px 0; background: var(--stone); }
.catgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.catbook { text-align: center; display: flex; flex-direction: column; gap: 6px; align-items: center; }
.catbook img { width: 64%; box-shadow: 0 34px 54px -30px rgba(16, 22, 29, .55); border-radius: 3px; transition: transform .4s; transform: rotate(-1.5deg); }
.catbook:hover img { transform: rotate(0) translateY(-8px); }
.catbook span { font-weight: 900; font-size: 20px; margin-top: 18px; }
.catbook small { color: var(--accent-dark); letter-spacing: .14em; font-weight: 700; }
.legal-ids { direction: inherit; }
.trust .certs .cert b { font-weight: 700; margin-inline-start: 4px; }

@media (max-width: 900px) {
  .pgrid, .pgrid.big { grid-template-columns: 1fr 1fr; gap: 14px; }
  .pc-body { padding: 14px 14px 16px; }
  .pcard h3 { font-size: 17px; }
  .pc-stats { gap: 12px; }
  .pc-stats b { font-size: 15px; }
  .pp-hero { padding-bottom: 80px; }
  .pp-grid, .pp-cols, .pc-grid, .calc, .cap-grid { grid-template-columns: 1fr; gap: 36px; }
  .calc-head { grid-row: auto; }
  .pp-aside { position: static; }
  .stats-4, .stats-3 { grid-template-columns: 1fr 1fr; }
  .stat { padding: 18px 12px; }
  .stat b { font-size: 26px; }
  .guide, .forms3, .famcards, .catgrid { grid-template-columns: 1fr; }
  .steps.s4 { grid-template-columns: 1fr; }
  .cap-photo { width: 100%; opacity: .3; }
  .cap-stats b { font-size: 34px; }
  .fam-products .pp-calc { padding: 36px 20px; }
  .calc-form { grid-template-columns: 1fr 1fr; padding: 16px; }
  .catbook img { width: 56%; }
}
@media (max-width: 560px) {
  .pgrid, .pgrid.big { grid-template-columns: 1fr; }
  .pc-media { aspect-ratio: 4 / 3; }
  .pc-pack .pc-media img { height: 88%; }
}

/* buttons inside page content (landing pages) */
.prose a.btn, .page-content a.btn { color: #10161D; text-decoration: none; display: inline-flex; margin-top: 8px; }
.prose a.btn:hover { color: #10161D; }