/* =====================================================================================================================
   /pricing on the v9 look (views/landing/pricing.php, v9 round 2, 2026-10-31). Pinnat: white sheets with soft shadows
   on the calm cool page, near-black Mona Sans 800 at 110 % for H1/H2, Geologica for text, 12 px controls with 1.5 px
   edges, 24 px sheets with no outline, nothing under 16 px. The page is on the legacy layout (landing.css is loaded,
   v9/base.css is not), so everything here is scoped to .pr9, and the home price calculator's own files
   (css/v8/parts/hinnat.css, css/v8/port.css) load after this one: the calculator overrides use "#hinnat" to win.

   Contrast (WCAG 2.x), every pair used here:
     ink #1A2225: page #ECF0EE 14.1, white 16.2, tint #E0EDE7 13.4       text-2 #3B4549: white 9.8, chip #E3E8E6 8.0
     Kuusi #1F4D47: white 9.5, tint #E0EDE7 7.9                           white on Kuusi 9.5
     control edge #727E79 on white 4.2 (non-text)   bracket #A3AAA7 on white 2.4 (decoration only, the text says it)
     focus #0B57B0: page 6.1, white 7.0
   ===================================================================================================================== */
.pr9 {
  /* the v9 values (public/css/v9/base.css :root), and its v8 bridge for the reused calculator */
  --page: #ECF0EE; --sheet: #FFFFFF; --ink: #1A2225; --ink-2: #3B4549; --text-2: #3B4549; --ink-3: #525D5A;
  --rule: #DCE4E0; --rule-2: rgba(28, 35, 38, .32); --rule-strong: #A3AAA7; --edge: #727E79;
  --kuusi: #1F4D47; --kuusi-2: #163A35; --kuusi-hover: #183E39; --kuusi-active: #12302C; --mint: #E3EFEA; --mint-tx: #A9D4C6;
  --sunken: #E3E9E6; --selected: #DDE8E3; --tint: #E0EDE7; --chip: #E3E8E6; --focus: #0B57B0; --color-focus: #0B57B0;
  --f-disp: "Mona Sans", "Mona Sans fallback", "Geologica", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --f-sans: "Geologica", "Geologica fallback", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --f-mono: var(--f-sans); --dw: 110%; --display-wdth: 110%;
  --sh-card: 0 0 0 1px rgb(26 34 37 / .07), 0 1px 2px rgb(26 34 37 / .07), 0 10px 28px -10px rgb(26 34 37 / .18);
  --sh-raised: 0 1px 2px rgb(26 34 37 / .10), 0 2px 6px -2px rgb(26 34 37 / .10);
  --sh-btn: 0 1px 0 rgb(255 255 255 / .14) inset, 0 1px 2px rgb(18 48 44 / .28);
  --r-btn: 12px; --r-ctl: 12px; --r-card: 16px; --r-sheet: 24px; --r-mark: 3px;
  --ease: cubic-bezier(.2, .7, .2, 1); --ease-out: cubic-bezier(.2, .8, .2, 1);
  --gut: 16px; --gap: 16px; --sec: 72px;
  color: var(--ink); font-family: var(--f-sans);
}
@media (min-width: 48rem) { .pr9 { --gap: 24px; --sec: 96px; } }
@media (min-width: 64rem) { .pr9 { --gut: 40px; --gap: 32px; --sec: 128px; } }
@media (min-width: 82.5rem) { .pr9 { --gut: 64px; } }

.pr9-wrap { box-sizing: content-box; max-width: 1312px; margin: 0 auto; padding-inline: var(--gut); }
.pr9-sec { padding-top: var(--sec); }
.pr9-sheet { background: var(--sheet); border-radius: var(--r-sheet); box-shadow: var(--sh-card); }
.pr9 :focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.pr9-nw { white-space: nowrap; }

/* ---------- headings and text ---------- */
.pr9-h1, .pr9-h2 { margin: 0; font-family: var(--f-disp); font-stretch: 110%; font-weight: 800; color: var(--ink); text-wrap: balance; overflow-wrap: break-word; }
.pr9-h2 { font-size: clamp(32px, 1.35rem + 2.6vw, 56px); line-height: 1.02; letter-spacing: -.022em; }
.pr9-h3 { margin: 0; font: 700 clamp(22px, 1.18rem + .55vw, 28px)/1.15 var(--f-disp); letter-spacing: -.012em; color: var(--ink); text-wrap: balance; }
.pr9-head { display: flex; flex-direction: column; gap: 20px; max-width: 52rem; margin-bottom: 40px; }
.pr9-lead { margin: 0; max-width: 40em; font: 400 18px/1.55 var(--f-sans); color: var(--ink-2); text-wrap: pretty; }
@media (min-width: 36rem) { .pr9-lead { font-size: 20px; } }
@media (min-width: 48rem) { .pr9-head { margin-bottom: 56px; } }
.pr9-a { color: var(--kuusi); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 4px; border-radius: 4px; }
.pr9-a:hover { text-decoration-thickness: 2.5px; }
.pr9-go { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; color: var(--kuusi); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 4px; }
.pr9-go::after { content: ""; width: 9px; height: 9px; flex: none; margin-left: 2px; border-top: 2.2px solid currentColor; border-right: 2.2px solid currentColor; transform: rotate(45deg); transition: transform .18s var(--ease-out); }
.pr9-go:hover::after { transform: translateX(3px) rotate(45deg); }
.pr9-chev { width: 22px; height: 22px; flex: none; color: var(--ink-2); transition: transform .18s var(--ease-out); }
[open] > summary > .pr9-chev { transform: rotate(180deg); }

/* ---------- hero: the price as the H1, sized by its own container (84 px at 1440, never past 3 lines) ---------- */
.pr9-hero { padding-top: calc(var(--navh) + clamp(32px, 4.4vw, 72px)); }
/* the H1 is sized by its own column (9.8 % of it, 84 px at 1440), so it is two lines on every laptop and tablet */
.pr9-hero__title { container-type: inline-size; min-width: 0; }
.pr9-hero__head { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: 20px; }
.pr9-h1 { max-width: 11.5em; font-size: clamp(42px, 9.8cqi, 84px); line-height: .94; letter-spacing: -.03em; }
@media (max-width: 47.99rem) { .pr9-h1 { line-height: 1; } }
@media (max-width: 359px) { .pr9-h1 { font-size: 36px; } }
.pr9-hero__lead { margin: 0; max-width: 30em; font: 400 18px/1.55 var(--f-sans); color: var(--ink-2); text-wrap: pretty; }
@media (min-width: 64rem) {
  .pr9-hero__head { grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); column-gap: var(--gap); align-items: end; }
  .pr9-hero__lead { padding-bottom: 6px; font-size: 20px; }
}

/* ---------- the home calculator, fitted to this page: no Kuusi band (the heading above is the page's H1), the
   section rhythm of this page, v9's 16 px floor, 44 px targets and the 3 px focus ring ---------- */
.pr9 #hinnat.hn { padding: 0; background: none; overflow: visible; }
.pr9 #hinnat .hn__intro { display: none; }
.pr9 #hinnat .hn__calc { margin-top: clamp(28px, 3.4vw, 56px); }
.pr9 #hinnat .hn__calc::before { display: none; }
.pr9 #hinnat .hn__ticks, .pr9 #hinnat .hn__quick, .pr9 #hinnat .hn__qb, .pr9 #hinnat .hn__zone { font-size: 16px; }
.pr9 #hinnat .hn__quick { align-items: center; }
.pr9 #hinnat .hn__qb { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 6px; }
.pr9 #hinnat .hn__track { height: 44px; }
.pr9 #hinnat :focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.pr9 #hinnat .hn__track:focus-visible { outline: none; }
.pr9 #hinnat .hn__track:focus-visible .hn__thumb { outline: 3px solid var(--focus); outline-offset: 3px; }
.pr9 #hinnat .hn__buy { margin-top: 32px; }
.pr9 #hinnat .hn9__terms { max-width: 40em; font-size: 17px; line-height: 1.6; color: var(--ink-2); }
@media (min-width: 75rem) { .pr9 #hinnat .hn9__terms { align-self: center; } }
/* the primary button is v9's (landing.css has an older .cta band rule that would pad it) */
.pr9 #hinnat .cta {
  display: inline-flex; align-items: center; gap: 12px; min-height: 56px; padding: 0 26px; border: 0; border-radius: var(--r-btn);
  background: var(--kuusi); color: #FFFFFF; box-shadow: var(--sh-btn); font: 600 18px/1.2 var(--f-sans); text-decoration: none; white-space: nowrap;
  transition: transform .12s var(--ease-out), background-color .12s linear;
}
.pr9 #hinnat .cta:hover { background: var(--kuusi-hover); }
.pr9 #hinnat .cta:active { transform: scale(.97); background: var(--kuusi-active); }
.pr9 #hinnat .cta svg { width: 20px; height: 20px; flex: none; }
@media (max-width: 29.99rem) { .pr9 #hinnat .cta { white-space: normal; } }

/* ---------- comparison: one white sheet; the plan the calculator has chosen is the tinted column ---------- */
.pr9-cmp__sheet { padding: 8px 24px 24px; }
.pr9-table { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; font: 400 17px/1.45 var(--f-sans); color: var(--ink); }
.pr9-table th, .pr9-table td { padding: 18px 20px; text-align: left; vertical-align: middle; border-bottom: 1px solid var(--rule); transition: background-color .28s var(--ease-out); }
.pr9-table thead th { position: sticky; top: var(--navh); z-index: 1; padding-top: 28px; padding-bottom: 20px; vertical-align: bottom; background: var(--sheet); border-bottom: 1.5px solid var(--edge); }
.pr9-table__corner { width: 34%; }
.pr9-table__name { display: block; font: 700 clamp(22px, 1.9vw, 28px)/1.1 var(--f-disp); letter-spacing: -.015em; color: var(--ink); }
.pr9-table__price { display: block; margin-top: 8px; font: 400 16px/1.35 var(--f-sans); color: var(--ink-2); }
.pr9-table__price b { font: 800 22px/1 var(--f-disp); font-stretch: 105%; letter-spacing: -.01em; color: var(--ink); font-variant-numeric: lining-nums proportional-nums; }
.pr9-table__from { color: var(--ink-2); }
.pr9-table__k { display: block; font: 600 17px/1.35 var(--f-sans); color: var(--ink); }
.pr9-table__hint { display: block; margin-top: 3px; font: 400 16px/1.4 var(--f-sans); color: var(--ink-2); }
.pr9-table td b { font: 600 18px/1.25 var(--f-sans); color: var(--ink); }
.pr9-yes { display: inline-flex; color: var(--kuusi); }
.pr9-yes svg { width: 24px; height: 24px; }
.pr9-no { display: inline-block; width: 16px; height: 2px; border-radius: 1px; background: var(--ink-2); vertical-align: middle; }
.pr9-table tfoot td { padding-top: 20px; padding-bottom: 20px; border-bottom: 0; }
.pr9-btn {
  display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 20px; border-radius: var(--r-btn);
  background: var(--sheet); color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--edge); font: 600 17px/1.2 var(--f-sans); text-align: center; text-decoration: none;
  transition: transform .12s var(--ease-out), background-color .2s linear, color .2s linear, box-shadow .2s linear;
}
.pr9-btn:hover { box-shadow: inset 0 0 0 2px var(--ink); }
.pr9-btn:active { transform: scale(.97); }
/* the chosen column (data-on follows the calculator; the page opens on Starter, as the calculator does) */
.pr9-table[data-on="starter"] [data-col="starter"], .pr9-table[data-on="pro"] [data-col="pro"], .pr9-table[data-on="salkku"] [data-col="salkku"] { background: var(--tint); }
.pr9-table[data-on="starter"] thead [data-col="starter"], .pr9-table[data-on="pro"] thead [data-col="pro"], .pr9-table[data-on="salkku"] thead [data-col="salkku"] { border-radius: 16px 16px 0 0; }
.pr9-table[data-on="starter"] tfoot [data-col="starter"], .pr9-table[data-on="pro"] tfoot [data-col="pro"], .pr9-table[data-on="salkku"] tfoot [data-col="salkku"] { border-radius: 0 0 16px 16px; }
.pr9-table[data-on="starter"] [data-col="starter"] .pr9-table__name, .pr9-table[data-on="pro"] [data-col="pro"] .pr9-table__name, .pr9-table[data-on="salkku"] [data-col="salkku"] .pr9-table__name { color: var(--kuusi); }
.pr9-table[data-on="starter"] [data-col="starter"] .pr9-btn, .pr9-table[data-on="pro"] [data-col="pro"] .pr9-btn, .pr9-table[data-on="salkku"] [data-col="salkku"] .pr9-btn { background: var(--kuusi); color: #FFFFFF; box-shadow: var(--sh-btn); }
.pr9-table[data-on="starter"] [data-col="starter"] .pr9-btn:hover, .pr9-table[data-on="pro"] [data-col="pro"] .pr9-btn:hover, .pr9-table[data-on="salkku"] [data-col="salkku"] .pr9-btn:hover { background: var(--kuusi-hover); }

/* Salkku: its terms on a second, smaller sheet */
.pr9-salkku { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px 32px; margin-top: 24px; padding: 28px 20px; }
.pr9-salkku p { margin: 0; max-width: 40em; font: 400 17px/1.6 var(--f-sans); color: var(--ink-2); text-wrap: pretty; }
.pr9-salkku__head { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.pr9-salkku__head p { color: var(--ink); font-size: 18px; }
.pr9-more { margin-top: 12px; }
.pr9-more summary { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; cursor: pointer; list-style: none; font: 600 17px/1.3 var(--f-sans); color: var(--kuusi); border-radius: 8px; }
.pr9-more summary::-webkit-details-marker { display: none; }
.pr9-more summary .pr9-chev { color: var(--kuusi); }
.pr9-more p + p, .pr9-more summary + p { margin-top: 10px; }
@media (min-width: 48rem) { .pr9-salkku { padding: 36px 40px; } }
@media (min-width: 64rem) { .pr9-salkku { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: calc(var(--gap) * 2); padding: 40px 48px; } }

/* ---------- trial: fourteen solid day chips; the real steps (1, 2, 14) are Kuusi, the waiting days grey ---------- */
.pr9-trial__sheet { padding: 24px 16px; }
.pr9-days__row { --cols: 14; --g: 8px; display: grid; grid-template-columns: repeat(var(--cols), minmax(0, 1fr)); gap: var(--g); margin: 0; padding: 0; list-style: none; }
.pr9-day { display: flex; flex-direction: column; justify-content: space-between; min-height: clamp(76px, 6.6vw, 100px); padding: 10px 11px; border-radius: 12px; backface-visibility: hidden; }
.pr9-day.is-step { background: var(--kuusi); color: #FFFFFF; }
.pr9-day.is-quiet { background: var(--chip); color: var(--ink-2); }
.pr9-day__n { font: 800 clamp(22px, 2vw, 30px)/1 var(--f-disp); letter-spacing: -.02em; font-variant-numeric: lining-nums proportional-nums; }
.pr9-day__ic { width: 22px; height: 22px; align-self: flex-end; }
/* public/js/pages/pricing.js: before the step chips turn over they look like the waiting days */
.pr9-day.is-wait { background: var(--chip); color: var(--ink-2); }
.pr9-day.is-wait .pr9-day__ic { opacity: 0; }
.pr9-days__notes { display: grid; grid-template-columns: repeat(14, minmax(0, 1fr)); column-gap: 8px; margin: 14px 0 0; padding: 0; list-style: none; }
.pr9-note { position: relative; grid-row: 1; min-width: 0; padding-top: 26px; }
.pr9-note::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 12px; border: 1.5px solid var(--rule-strong); border-top: 0; border-radius: 0 0 6px 6px; }
.pr9-note--a { grid-column: 1 / 3; }
.pr9-note--a > span { width: max-content; max-width: 19ch; }
.pr9-note--b { grid-column: 3 / 14; text-align: center; }
.pr9-note--end { grid-column: 14 / 15; display: flex; flex-direction: column; align-items: flex-end; text-align: right; }
.pr9-note--end > span { width: max-content; max-width: 16ch; }
.pr9-note__k { display: block; font: 600 16px/1.3 var(--f-sans); color: var(--ink-2); }
.pr9-note__v { display: block; margin-top: 4px; font: 600 18px/1.35 var(--f-sans); color: var(--ink); text-wrap: balance; }
.pr9-after { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px 32px; margin-top: 32px; padding-top: 28px; border-top: 1px solid var(--rule); }
.pr9-after p { margin: 0; }
.pr9-refund { display: flex; align-items: flex-start; gap: 14px; }
.pr9-refund__ic { width: 28px; height: 28px; flex: none; margin-top: 1px; color: var(--kuusi); }
.pr9-refund__k { display: block; font: 700 20px/1.3 var(--f-disp); color: var(--ink); }
.pr9-refund__v { display: block; margin-top: 4px; font: 400 18px/1.55 var(--f-sans); color: var(--ink); text-wrap: pretty; }
.pr9-extend { align-self: center; max-width: 36em; font: 400 17px/1.6 var(--f-sans); color: var(--ink-2); text-wrap: pretty; }
@media (min-width: 48rem) { .pr9-trial__sheet { padding: 40px; } }
@media (min-width: 64rem) {
  .pr9-trial__sheet { padding: 48px 56px; }
  .pr9-after { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); column-gap: calc(var(--gap) * 2); }
}
/* narrow laptops: the middle caption wraps to two lines so the three captions keep clear gaps */
@media (min-width: 900px) and (max-width: 1099px) { .pr9-note--b > .pr9-note__v { max-width: 26ch; margin-inline: auto; } }
@media (max-width: 899px) {
  .pr9-days__row { --cols: 7; }
  .pr9-day { min-height: 72px; }
  .pr9-days__notes { display: flex; flex-direction: column; gap: 16px; margin-top: 24px; }
  .pr9-note, .pr9-note--end { display: block; padding: 2px 0 2px 16px; text-align: left; border-left: 3px solid var(--rule-strong); }
  .pr9-note::before { content: none; }
  .pr9-note--a > span, .pr9-note--end > span { width: auto; max-width: none; }
}
@media (max-width: 767px) {
  .pr9-days__row { --g: 6px; }
  .pr9-day { min-height: 60px; padding: 7px 8px; border-radius: 10px; }
  .pr9-day__n { font-size: 20px; }
  .pr9-day__ic { width: 16px; height: 16px; }
}
@media (max-width: 359px) { .pr9-day { padding: 7px 5px; } }

/* ---------- FAQ: <details> with a chevron, the home FAQ's shape ---------- */
.pr9-faq__in { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: 32px; }
.pr9-faq__links { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; margin: 24px 0 0; font-size: 17px; }
.pr9-faq__links .pr9-a { display: inline-flex; align-items: center; min-height: 44px; }
.pr9-faq__list { overflow: hidden; }
.pr9-q + .pr9-q { border-top: 1px solid var(--rule); }
.pr9-q summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; padding: 16px 20px; cursor: pointer; list-style: none; font: 600 18px/1.4 var(--f-sans); color: var(--ink); }
.pr9-q summary::-webkit-details-marker { display: none; }
.pr9-q summary:hover .pr9-q__q { text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 4px; }
.pr9 .pr9-q summary:focus-visible { outline-offset: -4px; border-radius: 12px; }
.pr9-q__a { padding: 0 20px 24px; max-width: 44em; color: var(--ink-2); }
.pr9-q__a p { margin: 0; font: 400 17px/1.65 var(--f-sans); text-wrap: pretty; }
@media (min-width: 48rem) {
  .pr9-q summary { padding: 18px 28px; font-size: 19px; }
  .pr9-q__a { padding: 0 28px 28px; }
  .pr9-q__a p { font-size: 18px; }
}
@media (min-width: 64rem) {
  .pr9-faq__in { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); column-gap: calc(var(--gap) * 2); align-items: start; }
  .pr9-faq__list { max-width: 760px; }
}


/* ---------- phones: the table becomes a sticky plan bar and one block per row (label, then the three values).
   The roles on the table keep it a table for screen readers when the display changes. ---------- */
@media (max-width: 767px) {
  .pr9-cmp__sheet { padding: 4px 12px 16px; }
  .pr9-table, .pr9-table thead, .pr9-table tbody, .pr9-table tfoot, .pr9-table tr { display: block; }
  .pr9-table thead tr, .pr9-table tbody tr, .pr9-table tfoot tr { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 6px; }
  .pr9-table thead { position: sticky; top: var(--navh); z-index: 2; background: var(--sheet); }
  .pr9-table th, .pr9-table td { padding: 12px 6px; border: 0; text-align: center; }
  .pr9-table .pr9-table__corner { display: none; }
  .pr9-table thead th { position: static; padding: 16px 4px 12px; border-bottom: 1.5px solid var(--edge); }
  .pr9-table__name { font-size: 20px; }
  .pr9-table__price { margin-top: 4px; font-size: 16px; }
  .pr9-table__price b { display: block; font-size: 19px; }
  .pr9-table__from { display: block; }
  .pr9-table tbody tr { padding: 14px 0 12px; border-bottom: 1px solid var(--rule); row-gap: 8px; }
  .pr9-table tbody th { grid-column: 1 / -1; padding: 0 2px; text-align: left; }
  .pr9-table tbody td { display: flex; align-items: center; justify-content: center; min-height: 46px; border-radius: 12px; background: #F3F6F4; }
  .pr9-table td b { font-size: 17px; }
  /* the companies row and the support row hold words, not marks: one line per plan, its name first */
  .pr9-table tbody tr:last-child, .pr9-table tbody tr:first-child { grid-template-columns: minmax(0, 1fr); }
  .pr9-table tbody tr:last-child > td, .pr9-table tbody tr:first-child > td { justify-content: space-between; gap: 14px; padding: 10px 14px; text-align: right; font-size: 16px; line-height: 1.3; }
  .pr9-table tbody tr:last-child > td::before, .pr9-table tbody tr:first-child > td::before { content: attr(data-plan); font: 700 16px/1.2 var(--f-disp); color: var(--ink); text-align: left; }
  .pr9-table thead [data-col] { border-radius: 12px 12px 0 0; }
  .pr9-table tfoot tr { padding-top: 12px; }
  .pr9-table tfoot td { padding: 8px 4px; border-radius: 12px; }
  .pr9-table[data-on] tfoot [data-col] { border-radius: 12px; }
  .pr9-btn { width: 100%; min-height: 52px; padding: 6px 8px; font-size: 16px; }
}
@media (max-width: 380px) {
  .pr9-table__name { font-size: 18px; }
  .pr9-table__price b { font-size: 17px; }
}
@media (prefers-reduced-motion: reduce) {
  .pr9-day, .pr9-table th, .pr9-table td, .pr9-chev, .pr9-btn { transition: none; }
}
html.rm .pr9-day, html.rm .pr9-table th, html.rm .pr9-table td, html.rm .pr9-chev, html.rm .pr9-btn { transition: none; }
/* 320-399 px: "/ vuosi + alv" wraps inside its third of the plan bar */
@media (max-width: 399px) { .pr9-table__price .pr9-nw { white-space: normal; } }