/* Generated by build.mjs for /fi/ pages. Don't edit: change the sources named below. */
/* ===== src/i18n/fi/locale.css ===== */
/* Finnish (/fi/) only. Phones hide the "Katso, " of the announcement bar's "Katso, miten se toimii", so the button starts
   on its first letter there: "Miten se toimii". */
@media (max-width:700px){.announce .more::first-letter{text-transform:uppercase}}
/* The hotels hero keeps "in-stay" on one line in English; its Finnish "kesken vierailun" is two words and too wide for a
   phone at the headline size, so it may wrap there. */
@media (max-width:700px){h1 .accent[style*="nowrap"]{white-space:normal!important}}
/* Finnish compounds ("markkinointipäälliköiden", "toimipaikoillesi") can be wider than a phone column at heading sizes.
   Let headings hyphenate (Finnish dictionary via lang="fi"), but only long words (13+ letters, 10+ on phones), so short
   ones never split; a word breaks unhyphenated only as a last resort, so nothing pushes the page wider than the screen. */
h1,h2,h3,.statement{-webkit-hyphens:auto;hyphens:auto;hyphenate-limit-chars:13 6 5;overflow-wrap:break-word}
@media (max-width:700px){h1,h2,h3,.statement{hyphenate-limit-chars:10 5 4}}
/* "Reputation you can measure" on the homepage: on desktop the stat columns are narrow, and the Finnish "1 napautus"
   ("1 tap") and "Jokainen" ("Every") are wider than their bars at the English sizes. Smaller figures in every bar, so
   the four stay alike. */
@media (min-width:1024px){.rc-stat b{font-size:30px}.rc-bar.is-open .rc-stat b{font-size:clamp(40px,3.4vw,48px)}}
/* Long compounds in the small uppercase stat labels ("arvostelusivustoa") hyphenate rather than run out of their bar;
   short words ("joille", "ohjata", "asiakas") never split. */
.case-bar span,.rc-stat span,.stat-label{-webkit-hyphens:auto;hyphens:auto;hyphenate-limit-chars:10 4 4;-webkit-hyphenate-limit-before:4;-webkit-hyphenate-limit-after:4}
/* Contact page "more ways to get help": the four cards sit in one row from 1025px, where the Finnish button labels
   ("Siirry ohjekeskukseen", "Apua kirjautumiseen") are wider than a quarter-width card until about 1280px. Keep two
   columns up to there, and give the buttons a little less side padding in the four-column row. */
@media (min-width:1025px) and (max-width:1279px){.help-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1025px){.help-card .btn{padding:0 16px}}
/* From 701px the big display headings (.statement) don't hyphenate: a compound wider than its box ("toimipaikoillesi"
   in the agents hero and the pricing form's headline) is scaled down by site.js ("Words wider than their box") and only
   hyphenates if it still doesn't fit at 60%. Phones keep the hyphenation above. */
@media (min-width:701px){.statement{-webkit-hyphens:manual;hyphens:manual}}
/* Feature heroes, the small cards beside the phone (review pages, platform overview): pills such as "Arvostelukutsu"
   are wider than the English ones, and on desktop they squeezed the card's title to a word or two a line. Let the
   pill drop under the title when both don't fit (as Malay does). */
.kside .ui > .row{flex-wrap:wrap;row-gap:6px}
