/* ==========================================================================
   Nordisk Sanitet - design layer
   --------------------------------------------------------------------------
   Only the styling that Elementor's native controls cannot express lives here
   (gradients with exact OKLCH stops, backdrop-filter, parent-hover
   relationships, and native form / accordion skinning).

   Layout, spacing, colour and typography are set on the widgets themselves so
   they stay editable from the Elementor panel.

   Colour tokens mirror Elementor's Global Colours (Site Settings > Colours);
   the hex fallbacks only apply if a global is ever removed.
   ========================================================================== */

:root, body {
	/* Palette - kept in sync with Elementor Global Colours */
	--ns-brand:    var(--e-global-color-nsbrand, #009be2);
	--ns-brand-fg: var(--e-global-color-nsbrandfg, #f9fcff);
	--ns-navy:     var(--e-global-color-nsnavy, #172133);
	--ns-navy-fg:  var(--e-global-color-nsnavyfg, #25334a);
	--ns-gold:     var(--e-global-color-nsgold, #cf9837);
	--ns-gold-fg:  var(--e-global-color-nsgoldfg, #ffffff);
	--ns-text:     var(--e-global-color-nstext, #303c4e);
	--ns-muted-fg: var(--e-global-color-nsmutedfg, #626d7c);
	--ns-surface:  var(--e-global-color-nssurface, #f2f8fb);
	--ns-border:   var(--e-global-color-nsborder, #e0e4e9);
	--ns-card:     var(--e-global-color-nscard, #ffffff);

	/* Gradients - exact OKLCH stops taken from the reference design */
	--ns-gradient-navy:   linear-gradient(150deg, oklch(96.5% .026 233), oklch(93.5% .042 238) 55%, oklch(97.5% .024 228));
	--ns-gradient-footer: linear-gradient(160deg, oklch(94.5% .032 236), oklch(91.5% .045 240) 60%, oklch(90% .05 244));

	/* Elevation */
	--ns-shadow-card:  0 18px 40px -26px color-mix(in oklab, oklch(24.9% .037 261.5) 35%, transparent);
	--ns-shadow-glow:  0 0 0 1px color-mix(in oklab, oklch(65.5% .152 238) 35%, transparent),
	                   0 20px 45px -20px color-mix(in oklab, oklch(65.5% .152 238) 55%, transparent);
	--ns-shadow-glass: 0 28px 60px -34px color-mix(in oklab, oklch(24.9% .037 261.5) 45%, transparent);
}

/* --------------------------------------------------------------------------
   1. Backgrounds that need a gradient or translucency
   -------------------------------------------------------------------------- */

.ns-gradient-navy { background-image: var(--ns-gradient-navy); }
.ns-gradient-footer { background-image: var(--ns-gradient-footer); }

/* Frosted panel used in the hero columns. */
.ns-glass {
	border: 1px solid color-mix(in oklab, oklch(24.9% .037 261.5) 10%, transparent);
	background-color: color-mix(in oklab, #fff 72%, transparent);
	-webkit-backdrop-filter: blur(16px);
	backdrop-filter: blur(16px);
	box-shadow: var(--ns-shadow-glass);
}

/* Sticky site header: translucent, blurred backdrop. */
.ns-header {
	background-color: color-mix(in oklab, #fff 95%, transparent);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}

/* Hero photo sits behind a 55% white scrim at 25% opacity. */
.ns-hero-media img { opacity: .25; }

/* --------------------------------------------------------------------------
   2. Elevation helpers
   -------------------------------------------------------------------------- */

.ns-shadow-card { box-shadow: var(--ns-shadow-card); }

/* Gold buttons glow on hover. */
.ns-glow .elementor-button:hover,
.ns-glow .elementor-button:focus-visible,
a.ns-glow:hover,
a.ns-glow:focus-visible {
	box-shadow: var(--ns-shadow-glow);
}

/* --------------------------------------------------------------------------
   3. Hover behaviour that depends on the parent card being hovered
      (`group-hover` in the reference). The card lift itself uses Elementor's
      own Transform > Hover control.
   -------------------------------------------------------------------------- */

.ns-card-group .ns-icon-tile,
.ns-card-group .ns-icon-tile .elementor-icon {
	transition: background-color .15s cubic-bezier(.4, 0, .2, 1), color .15s cubic-bezier(.4, 0, .2, 1);
}
.ns-card-group:hover .ns-icon-tile {
	background-color: var(--ns-brand);
}
.ns-card-group:hover .ns-icon-tile .elementor-icon,
.ns-card-group:hover .ns-icon-tile svg {
	color: var(--ns-brand-fg);
	stroke: var(--ns-brand-fg);
}

.ns-arrow .elementor-button-icon svg,
.ns-arrow svg { transition: transform .15s cubic-bezier(.4, 0, .2, 1); }
.ns-card-group:hover .ns-arrow svg,
.ns-arrow:hover svg { transform: translateX(4px); }

/* --------------------------------------------------------------------------
   4. Eyebrow label
   -------------------------------------------------------------------------- */

.ns-eyebrow,
.ns-eyebrow .elementor-heading-title {
	letter-spacing: .14em;
	text-transform: uppercase;
	font-size: .78rem;
	font-weight: 600;
	line-height: 1.65;
}

/* --------------------------------------------------------------------------
   5. Lucide icons stay stroked, never filled
   -------------------------------------------------------------------------- */

.ns-icon svg,
.ns-icon-tile svg,
.elementor-icon-list-icon svg.ns-lucide {
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* --------------------------------------------------------------------------
   6. Price table
   -------------------------------------------------------------------------- */

/* line-height:0 on the scroll wrapper stops the trailing text node in the HTML
   widget from adding a stray line box below the table. */
.ns-table { overflow-x: auto; line-height: 0; border-radius: 1rem; border: 1px solid color-mix(in oklab, oklch(24.9% .037 261.5) 12%, transparent); }
.ns-table table { margin: 0; width: 100%; min-width: 560px; border-collapse: collapse; text-align: left; color: color-mix(in oklab, var(--ns-navy-fg) 85%, transparent); }
.ns-table thead { background-color: color-mix(in oklab, oklch(24.9% .037 261.5) 5%, transparent); font-size: .875rem; text-transform: uppercase; letter-spacing: .025em; }
.ns-table th { padding: 1rem 1.25rem; font-weight: 600; line-height: 1.25rem; } /* Tailwind text-sm: exactly 20px, not 14 x 1.4286 = 20.0004 */
/* Hello Elementor puts a 1px border and vertical-align: top on every table
   cell; the reference has neither, so its rows are 1px shorter. The row
   separator below is unaffected because it sits on the <tr>. */
.ns-table th,
.ns-table td { border: 0; vertical-align: middle; }
.ns-table td { padding: 1rem 1.25rem; font-size: .98rem; line-height: 1.65; }
.ns-table tbody tr + tr { border-top: 1px solid color-mix(in oklab, #fff 10%, transparent); }

/* --------------------------------------------------------------------------
   7. Elementor Pro form, matched to the reference form
   -------------------------------------------------------------------------- */

.ns-form .elementor-field-group > label {
	display: block;
	font-size: .875rem;
	font-weight: 600;
	line-height: 1.4286;
	color: var(--ns-navy);
	margin-bottom: .375rem;
}
.ns-form .elementor-field-group .elementor-field-textual.elementor-field-textual {
	width: 100%;
	border-radius: .75rem;
	border: 1px solid var(--ns-border);
	background-color: #fff;
	padding: .75rem .875rem;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	color: var(--ns-text);
	outline: none;
	box-shadow: none;
	transition: border-color .15s cubic-bezier(.4, 0, .2, 1), box-shadow .15s cubic-bezier(.4, 0, .2, 1);
}
.ns-form .elementor-field-group .elementor-field-textual.elementor-field-textual:focus {
	border-color: var(--ns-brand);
	box-shadow: 0 0 0 2px color-mix(in oklab, oklch(65.5% .152 238) 20%, transparent);
}
.ns-form .elementor-field-group .elementor-field-textual.elementor-field-textual::placeholder { color: var(--ns-muted-fg); opacity: 1; }
.ns-form textarea.elementor-field-textual { resize: vertical; }

.ns-form .elementor-button[type="submit"] {
	width: 100%;
	justify-content: center;
	border-radius: 9999px;
	background-color: var(--ns-gold);
	color: var(--ns-gold-fg);
	font-weight: 700;
	padding: .875rem 1.5rem;
	transition: box-shadow .15s cubic-bezier(.4, 0, .2, 1);
}
.ns-form .elementor-button[type="submit"]:hover { box-shadow: var(--ns-shadow-glow); }

.ns-form .elementor-message { font-size: .875rem; margin-top: .5rem; }
.ns-form .elementor-field-group.elementor-error .elementor-field-textual { border-color: #b42318; }

/* Elementor gives every field group the same row gap; the reference varies it
   (20px after the service chips, 16px between the text fields, 24px before the
   submit button, 12px before the note beneath it), and its textarea sits in a
   label block that adds a 4px line-box descender. The differences are added as
   margin-top, which Elementor's own generated rule does not set. */
.ns-form .elementor-field-group-name,
.ns-form .elementor-field-group-phone { margin-top: 4px; }
.ns-form .e-form__buttons { margin-top: 12px; }
.ns-form-note { margin-top: -8px; }

/* --------------------------------------------------------------------------
   8. FAQ accordion - bottom-bordered rows, chevron on the right
   -------------------------------------------------------------------------- */

.ns-faq .e-n-accordion-item { border-bottom: 1px solid var(--ns-border); }
.ns-faq summary.e-n-accordion-item-title { padding: 1rem 0; cursor: pointer; }
.ns-faq summary.e-n-accordion-item-title:hover .e-n-accordion-item-title-text { color: var(--ns-brand); text-decoration: underline; }
.ns-faq .e-n-accordion-item-title-icon svg { transition: transform .2s cubic-bezier(.4, 0, .2, 1); }

/* --------------------------------------------------------------------------
   9. Fixed mobile call / quote bar
   -------------------------------------------------------------------------- */

.ns-mobilebar {
	position: fixed;
	inset-inline: 0;
	bottom: 0;
	z-index: 50;
	background-color: color-mix(in oklab, #fff 95%, transparent);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	border-top: 1px solid var(--ns-border);
}
@media (min-width: 768px) { .ns-mobilebar { display: none; } }
/* The footer already reserves room for the bar via its own bottom padding
   (the reference uses `pb-24 md:pb-16`), so no extra body padding is needed. */

/* --------------------------------------------------------------------------
   10. Accessibility - visible focus ring
   -------------------------------------------------------------------------- */

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible {
	outline: 2px solid var(--ns-brand);
	outline-offset: 2px;
	border-radius: 4px;
}

/* --------------------------------------------------------------------------
   11. Static chip list (`.ns-pills`)
       Used for the plain, non-linked place-name rows on the service pages.
       Linked chips are real Button widgets instead.
   -------------------------------------------------------------------------- */

.ns-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.ns-pills li {
	display: inline-flex;
	align-items: center;
	border: 1px solid var(--ns-border);
	background-color: var(--ns-card);
	border-radius: 9999px;
	padding: 10px 20px;
	font-size: 17px;
	font-weight: 600;
	line-height: 1.65;
	color: var(--ns-navy);
}
.ns-pills--sm li { padding: 8px 16px; font-size: 14px; line-height: 1.4286; }

/* --------------------------------------------------------------------------
   12. Breadcrumbs
   -------------------------------------------------------------------------- */

.ns-crumbs {
	font-size: 14px;
	line-height: 1.4286;
	color: color-mix(in oklab, var(--ns-navy-fg) 60%, transparent);
}
.ns-crumbs a { color: inherit; text-decoration: none; }
.ns-crumbs a:hover { color: var(--ns-gold); }
.ns-crumbs span[aria-hidden] { padding: 0 8px; }
.ns-crumbs span[aria-current] { color: color-mix(in oklab, var(--ns-navy-fg) 80%, transparent); }

/* --------------------------------------------------------------------------
   13. FAQ answers (rich text inside each accordion panel)
   -------------------------------------------------------------------------- */

.ns-faq-answer { font-size: 1.02rem; line-height: 1.4286; color: var(--ns-muted-fg); }
.ns-faq-answer p { margin: 0; font-weight: 600; color: var(--ns-navy); }
.ns-faq-answer ul { margin: 12px 0 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.ns-faq-answer li { display: flex; gap: 8px; }
.ns-faq-answer li::before { content: "\2022"; color: var(--ns-brand); }

/* --------------------------------------------------------------------------
   14. Price / spec tables
   -------------------------------------------------------------------------- */

.ns-table table { min-width: var(--ns-table-min, 560px); }

/* --------------------------------------------------------------------------
   15. Form service chooser — radio buttons drawn as selectable chips
   -------------------------------------------------------------------------- */

.ns-form .elementor-field-subgroup.ns-service-choice {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 2px;
}
/* Elementor widget CSS can load after the theme stylesheet, so the option
   class is repeated to guarantee these win without !important. */
.ns-form .ns-service-choice .elementor-field-option.elementor-field-option {
	margin: 0;
	padding: 0;
}
.ns-form .ns-service-choice .elementor-field-option {
	position: relative;
	display: inline-flex;
}
.ns-form .ns-service-choice .elementor-field-option input[type="radio"] {
	position: absolute;
	inset: 0;
	opacity: 0;
	margin: 0;
	width: 100%;
	height: 100%;
	cursor: pointer;
}
.ns-form .ns-service-choice .elementor-field-option label {
	border: 1px solid var(--ns-border);
	border-radius: 9999px;
	padding: 8px 16px;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4286;
	color: var(--ns-navy);
	cursor: pointer;
	transition: border-color .15s cubic-bezier(.4, 0, .2, 1), background-color .15s cubic-bezier(.4, 0, .2, 1), color .15s cubic-bezier(.4, 0, .2, 1);
}
.ns-form .ns-service-choice .elementor-field-option:hover label { border-color: var(--ns-brand); }
.ns-form .ns-service-choice .elementor-field-option:has(input:checked) label {
	border-color: var(--ns-brand);
	background-color: color-mix(in oklab, oklch(65.5% .152 238) 10%, transparent);
	color: var(--ns-brand);
}
.ns-form .ns-service-choice .elementor-field-option:has(input:focus-visible) label {
	outline: 2px solid var(--ns-brand);
	outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   16. Mobile menu CTA item (gold pill at the end of the mobile dropdown)
   -------------------------------------------------------------------------- */

.ns-mobile-nav .elementor-nav-menu--dropdown .ns-menu-cta > a.elementor-item {
	margin: 16px 16px 4px;
	border-radius: 9999px;
	background-color: var(--ns-gold);
	color: var(--ns-gold-fg);
	font-weight: 700;
	text-align: center;
	justify-content: center;
	padding: 12px 20px;
}
.ns-mobile-nav .elementor-nav-menu--dropdown .ns-menu-cta { border-bottom: 0; }

/* --------------------------------------------------------------------------
   17. Badge widget (small tinted status chip) never behaves as a link
   -------------------------------------------------------------------------- */

.ns-badge .elementor-button { cursor: default; pointer-events: none; }

/* --------------------------------------------------------------------------
   18. Inline colour accents inside headings
   -------------------------------------------------------------------------- */

.ns-gold-text { color: var(--ns-gold); }
.ns-brand-text { color: var(--ns-brand); }

/* Eyebrow badges keep the tracked uppercase treatment on their button label. */
.ns-eyebrow .elementor-button-text {
	letter-spacing: .14em;
	text-transform: uppercase;
	font-size: .78rem;
	font-weight: 600;
}

/* --------------------------------------------------------------------------
   19. Keep Lucide (stroke-based) icons unfilled
       Elementor always writes `fill: <colour>` onto icon SVGs, which turns a
       stroke-only Lucide glyph into a solid blob. Its selector carries five
       classes, so `!important` is the only way to win without duplicating
       Elementor's generated specificity. The stroke colour still comes from
       the widget's own colour control via `currentColor`.
   -------------------------------------------------------------------------- */

.ns-icon .elementor-icon svg,
.ns-icon-tile .elementor-icon svg,
.ns-list .elementor-icon-list-icon svg,
.elementor-button-icon svg {
	fill: none !important;
	stroke: currentColor;
}

/* Chip/pill list bullets on the dark-blue gradient bands. */
.ns-pills--navy li {
	border-color: color-mix(in oklab, oklch(24.9% .037 261.5) 15%, transparent);
	background-color: color-mix(in oklab, oklch(24.9% .037 261.5) 5%, transparent);
	color: var(--ns-navy-fg);
	/* The reference uses its taller py-3 chip for this dark row. */
	padding: 12px 20px;
}

/* --------------------------------------------------------------------------
   20. "Så går det till" stepper
       Elementor's nested tabs supply the behaviour; these rules lay out the
       number badge + title + subtitle inside each tab label.
   -------------------------------------------------------------------------- */

/* Elementor centres the tab list beside a taller panel; the reference keeps the
   three steps at the top of the column. */
.ns-stepper .e-n-tabs-heading { justify-content: flex-start; }

.ns-stepper .e-n-tab-title-text {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: center;
	gap: 16px;
	width: 100%;
	text-align: left;
}
.ns-step-no {
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	border-radius: 16px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1;
	background-color: var(--ns-surface);
	color: var(--ns-navy);
	transition: background-color .15s cubic-bezier(.4, 0, .2, 1), color .15s cubic-bezier(.4, 0, .2, 1);
}
.ns-step-txt { display: block; min-width: 0; }
.ns-step-title { display: block; font-weight: 700; }
.ns-step-sub {
	display: block;
	font-size: 14px;
	line-height: 1.4286;
	font-weight: 400;
	color: var(--ns-muted-fg);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.ns-stepper .e-n-tab-title[aria-selected="true"] .ns-step-no {
	background-color: var(--ns-brand);
	color: var(--ns-brand-fg);
}
.ns-stepper .e-n-tab-title[aria-selected="true"] .ns-step-sub {
	color: color-mix(in oklab, var(--ns-navy-fg) 70%, transparent);
}

/* Chip list variant with a brand check-mark (area districts). */
.ns-pills--check li::before {
	content: "";
	width: 16px;
	height: 16px;
	margin-right: 8px;
	flex: none;
	background-color: var(--ns-brand);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* --------------------------------------------------------------------------
   21. Article bullet lists inside blog posts
   -------------------------------------------------------------------------- */

.ns-bullets { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.ns-bullets li { display: flex; gap: 8px; color: var(--ns-navy); }
.ns-bullets li::before { content: "\2022"; color: var(--ns-brand); }

/* --------------------------------------------------------------------------
   22. Blog card (Loop Item) — category chip
   -------------------------------------------------------------------------- */

.ns-cat-chip .elementor-heading-title {
	display: inline-flex;
	width: fit-content;
	border-radius: 9999px;
	background-color: color-mix(in oklab, oklch(65.5% .152 238) 15%, transparent);
	padding: 4px 12px;
	text-transform: uppercase;
	letter-spacing: .025em;
}

/* --------------------------------------------------------------------------
   23. Icon boxes must measure exactly size + padding
       Elementor renders icons inline-block, so the inline box adds a few
       pixels of baseline leading and rows end up taller than the reference.
   -------------------------------------------------------------------------- */

.ns-icon .elementor-icon-wrapper { line-height: 0; font-size: 0; }
.ns-icon .elementor-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 0;
}

/* Elementor emits the accordion title typography inside `:where(...)`, which has
   zero specificity, so the 1.5 line-height set on the widget never lands. */
.ns-faq .e-n-accordion-item-title-text { line-height: 1.5; }
.ns-faq summary.e-n-accordion-item-title { line-height: 0; }
.ns-faq .e-n-accordion-item-title-icon { line-height: 0; }
/* Elementor scopes nested-tab title typography with `:where()` (zero
   specificity), so the step label size is set here alongside its layout. */
.ns-stepper .ns-step-title { font-size: 17px; line-height: 1.65; }

/* --------------------------------------------------------------------------
   24. Button icon sizes
       Elementor buttons size their icon from the label's font-size; the
       reference uses fixed 14/16/20px glyphs, so the builder tags each button
       with the size it needs.
   -------------------------------------------------------------------------- */

.ns-ico-14 .elementor-button-icon svg { width: 14px; height: 14px; }
.ns-ico-16 .elementor-button-icon svg { width: 16px; height: 16px; }
.ns-ico-20 .elementor-button-icon svg { width: 20px; height: 20px; }
.elementor-button-icon { display: inline-flex; align-items: center; }
/* Area pages use a stronger breadcrumb tint than the service pages. */
.ns-crumbs--strong { color: color-mix(in oklab, var(--ns-navy-fg) 80%, transparent); }
.ns-crumbs--strong span[aria-current] { color: var(--ns-navy-fg); }

/* --------------------------------------------------------------------------
   25. Sticky header spacer
       Elementor's sticky effect clones the header into a hidden spacer. The
       clone's mobile dropdown never receives the JS width fix, so it sticks out
       past the viewport and creates horizontal scroll below 768px.
   -------------------------------------------------------------------------- */

.elementor-sticky__spacer .elementor-nav-menu__container { display: none; }

/* A menu configured without a dropdown still renders an (unused) dropdown
   container; keep it out of the layout entirely. */
.elementor-nav-menu--dropdown-none .elementor-nav-menu--dropdown { display: none; }

/* Below 1024px the reference stacks the three step cards vertically above the
   detail panel. Elementor's nested tabs can place the list above the content
   ("block-start") but keeps the titles in a row, so they are stacked here. */
@media (max-width: 1023px) {
	.ns-stepper .e-n-tabs-heading {
		flex-direction: column;
		align-items: stretch;
	}
	.ns-stepper .e-n-tab-title { width: 100%; }
}

/* --------------------------------------------------------------------------
   26. FAQ open/close
       Elementor's accordion animation leaves a fixed inline height on the
       <details> element, which clips the answer. The height is released here
       (the inline style can only be beaten with !important) and the expand is
       animated natively instead, matching the reference's slide-down.
   -------------------------------------------------------------------------- */

.ns-faq .e-n-accordion-item { height: auto !important; overflow: visible !important; }
.ns-faq .e-n-accordion-item > summary { flex: none; }


/* --------------------------------------------------------------------------
   27. Area index cards
   -------------------------------------------------------------------------- */

/* In the reference the card's title and its "Se <ort> →" link are inline-block
   spans, so their line boxes add 4px below the title and sit 5px shorter than
   a block widget. Elementor renders both as block-level widgets, so the two
   offsets are restored here to keep the card the same height. */
.ns-city-card > .e-con:first-child { margin-bottom: 4px; }
.ns-city-card > .elementor-widget-button { line-height: 23px; }

/* --------------------------------------------------------------------------
   28. Blog cards
   -------------------------------------------------------------------------- */

/* The reference card is a flex column whose category chip is an inline-flex
   span and whose footer row is a blockified flex item, so their line boxes are
   25px and 20px tall. Elementor's block widgets inherit the 28px body line
   height instead; the two are pinned back to the reference's values. */
.ns-cat-chip { line-height: 25px; }
.ns-card-foot .elementor-widget-button { line-height: 20px; }

/* --------------------------------------------------------------------------
   29. Floating "Begär offert" tab
       The button, its colours, padding, link and fixed position all come from
       Elementor Pro's own controls. Only the rotation lives here: Elementor
       applies container transforms through a class it adds in the editor, not
       on the front end. Rotating about the bottom-right corner keeps the tab
       flush with the viewport edge whatever the label's width.
   -------------------------------------------------------------------------- */

.ns-offert-tab {
	transform: rotate(-90deg);
	transform-origin: 100% 100%;
}
.ns-offert-tab .elementor-button {
	box-shadow: 0 2px 12px rgb(23 33 51 / 18%);
}

/* Out of the way of the fixed mobile action bar. */
@media (max-width: 767px) {
	.ns-offert-tab .elementor-button {
		padding: 10px 16px;
		font-size: .875rem;
	}
}