/* ---------- Trust & clarity layer (clinic facts, included vs extra, verification, sticky CTA) ---------- */

/* clinic card facts */
.lcard.tc .media { position: relative; }
.lcard.tc .vb { position: absolute; top: 12px; left: 12px; z-index: 2; padding: 5px 10px; border-radius: 999px; font: 600 11.5px var(--title); background: rgba(255, 255, 255, .94); color: #5b6478; box-shadow: 0 2px 8px rgba(0, 0, 0, .08); }
.lcard.tc .vb.ok { background: var(--action); color: #fff; }
.lcard.tc .vb.mid { background: #fff3dc; color: #96610a; }
.lcard.tc .illu { position: absolute; right: 10px; bottom: 10px; z-index: 2; padding: 3px 8px; border-radius: 999px; background: rgba(15, 23, 42, .55); color: #fff; font-size: 10.5px; letter-spacing: .02em; }
.lcard.tc .media:has(.track img[data-attr]:not([data-attr=""])) .illu { display: none; }
.lcard.tc .meta h4 { font-size: 17px; }
.cf { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 7px; }
.cf li { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; line-height: 1.4; color: var(--body, #4a5468); }
.cf li > svg, .cf li > .ic { flex: none; width: 15px; height: 15px; margin-top: 2px; color: var(--green-d); }
.cf li span { min-width: 0; }
.cf-rev .grate { font-size: 13px; }
.cf-rev .grate:not([style*="none"]) + .cf-fb { display: none; }

/* drawer facts */
.cfx { display: grid; gap: 14px; margin: 18px 0; }
.cfx-v { display: flex; gap: 12px; padding: 14px 16px; border-radius: 16px; background: var(--smoke); }
.cfx-v.ok { background: rgba(34, 179, 168, .1); }
.cfx-v.mid { background: #fff7e8; }
.cfx-v > svg { flex: none; width: 22px; height: 22px; color: var(--green-d); }
.cfx-v b { display: block; font: 600 15px var(--title); color: var(--navy); }
.cfx-v span { display: block; font-size: 13.5px; color: var(--muted); margin: 2px 0 6px; line-height: 1.45; }
.cfx-v a, .vlink { font: 600 13.5px var(--title); color: var(--green-d); text-decoration: underline; text-underline-offset: 3px; }
.fx { display: flex; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.fx:last-child { border-bottom: 0; }
.fx > svg { flex: none; width: 18px; height: 18px; margin-top: 2px; color: var(--green-d); }
.fx h5 { margin: 0 0 4px; font: 600 14.5px var(--title); color: var(--navy); }
.fx p { margin: 0 0 4px; font-size: 13.5px; line-height: 1.5; color: var(--muted); }
.fx-p, .fx-d { list-style: none; margin: 0 0 6px; padding: 0; display: grid; gap: 4px; }
.fx-p li { display: flex; justify-content: space-between; gap: 12px; font-size: 14px; color: var(--navy); }
.fx-p small { color: var(--muted); }
.fx-d li { font-size: 13.5px; color: var(--muted); }
.fx-d b { color: var(--navy); }
.fx-n { font-size: 12px !important; }

/* indicative price strip (home, above clinic cards) */
.price-strip { display: grid; grid-template-columns: repeat(3, 1fr) 1.2fr; gap: 12px; margin: 0 0 26px; }
.ps-i { display: flex; gap: 12px; align-items: center; padding: 14px 16px; border-radius: 18px; background: #fff; border: 1px solid var(--line); }
.ps-i > svg { flex: none; width: 26px; height: 26px; padding: 7px; box-sizing: content-box; border-radius: 12px; background: rgba(34, 179, 168, .1); color: var(--green-d); }
.ps-i span { display: block; font-size: 12.5px; color: var(--muted); }
.ps-i b { display: block; font: 700 19px var(--title); color: var(--navy); }
.ps-i small { font-size: 11.5px; color: var(--muted); }
.ps-n { align-self: center; font-size: 12.5px; line-height: 1.5; color: var(--muted); }
.ps-n a { color: var(--green-d); font-weight: 600; }

/* included vs extra */
.incx { display: grid; grid-template-columns: 1fr 1.15fr; gap: 26px; align-items: start; }
.incx-card { position: relative; overflow: hidden; border-radius: var(--r-lg); padding: 34px 34px 22px; }
.incx-card.inc { background: linear-gradient(140deg, var(--blue-900), var(--blue)); color: #fff; }
.incx-card.inc::before { content: ""; position: absolute; inset: 0; opacity: .1; pointer-events: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='98' viewBox='0 0 56 98'%3E%3Cpath d='M28 66 0 50V18L28 2l28 16v32zm0 32L0 82V66l28-16 28 16v16z' fill='none' stroke='%23ffffff' stroke-width='1'/%3E%3C/svg%3E"); }
.incx-card.ext { background: #fff; box-shadow: var(--shadow); }
.incx-h { position: relative; display: flex; gap: 16px; align-items: center; margin-bottom: 14px; }
.incx-h .fi { flex: none; width: 58px; height: 58px; border-radius: 18px; display: grid; place-items: center; }
.incx-h .fi .ic { width: 28px; height: 28px; }
.inc .incx-h .fi { background: rgba(255, 255, 255, .14); color: #fff; }
.ext .incx-h .fi { background: var(--smoke2); color: var(--blue); }
.incx-h h3 { margin: 0; font: 600 22px var(--title); color: var(--navy); letter-spacing: -.01em; }
.incx-h p { margin: 2px 0 0; font-size: 14.5px; color: var(--body); }
.inc .incx-h h3 { color: #fff; }
.inc .incx-h p { color: rgba(255, 255, 255, .75); }
.incx ul { position: relative; list-style: none; margin: 0; padding: 0; display: block; }
.incx li { display: grid; grid-template-columns: 22px 1fr auto; gap: 14px; align-items: center; padding: 14px 0; border-top: 1px solid var(--line); }
.inc li { border-color: rgba(255, 255, 255, .16); }
.incx li > .ic { width: 22px; height: 22px; color: var(--green-d); }
.inc li > .ic { color: #7fe6db; }
.incx li b { display: block; font: 500 16px/1.35 var(--title); color: var(--navy); }
.incx li span { display: block; margin-top: 2px; font-size: 14px; line-height: 1.45; color: var(--body); }
.inc li b { color: #fff; }
.inc li span { color: rgba(255, 255, 255, .72); }
.incx li em { justify-self: end; padding: 5px 11px; border-radius: 999px; background: var(--smoke); color: var(--navy); font: 600 12.5px var(--title); font-style: normal; white-space: nowrap; }
.inc li em { background: #fff; color: var(--green-d); }
.ext li em.opt { background: rgba(34, 179, 168, .12); color: var(--green-d); }
.incx-n { margin-top: 26px; font-size: 15px; color: var(--body); }
.incx-n a { color: var(--teal-700); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

/* how we verify */
.verify { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.verify > div { padding: 20px; border-radius: 20px; background: #fff; border: 1px solid var(--line); }
.verify b { display: block; font: 600 15.5px var(--title); color: var(--navy); margin-bottom: 6px; }
.verify p { margin: 0; font-size: 13.5px; line-height: 1.5; color: var(--muted); }
.verify-key { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 18px; font-size: 13.5px; color: var(--muted); }
.verify-key span { display: inline-flex; gap: 8px; align-items: center; }
.verify-key i { width: 10px; height: 10px; border-radius: 50%; background: #c3c9d6; }
.verify-key i.ok { background: var(--green); }
.verify-key i.mid { background: #f0b44c; }
.hero-proof .vlink { color: inherit; display: inline-flex; align-items: center; gap: 6px; }

/* enquiry form: short version */
.enq-short .fld-opt summary { cursor: pointer; font: 600 14px var(--title); color: var(--navy); }
.enq-short .xray-note { font-size: 12.5px; color: var(--muted); line-height: 1.5; }

/* mobile sticky CTA */
.sticky-cta { display: none; }
@media (max-width: 860px) {
  .sticky-cta { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 60; display: flex; align-items: center; gap: 10px; padding: 6px; border-radius: 999px; background: rgba(255, 255, 255, .96); box-shadow: 0 8px 28px rgba(15, 23, 42, .18); backdrop-filter: blur(8px); transform: translateY(140%); opacity: 0; pointer-events: none; transition: transform .35s var(--ease, ease), opacity .25s; }
  .sticky-cta.show { transform: none; opacity: 1; pointer-events: auto; }
  .sticky-cta .btn { flex: 1; justify-content: center; padding: 10px 14px; font-size: 14px; text-transform: none; letter-spacing: 0; }
  .sticky-cta .sc-2 { flex: none; padding: 0 10px; font: 600 12.5px var(--title); color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }
  body.has-sticky .wa { bottom: 84px !important; transition: bottom .3s; }
  .price-strip { grid-template-columns: repeat(3, 1fr); }
  .ps-n { grid-column: 1 / -1; }
  .incx, .verify { grid-template-columns: 1fr; }
  .incx-card { padding: 26px 22px 14px; }
}
@media (max-width: 480px) {
  .price-strip { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .ps-i { padding: 10px; gap: 0; }
  .ps-i > svg { display: none; }
  .ps-i span { font-size: 11.5px; }
  .ps-i b { font-size: 15px; }
  .ps-i small { font-size: 10.5px; }
  .sticky-cta .sc-2 { display: none; }
  .incx li { grid-template-columns: 22px 1fr; row-gap: 6px; }
  .incx li em { grid-column: 2; justify-self: start; }
}

/* hero headline: one number, highlighted, with footnote */
.hero h1 .hl { position: relative; display: inline-block; margin: 0 .04em; padding-right: .04em; font-size: 1.32em; line-height: .9; background: linear-gradient(100deg, #b5f5ee, #46d3c7); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.hero h1 .hl::after { content: ""; position: absolute; left: 0; right: .1em; bottom: -.16em; height: .26em; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 20' preserveAspectRatio='none'%3E%3Cpath d='M3 14 C 50 4, 120 3, 197 9' fill='none' stroke='%2346d3c7' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / 100% 100%; }
.hero h1 .fn { -webkit-text-fill-color: #b5f5ee; color: #b5f5ee; font-size: .42em; vertical-align: super; line-height: 0; margin-left: .04em; text-decoration: none; }
.hero .kicker { display: flex; align-items: center; gap: 12px; margin: 6px 0 16px; font: 600 clamp(17px, 1.7vw, 22px)/1.25 var(--title); color: #fff; letter-spacing: -.01em; }
.hero .kicker::before { content: ""; flex: none; width: 30px; height: 3px; border-radius: 3px; background: #46d3c7; }
.hero-fn { margin-top: 16px; font-size: 12.5px; line-height: 1.5; opacity: .78; }
.hero-fn a { color: inherit; text-decoration: none; border-bottom: 1px dotted currentColor; }

/* even card layout: every row (name, location, prices, dentists, included, reviews, guarantee) lines up across a row of cards */
@supports (grid-template-rows: subgrid) {
  .cards:has(> .lcard.tc) { row-gap: 0; }
  .lcard.tc { display: grid; grid-row: span 8; grid-template-rows: subgrid; row-gap: 0; padding-bottom: 34px; }
  .lcard.tc .meta { display: grid; grid-row: span 7; grid-template-rows: subgrid; row-gap: 0; }
  .lcard.tc .r1 { align-items: flex-start; padding-bottom: 4px; }
  .lcard.tc .cf { display: grid; grid-row: span 6; grid-template-rows: subgrid; row-gap: 0; align-content: start; margin-top: 8px; }
  .lcard.tc .cf li { padding: 3px 0; }
  .fd-list:has(> .fd-c) { row-gap: 0; }
  .fd-c { display: grid; grid-row: span 6; grid-template-rows: subgrid; row-gap: 0; padding-bottom: 24px; }
  .fd-c .meta { display: grid; grid-row: span 3; grid-template-rows: subgrid; row-gap: 0; align-content: start; }
  .fd-c .r1 { align-items: flex-start; }
  .fd-c .fd-acts { align-self: start; }
}
/* clinics page: lift the "Show map" button above the mobile sticky bar */
body.has-sticky .mobile-map-btn { bottom: 84px !important; transition: bottom .3s; }

/* ---------- languages ---------- */
.lang-menu .cur-btn { gap: 6px; }
.lang-menu .lang-ic { width: 17px; height: 17px; flex: none; }
.lang-menu .cur-list li b { font-weight: 600; }
.mnav-lang { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; padding-top: 18px; border-top: 1px solid rgba(0,0,0,.08); }
.mnav-lang button { min-width: 48px; padding: 9px 12px; border: 1px solid rgba(0,0,0,.14); border-radius: 999px; background: transparent; font-family: inherit; font-size: 14px; font-weight: 600; line-height: 1; color: inherit; cursor: pointer; }
.mnav-lang button.on { background: #0b2a4a; border-color: #0b2a4a; color: #fff; }
@media (max-width: 640px) { .header .tools .lang-menu .cur-btn b { display: none; } }
/* Hero where the trip does not clearly pay off (e.g. visitors from Poland or Czechia) */
.hero h1 .h-alt { display: none; }
body.no-saving-claim .hero h1 .h-save,
body.no-saving-claim .hero .kicker,
body.no-saving-claim .hero-fn,
body.no-saving-claim .counter:has([data-calc=counter]) { display: none; }
body.no-saving-claim .hero h1 .h-alt { display: inline; }
.float-card.is-hidden { display: none !important; }

/* ---------- every language fits: longer words and labels never break the layout ---------- */
body { overflow-x: clip; }
.hero .container > *, .hero-copy, .calc > *, .calc-in, .calc-out, .tchips > *, .faq > *, .ct-row > *, .qty > *, .cta-band > *, .trip > *, .about > * { min-width: 0; }
.fd-c { grid-template-columns: minmax(0, 1fr); }
.fd-pop { max-width: calc(100vw - 32px); }
.hero-tag { max-width: 100%; overflow: hidden; }
/* buttons wrap onto a second line instead of clipping their label */
.btn, .btn.sm, .hero-sm .ctas .btn { height: auto; white-space: normal; text-align: center; line-height: 1.15; }
.btn { min-height: 56px; padding-top: 10px; padding-bottom: 10px; }
.btn.sm { min-height: 44px; padding-top: 7px; padding-bottom: 7px; }
.hero-sm .ctas .btn { min-height: 42px; padding-top: 7px; padding-bottom: 7px; }
.header .tools .btn { white-space: nowrap; flex: none; }
@media (max-width: 480px) { .hero-sm .ctas { flex-direction: column; } .hero-sm .ctas .btn { flex: none; width: 100%; } }
/* other languages: hyphenate long words, tighter header menu */
html:not([lang="en"]) body { -webkit-hyphens: auto; hyphens: auto; overflow-wrap: break-word; }
html:not([lang="en"]) .tchip b, html:not([lang="en"]) .tchip small { overflow-wrap: anywhere; }
html:not([lang="en"]) .header .container { gap: 16px; }
html:not([lang="en"]) .header .nav { margin-left: 4px; gap: 2px; }
html:not([lang="en"]) .header .nav a { padding: 10px 10px; font-size: 14px; letter-spacing: 0; }
@media (min-width: 641px) {
  html:not([lang="en"]) .fd-acts { display: flex; flex-wrap: wrap; }
  html:not([lang="en"]) .fd-acts > * { flex: 1 1 auto; }
}
@media (max-width: 640px) { .fd-acts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* no hyphen breaks inside headings and buttons */
html:not([lang="en"]) h1, html:not([lang="en"]) h2, html:not([lang="en"]) h3, html:not([lang="en"]) h4,
html:not([lang="en"]) .btn, html:not([lang="en"]) button:not(.tchip) { -webkit-hyphens: manual; hyphens: manual; }
/* request tray on phones: count on its own line, buttons below */
@media (max-width: 640px) {
  html:not([lang="en"]) .fd-tray { flex-wrap: wrap; row-gap: 6px; border-radius: 22px; padding: 8px 8px 8px 14px; }
  html:not([lang="en"]) .fd-tray #fd-tray-t { flex: 1 0 100%; }
  html:not([lang="en"]) .fd-tray-c, html:not([lang="en"]) .fd-tray-go { flex: 1 1 auto; white-space: nowrap; }
}
/* clinic category chips keep their full label (the row scrolls sideways) */
.cats > .cat { flex: none; }
/* Polish: the browser's word-break rules split words badly, so wrap whole words */
html[lang="pl"] body { -webkit-hyphens: manual; hyphens: manual; }
/* Header fits every language: main.js adds hd-tight when the menu doesn't fit, then hd-burger (menu button) if it still doesn't */
body.hd-tight .header .container { gap: 14px; }
body.hd-tight .header .nav { margin-left: 2px; gap: 0; }
body.hd-tight .header .nav a { padding: 10px 8px; font-size: 14px; letter-spacing: 0; }
body.hd-tight .header .tools { gap: 8px; }
body.hd-burger .header .nav { display: none; }
body.hd-burger .burger { display: grid; }

/* What's included v2 (Oct 2026): two light cards in the style guide colours – menu-style icon tiles, teal "Free" pills,
   booking partners shown under the line they cover (Skyscanner, Booking.com, Caradvance, Tripadvisor) */
.incx.v2 { align-items: stretch; }
.incx.v2 .incx-card { display: flex; flex-direction: column; padding: 30px 30px 18px; border-radius: 24px; }
.incx.v2 .incx-card.inc { background: #eef8f7; color: var(--navy); box-shadow: inset 0 0 0 1px #cfece8; }
.incx.v2 .incx-card.inc::before { display: none; }
.incx.v2 .incx-card.ext { background: #fff; box-shadow: inset 0 0 0 1px var(--line), var(--shadow-s); }
.incx.v2 .incx-h .fi { width: 52px; height: 52px; border-radius: 16px; }
.incx.v2 .inc .incx-h .fi { background: #04847f; color: #fff; }
.incx.v2 .ext .incx-h .fi { background: #d9f2ef; color: #04847f; }
.incx.v2 .inc .incx-h h3 { color: var(--navy); } .incx.v2 .inc .incx-h p { color: var(--body); }
.incx.v2 li { grid-template-columns: 40px 1fr auto; gap: 14px; padding: 13px 0; border-top: 1px solid var(--line); }
.incx.v2 .inc li { border-color: #cfece8; }
.incx-ic { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: #fff; color: #159c94; box-shadow: 0 0 0 1px var(--line); }
.incx.v2 .ext .incx-ic { background: var(--smoke, #f2f6f7); box-shadow: none; }
.incx-ic .ic { width: 20px; height: 20px; }
.incx.v2 li b { font-weight: 600; font-size: 15.5px; }
.incx.v2 .inc li b { color: var(--navy); } .incx.v2 .inc li span { color: var(--body); }
.incx.v2 li em { font-size: 12px; padding: 5px 11px; }
.incx.v2 .inc li em { background: #d9f2ef; color: #176e69; }
.incx.v2 .ext li em { background: var(--smoke, #f2f6f7); color: var(--slate-600, #4b5b6b); }
.incx.v2 .ext li em.opt { background: var(--sand-50); color: var(--sand-800); box-shadow: inset 0 0 0 1px var(--sand-200); }
.incx.v2 .ext li em.q { background: #d9f2ef; color: #176e69; }
.incx.v2 li span.incx-via { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; padding: 3px 9px 3px 8px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px var(--line); font: 500 11.5px var(--text); color: var(--muted); }
.incx-via img { height: 14px; width: auto; display: block; }
.incx-how { display: flex; gap: 14px; align-items: flex-start; margin-top: auto; padding: 16px; border-radius: 16px; background: #fff; box-shadow: 0 0 0 1px #cfece8; }
.incx.v2 .inc ul { margin-bottom: 18px; }
.incx-how p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--body); } .incx-how b { color: var(--navy); }
.incx-how .incx-ic { flex: none; background: #d9f2ef; box-shadow: none; }
@media (max-width: 700px) { .incx.v2 .incx-card { padding: 22px 18px 12px; } .incx.v2 li { grid-template-columns: 40px 1fr; } .incx.v2 li em { grid-column: 2; justify-self: start; } }
.incx.v2 { align-items: start; }
.incx.v2 .incx-how { margin-top: 4px; margin-bottom: 12px; }
.incx.v2 .incx-ic .ic, .incx.v2 li .incx-ic .ic { color: #159c94; }
/* icon tile is a span: keep it a centred grid (the generic ".incx li span" rule made it a block) */
.incx.v2 li span.incx-ic, .incx-how span.incx-ic { display: grid; place-items: center; margin-top: 0; }

/* "How we're paid": a plain centred line under the two cards, not a box inside one */
.incx-paid { display: flex; align-items: flex-start; justify-content: center; gap: 10px; max-width: 760px; margin: 26px auto 0; text-align: center; font-size: 15px; line-height: 1.55; color: var(--body); }
.incx-paid .ic { flex: none; width: 20px; height: 20px; margin-top: 2px; color: #159c94; }
.incx-paid b { color: var(--navy); } .incx-paid a { color: #04847f; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
#included .abt-head .lead { max-width: 640px; margin-inline: auto; }
.incx-paid { display: block; } .incx-paid .ic { display: inline-block; vertical-align: -4px; margin: 0 4px 0 0; }

/* six-card grids (verify, aftercare): icon tile like the rest of the site */
.verify.vf2 > div { display: grid; grid-template-columns: 40px minmax(0, 1fr); column-gap: 14px; align-items: start; align-content: start; }
.vf-ic { grid-row: span 2; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: #d9f2ef; color: #04847f; }
.vf-ic .ic { width: 19px; height: 19px; }
.verify.vf2 b { margin: 2px 0 4px; }
@media (max-width: 900px) { .verify.vf2 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .verify.vf2 { grid-template-columns: 1fr; } }
