/* BENIDENT concept — rebuilt in the style of DentaLux (Webflow): fluid rem scale, glass cards, soft grey canvas */
:root {
  --bg: #eef1f2;          /* soft-gray canvas (ref #efeff4) */
  --ink: #171c1f;         /* deep-gray text (ref #191b20) */
  --primary: #24464a;     /* deep teal-slate: dark buttons, footer, bullets (ref slate-violet #413d57) */
  --primary-2: #2f5a5f;   /* hover (ref indigo-gray) */
  --primary-30: rgba(36, 70, 74, .3);
  --primary-50: rgba(36, 70, 74, .5);
  --accent: #348079;      /* BENIDENT teal: main CTA (ref warm-beige #cfaa7f) */
  --accent-2: #2a6b65;    /* hover (ref bronze) */
  --accent-soft: #6fb3ab;
  --white: #fff;
  --w15: rgba(255, 255, 255, .15);
  --w20: rgba(255, 255, 255, .2);
  --w35: rgba(255, 255, 255, .35);
  --w50: rgba(255, 255, 255, .5);
  --neutral: #7f8586;
  --graphite: #474b4c;
  --dim: #595959;
  --snow: #f9fafa;
  --platinum: #f3f5f5;
  --steel: #a5abad;
  --display: 'Manrope', Arial, sans-serif;
  --body: 'Open Sans', Arial, sans-serif;
}
/* fluid responsive scale, exactly like the reference */
html { font-size: 1rem; }
@media screen and (min-width: 992px) { html { font-size: 1vw; } }
@media screen and (max-width: 991px) and (min-width: 768px) { html { font-size: 1.2vw; } }
@media screen and (max-width: 479px) { html { font-size: 4.1vw; } }

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; }
body { background: var(--bg); color: var(--ink); font-family: var(--body); font-size: 1rem; line-height: 1.3;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; overflow-x: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
p { margin: 0; }
h1, h2, h3 { margin: 0; font-weight: 600; font-family: var(--display); line-height: 1.2; }
ul { margin: 0; padding: 0; list-style: none; }
figure, blockquote { margin: 0; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
svg { flex: none; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: fixed; left: 1rem; top: -4rem; z-index: 2000; background: var(--primary); color: #fff; padding: .75rem 1.25rem; border-radius: 2rem; transition: top .2s; }
.skip:focus { top: 1rem; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: .5rem; }

.section { padding: 5rem 1.25rem; position: relative; }
.container { z-index: 2; width: 100%; max-width: 75rem; margin: 0 auto; position: relative; }
.overflow-hidden { overflow: hidden; }

/* type */
.heading-4 { font-family: var(--display); font-size: 3rem; line-height: 1.2; font-weight: 600; letter-spacing: -.01em; }
.heading-5 { font-family: var(--body); font-size: 1.5rem; font-weight: 400; line-height: 1.25; }
.heading-6 { font-family: var(--body); font-size: 1.25rem; font-weight: 500; line-height: 1.3; }
.text-size-regular { font-size: .875rem; line-height: 1.3; }
.text-size-medium { font-size: 1rem; line-height: 1.3; }
.text-weight-medium { font-weight: 500; }
.text-color-neutral_gray { color: var(--neutral); }
.text-color-graphite { color: var(--graphite); }
.text-align-center { text-align: center; }
.opacity50 { opacity: .5; }
.text__wrap.max-width-19 { max-width: 19rem; } .text__wrap.max-width-22 { max-width: 22rem; }
.text__wrap.max-width-25 { max-width: 25rem; } .text__wrap.max-width-28 { max-width: 28rem; } .text__wrap.max-width-38 { max-width: 38rem; }

/* buttons */
.button { transition: all .3s; }
.button.is-text { border-top: .125rem solid transparent; border-bottom: .125rem solid transparent; color: var(--neutral); font-size: 1rem; display: flex; align-items: center; }
.button.is-text:hover { color: var(--dim); }
.button.is-large { display: inline-flex; gap: .75rem; justify-content: center; align-items: center; border-radius: 5rem; color: #fff; font-size: 1rem;
  line-height: 1.5; letter-spacing: -.00875rem; padding: .625rem 1.5rem; position: relative; overflow: hidden; white-space: nowrap; }
.button.is-large.accent { background: var(--accent); }
.button.is-large.accent:hover { background: var(--accent-2); }
.button.is-large.gray { background: var(--primary); }
.button.is-large.gray:hover { background: var(--primary-2); }
.button__icon-arrow { width: .75rem; height: .75rem; transition: transform .3s; }
.button.is-large:hover .button__icon-arrow { transform: translate(.125rem, -.125rem); }
.button.is-icon { display: flex; justify-content: center; align-items: center; width: 3.875rem; height: 3.75rem; border-radius: 1rem; background: #fff; color: var(--accent); flex: none; transition: all .3s; }
.button.is-icon svg { width: 1rem; height: 1rem; }
.button-wrap { display: flex; justify-content: center; }
.swiper-nav__arrow { cursor: pointer; transition: all .2s; display: flex; color: var(--primary); }
.swiper-nav__arrow svg { width: 1.5rem; height: 1.5rem; }
.swiper-nav__arrow:hover { transform: translateX(.2rem); }
.g-icon { width: 1.5rem; height: 1.5rem; }

/* ---------- header ---------- */
.header { position: fixed; inset: 0 0 auto; z-index: 999; }
.header__bar { background: #fff; padding: 1.5rem 1.25rem; position: relative; z-index: 2; }
.header__content { display: flex; align-items: stretch; }
.logo { display: inline-grid; justify-items: center; align-content: center; color: var(--accent); width: 5.5rem; flex: none; line-height: 1; }
.logo__rule { width: 100%; height: 1px; background: currentColor; opacity: .55; margin-bottom: .3rem; }
.logo__name { font-family: var(--display); font-weight: 600; font-size: 1.12rem; letter-spacing: .06em; }
.logo__sub { font-size: .5rem; letter-spacing: .32em; text-transform: uppercase; margin-top: .3rem; color: var(--neutral); white-space: nowrap; }
.logo--light { color: #fff; } .logo--light .logo__sub { color: rgba(255,255,255,.7); }
.header__nav { display: flex; justify-content: space-between; align-items: stretch; gap: .9rem; flex: 1; max-width: 33rem; margin: 0 auto 0 1.5rem; padding-right: 1.5rem; }
html[lang=sq] .header__nav { max-width: none; }
html[lang=sq] .header__nav .button.is-text { font-size: .9rem; }
.header__actions { display: flex; align-items: center; gap: .75rem; }
.header__contact { display: flex; gap: .75rem; }
.header__contact-link { border: 1px solid var(--bg); border-radius: 50%; position: relative; width: 2.75rem; height: 2.75rem; display: flex; align-items: center; justify-content: center; color: var(--primary); }
.header__contact-icon { width: 1.25rem; height: 1.25rem; }
.header__contact-popup { opacity: 0; padding-top: 2.5rem; transition: opacity .3s; position: absolute; top: 100%; left: 0; pointer-events: none; visibility: hidden; }
.header__contact-link:hover .header__contact-popup, .header__contact-link:focus-within .header__contact-popup { opacity: 1; pointer-events: auto; visibility: visible; }
.header__contact-popup-text { display: flex; flex-direction: column; gap: .375rem; border-radius: 1rem; background: #fff; white-space: nowrap; padding: 1rem; font-size: .875rem; box-shadow: 0 .5rem 2rem rgba(23, 28, 31, .06); }
.header__contact-popup-text a:hover { color: var(--accent); }
.header__contact-popup-wrap { border: 1px solid #fff; border-radius: 1.5rem; background: var(--w20); -webkit-backdrop-filter: blur(.75rem); backdrop-filter: blur(.75rem); padding: .5rem; }
.lang { display: flex; align-items: center; border: 1px solid var(--bg); border-radius: 2rem; height: 2.75rem; padding: .25rem; gap: .125rem; }
.lang__btn { height: 100%; padding: 0 .55rem; border-radius: 2rem; font-size: .8125rem; font-weight: 600; color: var(--neutral); transition: all .3s; }
.lang__btn[aria-pressed="true"] { background: var(--primary); color: #fff; }
.lang__btn:hover:not([aria-pressed="true"]) { color: var(--ink); }
.burger { display: none; }
.header__menu { display: none; }

/* ---------- hero ---------- */
.section.mod--hero { display: flex; flex-direction: column; justify-content: center; align-items: center; padding-top: 13.8125rem; padding-bottom: 8.1875rem; }
.hero__illustr-wrap { position: absolute; top: -7.9375rem; right: 10.6875rem; width: 52.6875rem; height: 50rem; display: flex; justify-content: center; align-items: center; cursor: none; touch-action: pan-y; z-index: 1; }
.hero__canvas { width: 100%; height: 100%; display: block; transform: scale(.9); }
.hero__illustr-cursor { position: absolute; left: 50%; top: 50%; width: 10rem; height: 10rem; margin: -5rem 0 0 -5rem; display: flex; justify-content: center; align-items: center; opacity: 0; pointer-events: none; transition: opacity .5s; z-index: 5; will-change: transform; }
.hero__illustr-wrap:hover .hero__illustr-cursor { opacity: 1; }
.hero__illustr-cursor-text { width: 7.5rem; height: 7.5rem; animation: rot 20s linear infinite; overflow: visible; }
.hero__illustr-cursor-text text { font-family: var(--body); font-size: 8.4px; letter-spacing: 1.9px; fill: var(--primary); font-weight: 600; }
.hero__illustr-cursor-dot { position: absolute; width: .5rem; height: .5rem; border-radius: 50%; background: var(--accent); }
@keyframes rot { to { transform: rotate(360deg); } }
.hero__illustr-icon { position: absolute; top: 1.5rem; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: .2rem; color: var(--neutral); font-family: Inter, Arial, sans-serif; font-size: 1.05rem; pointer-events: none; }
.hero__illustr-icon svg { width: 1.6rem; height: .75rem; }
.hero__content-wrap { position: relative; z-index: 2; pointer-events: none; width: 100%; }
.hero__contact { position: absolute; top: 7.25rem; left: 0; display: flex; flex-direction: column; gap: .25rem; border: 1px solid #fff; border-radius: 1.5rem; background: var(--w35); padding: .25rem; pointer-events: auto; }
.hero__contact-link { width: 2.5rem; height: 2.5rem; border: 1px solid #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: background .2s; color: var(--primary); }
.hero__contact-link svg { width: 1.2rem; height: 1.2rem; }
.hero__contact-link:hover { background: rgba(173, 173, 173, .16); }
.hero__swiper-wrap { width: 29.25rem; margin: 0 0 11.9375rem auto; padding: 1.25rem; border: 1px solid #fff; border-radius: 1.5rem; background: var(--w20); -webkit-backdrop-filter: blur(.7875rem); backdrop-filter: blur(.7875rem); pointer-events: auto; }
.hero__swiper { overflow: hidden; margin: 0 -1.25rem; padding: 0 1.25rem; }
.hero__track { display: flex; gap: 2rem; will-change: transform; }
.hero__slide { flex: none; width: 100%; display: flex; justify-content: space-between; gap: 1rem; }
.hero__swiper-img { width: 7.6875rem; height: 6rem; object-fit: cover; border-radius: 1rem; flex: none; }
.hero__swiper-text { display: flex; flex-direction: column; gap: .5rem; width: 17.5625rem; }
.hero__swiper-text b { font-weight: 600; color: var(--graphite); }
.hero__pagination { margin-top: 1.25rem; display: flex; justify-content: space-between; align-items: center; }
.hero__swiper-num { font-family: Inter, Arial, sans-serif; font-size: 1rem; display: flex; color: var(--primary); }
.hero__swiper-nav { display: flex; gap: 1.5rem; justify-content: space-between; align-items: center; width: 17.5625rem; }
.hero__pagination-bullet { border-radius: 1rem; background: var(--primary-30); width: 100%; height: .125rem; }
.hero__pagination-bullet-active { border-radius: 1rem; background: var(--primary); width: 33.33%; height: 100%; transition: width 1s; }
.hero__heading-wrap { position: relative; z-index: 2; width: 100%; pointer-events: none; }
.hero__title { font-family: var(--display); font-size: 12.5rem; line-height: 1.2; font-weight: 600; letter-spacing: -.02em; margin-left: -.06em; white-space: nowrap; }
.hero__word { display: inline-block; }
.hero__text-wrap { max-width: 35rem; pointer-events: auto; }

/* ---------- section heading ---------- */
.heading__wrap { margin-bottom: 4rem; display: flex; justify-content: space-between; align-items: center; width: 100%; gap: 2rem; }
.section__content-wrap, .services__content-wrap { display: flex; flex-direction: column; align-items: center; }

/* ---------- treatments grid ---------- */
.services__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 1rem; width: 100%; margin-bottom: 2rem; }
.services__item { grid-column: span 2; border-radius: 1.25rem; min-height: 29.25rem; position: relative; overflow: hidden; display: flex; background: #dfe5e6; }
.services__item:nth-child(1), .services__item:nth-child(2) { grid-column: span 3; }
.services__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2,.7,.2,1); }
.services__item:hover .services__img { transform: scale(1.03); }
.services__link { position: absolute; left: .5rem; right: .5rem; bottom: .5rem; display: flex; flex-direction: column; padding: 1.125rem 1.5rem 0; border: 1px solid #fff; border-radius: 1rem;
  background: var(--w15); -webkit-backdrop-filter: blur(.75rem); backdrop-filter: blur(.75rem); color: #fff; overflow: hidden; }
.services__item::after { content: ''; position: absolute; inset: 55% 0 0; background: linear-gradient(to top, rgba(10, 22, 24, .45), transparent); pointer-events: none; }
.services__link { z-index: 2; }
.services__heading-wrap { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.services__heading-wrap .heading-5 { text-shadow: 0 1px 12px rgba(0,0,0,.18); }
.services__heading-wrap .button.is-icon { margin: -.875rem -1.25rem -.875rem 0; }
.services__text-anim { padding-bottom: 1rem; display: block; }
.services__text-wrap { display: block; margin-top: 1.25rem; margin-bottom: -7rem; transition: all .5s; }
@media (min-width: 768px) {
  .services__item:hover .services__text-wrap, .services__link:focus-visible .services__text-wrap { margin-bottom: 0; }
  .services__item:hover .button.is-icon { background: var(--primary); color: #fff; }
}

/* ---------- glass cards (benefits / tech) ---------- */
.cards { display: flex; gap: 1rem; width: 100%; margin-bottom: 2rem; }
.card { flex: 1; border: 1px solid #fff; border-radius: 1.5rem; background: var(--w15); padding: .5rem; }
.card__wrap { height: 100%; border: 1px solid #fff; background: var(--w35); border-radius: 1.375rem; padding: 1rem; }
.icon-box { width: 4rem; height: 4rem; border-radius: 1rem; background: #fff; display: flex; align-items: center; justify-content: center; color: var(--accent); flex: none; }
.icon-box svg { width: 2rem; height: 2rem; }
.benefits__text-wrap { margin-top: .75rem; display: flex; flex-direction: column; gap: .5rem; }
.cards--tech { display: grid; grid-template-columns: 1fr 1fr; margin-bottom: 0; }
.cards--tech .card__wrap { display: flex; gap: 1rem; }
.cards--tech .benefits__text-wrap { margin-top: .6rem; }
.snap-dots, .drag-dots { display: none; }

/* ---------- clinic (specialists mechanic) ---------- */
.clinic__wrap { display: flex; align-items: center; width: 100%; position: relative; }
.clinic__photos { width: 53.6875rem; border-radius: 2rem; overflow: hidden; flex: none; position: relative; }
.clinic__photos-track { display: flex; gap: 2rem; will-change: transform; }
.clinic__photo { flex: none; width: 100%; }
.clinic__photo img { width: 100%; height: 37.5rem; object-fit: cover; border-radius: 2rem; }
.clinic__card { position: absolute; right: 0; z-index: 2; width: 33.25rem; padding: 1.5rem; border: 1px solid #fff; border-radius: 1.5rem; background: var(--w50); -webkit-backdrop-filter: blur(.75rem); backdrop-filter: blur(.75rem); }
.clinic__card-view { overflow: hidden; margin: 0 -1.5rem; padding: 0 1.5rem; }
.clinic__card-track { display: flex; gap: 2rem; will-change: transform; }
.clinic__slide { flex: none; width: 100%; display: flex; gap: 1.5rem; align-items: flex-start; }
.clinic__thumb { width: 7.5rem; height: 7.5rem; border-radius: 1.25rem; object-fit: cover; flex: none; }
.clinic__text { display: flex; flex-direction: column; align-items: flex-start; max-width: 21.25rem; }
.clinic__text .text-size-regular { margin: .75rem 0 1.75rem; }
.tag { padding: .5rem .625rem; border-radius: 1.5rem; background: var(--primary-30); color: #fff; font-size: .875rem; font-weight: 500; }
.clinic__pagination { margin-top: 1.25rem; display: flex; justify-content: space-between; align-items: center; }
.bullets { display: flex; gap: .1875rem; width: 100%; max-width: 13.6875rem; }
.bullet { flex: 1; height: 1rem; display: flex; align-items: center; }
.bullet span { display: block; width: 100%; height: .125rem; border-radius: 1rem; background: var(--primary-30); position: relative; overflow: hidden; }
.bullet span::after { content: ''; position: absolute; inset: 0; width: 0; background: var(--primary); border-radius: 1rem; }
.bullet.is-active span::after { width: 100%; transition: width 5.8s linear; }
.clinic__btn { position: absolute; right: 0; bottom: 4rem; }

/* ---------- about (features) ---------- */
.features__content { display: flex; gap: 1rem; width: 100%; margin-bottom: 2rem; }
.features__img-wrap { border-radius: 2rem; flex: none; position: relative; overflow: hidden; width: 37rem; }
.features__img { width: 100%; height: 100%; min-height: 38rem; object-fit: cover; }
.features__text-wrap.is1 { position: absolute; left: .5rem; right: .5rem; bottom: .5rem; padding: .5rem; border: 1px solid #fff; border-radius: 1.5rem; background: var(--w20); -webkit-backdrop-filter: blur(.75rem); backdrop-filter: blur(.75rem); }
.features__text.is1 { display: flex; flex-direction: column; gap: .625rem; padding: 1rem; border: 1px solid #fff; border-radius: 1rem; background: rgba(30, 70, 72, .18); -webkit-backdrop-filter: blur(.75rem); backdrop-filter: blur(.75rem); color: #fff; text-shadow: 0 1px 10px rgba(0, 40, 40, .3); }
.features__img-wrap::after { content: ''; position: absolute; inset: 40% 0 0; background: linear-gradient(to top, rgba(18, 52, 54, .62), transparent); pointer-events: none; }
.features__text-wrap.is1 { z-index: 2; }
.features__text-wrap.is2 { flex: 1; display: flex; flex-direction: column; gap: 1rem; padding: .75rem; border: 1px solid #fff; border-radius: 1.5rem; background: var(--w20); }
.features__icon { display: flex; align-items: center; gap: 1rem; }
.features__list { display: flex; flex-direction: column; gap: 1rem; }
.features__text.is2 { display: flex; align-items: center; gap: .625rem; padding: 1rem; border-radius: 1rem; background: var(--snow); min-height: 4.1rem; }
.features__text.is2 svg { width: 1.5rem; height: 1.5rem; color: var(--accent-soft); }

/* ---------- gallery ---------- */
.gallery { display: grid; grid-template-columns: repeat(12, 1fr); gap: 1rem; width: 100%; }
.gallery__item { grid-column: span 3; border-radius: 1.5rem; overflow: hidden; height: 19.5rem; background: #dfe5e6; }
.gallery__item--wide { grid-column: span 4; }
.gallery__img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2,.7,.2,1); }
.gallery__item:hover .gallery__img { transform: scale(1.04); }

/* ---------- drag sliders (feed / reviews) ---------- */
.drag { width: 100%; position: relative; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.drag:focus-visible { outline-offset: 6px; }
.drag__track { display: flex; gap: 1rem; will-change: transform; }
.drag img { -webkit-user-drag: none; pointer-events: none; }
.feed__card { flex: none; width: calc((100% - 3rem) / 4); border-radius: 1.5rem; overflow: hidden; background: #fff; height: 26.25rem; }
.feed__img { width: 100%; height: 100%; object-fit: cover; }
.feed__card--split { background: linear-gradient(90deg, #fff 50%, #000 50%); }
.feed__card--split .feed__img { object-fit: contain; }
.drag--reviews { margin-bottom: 2rem; }
.review { flex: none; width: calc((100% - 2rem) / 3); border: 1px solid #fff; border-radius: 1.5rem; background: var(--w50); padding: 1.5rem; display: flex; flex-direction: column; }
.reviews__ava-wrap { margin-bottom: 1.25rem; display: flex; align-items: center; gap: .75rem; }
.reviews__ava { width: 4rem; height: 4rem; border-radius: 50%; background: var(--accent); color: #fff; display: flex; align-items: center; justify-content: center; font-family: var(--display); font-weight: 600; font-size: 1.1rem; flex: none; }
.reviews__text-wrap { display: flex; flex-direction: column; gap: .25rem; }
.review__quote { line-height: 1.45; }
.review--rating { justify-content: center; gap: .5rem; background: #fff; }
.review__score { display: flex; align-items: baseline; gap: 1rem; margin-bottom: .5rem; }
.review__num { font-family: var(--display); font-size: 4rem; font-weight: 600; line-height: 1; color: var(--primary); }
.review__stars { color: #f2b01e; font-size: 1.5rem; letter-spacing: .1em; }
.review--cta { gap: .75rem; justify-content: center; }
.review__link { color: var(--accent); gap: .5rem; margin-top: .25rem; font-weight: 600; }
.review__link:hover { color: var(--accent-2); }
.custom-cursor { position: fixed; top: -2rem; left: -1.75rem; width: 3.5rem; height: 4rem; border-radius: 1.5rem; border: 1px solid var(--primary);
  background: linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.03)); box-shadow: 0 .25rem 1.5rem -.0625rem rgba(0,0,0,.08);
  -webkit-backdrop-filter: blur(.375rem); backdrop-filter: blur(.375rem); pointer-events: none; z-index: 9999; opacity: 0; transition: opacity .2s ease; }
.custom-cursor::before, .custom-cursor::after { content: ''; position: absolute; top: 50%; width: .4rem; height: .4rem; border: solid var(--primary); border-width: 0 0 1.5px 1.5px; }
.custom-cursor::before { left: .7rem; transform: translateY(-50%) rotate(45deg); }
.custom-cursor::after { right: .7rem; transform: translateY(-50%) rotate(-135deg); }
@media (hover: hover) and (min-width: 768px) { [data-hover=cursor]:hover { cursor: none; } }

/* ---------- CTA / coming home ---------- */
.cta__content-wrap { position: relative; border-radius: 2rem; overflow: hidden; color: #fff; display: flex; justify-content: space-between; align-items: flex-end; min-height: 28.3125rem; padding: 2rem; isolation: isolate; }
.cta__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.cta__content-wrap::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(100deg, rgba(14, 38, 41, .82) 0%, rgba(14, 38, 41, .55) 45%, rgba(14, 38, 41, .28) 100%); }
.cta__heading-wrap { max-width: 43rem; }
.cta__text-wrap { margin-bottom: 1rem; max-width: 21.5625rem; }
.cta__heading-wrap .heading-4 { font-size: 3rem; }
.cta__form { width: 23.375rem; margin: auto 0; padding: 1.5rem 1rem 1rem; border-radius: 1.5rem; background: var(--w20); -webkit-backdrop-filter: blur(.75rem); backdrop-filter: blur(.75rem); }
.cta__form-line { width: 2.125rem; height: 1px; background: #fff; margin: 0 auto 1.5rem; }
.form__block { border-radius: 1rem; background: var(--w20); padding: 1.5rem 1rem; }
.text__field-wrap { margin: 1rem 0; display: flex; flex-direction: column; gap: .5rem; }
.text__field { height: 2.75rem; border: 1px solid #fff; border-radius: 1.5rem; background: var(--w20); color: #fff; font: inherit; font-size: .875rem; padding: 0 1rem; width: 100%; outline: 0; transition: border-color .2s; }
.text__field::placeholder { color: #fff; transition: opacity .2s; }
.text__field:focus::placeholder { opacity: 0; }
.text__field:focus { border-color: var(--accent-soft); }
.form__submit { width: 100%; }

/* ---------- FAQ ---------- */
.faq { width: 100%; display: flex; flex-direction: column; gap: 1rem; }
.faq__item { background: var(--w50); border-radius: 1rem; transition: background .3s; }
.faq__item:hover { background: var(--platinum); }
.faq__item.is-open { background: #fff; }
.faq__toggle { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; padding: 2rem 1.5rem; text-align: left; font-size: 1.5rem; font-weight: 400; line-height: 1.25; border-radius: 1rem; }
.faq__drop-btn { width: 3.5rem; height: 3.5rem; padding: .25rem; border-radius: 50%; background: var(--w50); transition: all .3s; display: flex; flex: none; }
.faq__ellipse { width: 100%; height: 100%; border-radius: 50%; background: var(--platinum); display: flex; justify-content: center; align-items: center; transition: all .3s; position: relative; }
.drop__line { position: absolute; background: var(--dim); border-radius: 1rem; transition: all .3s; }
.drop__line.is1 { width: 1.125rem; height: .125rem; } .drop__line.is2 { width: .125rem; height: 1.125rem; }
.faq__item.is-open .faq__drop-btn { background: var(--primary-50); }
.faq__item.is-open .faq__ellipse { background: var(--primary); }
.faq__item.is-open .drop__line { background: #fff; transform: rotate(45deg); }
.faq__panel { height: 0; overflow: hidden; transition: height .5s; }
.faq__item.is-open .faq__panel { margin-top: -1.125rem; }
.faq__text-wrap { max-width: 46rem; padding: 0 1.5rem 2rem; }

/* ---------- footer ---------- */
.footer { padding-top: 5rem; }
.section.mod--footer { background: var(--primary); padding-top: 4.5rem; padding-bottom: 2rem; color: #fff; }
.footer__content.is1 { margin-bottom: 2rem; display: flex; gap: 3.5rem; align-items: flex-start; }
.footer__col.is1 { position: relative; display: flex; flex-direction: column; gap: 1.6rem; }
.footer__social-wrap { display: flex; gap: .5rem; }
.footer__social { width: 2.25rem; height: 2.25rem; border-radius: 50%; border: 1px solid var(--w35); background: rgba(212,212,212,.16); display: flex; align-items: center; justify-content: center; transition: background .2s; }
.footer__social svg { width: 1.1rem; height: 1.1rem; }
.footer__social:hover { background: rgba(255,255,255,.28); }
.footer__col.is2 { display: flex; flex-direction: column; align-items: flex-start; gap: 1.1875rem; padding-top: .59375rem; }
.footer__text-link { color: #fff; font-size: 1rem; transition: color .3s; }
.footer__text-link:hover { color: var(--steel); }
.footer__col.is3 { display: flex; flex-direction: column; gap: 1.5rem; padding-top: .4375rem; max-width: 15rem; }
.footer__text-wrap { display: flex; flex-direction: column; gap: .375rem; }
.footer__text-wrap a:hover { color: var(--steel); }
.icon-22 { width: 1.375rem; height: 1.375rem; margin-bottom: .125rem; }
.footer__col.is4 { margin-left: auto; border-radius: 1rem; overflow: hidden; width: 100%; max-width: 40.4rem; height: 23rem; position: relative; display: block; }
.footer__map-img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2,.7,.2,1); }
.footer__col.is4:hover .footer__map-img { transform: scale(1.03); }
.footer__map-pill { position: absolute; left: 1rem; bottom: 1rem; display: inline-flex; align-items: center; gap: .6rem; padding: .7rem 1.1rem; border-radius: 3rem; border: 1px solid #fff; background: var(--w20); -webkit-backdrop-filter: blur(.75rem); backdrop-filter: blur(.75rem); color: #fff; font-size: .95rem; }
.footer__map-pill svg { width: 1.1rem; height: 1.1rem; }
.footer__map-pill .button__icon-arrow { width: .75rem; height: .75rem; }
.footer__content.is2 { display: flex; justify-content: space-between; gap: 1rem; }
.footer__text-wrap.is2 { flex-direction: row; gap: 1rem; flex-wrap: wrap; }

/* ---------- toast ---------- */
.toast { position: fixed; left: 1.25rem; bottom: 1.25rem; z-index: 1500; max-width: 24rem; display: flex; gap: .75rem; align-items: flex-start; padding: .9rem 1rem .9rem 1.1rem; border-radius: 1rem;
  background: rgba(255,255,255,.82); -webkit-backdrop-filter: blur(.75rem); backdrop-filter: blur(.75rem); border: 1px solid #fff; box-shadow: 0 .75rem 2.5rem rgba(23,28,31,.12); font-size: .875rem; line-height: 1.4; color: var(--graphite);
  transform: translateY(1rem); opacity: 0; transition: opacity .5s, transform .5s; }
.toast.is-in { transform: none; opacity: 1; }
.toast__close { width: 1.75rem; height: 1.75rem; border-radius: 50%; background: var(--platinum); display: flex; align-items: center; justify-content: center; flex: none; transform: rotate(45deg); }
.toast__close svg { width: .9rem; height: .9rem; }
.toast[hidden], .header.is-open ~ .toast { display: none; }

/* hide-before-reveal only when JS runs */
.js [data-reveal] { opacity: 0; }
.js [data-reveal-grow] { opacity: 0; }
.js .hero__title .hero__word { visibility: hidden; }
@media (prefers-reduced-motion: reduce) {
  .js [data-reveal], .js [data-reveal-grow] { opacity: 1; }
  .js .hero__title .hero__word { visibility: visible; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* ---------- tablet ---------- */
@media (max-width: 991px) {
  .header__nav { display: none; }
  .header__actions { margin-left: auto; }
  .burger { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 4px; width: 44px; height: 44px; position: relative; margin-left: 12px; flex: none; }
  .burger span { width: 18px; height: 2px; border-radius: 1rem; background: var(--ink); transition: transform .3s, opacity .3s; }
  .header.is-open .burger span:nth-child(1) { opacity: 0; }
  .header.is-open .burger span:nth-child(2) { transform: translateY(3px) rotate(45deg); }
  .header.is-open .burger span:nth-child(3) { transform: translateY(-3px) rotate(-45deg); }
  .header__menu { display: flex; flex-direction: column; justify-content: space-between; position: fixed; inset: 0; z-index: 1; background: var(--bg); padding: 96px 20px 32px; transform: translateX(-100%); transition: transform .7s ease; visibility: hidden; overflow-y: auto; }
  .header.is-open .header__menu { transform: none; visibility: visible; }
  .header__menu-nav { display: flex; flex-direction: column; gap: 14px; }
  .header__menu-nav .button.is-text { color: var(--graphite); justify-content: space-between; font-size: 22px; font-family: var(--display); font-weight: 500; padding: 6px 0; border-bottom: 1px solid #fff; }
  .header__menu-nav svg { width: 24px; height: 24px; }
  .header__menu-foot { display: flex; flex-direction: column; gap: 20px; align-items: stretch; margin-top: 28px; }
  .header__menu-foot .lang { align-self: flex-start; border-color: #fff; height: 44px; padding: 4px; }
  .header__menu-foot .lang__btn { font-size: 13px; padding: 0 9px; }
  .header__menu-foot .button.is-large { font-size: 16px; padding: 10px 24px; gap: 12px; }
  .header__menu-foot .button__icon-arrow { width: 12px; height: 12px; }
  .header__menu-info { color: var(--graphite); font-size: 15px; line-height: 1.5; }
}

/* ---------- mobile (reference breakpoint 767) ---------- */
@media (max-width: 767px) {
  .section { padding-top: 1.5rem; padding-bottom: 1.5rem; }
  .heading-4, .cta__heading-wrap .heading-4 { font-size: 1.75rem; }
  .heading-5 { font-size: 1.25rem; }
  .heading-6 { font-size: 1.15rem; }
  .text-size-regular { font-size: .875rem; }
  .header__bar { padding: .5rem 1.25rem; background: var(--w20); -webkit-backdrop-filter: blur(.75rem); backdrop-filter: blur(.75rem); border-top: 1px solid #fff; border-bottom: 1px solid #fff; }
  .header.is-scrolled .header__bar, .header.is-open .header__bar { background: rgba(255,255,255,.82); }
  .header__content { justify-content: space-between; align-items: center; }
  .header__actions { display: none; }
  .logo { width: 4.6rem; } .logo__name { font-size: .95rem; } .logo__sub { font-size: .42rem; }
  .section.mod--hero { padding-top: 22.5rem; padding-bottom: 1.5rem; }
  .hero__illustr-wrap { width: 100%; height: 20.55rem; top: -18.75rem; right: 0; }
  .hero__canvas { transform: none; }
  .hero__illustr-cursor { display: none; }
  .hero__illustr-icon { top: .25rem; }
  .hero__content-wrap { display: flex; flex-direction: column; position: static; }
  .hero__contact { top: -15rem; left: auto; right: 0; z-index: 3; }
  .hero__contact-link { width: 2.25rem; height: 2.25rem; }
  .hero__swiper-wrap { order: 1; width: 100%; margin: 0; padding: 1.5rem; }
  .hero__swiper { margin: 0 -1.5rem; padding: 0 1.5rem; }
  .hero__slide { gap: 1.5rem; }
  .hero__swiper-img { width: 6rem; height: 6rem; }
  .hero__swiper-text { width: 100%; gap: .75rem; }
  .hero__swiper-text .heading-6 { font-size: 1rem; }
  .hero__pagination { margin-top: 2rem; gap: 1rem; }
  .hero__swiper-nav { flex: 1; width: auto; }
  .hero__swiper-num { font-size: .8125rem; }
  .hero__heading-wrap { order: -1; margin-bottom: 1.5rem; }
  .section.mod--hero .container { display: flex; flex-direction: column; }
  .hero__title { font-size: 4.1rem; }
  .hero__text-wrap { margin-top: .25rem; }

  .heading__wrap { flex-direction: column; align-items: stretch; gap: .5rem; margin-bottom: 2rem; }
  .services__grid { grid-template-columns: 1fr 1fr; }
  .services__item, .services__item:nth-child(1), .services__item:nth-child(2) { grid-column: span 1; min-height: 11.625rem; border-radius: .5rem; }
  .services__item:nth-child(3) { grid-column: span 2; }
  .services__link { border-radius: .375rem; padding: .25rem .25rem .25rem .5rem; left: .35rem; right: .35rem; bottom: .35rem; }
  .services__heading-wrap .heading-5 { font-size: .875rem; }
  .services__heading-wrap .button.is-icon { width: 2rem; height: 2rem; border-radius: .5rem; margin: 0; }
  .services__heading-wrap .button.is-icon svg { width: .6rem; height: .6rem; }
  .services__text-anim { display: none; }

  .section__content-wrap { margin: 0 -1.25rem; padding: 0 1.25rem; overflow: hidden; }
  [data-snap] { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 1rem; margin-bottom: 1.5rem; scrollbar-width: none; overscroll-behavior-x: contain; }
  [data-snap]::-webkit-scrollbar { display: none; }
  [data-snap] > * { scroll-snap-align: start; flex: none; width: 88%; }
  .cards--tech { display: flex; }
  .cards--tech .card__wrap { flex-direction: column; }
  .snap-dots, .drag-dots { display: flex; justify-content: center; gap: .1875rem; width: 100%; max-width: 18.875rem; margin: 0 auto 1.5rem; }
  .snap-dots i, .drag-dots i { flex: 1; height: .125rem; border-radius: 1rem; background: var(--primary-30); transition: background .3s; }
  .snap-dots i.on, .drag-dots i.on { background: var(--primary); }

  .clinic__wrap { flex-direction: column; }
  .clinic__photos { width: 100%; }
  .clinic__photo img { height: 22rem; }
  .clinic__card { position: relative; width: 100%; margin-top: -5.375rem; margin-bottom: 2rem; }
  .clinic__thumb { width: 5.625rem; height: 5.625rem; }
  .clinic__slide { gap: 1.25rem; }
  .clinic__text .text-size-regular { margin-bottom: 1.25rem; }
  .bullets { max-width: none; }
  .clinic__pagination { margin-top: 1.5rem; }
  .clinic__btn { position: relative; bottom: 0; }

  .features__content { flex-direction: column; }
  .features__img-wrap { width: 100%; margin-bottom: 1rem; }
  .features__img { min-height: 0; height: 31.25rem; }
  .features__text-wrap.is2 { gap: .5rem; }
  .features__list { gap: .5rem; }
  .features__text.is2 .text-size-medium { font-size: .875rem; }

  .gallery { display: flex; }
  .gallery__item, .gallery__item--wide { height: 22rem; }

  .feed__card { width: calc((100% - 1rem) / 2); height: 15.5rem; }
  .review { width: 88%; }
  .drag--reviews { margin-bottom: 1.5rem; }

  .cta__content-wrap { flex-direction: column; align-items: flex-start; min-height: 0; padding: 1rem; }
  .cta__heading-wrap { margin: 8rem 0 2rem; }
  .cta__form { width: 100%; margin: 0; }

  .faq__toggle { padding: .75rem 1rem .75rem 1.5rem; font-size: 1rem; }
  .faq__item.is-open .faq__panel { margin-top: .25rem; }
  .faq__text-wrap { padding: 0 3rem 1.5rem 1.5rem; }
  .faq__text-wrap .text-size-medium { font-size: .875rem; }

  .footer { padding-top: 1.5rem; }
  .section.mod--footer { padding-top: 1.5rem; padding-bottom: 6rem; }
  .footer__content.is1 { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem 2rem; }
  .footer__col.is1 { grid-column: span 2; flex-direction: row; justify-content: space-between; align-items: center; }
  .footer__col.is2 { padding-top: 0; }
  .footer__col.is3 { padding-top: 0; }
  .footer__col.is4 { grid-column: span 2; height: 14rem; max-width: none; }
  .footer__content.is2 { flex-direction: column; }
  .footer__text-wrap.is2 { gap: .5rem 1rem; }
  .toast { left: .75rem; right: .75rem; bottom: .75rem; max-width: none; }
}