/* Typography fit for translated pages. The design was tuned for Swedish; most other languages need more characters
   per phrase (German compounds, Russian/Finnish long words), so headings and the navigation are scaled per language
   to keep the same visual rhythm. Loaded after main.css on public pages only. */

html { --ls: 1; }                       /* heading scale */
html[lang="de"] { --ls: .86; }
html[lang="fr"] { --ls: .92; }
html[lang="es"] { --ls: .92; }
html[lang="it"] { --ls: .92; }
html[lang="pt"] { --ls: .92; }
html[lang="nl"] { --ls: .86; }
html[lang="da"] { --ls: .92; }
html[lang="no"] { --ls: .94; }
html[lang="fi"] { --ls: .80; }
html[lang="pl"] { --ls: .84; }
html[lang="ru"] { --ls: .76; }
html[lang="ar"] { --ls: .88; }
html[lang="en"] { --ls: .96; }

html[lang] h1                           { font-size: calc(var(--h1-size) * var(--ls)); overflow-wrap: break-word; hyphens: auto; }
html[lang] h2                           { font-size: calc(clamp(1.7rem, 2.9vw, 2.7rem) * var(--ls)); overflow-wrap: break-word; hyphens: auto; }
html[lang] h3                           { overflow-wrap: break-word; hyphens: auto; }
html[lang] .hero__headline              { max-width: 780px; }
html[lang] .hero__headline h1           { font-size: calc(clamp(2.8rem, 4.4vw, 4.6rem) * var(--ls)); line-height: 1.06; hyphens: manual; }
html[lang] .svc-hero h1                 { font-size: calc(var(--h1-size) * var(--ls)); }
html[lang] .svc-prose h2                { font-size: calc(clamp(1.6rem, 2.9vw, 2.4rem) * var(--ls)); }
html[lang] .svc-local h2                { font-size: calc(clamp(1.5rem, 2.6vw, 2.1rem) * var(--ls)); }
html[lang] .svc-cathead h2              { font-size: calc(clamp(1.5rem, 2.8vw, 2.2rem) * var(--ls)); }
html[lang] .offert-trust__title         { font-size: calc(var(--h1-size) * var(--ls)); }
html[lang] .offert-form__title          { font-size: calc(clamp(1.9rem, 3vw, 2.55rem) * var(--ls)); }
html[lang] .hero__sub                   { max-width: 560px; }

/* hero lead lines must not push the call-to-action far below the fold */
html[lang]:not([lang="sv"]):not([lang="en"]) .hero__sub { font-size: clamp(.98rem, 1.4vw, 1.08rem); }

/* navigation: keep every label on one line, tighten spacing a little for longer words */
html:not([lang="sv"]) .nav__links > li > a { white-space: nowrap; padding-left: 14px; padding-right: 14px; font-size: .98rem; }
html:not([lang="sv"]) .nav__links > li > a::after { left: 14px; right: 14px; }
html:not([lang="sv"]) .nav__cta-btn { white-space: nowrap; }
html[lang="ru"] .nav__links > li > a, html[lang="fi"] .nav__links > li > a, html[lang="de"] .nav__links > li > a,
html[lang="nl"] .nav__links > li > a, html[lang="pl"] .nav__links > li > a { font-size: .92rem; padding-left: 11px; padding-right: 11px; }
html[lang="ru"] .nav__links > li > a::after, html[lang="fi"] .nav__links > li > a::after, html[lang="de"] .nav__links > li > a::after,
html[lang="nl"] .nav__links > li > a::after, html[lang="pl"] .nav__links > li > a::after { left: 11px; right: 11px; }
/* between 1081 and 1300px the desktop nav is tight: drop the phone text, the icon-only call button stays */
@media (min-width: 1081px) and (max-width: 1320px) {
  html:not([lang="sv"]) .nav__cta .nav__phone { display: none; }
  html:not([lang="sv"]) .nav__cta .nav__phone-icon { display: inline-flex; }
}

@media (max-width: 900px) {
  html[lang] .hero__headline h1 { font-size: calc(clamp(2.2rem, 9vw, 3.2rem) * var(--ls)); }
}
@media (max-width: 640px) {
  html[lang] .hero__headline h1 { font-size: calc(clamp(2.35rem, 11vw, 3.35rem) * var(--ls)); line-height: 1.04; }
  html[lang] h1 { font-size: calc(clamp(2rem, 9.5vw, 3rem) * var(--ls)); }
  html[lang] .svc-hero h1 { font-size: calc(clamp(1.8rem, 8vw, 2.4rem) * var(--ls)); }
  html[lang] .offert-trust__title { font-size: calc(clamp(2.1rem, 12vw, 3.1rem) * var(--ls)); }
}

/* Buttons and badges: longer words wrap instead of overflowing */
html[lang]:not([lang="sv"]) .btn { text-align: center; line-height: 1.25; }
html[lang]:not([lang="sv"]) .eyebrow, html[lang]:not([lang="sv"]) .svc-hero__chip { overflow-wrap: anywhere; }

/* Buttons: allow long labels to wrap inside the button instead of pushing the page wider (Swedish labels are short) */
html[lang]:not([lang="sv"]) .btn, html[lang]:not([lang="sv"]) .nav__cta-btn { white-space: normal; max-width: 100%; }
html[lang]:not([lang="sv"]) .nav__cta-btn { white-space: nowrap; }
html[lang]:not([lang="sv"]) .btn { overflow-wrap: break-word; }
html[lang]:not([lang="sv"]) .svc-actions { flex-wrap: wrap; }
/* grid items may shrink below their longest word (long German/Finnish compounds) */
html[lang]:not([lang="sv"]) [class*="grid"] > *, html[lang]:not([lang="sv"]) [class*="split"] > * { min-width: 0; }
html[lang]:not([lang="sv"]) p, html[lang]:not([lang="sv"]) li, html[lang]:not([lang="sv"]) td, html[lang]:not([lang="sv"]) strong,
html[lang]:not([lang="sv"]) span, html[lang]:not([lang="sv"]) summary { overflow-wrap: break-word; }
@media (max-width: 900px) {
  html[lang]:not([lang="sv"]) .fastighet-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 640px) {
  html[lang]:not([lang="sv"]) [style*="flex-shrink:0"] { flex-shrink: 1 !important; max-width: 100%; }
  html[lang]:not([lang="sv"]) .cta-band .btn, html[lang]:not([lang="sv"]) .svc-actions .btn { width: 100%; justify-content: center; }
  html[lang]:not([lang="sv"]) .btn--lg { padding-left: 20px; padding-right: 20px; }
  html[lang]:not([lang="sv"]) h2 { hyphens: auto; }
}