/* elivance.eu - assembly layer over tokens.css + base.css (release 1, 18.10.2026).
   Only components the mockup did not have, and the classes that replace the mockup's inline styles. */

.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

/* real logo (packaging/logo/elivance-c-dmsans.svg), wordmark = currentColor */
.logo { align-items: center; }
.logo__svg { display: block; height: 26px; width: auto; color: inherit; }
.site-footer .logo__svg { height: 30px; }

/* header: no language switcher in phase 1 (contract §6) */
.header-cta-wrap { display: none; flex-direction: column; align-items: flex-end; gap: 2px; margin-left: auto; }
.header-cta__note { font-size: 0.8125rem; color: var(--c-muted); font-weight: var(--fw-semibold); }
@media (min-width: 900px) { .header-cta-wrap { display: flex; } }
.site-header .header-cta { display: inline-flex; }
.menu-mobile__panel .cta-note { margin-top: var(--s-5); }

/* breadcrumbs */
.breadcrumbs { padding-top: var(--s-5); font-size: var(--fs-small); color: var(--c-muted); }
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: var(--s-1) var(--s-2); list-style: none; padding: 0; margin: 0; }
.breadcrumbs li { display: inline-flex; align-items: center; gap: var(--s-2); min-width: 0; }
.breadcrumbs li + li::before { content: "/"; color: var(--c-line-strong); }
.breadcrumbs a { color: var(--c-emerald-strong); display: inline-block; padding-block: 10px; }
.breadcrumbs [aria-current] { color: var(--c-text); font-weight: var(--fw-semibold); overflow-wrap: anywhere; }

/* page head (pages whose first section is not a hero) */
.page-head { padding-top: var(--s-7); }
.page-head h1 { max-width: 22ch; overflow-wrap: break-word; }
.section--first { padding-top: var(--s-7); }
.hero__grid--single { grid-template-columns: minmax(0, 1fr) !important; }
.hero__grid--single .hero__copy h1 { max-width: 20ch; }
.hero__body { color: var(--c-text); }

/* CTA group: "Calls are in English" sits above the button (contract §7) */
.cta-group { display: grid; gap: var(--s-3); justify-items: start; }
.cta-note { font-size: var(--fs-small); font-weight: var(--fw-bold); color: var(--c-text); display: inline-flex; align-items: center; gap: var(--s-2); }
.cta-note::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--c-emerald); flex: none; }
.cta-micro { font-size: var(--fs-small); color: var(--c-muted); max-width: 52ch; }
.cta-panel { display: grid; gap: var(--s-5); padding: clamp(24px, 1.2rem + 1.2vw, 48px); background: var(--c-paper); border: var(--border) solid var(--c-emerald); border-radius: var(--r-md); }
.section--cta .cta-panel h2 { max-width: 24ch; }
.lead p { font-size: var(--fs-lead); color: var(--c-muted); }

/* hero: two options (consultation page) */
.options { display: grid; gap: var(--grid-gap); margin-top: var(--s-8); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .options { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); } }
.option__title { font-size: var(--fs-h3); letter-spacing: -0.01em; }
.option--light { background: var(--c-bg); }
.option__line { font-size: var(--fs-small); color: var(--c-muted); }

/* generic sections */
.section-body { max-width: 760px; }
.section-body--wide { max-width: none; }
.section-body > * + * { margin-top: var(--s-5); }
.prose > * + * { margin-top: var(--s-4); }
.prose ul, .prose ol { padding-left: 1.25em; }
.prose li + li { margin-top: var(--s-2); }
.prose a { color: var(--c-link); }
.list-title { font-size: var(--fs-h3); }
.steps--many { counter-reset: step; }
@media (min-width: 768px) { .steps--many { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .steps--many { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.step p { color: var(--c-text); }
.footnote { font-size: var(--fs-small); color: var(--c-muted); }
.section-link { margin-top: var(--s-5); }
.link-list { list-style: none; padding: 0; display: grid; gap: var(--s-3); }
.link-list .link-arrow { padding-block: 6px; }
.assistant-line { margin-top: var(--s-5); font-size: var(--fs-small); max-width: 70ch; }
.link-button { background: none; border: 0; padding: 0; color: var(--c-link); font: inherit; font-weight: var(--fw-bold); text-decoration: underline; cursor: pointer; min-height: 24px; }
.link-pending { color: inherit; }
.anchor-alias { display: block; position: relative; top: -96px; }

/* cards from copy */
.card__pain { font-weight: var(--fw-semibold); }
.card__entry { font-size: var(--fs-small); color: var(--c-muted); }
.card__meta { flex-wrap: wrap; gap: var(--s-2) var(--s-4); }

/* launch callout without a big number (copy has no separate number) */
.launch--text { grid-template-columns: minmax(0, 1fr); border-color: var(--c-coral); }
.launch__title { display: block; color: var(--c-text); font-size: 1.125rem; }

/* tables */
.table-wrap { overflow-x: auto; border: var(--border) solid var(--c-line); border-radius: var(--r-md); background: var(--c-paper); }
.table { width: 100%; border-collapse: collapse; font-size: var(--fs-small); min-width: 560px; }
.table caption { text-align: left; padding: var(--s-4) var(--s-5) 0; font-weight: var(--fw-bold); }
.table th, .table td { text-align: left; vertical-align: top; padding: var(--s-4) var(--s-5); border-bottom: var(--border-hair) solid var(--c-line); }
.table thead th { font-size: var(--fs-label); text-transform: uppercase; letter-spacing: var(--tracking-label); color: var(--c-muted); }
.table tbody tr:last-child > * { border-bottom: 0; }
.table a { color: var(--c-link); }

/* embed slot (Cal.com click-to-load) */
.embed-slot__icon { color: var(--c-emerald-strong); }
.embed-slot__text p { margin-inline: auto; }
.embed-slot__text a { color: var(--c-link); }
.embed-slot iframe, .cal-dialog__slot iframe { width: 100%; min-height: 640px; border: 0; border-radius: var(--r-sm); background: var(--c-paper); }
.embed-slot.is-loaded { padding: 0; border-style: solid; display: block; }
.calendar-panel { max-width: 760px; }

/* form additions */
.form__notice { font-size: var(--fs-small); color: var(--c-muted); }
.form__notice a, .check a { color: var(--c-link); }
.field--check .field__error { margin-top: var(--s-2); }
.hp-field { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.form-summary { display: flex; gap: var(--s-3); align-items: flex-start; }
.form-summary[hidden] { display: none; }
.form-summary .icon { color: var(--c-error); margin-top: 3px; }
.form-panel { max-width: 760px; }

/* legal pages */
.legal-banner { background: #FFF3C4; border-block: var(--border) solid #C9A227; color: var(--c-text); }
.legal-banner p { display: flex; align-items: center; gap: var(--s-3); padding-block: var(--s-3); font-size: var(--fs-small); }
.legal-banner .icon { color: #6B5300; }
.prose--doc { max-width: 76ch; }
.prose--doc h2 { font-size: var(--fs-h3); margin-top: var(--s-8); }
.prose--doc h3 { font-size: 1.125rem; margin-top: var(--s-6); }
.prose--doc table { width: 100%; border-collapse: collapse; font-size: var(--fs-small); }
.prose--doc th, .prose--doc td { text-align: left; vertical-align: top; padding: var(--s-3); border-bottom: var(--border-hair) solid var(--c-line); }
.prose--doc blockquote { border-left: 4px solid var(--c-emerald); padding-left: var(--s-4); color: var(--c-muted); }
.prose--doc code { font-size: 0.9em; overflow-wrap: anywhere; }
.prose--doc :is(p, li, td) { overflow-wrap: break-word; }

/* articles */
.article__wrap { max-width: 840px; }
.article__meta { color: var(--c-muted); font-size: var(--fs-small); margin-top: var(--s-4); }
.article__meta a { color: var(--c-link); }
.article .page-head h1 { max-width: none; font-size: clamp(2rem, 1.4rem + 2.4vw, 3.25rem); }
.article .prose--doc { margin-top: var(--s-7); }
.article-cta { display: grid; gap: var(--s-3); justify-items: start; padding: var(--s-5); margin-block: var(--s-5); border: var(--border) solid var(--c-emerald); border-radius: var(--r-md); background: var(--c-paper); }
.article-cta .btn { color: var(--c-on-emerald); text-decoration: none; }
.author-box { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: var(--s-5); align-items: start; margin-top: var(--s-10); padding: var(--s-6); background: var(--c-paper); border: var(--border) solid var(--c-line); border-radius: var(--r-md); }
.author-box > div > * + * { margin-top: var(--s-2); }
.author-box__photo { width: 96px; aspect-ratio: 1; border-radius: var(--r-md); object-fit: cover; }
.author-box__name { font-weight: var(--fw-heading); font-size: 1.125rem; }
.author-box__role { color: var(--c-muted); font-size: var(--fs-small); }
@media (max-width: 479px) { .author-box { grid-template-columns: minmax(0, 1fr); } }
.related { margin-top: var(--s-10); }
.related h2 { font-size: var(--fs-h3); margin-bottom: var(--s-5); }
.related .cards--3 { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 768px) { .related .cards--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.post-card__meta { font-size: var(--fs-small); color: var(--c-muted); margin-top: auto; }
.blog-group + .blog-group { margin-top: var(--s-10); }
.blog-group__title { margin-bottom: var(--s-5); }
.blog-group__title a { color: var(--c-text); }
.pillar-services { margin-top: var(--s-10); }
.pillar-services h2 { font-size: var(--fs-h3); margin-bottom: var(--s-4); }

/* footer: 5 columns from copy */
@media (min-width: 1024px) { .footer__grid--5 { grid-template-columns: minmax(0, 1.1fr) repeat(4, minmax(0, 1fr)); } }
.footer__bottom p { max-width: 80ch; }

/* chat panel (AI assistant) */
.chat { position: fixed; z-index: 60; right: 16px; bottom: 16px; width: min(420px, calc(100vw - 32px)); max-height: min(640px, calc(100vh - 32px));
  display: flex; flex-direction: column; background: var(--c-paper); border: var(--border) solid var(--c-text); border-radius: var(--r-md); box-shadow: var(--shadow-float); overflow: hidden; }
.chat[hidden] { display: none; }
.chat__head { display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); padding: var(--s-3) var(--s-4); border-bottom: var(--border-hair) solid var(--c-line); }
.chat__title { font-weight: var(--fw-heading); display: inline-flex; align-items: center; gap: var(--s-2); }
.chat__close { width: 44px; height: 44px; display: grid; place-items: center; border: 0; background: none; border-radius: var(--r-sm); cursor: pointer; color: var(--c-text); }
.chat__close:hover { background: var(--c-bg-sunk); }
.chat__intro, .chat__body { padding: var(--s-4); overflow-y: auto; display: flex; flex-direction: column; gap: var(--s-3); }
.chat__body[hidden], .chat__intro[hidden] { display: none; }
.chat__disclosure { font-size: 1.0625rem; }
.chat__text { font-size: var(--fs-small); }
.chat__text a, .chat__small a { color: var(--c-link); }
.chat__small { font-size: 0.875rem; color: var(--c-muted); }
.chat__actions { display: flex; flex-wrap: wrap; gap: var(--s-3); }
.chat__banner { font-size: 0.875rem; font-weight: var(--fw-bold); padding: var(--s-2) var(--s-3); background: var(--c-emerald-tint); border-radius: var(--r-sm); }
.chat__log { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--s-3); min-height: 120px; }
.chat__msg { padding: var(--s-3) var(--s-4); border-radius: var(--r-md); max-width: 88%; white-space: pre-wrap; overflow-wrap: anywhere; font-size: var(--fs-small); }
.chat__msg--bot { background: var(--c-bg-sunk); align-self: flex-start; }
.chat__ai { display: inline-block; font-size: 0.6875rem; font-weight: var(--fw-bold); letter-spacing: 0.04em; line-height: 1; padding: 3px 5px; border-radius: 4px; background: var(--c-emerald-tint); vertical-align: 1px; }
.chat__chips[hidden] { display: none; }
.chat__msg--me { background: var(--c-emerald-tint); align-self: flex-end; }
.chat__msg--err { background: var(--c-paper); border: var(--border) solid var(--c-error); }
.chat__msg a { color: var(--c-link); }
.chat__form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--s-2); align-items: end; }
.chat__input { min-height: 48px; resize: vertical; }
.chat__send { min-width: 48px; padding-inline: var(--s-3); }

/* Cal.com dialog */
.cal-dialog { width: min(760px, calc(100vw - 24px)); max-height: calc(100vh - 24px); padding: 0; border: var(--border) solid var(--c-text); border-radius: var(--r-md); background: var(--c-paper); color: var(--c-text); }
.cal-dialog::backdrop { background: rgba(20, 36, 32, 0.45); }
.cal-dialog__head { display: flex; align-items: center; justify-content: space-between; padding: var(--s-3) var(--s-4); border-bottom: var(--border-hair) solid var(--c-line); }
.cal-dialog__title { font-weight: var(--fw-heading); font-size: 1.125rem; }
.cal-dialog__slot { padding: var(--s-4); }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }
@media print { .chat, .cal-dialog, .launcher, .sticky-cta { display: none !important; } }

/* spacing fixes found in render check */
.section--sunk + .section, .section--paper + .section, .hero + .section, .breadcrumbs + .section { padding-top: var(--section-y); }
.breadcrumbs + .section--first, .legal-banner + .section--first, .page-head + .section { padding-top: var(--s-7); }
.header-cta-wrap { padding-block: var(--s-2); }
.container.article__wrap { max-width: var(--container); }
.article__wrap > * { max-width: 840px; }
/* beat base.css adjacent-section collapse (specificity 0,4,0) */
.section--sunk + .section:not(.section--sunk):not(.section--paper),
.section--paper + .section:not(.section--sunk):not(.section--paper),
.section--cta + .section:not(.section--sunk):not(.section--paper) { padding-top: var(--section-y); }
/* price table stacks into cards on phones */
@media (max-width: 639px) {
  .table-wrap--stack { overflow: visible; border: 0; background: none; }
  .table-wrap--stack .table { min-width: 0; }
  .table-wrap--stack thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .table-wrap--stack tbody, .table-wrap--stack tr, .table-wrap--stack th, .table-wrap--stack td { display: block; }
  .table-wrap--stack tr { background: var(--c-paper); border: var(--border) solid var(--c-line); border-radius: var(--r-md); padding: var(--s-4); }
  .table-wrap--stack tr + tr { margin-top: var(--s-3); }
  .table-wrap--stack th, .table-wrap--stack td { padding: var(--s-1) 0; border: 0; }
  .table-wrap--stack th[scope=row] { font-size: 1.0625rem; }
  .table-wrap--stack td::before { content: attr(data-label); display: block; font-size: var(--fs-label); font-weight: var(--fw-bold); text-transform: uppercase; letter-spacing: var(--tracking-label); color: var(--c-muted); }
  .table-wrap--stack caption { padding: 0 0 var(--s-3); }
}

/* chat consent tick + enquiry hint (backend integration 2026-10-18) */
.chat__consent { font-size: 0.875rem; }
/* contact form under the chat (plan v4/v5): details go to the server, never to the AI */
.chat__contact { display: flex; flex-direction: column; gap: var(--s-3); padding: var(--s-4); border: var(--border-hair) solid var(--c-line); border-radius: var(--r-md); background: var(--c-paper); }
.chat__contact[hidden] { display: none; }
/* Elli is writing: a pencil and three dots, like in Telegram (Lidia 26.10) */
.chat__typing { display: inline-flex; align-items: center; gap: 6px; color: var(--c-muted); white-space: nowrap; }
.chat__pencil { animation: chat-pencil 0.9s ease-in-out infinite; transform-origin: 20% 80%; }
.chat__dots { display: inline-flex; gap: 3px; }
.chat__dots i { width: 4px; height: 4px; border-radius: 50%; background: currentColor; opacity: 0.3; animation: chat-dot 1.2s infinite; }
.chat__dots i:nth-child(2) { animation-delay: 0.2s; } .chat__dots i:nth-child(3) { animation-delay: 0.4s; }
@keyframes chat-pencil { 0%, 100% { transform: rotate(-8deg); } 50% { transform: rotate(8deg) translateX(2px); } }
@keyframes chat-dot { 0%, 60%, 100% { opacity: 0.3; } 30% { opacity: 1; } }
/* name and email came from the chat (Lidia 26.10): one line with them, the consent tick and the send button */
.chat__prefill { display: none; font-weight: var(--fw-heading); overflow-wrap: anywhere; }
.chat__contact--confirm .chat__prefill { display: block; }
.chat__contact--confirm .chat__contact-title, .chat__contact--confirm > .chat__small:not(.chat__contact-msg),
.chat__contact--confirm [data-field=name], .chat__contact--confirm [data-field=email],
.chat__contact--confirm [data-field=phone], .chat__contact--confirm [data-field=company] { display: none; }
.chat__contact-title { font-weight: var(--fw-heading); }
.chat__contact .field { gap: var(--s-1); }
.chat__contact-msg[data-state="error"] { color: var(--c-error); }
.chat__leave { align-self: flex-start; }
.chat__consent .check { align-items: flex-start; }
.chat__msg--note { background: var(--c-paper); border: var(--border-hair) solid var(--c-line); align-self: flex-start; }
.chat__form[aria-disabled="true"] { opacity: .6; }

/* sample AI roadmap page (/blog/sample-ai-roadmap), author page, pillar intro - 2026-10-18 */
.sample-label { display: flex; flex-wrap: wrap; gap: var(--s-3); align-items: flex-start; padding: var(--s-4) var(--s-5); background: var(--c-paper); border: var(--border) solid var(--c-line); border-left: 4px solid var(--c-coral); border-radius: var(--r-md); }
.sample-label p { flex: 1 1 280px; margin: 0; }
.sample-download { display: flex; gap: var(--s-2); align-items: center; margin-top: var(--s-4); font-weight: var(--fw-semibold); }
.sample-download .icon { width: 20px; height: 20px; }
.sample-doc { margin-top: var(--s-7); padding: clamp(20px, 4vw, 48px); background: var(--c-paper); border: var(--border) solid var(--c-line); border-radius: var(--r-md); }
.sample-doc > * + * { margin-top: var(--s-4); }
.sample-doc .sd-title { font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2rem); }
.sample-doc h2.sd-h { font-size: 1.25rem; margin-top: var(--s-7); }
.sample-doc h3.sd-h { font-size: 1.0625rem; display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s-2); }
.sample-doc h4.sd-h { font-size: 1rem; }
.sample-doc .sd-sample { border-left: 3px solid var(--c-coral); padding-left: var(--s-3); color: var(--c-muted); font-size: var(--fs-small); }
.sample-doc .sd-sample b, .sample-doc .sd-risk b { color: var(--c-text); }
.sample-doc .sd-kicker, .sample-doc .sd-k, .sample-doc .sd-eff { font-size: var(--fs-label); font-weight: var(--fw-bold); text-transform: uppercase; letter-spacing: var(--tracking-label); color: var(--c-muted); }
.sample-doc .sd-meta, .sample-doc .sd-note, .sample-doc .sd-lead { color: var(--c-muted); font-size: var(--fs-small); }
.sample-doc .sd-meta { padding-bottom: var(--s-3); border-bottom: var(--border-hair) solid var(--c-line); }
.sample-doc .sd-summary { display: grid; grid-template-columns: minmax(0, 9rem) minmax(0, 1fr); gap: var(--s-2) var(--s-4); padding-block: var(--s-3); border-block: var(--border-hair) solid var(--c-line); }
.sample-doc .sd-card { border-top: 2px solid var(--c-text); padding-top: var(--s-3); }
.sample-doc .sd-n { color: var(--c-emerald-strong); margin-right: var(--s-2); }
.sample-doc .sd-grid2, .sample-doc .sd-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); gap: var(--s-3) var(--s-5); }
.sample-doc .sd-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sample-doc .sd-row { margin-top: var(--s-2); }
.sample-doc .sd-risk { border-left: 3px solid var(--c-coral); padding-left: var(--s-3); margin-top: var(--s-3); }
.sample-doc .sd-step { border-left: 2px solid var(--c-emerald); padding-left: var(--s-3); }
.sample-doc .sd-step p + p { margin-top: var(--s-2); }
.sample-doc ul { padding-left: 1.25rem; list-style: disc; }
.sample-doc li + li { margin-top: var(--s-1); }
.sample-doc .sd-sub td, .sample-doc .sd-area { font-weight: var(--fw-semibold); }
.sample-doc .sd-total td { font-weight: var(--fw-bold); }
@media (max-width: 639px) { .sample-doc .sd-summary, .sample-doc .sd-grid2, .sample-doc .sd-cols { grid-template-columns: minmax(0, 1fr); } }
.pillar-intro { max-width: var(--measure); margin-top: var(--s-5); margin-bottom: var(--s-7); }
.pillar-intro > * + * { margin-top: var(--s-4); }
/* chat layout: the log scrolls, consent + input stay in view; messages never shrink into each other */
.chat__body { overflow: hidden; flex: 1 1 auto; min-height: 0; }
.chat__body > :not(.chat__logwrap) { flex-shrink: 0; }
.chat__logwrap { flex: 1 1 auto; overflow-y: auto; min-height: 96px; display: flex; flex-direction: column; }
.chat__log { flex: 1 0 auto; }
.chat__log > * { flex-shrink: 0; }
.launcher--float[aria-expanded="true"] { display: none; }

/* ---- fix pass 18.10 (codex-final, CRO, a11y reviews) ---- */
/* 2.4.11: focused elements must not hide under the sticky CTA bar / floating launcher */
@media (max-width: 899px) { html { scroll-padding-bottom: calc(var(--sticky-cta-h) + 16px + env(safe-area-inset-bottom)); } }
@media (min-width: 900px) { html { scroll-padding-bottom: 96px; } }
/* skip-link target: programmatic focus on main draws no ring */
main:focus { outline: none; }
/* preview banner (every page of a --preview build) */
.preview-banner { background: #FFF3C4; border-bottom: var(--border) solid #C9A227; color: var(--c-text); }
.preview-banner p { display: flex; align-items: center; gap: var(--s-3); padding-block: var(--s-2); font-size: var(--fs-small); }
.preview-banner .icon { color: #6B5300; flex-shrink: 0; }
/* legal: value not decided yet */
.tbc { background: #FFF3C4; padding: 0 0.25em; border-radius: 3px; font-weight: var(--fw-semibold); white-space: nowrap; }
/* paid consultation switched off on preview */
.paid-off { display: inline-grid; gap: var(--s-2); justify-items: start; }
.paid-off .btn[disabled] { opacity: 0.55; cursor: not-allowed; }
.paid-off__note { font-size: var(--fs-small); color: var(--c-muted); }
/* calendar: loading text until the iframe fires load */
.cal-loading { padding: var(--s-6); text-align: center; color: var(--c-muted); }
/* mobile: cal.com opens in a new tab, say so under the button */
.cta-mobile-note { display: none; font-size: var(--fs-small); color: var(--c-muted); }
@media (max-width: 767px) { .cta-mobile-note { display: block; } }
/* mobile: face next to the hero button */
.hero__face { display: none; }
@media (max-width: 767px) {
  .hero__face { display: flex; align-items: center; gap: var(--s-3); font-size: var(--fs-small); font-weight: var(--fw-semibold); margin-top: var(--s-4); }
  .hero__face img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; object-position: 50% 30%; }
}
/* sticky bar: hidden on /contact (the page is the calendar) and while typing in a form */
.page-contact .sticky-cta, body.form-focus .sticky-cta { display: none; }
@media (max-width: 899px) { .page-contact .launcher--float:not([aria-expanded="true"]) { display: inline-flex; bottom: max(16px, env(safe-area-inset-bottom)); } }
.article-cta--mid p { margin: 0; }

/* chat starter chips (Lidia 18.10) */
.chat__chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 16px; }
.chip { font: inherit; font-size: 0.875rem; line-height: 1.3; text-align: left; padding: 8px 12px; min-height: 40px;
  border: 1px solid var(--c-line-strong, #7C847F); border-radius: 999px; background: var(--c-paper, #fff);
  color: var(--c-text, #142420); cursor: pointer; }
.chip:hover { border-color: var(--c-emerald-strong, #0B7A5C); color: var(--c-emerald-strong, #0B7A5C); }
.chip:focus-visible { outline: 3px solid var(--c-focus, #0B7A5C); outline-offset: 2px; }

/* ---------- ideas pass 18.10 (smyslokod): blog template, calculator, form line, assistant box ---------- */
.in-short { margin-top: var(--s-5); padding: var(--s-4) var(--s-5); background: var(--c-paper); border: var(--border) solid var(--c-line); border-left: 4px solid var(--c-emerald); border-radius: var(--r-md); max-width: 760px; }
.in-short p { margin: 0; }
.in-short__label { font-size: var(--fs-small); font-weight: var(--fw-bold); text-transform: uppercase; letter-spacing: 0.06em; color: var(--c-emerald-strong); margin-bottom: var(--s-2) !important; }
.takeaways { margin-top: var(--s-5); max-width: 760px; }
.takeaways__title { font-size: var(--fs-h3); margin-bottom: var(--s-3); }
.try-week { margin-block: var(--s-6); padding: var(--s-4) var(--s-5); background: var(--c-bg-sunk); border-radius: var(--r-md); border-left: 4px solid var(--c-coral); }
.try-week p { margin: 0; }
.try-week__label { font-weight: var(--fw-bold); margin-bottom: var(--s-2) !important; }
.useful { margin-top: var(--s-6); display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3) var(--s-4); }
.useful__q { font-weight: var(--fw-bold); margin: 0; }
.useful__btns { display: flex; gap: var(--s-3); }
.useful__btns .btn { min-width: 72px; }
.useful__btns .btn[aria-pressed="true"] { border-color: var(--c-emerald); }
.useful__thanks { margin: 0; color: var(--c-muted); font-size: var(--fs-small); }
.useful__thanks:empty { display: none; }
.calc { margin-top: var(--s-5); }
.calc__form { display: grid; gap: var(--s-4); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .calc__form { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.calc__form .field { display: grid; gap: var(--s-2); align-content: start; }
.calc__form .input { width: 100%; }
.calc__result { padding: var(--s-4) var(--s-5); background: var(--c-bg); border: var(--border) solid var(--c-emerald); border-radius: var(--r-md); }
.calc__result p { margin: 0; }
.calc__result p + p { margin-top: var(--s-2); }
.calc__cost { font-size: var(--fs-lead); font-weight: var(--fw-bold); }
.calc__cta { display: grid; gap: var(--s-3); }
.calc__cta > p { margin: 0; }
.form__system { font-size: var(--fs-small); color: var(--c-text); padding: var(--s-3) var(--s-4); background: var(--c-bg-sunk); border-radius: var(--r-sm); margin: 0 0 var(--s-4); }
.how-assistant { margin-bottom: var(--s-6); max-width: 760px; }
.how-assistant h2 { font-size: var(--fs-h3); }

/* Finnish pages for online shops (copy-fi.json, 26.10) */
.tile { display: flex; flex-direction: column; }
.tile .card__text { flex: 1; }
.tile__action { margin-top: var(--s-3); }
.tile__action .btn { width: 100%; justify-content: center; }
.table.sample td.sample__after { background: var(--c-emerald-tint); }
.table.sample th[scope=row] { white-space: nowrap; }
@media (max-width: 767px) { .table.sample th[scope=row] { white-space: normal; } }
.chat-demo__bot { font-weight: var(--fw-semibold); display: flex; gap: var(--s-2); align-items: center; }
.chat-demo__qs { display: flex; flex-wrap: wrap; gap: var(--s-2); list-style: none; padding: 0; margin: var(--s-2) 0 var(--s-3); }
.chip--static { cursor: default; border: var(--border-hair) solid var(--c-line); border-radius: var(--r-md); background: var(--c-paper); }
.cta-or { align-self: center; color: var(--c-muted); }

/* cookie banner (launch plan piece 3): non-modal, bottom; Accept and Reject same look (Traficom / EDPB) */
.ckb { position: fixed; z-index: 70; left: var(--s-3); right: var(--s-3); bottom: var(--s-3); max-width: 560px; background: var(--c-paper); color: var(--c-text); border: var(--border-hair) solid var(--c-line-strong); border-radius: var(--r-md); box-shadow: 0 8px 32px rgba(20, 36, 32, 0.18); }
.ckb[hidden] { display: none; }
.ckb__inner { padding: var(--s-4); display: flex; flex-direction: column; gap: var(--s-3); max-height: 80vh; overflow-y: auto; }
.ckb__title { font-size: var(--fs-h3); margin: 0; }
.ckb__text, .ckb__small { margin: 0; font-size: var(--fs-small); }
.ckb__text a { color: var(--c-link); }
.ckb__more { display: flex; flex-direction: column; gap: var(--s-2); }
.ckb__more[hidden] { display: none; }
.ckb__opt { display: flex; align-items: center; gap: var(--s-2); min-height: 44px; font-size: var(--fs-small); }
.ckb__opt input { width: 22px; height: 22px; accent-color: var(--c-emerald-strong); }
.ckb__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3); }
.ckb__actions .btn { flex: 1 1 140px; justify-content: center; }
.footer__bottom [data-cookie-settings][hidden] { display: none; }
@media (min-width: 768px) { .ckb { left: var(--s-5); bottom: var(--s-5); } }
/* stage diagram (render_flow, class stage-map): stacked with arrows down on phones, three columns with arrows right from 900px */
.stage-map { margin: 0; }
.stage-map__stages { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--s-7); }
.stage-map__stage { position: relative; }
.stage-map__stage + .stage-map__stage::before { content: ""; position: absolute; left: 50%; top: calc(-1 * var(--s-6)); width: 12px; height: 12px; border-right: 2px solid var(--c-line-strong); border-bottom: 2px solid var(--c-line-strong); transform: translateX(-50%) rotate(45deg); }
.stage-map__label { margin: 0 0 var(--s-3); font-size: var(--fs-label); font-weight: var(--fw-bold); letter-spacing: 0.06em; text-transform: uppercase; color: var(--c-muted); }
.stage-map__nodes { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--s-3); }
.stage-map__node { background: var(--c-paper); border: 1px solid var(--c-line); border-radius: 8px; padding: var(--s-3) var(--s-4); }
.stage-map__node strong { display: block; font-weight: var(--fw-semibold); line-height: var(--lh-heading); }
.stage-map__node span { display: block; margin-top: var(--s-1); font-size: var(--fs-small); color: var(--c-muted); line-height: 1.45; }
.stage-map__node--key { border: 2px solid var(--c-emerald); background: var(--c-emerald-tint); }
.stage-map__caption { margin-top: var(--s-5); font-size: var(--fs-small); color: var(--c-muted); }
@media (min-width: 900px) {
  .stage-map__stages { grid-template-columns: 1.15fr 1fr 1fr; gap: var(--s-7); align-items: start; }
  .stage-map__stage + .stage-map__stage::before { left: calc(-1 * var(--s-5)); top: 50%; transform: translate(-50%, -50%) rotate(-45deg); }
}