/* Publieke websites PraktijkWerkt en SalonWerkt (ontwerp 'PraktijkWerkt & SalonWerkt – 2026').
   Laadt na app.css; alles hier hoort bij body.site. Lettertypen zelf gehost (SIL Open Font License, zie
   static/fonts/OFL-*.txt): geen externe verzoeken, geen tracking. */

@font-face { font-family: "Instrument Sans"; src: url("../fonts/instrument-sans.fa41c43a3d8e.woff2") format("woff2");
  font-weight: 400 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Instrument Serif"; src: url("../fonts/instrument-serif.9b8dd1ecf641.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Instrument Serif"; src: url("../fonts/instrument-serif-italic.bc891bdd08ad.woff2") format("woff2");
  font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "DM Sans"; src: url("../fonts/dm-sans.6c1e961057d2.woff2") format("woff2");
  font-weight: 400 700; font-style: normal; font-display: swap; }

/* --- Merken ------------------------------------------------------------------------------------------------- */
body.site {
  --ink: #14201C; --accent: #2E6B4F; --highlight: #D9F16E; --soft: #CFE0D4; --soft-2: #E6EFE9;
  --bg: #F3EFE8; --paper: #FFFFFF; --line: #E4DED3; --muted: #5B6B63; --peach: #F7E1D3;
  --sans: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --serif: "Instrument Serif", Georgia, serif;
  --display: var(--sans); --display-weight: 600; --display-spacing: -0.045em; --h2-spacing: -0.04em;
  --on-highlight: #14201C;
  /* app.css-variabelen naar de huisstijl */
  --teal: var(--ink); --teal-dark: var(--accent); --teal-soft: var(--soft-2); --font: var(--sans);
  --line-strong: var(--line); --radius: 22px; --radius-sm: 12px;
  background: var(--bg); color: var(--ink); font-family: var(--sans); font-size: 16px;
}
body.site.brand-salonwerkt {
  --ink: #2B2430; --accent: #7A5AD6; --highlight: #C9B8F0; --soft: #EDE6FA; --soft-2: #EDE6FA;
  --bg: #FAF6F1; --line: #E9E2DC; --muted: #6E6373; --peach: #F6D9CC;
  --sans: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --display: var(--serif); --display-weight: 400; --display-spacing: -0.02em; --h2-spacing: -0.02em;
}

body.site h1, body.site h2, body.site h3 { color: var(--ink); }
body.site a { color: var(--ink); }
body.site em { font-style: italic; }
.site .wrap { width: 100%; max-width: 1280px; margin: 0 auto; padding: 0 20px; }
.site .center { text-align: center; }
.site .muted { color: var(--muted); }
.site .fine { font-size: 13px; color: var(--muted); margin: .6rem 0 0; }
.site .serif { font-family: var(--serif); font-weight: 400; }
.site .lead { font-size: 19px; line-height: 1.55; color: var(--muted); margin: 0 0 1.4rem; }
.site .lead.narrow { max-width: 640px; }
.site .eyebrow { font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); margin: 0 0 .9rem; }
.site h1 { font-family: var(--display); font-weight: var(--display-weight); font-size: clamp(42px, 5.6vw, 78px);
  line-height: .98; letter-spacing: var(--display-spacing); margin: 0 0 1.4rem; }
.site h2 { font-family: var(--display); font-weight: var(--display-weight); font-size: clamp(34px, 4.4vw, 58px);
  line-height: 1.02; letter-spacing: var(--h2-spacing); margin: 0 0 1rem; }
.site h1 em, .site h2 em, .site .serif-title em, .site .serif em { font-family: var(--serif); font-weight: 400; color: var(--accent); letter-spacing: -0.02em; }
.site h3 { font-size: 22px; font-weight: 600; letter-spacing: -0.02em; margin: 0 0 .6rem; }
.site .serif-title { font-family: var(--serif); font-weight: 400; font-size: clamp(30px, 3.4vw, 46px); letter-spacing: -0.02em; line-height: 1.05; margin: 0 0 .8rem; }
.site .row-between { display: flex; justify-content: space-between; align-items: center; gap: .75rem; }

/* knoppen */
.site .pill { display: inline-flex; align-items: center; justify-content: center; gap: .4em; border-radius: 999px;
  padding: 12px 22px; font-weight: 600; font-size: 16px; text-decoration: none; border: 1px solid transparent;
  cursor: pointer; font-family: inherit; line-height: 1.2; white-space: nowrap; }
.site .pill.big { padding: 16px 24px; font-size: 17px; }
.site .pill.tiny { padding: 7px 14px; font-size: 13px; }
.site .pill.wide { display: flex; width: 100%; }
.site .pill.dark { background: var(--ink); color: #fff; }
.site .pill.dark:hover { background: var(--accent); color: #fff; }
.site .pill.light { background: var(--paper); color: var(--ink); border-color: var(--line); }
.site .pill.light:hover { border-color: var(--ink); }
.site .pill.soft { background: var(--soft-2); color: var(--ink); }
.site .pill.highlight { background: var(--highlight); color: var(--on-highlight); }
.site .pill.highlight:hover { filter: brightness(.96); }
.site .btn { border-radius: 999px; background: var(--ink); border-color: var(--ink); }
.site .btn:hover { background: var(--accent); border-color: var(--accent); }
.site .btn.secondary { background: var(--paper); color: var(--ink); border-color: var(--line); }
.site .tag { display: inline-block; font-style: normal; font-size: 12px; font-weight: 600; border-radius: 999px;
  padding: 3px 10px; white-space: nowrap; background: var(--bg); color: var(--ink); }
.site .tag.highlight { background: var(--highlight); }
.site .tag.soft { background: var(--soft-2); }
.site .tag.peach { background: var(--peach); }
.site .tag.plain { background: var(--bg); }

/* --- Topbalk, navigatie, footer ---------------------------------------------------------------------------- */
.site .site-topbar { background: var(--ink); color: rgba(255,255,255,.82); font-size: 13px; }
.site .topbar-inner { display: flex; justify-content: center; gap: 8px 28px; flex-wrap: wrap; padding: 8px 20px; }
.site .site-topbar strong { color: #fff; font-weight: 600; }
.site .site-nav-wrap { position: sticky; top: 0; z-index: 30; padding: 16px 20px 0; }
.site .site-nav { max-width: 1240px; margin: 0 auto; background: var(--paper); border: 1px solid var(--line);
  border-radius: 999px; display: flex; align-items: center; gap: 24px; padding: 10px 12px 10px 22px;
  box-shadow: 0 10px 30px rgba(0,0,0,.05); }
.site .logo { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; color: var(--ink); flex: none; }
.site .logo-word { font-weight: 600; font-size: 21px; letter-spacing: -0.03em; }
.site .logo-word.salon { font-family: var(--serif); font-weight: 400; font-size: 21px; letter-spacing: -0.02em; }
.site .logo-word.salon em { font-style: italic; }
.site .site-nav-links { display: flex; gap: 20px; flex-wrap: wrap; }
.site .site-nav-links a, .site .nav-login { text-decoration: none; color: var(--muted); font-size: 16px; font-weight: 500; }
.site .site-nav-links a:hover, .site .site-nav-links a[aria-current] { color: var(--ink); }
.site .site-nav-actions { margin-left: auto; display: flex; align-items: center; gap: 20px; }
.site .nav-login { color: var(--ink); font-weight: 600; }
.site .site-foot { border-top: 1px solid var(--line); max-width: 1240px; margin: 80px auto 0; padding: 40px 0 60px; color: var(--muted); font-size: 14px; background: none; }
.site .foot-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 32px; }
.site .site-foot h3 { font-size: 14px; color: var(--ink); margin: 0 0 .6rem; letter-spacing: 0; }
.site .site-foot ul { list-style: none; padding: 0; margin: 0; }
.site .site-foot li { margin: 0 0 .35rem; }
.site .site-foot a { color: var(--muted); text-decoration: none; }
.site .site-foot a:hover { color: var(--ink); text-decoration: underline; }
.site .foot-brand p { margin: .5rem 0 0; max-width: 320px; }
.site .logo.small .logo-word { font-size: 17px; }
.site .site-foot .logo { color: var(--ink); text-decoration: none; }

/* --- Hero met app-voorbeeld --------------------------------------------------------------------------------- */
.site .hero { padding: 72px 0 40px; background: none; }
.site .hero h1 { font-size: clamp(42px, 5.6vw, 78px); }
.site .hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 56px; align-items: center; }
.site .badge-new { display: inline-flex; align-items: center; gap: 10px; background: var(--paper); border: 1px solid var(--line);
  border-radius: 999px; padding: 5px 14px 5px 5px; font-size: 14px; font-weight: 500; margin: 0 0 1.4rem; }
.site .badge-new span { background: var(--highlight); border-radius: 999px; padding: 3px 9px; font-weight: 600; }
.site .checklist { list-style: none; padding: 0; margin: 0 0 1.8rem; }
.site .checklist li { display: flex; gap: 10px; margin: 0 0 .6rem; font-size: 17px; line-height: 1.4; }
.site .checklist.small li { font-size: 14px; margin-bottom: .45rem; }
.site .check { color: var(--accent); flex: 0 0 20px; margin-top: 1px; }
.site .actions { display: flex; flex-wrap: wrap; gap: 12px; }
.site .actions.small { gap: 8px; margin-top: 1rem; }
.site .actions.small .pill { padding: 10px 18px; font-size: 14px; }

.site .device { background: var(--ink); border-radius: 32px; padding: 12px 14px 14px; box-shadow: 0 30px 70px rgba(0,0,0,.16); }
.site .device.small { border-radius: 28px; }
.site .device-bar { display: flex; align-items: center; gap: 6px; padding: 4px 6px 12px; color: rgba(255,255,255,.7); font-size: 12px; }
.site .device-bar i { width: 9px; height: 9px; border-radius: 50%; background: rgba(255,255,255,.3); }
.site .device-bar span { margin-left: 10px; }
.site .app { display: grid; grid-template-columns: 170px minmax(0, 1fr); background: var(--paper); border-radius: 20px; overflow: hidden; font-size: 13px; }
.site .app-side { background: var(--bg); padding: 16px 10px; display: flex; flex-direction: column; gap: 2px; border-right: 1px solid var(--line); }
.site .app-logo { padding: 2px 8px 14px; display: flex; align-items: center; gap: 6px; }
.site .app-logo .logo-word { font-size: 15px; }
.site .app-menu { display: flex; justify-content: space-between; align-items: center; padding: 7px 10px; border-radius: 9px; color: var(--muted); }
.site .app-menu.active { background: var(--ink); color: #fff; font-weight: 600; }
.site .app-menu b { background: var(--highlight); color: var(--ink); border-radius: 999px; font-size: 10px; padding: 0 6px; }
.site .app-main { padding: 18px; min-width: 0; }
.site .app-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.site .app-head small { display: block; color: var(--muted); font-size: 12px; }
.site .app-head strong.serif { font-size: 26px; line-height: 1.1; display: block; }
.site .app-head strong.serif em { color: var(--accent); }
.site .app-buttons { display: flex; gap: 6px; }
.site .app-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; }
.site .app-stat { border: 1px solid var(--line); border-radius: 14px; padding: 10px 12px; }
.site .app-stat small { display: block; color: var(--muted); font-size: 12px; margin-bottom: 2px; }
.site .app-stat .num { font-size: 22px; font-weight: 700; }
.site .app-stat .bold { font-weight: 600; }
.site .app-stat.kor { background: var(--soft); border-color: transparent; }
.site .app-stat .bar { display: block; height: 6px; background: #fff; border-radius: 99px; margin: 6px 0; }
.site .app-stat .bar i { display: block; width: 36%; height: 100%; background: var(--accent); border-radius: 99px; }
.site .app-list { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.site .app-list-head { display: flex; justify-content: space-between; padding: 10px 12px; border-bottom: 1px solid var(--line); }
.site .app-list-head small { color: var(--muted); }
.site .app-row { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 9px 12px; border-bottom: 1px solid var(--line); }
.site .app-row:last-child { border-bottom: 0; }
.site .app-row span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* --- Platform-labels ---------------------------------------------------------------------------------------- */
.site .platform { padding: 40px 0 20px; }
.site .platform-title { font-weight: 600; color: var(--muted); margin: 0 0 .8rem; }
.site .chips { list-style: none; padding: 0; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; max-width: 1140px; }
.site .chips li { background: var(--paper); border: 1px solid var(--line); border-radius: 999px; padding: 7px 15px; font-weight: 500; }

/* --- Blokken ------------------------------------------------------------------------------------------------ */
.site .block { padding: 110px 0 0; }
.site .block.tight { padding-top: 70px; }
.site .block.first { padding-top: 56px; }
.site .split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; }
.site .split.reverse > :first-child { order: 0; }
.site .card { background: var(--paper); border: 1px solid var(--line); border-radius: 22px; padding: 22px; box-shadow: none; }

/* website-voorbeeld */
.site .mock-site { background: var(--paper); border-radius: 18px; overflow: hidden; font-size: 13px; }
.site .mock-nav { display: flex; align-items: center; gap: 16px; padding: 14px 18px; border-bottom: 1px solid var(--line); }
.site .mock-nav strong { color: var(--mock); }
.site .mock-nav span { color: var(--muted); margin: 0 auto; }
.site .mock-nav em, .site .mock-hero em { font-style: normal; background: var(--mock); color: #fff; border-radius: 999px; padding: 6px 13px; font-weight: 600; }
.site .mock-hero { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; padding: 24px 18px; background: var(--mock-tint); }
.site .mock-title { font-family: var(--serif); font-size: 28px; line-height: 1.08; color: var(--mock); margin: 0 0 .5rem; }
.site .mock-hero p { color: var(--muted); margin: 0 0 .9rem; }
.site .mock-photo { background: var(--mock-photo); border-radius: 14px; display: grid; place-items: center; color: var(--muted); min-height: 140px; }
.site .mock-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 16px 18px 18px; }
.site .mock-tiles div { border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; }
.site .mock-tiles strong { display: block; font-size: 13px; }
.site .mock-tiles span { color: var(--muted); font-size: 12px; }

/* btw-aangifte, logboek, route */
.site .vat-card, .site .inner-card { font-size: 14px; }
.site .vat-card .row-between, .site .inner-card .row-between { margin-bottom: .4rem; }
.site .line { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.site .vat-card .line span { color: var(--muted); }
.site .inner-card { border: 1px solid var(--line); border-radius: 18px; padding: 18px; margin-top: 1rem; }
.site .inner-card .line { grid-template-columns: 56px minmax(0, 1fr) auto; }
.site .inner-card .line.travel span, .site .inner-card .line small { color: var(--muted); }
.site .inner-card .line.logline { grid-template-columns: 60px minmax(0, 1fr); background: none; color: var(--ink); font-family: inherit; border-radius: 0; padding: 10px 0; }
.site .two-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.site .big-card { padding: 34px 32px; border-radius: 28px; }
.site .big-card h3 { font-size: 26px; }

/* donkere banden: rekenhulp en prijs */
.site .dark-band { background: var(--ink); color: rgba(255,255,255,.82); border-radius: 32px; padding: 44px 36px;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; margin-top: 56px; }
.site .dark-band .eyebrow { color: var(--highlight); }
.site .dark-band h2, .site .dark-band h3, .site .dark-band .serif-title { color: #fff; }
.site .dark-band .serif-title em { color: #fff; }
.site .calc-rows { display: flex; flex-direction: column; gap: 10px; }
.site .calc-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; background: rgba(255,255,255,.08);
  border-radius: 12px; padding: 10px 14px; color: #fff; font-size: 15px; font-weight: 400; margin: 0; cursor: text; }
.site .calc-input { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; color: rgba(255,255,255,.8); }
.site .calc-input input { width: 6.5ch; background: transparent; border: 0; border-bottom: 1px solid rgba(255,255,255,.4);
  color: #fff; font: inherit; text-align: right; padding: 2px 0; border-radius: 0; box-shadow: none; }
.site .calc-input input:focus { outline: 2px solid var(--highlight); outline-offset: 2px; }
.site .calc-row.total { background: var(--highlight); color: var(--on-highlight); font-weight: 600; cursor: default; }
.site .calc .fine { color: rgba(255,255,255,.6); }
.site .calc-result { color: #fff; font-weight: 600; font-size: 17px; min-height: 1.5em; }
.site .price-band { align-items: center; padding: 56px 48px; }
.site .price-band p { font-size: 17px; }
.site .price-box { color: var(--ink); padding: 28px; border: 0; }
.site .price-big { margin: 0; font-size: 18px; color: var(--muted); }
.site .price-big strong { font-size: 56px; font-weight: 600; letter-spacing: -0.04em; color: var(--ink); }
.site .price-box .checklist { margin: 1rem 0 1.2rem; }

/* chat */
.site .chat-card { display: flex; flex-direction: column; gap: 10px; font-size: 15px; }
.site .chat-card small { color: var(--muted); }
.site .bubble { margin: 0; padding: 10px 14px; border-radius: 14px; max-width: 85%; line-height: 1.4; }
.site .bubble.in { background: var(--bg); align-self: flex-end; }
.site .bubble.out { background: var(--ink); color: #fff; align-self: flex-start; }
.site .bubble.done { background: var(--soft-2); font-weight: 600; align-self: flex-start; }

/* functies en stappen */
.site .feature-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 2rem; }
.site .feature h3 { font-size: 19px; margin: .5rem 0 .4rem; }
.site .feature p, .site .step p { color: var(--muted); font-size: 14.5px; margin: 0; line-height: 1.5; }
.site .num-serif { font-family: var(--serif); font-style: italic; font-size: 24px; color: var(--accent); }
.site .num-serif.big { font-size: 30px; }
.site .steps-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 1.2rem; }
.site .step { padding: 28px; border-radius: 28px; }
.site .step h3 { margin-top: .6rem; }
.site .step p { font-size: 16px; }

/* vergelijking */
.site .compare-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 22px; background: var(--paper); margin-top: 1.6rem; }
.site .compare { width: 100%; border-collapse: collapse; font-size: 14px; min-width: 860px; }
.site .compare th, .site .compare td { text-align: left; padding: 12px 14px; border-bottom: 1px solid var(--line); }
.site .compare th { text-transform: none; letter-spacing: 0; font-size: 14px; background: none; }
.site .compare thead th { font-weight: 600; color: var(--ink); border-bottom: 1px solid var(--line); }
.site .compare thead th.ours { background: var(--soft-2); }
.site .compare tbody th { font-weight: 400; color: var(--muted); }
.site .compare tr:last-child th, .site .compare tr:last-child td { border-bottom: 0; }
.site .compare .ours { background: var(--soft-2); font-weight: 600; }

/* vragen */
.site .faq-wrap { max-width: 900px; }
.site .faq details { border: 0; border-top: 1px solid var(--line); background: none; border-radius: 0; margin: 0; }
.site .faq details:last-child { border-bottom: 1px solid var(--line); }
.site .faq summary { padding: 18px 0; font-weight: 600; font-size: 18px; cursor: pointer; }
.site .faq details p { color: var(--muted); padding: 0 0 18px; margin: 0; font-size: 16px; }

/* aanmeldblok */
.site .final { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; padding: 48px; border-radius: 32px; }
.site .final-form { display: flex; flex-direction: column; gap: 8px; }
.site .final-form label { font-size: 13px; font-weight: 600; margin: 0; }
.site .calc-row span, .site .calc-row strong { font-weight: inherit; }
.site .final-form input { border-radius: 14px; padding: 13px 14px; border: 1px solid var(--line); font: inherit; background: var(--paper); }
.site .final-form button { margin-top: 6px; padding: 15px; }

/* formulieren (aanmelden, juridische pagina's) in de huisstijl */
.site .section .container.narrow, .site .container.narrow { max-width: 760px; }
.site .section h1 { font-size: clamp(34px, 4.4vw, 52px); }
.site input, .site select, .site textarea { border-radius: 12px; }
.site .wizard-steps li.current span { background: var(--ink); border-color: var(--ink); }
.site .wizard-steps li.done span { border-color: var(--accent); color: var(--accent); }
.site .card.soft { background: var(--soft-2); }
.site .prose { font-size: 16px; }

.site .card h2, .site .prose h2 { font-family: var(--display); font-weight: var(--display-weight); font-size: 28px;
  letter-spacing: -0.02em; line-height: 1.15; margin: 1.6rem 0 .6rem; }
.site .card h2:first-child, .site .card > h2:first-child { margin-top: 0; }
.site .card.final h2 { font-size: clamp(30px, 3.4vw, 46px); font-family: var(--serif); font-weight: 400; margin-top: 0; }
.site .section { padding: 3.5rem 0 0; }

/* --- Smal scherm -------------------------------------------------------------------------------------------- */
@media (max-width: 1100px) {
  .site .site-nav-links { display: none; }
  .site .feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .site .hero { padding-top: 40px; }
  .site .hero-grid, .site .split, .site .two-cards, .site .dark-band, .site .final { grid-template-columns: 1fr; gap: 32px; }
  .site .split.reverse > :first-child { order: 2; }
  .site .steps-grid { grid-template-columns: 1fr; }
  .site .block { padding-top: 72px; }
  .site .dark-band, .site .price-band, .site .final, .site .big-card { padding: 28px 22px; }
  .site .foot-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
  .site .topbar-inner span:nth-child(n+3) { display: none; }
  .site .site-nav { padding: 8px 8px 8px 16px; gap: 10px; }
  .site .site-nav-actions { gap: 10px; }
  .site .site-nav-actions .pill { padding: 9px 14px; font-size: 14px; }
  .site .nav-login { font-size: 14px; }
}
@media (max-width: 430px) {
  .site .nav-login { display: none; }
  .site .hero-text .pill.big { white-space: normal; text-align: center; }
  .site .logo-word { font-size: 18px; }
  .site .feature-grid { grid-template-columns: 1fr; }
  .site .app { grid-template-columns: 1fr; }
  .site .app-side { display: none; }
  .site .mock-hero { grid-template-columns: 1fr; }
  .site .mock-nav span { display: none; }
  .site .mock-tiles { grid-template-columns: 1fr; }
  .site .lead { font-size: 17px; }
  .site .checklist li { font-size: 16px; }
  .site .pill.big { padding: 15px 20px; font-size: 16px; }
  .site .foot-grid { grid-template-columns: 1fr; }
  .site .price-big strong { font-size: 44px; }
}