/* Butterfly: "wings". Porcelain paper, plum ink, the logo's orchid, lilac and a little saffron from the salon's curtains.
   Prata for headings (a fashion Didone), Ysabeau Infant for text, Noto Serif/Sans Georgian for Georgian. Cards are cut
   like wings: the outer top corner wide, mirrored on the two sides of the page. Motion rules: the base style is the
   final state; hidden start states exist only under html.js:not(.no-hide) and prefers-reduced-motion: no-preference. */

@font-face { font-family: "Prata"; src: url("/fonts/prata.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+0400-045F, U+0490-0491, U+2000-206F, U+2116, U+2122, U+2190-2192, U+2212; }
@font-face { font-family: "Ysabeau"; src: url("/fonts/ysabeau.woff2") format("woff2"); font-weight: 400 700; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+0400-045F, U+0490-0491, U+2000-206F, U+2116, U+2122, U+2190-2192, U+2212; }
@font-face { font-family: "Noto Sans Georgian"; src: url("/fonts/noto-sans-georgian.woff2") format("woff2"); font-weight: 400 600; font-display: swap; unicode-range: U+10A0-10FF, U+1C90-1CBF, U+2D00-2D2F, U+20BE; }
@font-face { font-family: "Noto Serif Georgian"; src: url("/fonts/noto-serif-georgian.woff2") format("woff2"); font-weight: 400 600; font-display: swap; unicode-range: U+10A0-10FF, U+1C90-1CBF, U+2D00-2D2F; }
@font-face { font-family: "Lari"; src: url("/fonts/lari.woff2") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+20BE; }

:root {
  --milk: #fbf6f3; --porcelain: #f4ecef; --card: #fffdfc; --plum: #2a1430; --plum2: #4a2a50; --muted: #6b5670;
  --orchid: #972982; --orchid-deep: #741b63; --orchid-soft: #c57ab5; --pink: #f2c6e0; --lilac: #e9dcef; --mist: #e8dbe5;
  --saffron: #e2a436; --peach: #f6d2b8;
  --display: "Prata", "Lari", "Noto Serif Georgian", Georgia, serif;
  --text: "Ysabeau", "Lari", "Noto Sans Georgian", system-ui, sans-serif;
  --wide: 1240px; --gut: 24px; --head: 76px;
  --wing: 104px; --wing-mid: 44px; --round: 18px;
  --ease: cubic-bezier(.2, .8, .2, 1);
  color-scheme: light;
}
.lang-ka { --display: "Noto Serif Georgian", "Prata", "Lari", Georgia, serif; }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--head) + 16px); }
body { margin: 0; background: var(--milk); color: var(--plum); font: 400 18px/1.6 var(--text); font-feature-settings: "lnum", "pnum"; overflow-x: clip; }
img, svg { display: block; max-width: 100%; }
a { color: var(--orchid-deep); text-underline-offset: .2em; text-decoration-thickness: 1px; }
a:hover { color: var(--orchid); }
:focus-visible { outline: 3px solid var(--orchid); outline-offset: 3px; border-radius: 6px; }
h1, h2, h3 { margin: 0; font-weight: 400; }
p { margin: 0; }
ul { margin: 0; padding: 0; list-style: none; }
address { font-style: normal; }
.display { font-family: var(--display); font-weight: 400; line-height: 1.08; letter-spacing: -.005em; }
.lang-ka .display { font-weight: 500; letter-spacing: 0; line-height: 1.25; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 12px; top: -60px; z-index: 50; padding: 10px 16px; background: var(--plum); color: var(--milk); border-radius: 10px; }
.skip:focus { top: 12px; }
.ico { width: 1.25em; height: 1.25em; flex: none; }
.soc { width: 1.25em; height: 1.25em; flex: none; }

/* ---------- buttons ---------- */
.btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: .55em; min-height: 52px; padding: 0 26px; border-radius: 999px; border: 1.5px solid transparent; font: 600 17px/1.1 var(--text); letter-spacing: .01em; text-decoration: none; white-space: nowrap; overflow: hidden; isolation: isolate; transition: background-color .25s, color .25s, border-color .25s, transform .25s var(--ease); }
.btn:active { transform: scale(.98); }
.btn-sm { min-height: 42px; padding: 0 18px; font-size: 15px; }
.btn-orchid { background: var(--orchid); color: var(--milk); }
.btn-orchid:hover { background: var(--orchid-deep); color: var(--milk); }
.btn-plum { background: var(--plum); color: var(--milk); }
.btn-plum:hover { background: var(--orchid-deep); color: var(--milk); }
.btn-line { border-color: rgba(42, 20, 48, .28); color: var(--plum); background: rgba(255, 255, 255, .55); }
.btn-line:hover { border-color: var(--orchid); color: var(--orchid-deep); background: #fff; }
.btn-milk { background: var(--milk); color: var(--plum); }
.btn-milk:hover { background: #fff; color: var(--orchid-deep); }
.btn-ghost { border-color: rgba(251, 246, 243, .45); color: var(--milk); }
.btn-ghost:hover { border-color: var(--milk); color: #fff; background: rgba(255, 255, 255, .08); }
/* a sheen sweeps over a filled button on hover, like light over a wing */
.btn-orchid::after, .btn-plum::after, .btn-milk::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(105deg, transparent 30%, rgba(255, 255, 255, .32) 48%, rgba(246, 210, 184, .28) 54%, transparent 70%); transform: translateX(-110%); transition: transform .8s var(--ease); }
.btn-orchid:hover::after, .btn-plum:hover::after, .btn-milk:hover::after { transform: translateX(110%); }
.cta-row { display: flex; flex-wrap: wrap; gap: 12px; }
.cta-row.center, .center .cta-row { justify-content: center; }

/* ---------- header ---------- */
.site-header { position: sticky; top: 0; z-index: 20; background: rgba(251, 246, 243, .86); backdrop-filter: saturate(1.4) blur(14px); -webkit-backdrop-filter: saturate(1.4) blur(14px); border-bottom: 1px solid rgba(232, 219, 229, .8); view-transition-name: site-header; }
.bar { max-width: var(--wide); margin: 0 auto; padding: 0 var(--gut); height: var(--head); display: flex; align-items: center; gap: 28px; }
.logo { display: block; flex: none; }
.logo .logo-row { height: 50px; width: auto; }
.nav { display: flex; gap: 6px; margin-left: auto; }
.nav a { padding: 8px 14px; border-radius: 999px; color: var(--plum); font-weight: 600; font-size: 16px; text-decoration: none; transition: background-color .2s, color .2s; }
.nav a:hover { background: var(--porcelain); color: var(--orchid-deep); }
.nav a[aria-current="page"] { background: var(--lilac); color: var(--orchid-deep); }
.lang { display: flex; gap: 2px; padding: 3px; border-radius: 999px; background: var(--porcelain); }
.lang a { min-width: 40px; padding: 6px 9px; border-radius: 999px; text-align: center; font-size: 13px; font-weight: 700; letter-spacing: .06em; color: var(--muted); text-decoration: none; }
.lang a:hover { color: var(--orchid-deep); }
.lang a[aria-current="true"] { background: #fff; color: var(--orchid-deep); box-shadow: 0 1px 3px rgba(42, 20, 48, .12); }

/* ---------- sections ---------- */
main { display: block; }
.section { max-width: var(--wide); margin: 0 auto; padding: 96px var(--gut) 0; }
.sec-head { max-width: 760px; margin: 0 0 40px; }
.sec-head h2 { font-size: clamp(34px, 4.4vw, 58px); }
.section-intro { margin-top: 16px; font-size: 19px; color: var(--plum2); max-width: 62ch; }
.eyebrow { font-weight: 700; font-size: 14px; letter-spacing: .2em; text-transform: uppercase; color: var(--orchid); }
.lang-ka .eyebrow { letter-spacing: .04em; text-transform: none; font-size: 15px; }
.lede { font-size: clamp(18px, 1.5vw, 21px); color: var(--plum2); max-width: 54ch; }
.more { margin-top: 36px; }
.card { background: var(--card); border: 1px solid var(--mist); border-radius: 28px; padding: 32px; box-shadow: 0 1px 0 rgba(255, 255, 255, .8) inset, 0 18px 40px -28px rgba(74, 42, 80, .35); }

/* wing-cut cards: the outer top corner is wide, mirrored on the two halves of a row */
.winged { border-radius: var(--round); }

/* ---------- hero ---------- */
.hero { position: relative; overflow: hidden; background: radial-gradient(55% 70% at 80% 42%, rgba(242, 198, 224, .55), transparent 70%), radial-gradient(34% 38% at 6% 70%, rgba(246, 210, 184, .4), transparent 70%); }
.hero-inner { max-width: var(--wide); margin: 0 auto; padding: 56px var(--gut) 72px; display: grid; grid-template-columns: 1.02fr .98fr; gap: 24px; align-items: center; min-height: min(760px, calc(100svh - var(--head))); }
.hero h1 { margin: 18px 0 22px; }
.h1-name { display: block; font-family: "Prata", Georgia, serif; font-size: clamp(76px, 10.4vw, 152px); line-height: .92; letter-spacing: -.02em; color: var(--plum); }
.h1-sub { display: block; margin-top: 14px; font-family: var(--display); font-size: clamp(26px, 2.7vw, 38px); line-height: 1.18; color: var(--orchid-deep); max-width: 16ch; }
.lang-ka .h1-sub { font-weight: 500; font-size: clamp(24px, 2.4vw, 34px); max-width: 20ch; }
.hero .lede { margin-bottom: 30px; }
.hero-meta { display: flex; flex-wrap: wrap; gap: 10px 26px; margin-top: 28px; color: var(--muted); font-size: 16px; font-weight: 600; }
.hero-meta li { display: inline-flex; align-items: center; gap: 8px; }
.hero-meta .ico { color: var(--orchid); }
.hero-art { position: relative; }
.wings { width: 100%; height: auto; overflow: visible; }
.wings .ring-text { font: 600 15px var(--text); letter-spacing: .26em; text-transform: uppercase; fill: var(--orchid-deep); }
.lang-ka .wings .ring-text { letter-spacing: .08em; text-transform: none; font-size: 16px; }
.wings .wing, .wings .flap { transform-box: view-box; transform-origin: 320px 300px; }
.wings .ring { transform-box: view-box; transform-origin: 320px 300px; }
.wings .mote { transform-box: fill-box; transform-origin: center; }

/* ---------- family ---------- */
.fam-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.fam-card { position: relative; padding: 34px 32px 30px; background: var(--card); border: 1px solid var(--mist); box-shadow: 0 18px 40px -30px rgba(74, 42, 80, .4); display: flex; flex-direction: column; gap: 12px; }
.fam-card:nth-child(1) { border-radius: var(--wing) var(--round) var(--round) var(--wing-mid); }
.fam-card:nth-child(2) { border-radius: var(--wing-mid) var(--wing-mid) var(--round) var(--round); }
.fam-card:nth-child(3) { border-radius: var(--round) var(--wing) var(--wing-mid) var(--round); }
.fam-ico { width: 54px; height: 54px; padding: 13px; border-radius: 50%; background: var(--lilac); color: var(--orchid-deep); }
.fam-card:nth-child(1) .fam-ico { margin-left: 18px; }
.fam-card:nth-child(3) .fam-ico { align-self: flex-end; margin-right: 18px; }
.fam-card h3 { font-family: var(--display); font-size: 30px; line-height: 1.15; }
.lang-ka .fam-card h3 { font-weight: 500; font-size: 26px; }
.fam-card p { color: var(--plum2); font-size: 17px; }
.pick { display: flex; justify-content: space-between; gap: 14px; margin-top: auto; padding-top: 14px; border-top: 1px dashed var(--mist); font-size: 16px; color: var(--muted); }
.pick-price { flex: none; font-weight: 700; color: var(--orchid-deep); }

/* ---------- services tiles ---------- */
.tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.tile a { position: relative; display: flex; flex-direction: column; gap: 8px; height: 100%; padding: 28px 24px 24px; background: var(--card); border: 1px solid var(--mist); border-radius: inherit; color: var(--plum); text-decoration: none; overflow: hidden; transition: border-color .3s, box-shadow .3s, transform .4s var(--ease); }
.tile a::before { content: ""; position: absolute; inset: -40%; background: conic-gradient(from 200deg at 50% 50%, transparent, rgba(242, 198, 224, .55), rgba(246, 210, 184, .5), rgba(217, 195, 230, .55), transparent 70%); opacity: 0; transform: rotate(-30deg); transition: opacity .45s, transform 1.2s var(--ease); z-index: 0; }
.tile a > * { position: relative; z-index: 1; }
.tile a:hover { border-color: var(--orchid-soft); box-shadow: 0 22px 40px -26px rgba(151, 41, 130, .45); transform: translateY(-3px); }
.tile a:hover::before { opacity: 1; transform: rotate(30deg); }
.tile:nth-child(4n + 1) { border-radius: var(--wing) var(--round) var(--round) var(--wing-mid); }
.tile:nth-child(4n + 2) { border-radius: var(--wing-mid) var(--round) var(--round) var(--round); }
.tile:nth-child(4n + 3) { border-radius: var(--round) var(--wing-mid) var(--round) var(--round); }
.tile:nth-child(4n + 4) { border-radius: var(--round) var(--wing) var(--wing-mid) var(--round); }
.tile-ico { width: 46px; height: 46px; padding: 11px; border-radius: 50%; background: var(--porcelain); color: var(--orchid); margin-bottom: 6px; }
.tile:nth-child(4n + 1) .tile-ico { margin-left: 14px; }
.tile:nth-child(4n + 4) .tile-ico { align-self: flex-end; margin-right: 14px; }
.tile a:hover .tile-ico { animation: flutter .9s var(--ease); }
.tile h3 { font-family: var(--display); font-size: 23px; line-height: 1.2; overflow-wrap: break-word; }
.lang-ka .tile h3 { font-weight: 500; font-size: 20px; }
.tile p { font-size: 15.5px; color: var(--muted); line-height: 1.45; }
.tile-from { margin-top: auto; padding-top: 10px; font-weight: 700; color: var(--orchid-deep); font-size: 17px; }

/* ---------- techniques ---------- */
.techs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.tech { display: flex; flex-direction: column; gap: 10px; }
.tech-art { aspect-ratio: 4 / 3; border-radius: 50% 50% 28px 28px / 42% 42% 28px 28px; background: radial-gradient(80% 70% at 50% 35%, #fff, var(--porcelain)); border: 1px solid var(--mist); display: grid; place-items: center; overflow: hidden; margin-bottom: 8px; }
.tech-art .art { width: 78%; height: auto; }
.tech h3 { font-family: var(--display); font-size: 30px; }
.lang-ka .tech h3 { font-weight: 500; font-size: 26px; }
.tech p { color: var(--plum2); font-size: 17px; }
.art .draw { stroke-dasharray: 1; stroke-dashoffset: 0; }

/* ---------- booking band ---------- */
.booking-band { position: relative; margin-top: 110px; padding: 100px var(--gut); background: var(--plum); color: var(--milk); overflow: hidden; text-align: center; }
.booking-art { position: absolute; inset: 0; opacity: .5; }
.booking-art .art { width: 100%; height: 100%; }
.booking-inner { position: relative; max-width: 760px; margin: 0 auto; }
.booking-inner h2 { font-size: clamp(38px, 5vw, 66px); color: #fff; }
.booking-inner p { margin: 18px auto 34px; font-size: 19px; color: rgba(251, 246, 243, .86); max-width: 52ch; }
.booking-inner .cta-row { justify-content: center; }

/* ---------- ratings ---------- */
.ratings { display: grid; grid-template-columns: repeat(2, minmax(0, 420px)); gap: 20px; }
.rating { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto auto; column-gap: 22px; align-items: center; padding: 28px 30px; background: var(--card); border: 1px solid var(--mist); border-radius: var(--wing) var(--round) var(--round) var(--wing-mid); color: var(--plum); text-decoration: none; transition: border-color .3s, box-shadow .3s; }
.rating + .rating { border-radius: var(--round) var(--wing) var(--wing-mid) var(--round); }
.rating:hover { border-color: var(--orchid-soft); box-shadow: 0 22px 40px -26px rgba(151, 41, 130, .4); color: var(--plum); }
.rating-num { grid-row: 1 / 4; font-family: "Prata", Georgia, serif; font-size: 76px; line-height: 1; color: var(--orchid); font-variant-numeric: tabular-nums; }
.stars { position: relative; display: inline-flex; width: max-content; }
.stars .ico { width: 20px; height: 20px; }
.stars-off { display: flex; color: var(--mist); }
.stars-on { position: absolute; inset: 0; display: flex; color: var(--saffron); clip-path: inset(0 calc(100% - var(--v)) 0 0); }
.rating-src { font-weight: 700; font-size: 17px; }
.rating-count { font-size: 15px; color: var(--muted); }
.rating-open { grid-column: 1 / 3; margin-top: 16px; display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 15px; color: var(--orchid-deep); }
.rating-open .ico { transition: transform .3s var(--ease); }
.rating:hover .rating-open .ico { transform: translateX(4px); }

/* ---------- where ---------- */
.where-grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: 24px; align-items: start; }
.where-card { display: flex; flex-direction: column; gap: 14px; border-radius: var(--wing) var(--round) var(--round) var(--wing-mid); }
.row { display: flex; gap: 12px; align-items: flex-start; }
.row .ico { margin-top: .2em; color: var(--orchid); }
.row.addr { font-family: var(--display); font-size: 24px; line-height: 1.25; }
.lang-ka .row.addr { font-weight: 500; font-size: 21px; }
.where-card .cta-row { padding-top: 14px; }
.where-side { display: flex; flex-direction: column; gap: 16px; }
.mini-map { display: block; position: relative; aspect-ratio: 560 / 400; border-radius: var(--round) var(--wing) var(--wing-mid) var(--round); overflow: hidden; border: 1px solid var(--mist); }
.mini-map .locmap { position: absolute; inset: 0; width: 100%; height: 100%; }
.nw { white-space: nowrap; }
.tel { font-weight: 700; color: var(--plum); text-decoration: none; }
.tel:hover { color: var(--orchid-deep); }
.tel-big { font-family: "Prata", Georgia, serif; font-weight: 400; font-size: 30px; }

/* ---------- page heads ---------- */
.page-head { position: relative; overflow: hidden; background: radial-gradient(50% 90% at 90% 10%, rgba(242, 198, 224, .5), transparent 70%); }
.page-head-art { position: absolute; right: max(0px, calc(50% - 680px)); top: 18px; width: min(640px, 70vw); opacity: .9; pointer-events: none; }
.page-head-inner { position: relative; max-width: var(--wide); margin: 0 auto; padding: 84px var(--gut) 8px; }
.page-head h1 { font-size: clamp(46px, 6.6vw, 92px); margin-bottom: 18px; color: var(--plum); }
.page-head .cta-row { margin-top: 28px; }
.w { display: inline-block; }

/* ---------- services page ---------- */
.chips { margin-top: 34px; }
.chips ul { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px 0 12px; border-radius: 999px; background: var(--card); border: 1px solid var(--mist); color: var(--plum); font-weight: 600; font-size: 15px; text-decoration: none; transition: border-color .2s, background-color .2s; }
.chip .ico { color: var(--orchid); }
.chip:hover { border-color: var(--orchid-soft); background: #fff; color: var(--orchid-deep); }
.price-list { padding-top: 40px; }
.group { padding-top: 64px; }
.group-head { display: flex; align-items: center; gap: 16px; margin-bottom: 24px; padding-bottom: 18px; border-bottom: 1px solid var(--mist); }
.group-ico { width: 56px; height: 56px; padding: 14px; border-radius: 50%; background: var(--lilac); color: var(--orchid-deep); }
.group-head h2 { font-size: clamp(30px, 3.4vw, 44px); }
.group-from { margin-left: auto; font-weight: 700; color: var(--orchid-deep); font-size: 18px; white-space: nowrap; }
/* parts flow in two balanced columns, top to bottom, so a long list never leaves a hole next to a short one */
.parts { columns: 2; column-gap: 20px; }
.parts > .part { break-inside: avoid; margin-bottom: 20px; }
.parts-one { columns: 1; }
.parts-one .plist { columns: 2; column-gap: 48px; }
.part { padding: 26px 30px 18px; background: var(--card); border: 1px solid var(--mist); border-radius: var(--round); }
.part:nth-child(odd) { border-top-left-radius: var(--wing-mid); }
.part:nth-child(even) { border-top-right-radius: var(--wing-mid); }
.part-t { margin-bottom: 8px; font-weight: 700; font-size: 14px; letter-spacing: .14em; text-transform: uppercase; color: var(--orchid); }
.lang-ka .part-t { letter-spacing: .02em; text-transform: none; font-size: 15px; }
.prow { display: flex; align-items: baseline; gap: 10px; padding: 11px 0; border-bottom: 1px solid rgba(232, 219, 229, .6); break-inside: avoid; }
.prow:last-child { border-bottom: 0; }
.prow-name { flex: 0 1 auto; font-size: 17px; line-height: 1.4; }
.prow-note { display: block; margin-top: 3px; font-size: 14px; color: var(--muted); }
.dots { flex: 1 1 24px; min-width: 18px; height: 1px; border-bottom: 2px dotted rgba(151, 41, 130, .32); transform-origin: left center; }
.prow-price { flex: none; font-weight: 700; color: var(--orchid-deep); font-variant-numeric: tabular-nums; white-space: nowrap; }
.prow:target { background: linear-gradient(90deg, rgba(242, 198, 224, .5), transparent); border-radius: 10px; }
.end-cta { padding-top: 72px; }

/* ---------- contacts ---------- */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; padding-top: 56px; }
.contact-grid .card:first-child { border-radius: var(--wing) var(--round) var(--round) var(--wing-mid); }
.contact-grid .card:last-child { border-radius: var(--round) var(--wing) var(--wing-mid) var(--round); }
.contact-grid h2 { font-size: 34px; margin-bottom: 18px; }
.contact-grid h2.mt { margin-top: 30px; font-size: 26px; }
.contact-grid address { display: flex; flex-direction: column; gap: 16px; margin-bottom: 24px; }
.hours { border-collapse: collapse; font-size: 19px; }
.hours th { text-align: left; font-weight: 600; padding: 6px 28px 6px 0; }
.hours td { font-weight: 700; color: var(--orchid-deep); font-variant-numeric: tabular-nums; }
.soc-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.soc-btn { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 999px; background: var(--porcelain); color: var(--plum); font-weight: 600; text-decoration: none; }
.soc-btn:hover { background: var(--lilac); color: var(--orchid-deep); }
.maps { position: relative; }
.map-tabs { display: flex; gap: 8px; margin-bottom: 14px; }
.map-tab[aria-pressed="true"] { background: var(--orchid); border-color: var(--orchid); color: var(--milk); }
.map { position: relative; aspect-ratio: 2 / 1; border-radius: var(--wing) var(--wing) var(--wing-mid) var(--wing-mid); overflow: hidden; border: 1px solid var(--mist); background: #f5edf0; }
.map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; z-index: 2; background: #f5edf0; }
.map iframe[hidden] { display: none; }
.map-credit { margin-top: 8px; font-size: 13px; color: var(--muted); }
.map-credit a { color: var(--muted); }
.maps .map-links { margin-top: 18px; }
.locmap { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.locmap-tall { display: none; }
.locmap .names text { font-family: var(--text); font-weight: 600; text-anchor: middle; letter-spacing: .04em; paint-order: stroke; stroke: #f8f1f4; stroke-width: 4px; stroke-linejoin: round; }
.lang-ka .locmap .names text { letter-spacing: 0; }
.locmap .osm-st text { dominant-baseline: central; fill: #7a6478; }
.locmap .osm-lm text { fill: var(--plum2); font-weight: 700; }
.locmap .osm-lm .pk, .locmap .osm-wt text { fill: #5d7255; }
.locmap .osm-wt text { fill: #55658f; }
.locmap .bar-tag rect { fill: var(--orchid); }
.locmap .bar-tag text { font-family: var(--text); font-weight: 700; fill: var(--milk); text-anchor: middle; letter-spacing: .08em; }
.locmap .sbar { fill: #7a6478; stroke: #7a6478; stroke-width: .8px; }
.locmap .sbar text { font-family: var(--text); font-size: 12px; stroke: none; }
.locmap .pin-ring { transform-box: fill-box; transform-origin: center; }

/* ---------- faq ---------- */
.faq-list { padding-top: 40px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.qa { padding: 28px 32px; background: var(--card); border: 1px solid var(--mist); border-radius: var(--round); }
.qa:nth-child(odd) { border-top-left-radius: var(--wing-mid); }
.qa:nth-child(even) { border-top-right-radius: var(--wing-mid); }
.qa h2 { font-family: var(--display); font-size: 26px; line-height: 1.25; margin-bottom: 10px; }
.lang-ka .qa h2 { font-weight: 500; font-size: 22px; }
.qa p { color: var(--plum2); }

/* ---------- footer ---------- */
.site-footer { margin-top: 120px; background: var(--plum); color: rgba(251, 246, 243, .86); padding: 72px var(--gut) 40px; }
.footer-grid { max-width: var(--wide); margin: 0 auto; display: grid; grid-template-columns: 1.5fr 1fr .8fr .8fr; gap: 40px; align-items: start; }
.medallion { display: grid; place-items: center; width: 148px; aspect-ratio: 1; border-radius: 50%; background: var(--milk); box-shadow: 0 0 0 8px rgba(151, 41, 130, .35); }
.medallion img { width: 72%; height: auto; }
.footer-brand p { margin-top: 24px; max-width: 34ch; font-size: 16px; }
.site-footer address p, .footer-links li, .footer-soc li { margin-bottom: 10px; font-size: 16px; }
.site-footer a { color: var(--milk); text-decoration: none; }
.site-footer a:hover { color: var(--pink); }
.site-footer .tel { color: var(--milk); }
.soc-link { display: inline-flex; align-items: center; gap: 10px; }
.footer-meta { max-width: var(--wide); margin: 48px auto 0; padding-top: 22px; border-top: 1px solid rgba(251, 246, 243, .14); font-size: 14px; color: rgba(251, 246, 243, .7); }
.footer-meta a { color: rgba(251, 246, 243, .86) !important; }
.cta-bar { display: none; }

/* ---------- chooser and 404 ---------- */
.page-chooser, .page-404 { min-height: 100svh; }
.chooser, .lost { position: relative; min-height: 100svh; display: grid; place-items: center; padding: 40px var(--gut); overflow: hidden; text-align: center; background: radial-gradient(60% 60% at 50% 40%, rgba(242, 198, 224, .6), transparent 70%); }
.chooser-art { position: absolute; inset: 0; opacity: .35; }
.chooser-art .art { width: 100%; height: 100%; }
.chooser-inner, .lost-body { position: relative; display: flex; flex-direction: column; align-items: center; gap: 28px; }
.medallion-big { width: 260px; }
.chooser .lede { font-size: 20px; }
.lang-btn { min-width: 150px; }
.lost-code { font-size: 120px; line-height: 1; color: var(--orchid); }
.lost h1 { font-family: var(--display); font-size: 34px; }

/* ---------- motion ---------- */
@keyframes flutter { 0%, 100% { transform: scaleX(1); } 30% { transform: scaleX(.72); } 60% { transform: scaleX(1.06); } }
@keyframes unfold { from { transform: scaleX(.04); opacity: 0; } 60% { opacity: 1; } to { transform: scaleX(1); opacity: 1; } }
@keyframes flap { 0%, 100% { transform: scaleX(1); } 50% { transform: scaleX(.88); } }
@keyframes flap-hero { 0%, 100% { transform: scaleX(1); } 50% { transform: scaleX(.95); } }
@keyframes draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes rise { from { transform: translateY(.5em); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes drift { 0%, 100% { transform: translate(0, 0) rotate(0); } 50% { transform: translate(6px, -14px) rotate(25deg); } }
@keyframes march { to { stroke-dashoffset: -20; } }
@keyframes ping { 0% { transform: scale(.6); opacity: .9; } 100% { transform: scale(3.2); opacity: 0; } }
@keyframes vt-in { from { clip-path: inset(0 50% 0 50%); } to { clip-path: inset(0 0 0 0); } }
@keyframes vt-out { from { opacity: 1; } to { opacity: 0; } }

@media (prefers-reduced-motion: no-preference) {
  /* page transitions: the new page opens from the middle like a pair of wings (View Transitions, Chromium and Safari) */
  @view-transition { navigation: auto; }
  ::view-transition-old(root) { animation: vt-out .3s ease both; }
  ::view-transition-new(root) { animation: vt-in .7s var(--ease) both; }

  /* hero: words rise, the logo butterfly unfolds from its axis, then the wings breathe */
  html.js:not(.no-hide) .hero .w { animation: rise .9s var(--ease) both; animation-delay: calc(120ms + var(--i) * 70ms); }
  html.js:not(.no-hide) .hero .h1-sub .w { animation-delay: calc(420ms + var(--i) * 45ms); }
  html.js:not(.no-hide) .wings .wing { animation: unfold 1.6s var(--ease) both; animation-delay: .25s; }
  html.js:not(.no-hide) .wings .ring, html.js:not(.no-hide) .wings .motes { animation: fade 1.6s ease both; animation-delay: .8s; }
  .wings .flap { animation: flap-hero 7s ease-in-out 2.2s infinite; animation-play-state: paused; }
  .wings .ring-text { animation: spin 120s linear infinite; animation-play-state: paused; transform-box: view-box; transform-origin: 320px 300px; }
  .wings .mote { animation: drift 9s ease-in-out infinite; animation-delay: calc(var(--i) * -1.4s); animation-play-state: paused; }
  .live .wings .flap, .live .wings .ring-text, .live .wings .mote { animation-play-state: running; }

  /* blocks: fade up, or open from a centre line like wings (a 2% strip stays visible for IntersectionObserver) */
  .reveal { transition: opacity .8s var(--ease), transform .8s var(--ease); transition-delay: calc(var(--i, 0) * 90ms); }
  html.js:not(.no-hide) .reveal:not(.in) { opacity: 0; transform: translateY(22px); }
  .unfold { clip-path: inset(-60px -60px -60px -60px); transition: clip-path 1s var(--ease); transition-delay: calc(var(--i, 0) * 110ms); }
  html.js:not(.no-hide) .unfold:not(.in) { clip-path: inset(-60px 49% -60px 49%); }

  /* page titles: words rise once the head is in view */
  html.js:not(.no-hide) .page-head h1 .w { animation: rise .9s var(--ease) both; animation-delay: calc(100ms + var(--i) * 80ms); }
  html.js:not(.no-hide) .page-head-art .draw { animation: draw 2.4s var(--ease) both; animation-delay: .3s; }
  .page-head-art .tiny-l, .page-head-art .tiny-r { transform-box: view-box; transform-origin: 600px 62px; animation: flutter 1.6s ease-in-out infinite; animation-play-state: paused; }
  .live .tiny-l, .live .tiny-r { animation-play-state: running; }

  /* price lists: dotted leaders draw from the name to the price */
  .part .dots { transition: transform 1.1s var(--ease) .25s; }
  html.js:not(.no-hide) .part:not(.in) .dots { transform: scaleX(0); }
  html.js:not(.no-hide) .group-head.in .group-ico { animation: flutter 1s var(--ease) .2s; }

  /* the technique drawings draw themselves when they come into view */
  html.js:not(.no-hide) .tech:not(.in) .draw { stroke-dashoffset: 1; }
  .tech .draw { transition: stroke-dashoffset 1.8s var(--ease) .2s; transition-delay: calc(.2s + var(--k, 0) * 90ms); }
  .tech .heat { animation: drift 3.2s ease-in-out infinite; animation-delay: calc(var(--k, 0) * -.8s); animation-play-state: paused; transform-box: fill-box; transform-origin: center; }
  .live .tech .heat { animation-play-state: running; }

  /* the map: the walk from the park marches to the pin, a ring goes out from the pin */
  .locmap .route { animation: march 1.2s linear infinite; animation-play-state: paused; }
  .locmap .pin-ring { animation: ping 2.4s ease-out infinite; animation-play-state: paused; }
  .live .locmap .route, .live .locmap .pin-ring { animation-play-state: running; }

  /* the call bar slides up after the first screen */
  .cta-bar { transition: transform .45s var(--ease); }
}
/* every endless loop stops while the tab is hidden */
.hidden-tab .flap, .hidden-tab .ring-text, .hidden-tab .mote, .hidden-tab .route, .hidden-tab .pin-ring, .hidden-tab .heat, .hidden-tab .tiny-l, .hidden-tab .tiny-r { animation-play-state: paused !important; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ---------- responsive ---------- */
@media (max-width: 1080px) {
  .tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tile:nth-child(odd) { border-radius: var(--wing) var(--round) var(--round) var(--wing-mid); }
  .tile:nth-child(even) { border-radius: var(--round) var(--wing) var(--wing-mid) var(--round); }
  .tile:nth-child(odd) .tile-ico { margin-left: 14px; align-self: flex-start; margin-right: 0; }
  .tile:nth-child(even) .tile-ico { align-self: flex-end; margin-right: 14px; margin-left: 0; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .nav a { padding: 8px 10px; }
  .bar { gap: 16px; }
}
@media (max-width: 900px) {
  :root { --head: 64px; --wing: 72px; --wing-mid: 32px; }
  .hero-inner { grid-template-columns: 1fr; min-height: 0; padding-top: 28px; gap: 8px; }
  .hero-art { order: -1; width: min(340px, 84%); margin: 0 auto -8px; }
  .fam-grid, .techs { grid-template-columns: 1fr; }
  .where-grid, .contact-grid { grid-template-columns: 1fr; }
  .parts { columns: 1; }
  .faq-list { grid-template-columns: 1fr; }
  .parts-one .plist { columns: 1; }
  .ratings { grid-template-columns: 1fr; }
  .head-book { display: none; }
  .bar { flex-wrap: wrap; height: auto; padding-top: 10px; padding-bottom: 8px; row-gap: 6px; }
  .nav { order: 3; width: 100%; margin: 0 -10px; justify-content: space-between; }
  .lang { margin-left: auto; }
  .logo .logo-row { height: 42px; }
  .section { padding-top: 72px; }
  .booking-band { margin-top: 84px; padding: 72px var(--gut); }
  .site-footer { margin-top: 90px; padding-bottom: 110px; }
  .cta-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; display: flex; gap: 8px; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); background: rgba(251, 246, 243, .94); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-top: 1px solid var(--mist); }
  .cta-bar .btn { flex: 1 1 auto; min-width: 0; min-height: 48px; padding: 0 10px; font-size: 15px; gap: 6px; }
  html.js:not(.no-hide) .cta-bar:not(.show) { transform: translateY(110%); }
  .map { aspect-ratio: 420 / 540; }
  .locmap-wide { display: none; }
  .locmap-tall { display: block; }
}
@media (max-width: 560px) {
  :root { --gut: 16px; }
  body { font-size: 17px; }
  .tiles { gap: 10px; }
  .tile a { padding: 20px 16px 18px; }
  .tile h3 { font-size: 19px; }
  .lang-ka .tile h3 { font-size: 17px; }
  .tile p { font-size: 14px; }
  .tile-from { font-size: 15px; }
  .tile-ico { width: 40px; height: 40px; padding: 9px; }
  .tile:nth-child(odd) .tile-ico { margin-left: 8px; }
  .tile:nth-child(even) .tile-ico { margin-right: 8px; }
  .card, .part, .qa { padding: 24px 20px; }
  .fam-card { padding: 28px 22px 24px; }
  .rating { padding: 24px 22px; column-gap: 16px; }
  .rating-num { font-size: 62px; }
  .row.addr { font-size: 21px; }
  .cta-row .btn { flex: 1 1 auto; }
  .hero .cta-row .btn, .page-head .cta-row .btn { width: 100%; }
  .group-head { display: grid; grid-template-columns: auto 1fr; column-gap: 14px; row-gap: 2px; }
  .group-head .group-ico { grid-row: 1 / 3; }
  .group-from { margin-left: 0; }
  .chips { margin: 30px calc(var(--gut) * -1) 0; }
  .chips ul { flex-wrap: nowrap; overflow-x: auto; padding: 2px var(--gut) 10px; scrollbar-width: none; }
  .chips ul::-webkit-scrollbar { display: none; }
  .chip { white-space: nowrap; }
  .group-ico { width: 46px; height: 46px; padding: 11px; }
  .group-from { font-size: 16px; }
  .prow-name { font-size: 16px; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .booking-inner .btn { width: 100%; }
  .map-tabs .btn { flex: 1; }
  .nav a { font-size: 15px; padding: 7px 8px; }
  .lang a { min-width: 34px; padding: 6px 6px; }
  .medallion-big { width: 210px; }
}

/* phones: services read as one list, icon beside the text, so long Georgian words never break */
@media (max-width: 480px) {
  .tiles { grid-template-columns: minmax(0, 1fr); --wing: 56px; --wing-mid: 26px; }
  .tile a { display: grid; grid-template-columns: 40px minmax(0, 1fr); grid-template-areas: "ico h" "ico p" "ico f"; column-gap: 16px; row-gap: 4px; align-content: start; padding: 20px 22px 18px; }
  .tile:nth-child(odd) .tile-ico, .tile:nth-child(even) .tile-ico { grid-area: ico; margin: 2px 0 0; align-self: start; }
  .tile h3 { grid-area: h; }
  .lang-ka .tile h3 { font-size: 18px; }
  .tile p { grid-area: p; font-size: 15px; }
  .tile-from { grid-area: f; padding-top: 6px; }
}

/* the narrowest phones: the three bar buttons keep their whole words */
@media (max-width: 400px) {
  .cta-bar { gap: 6px; padding-left: 10px; padding-right: 10px; }
  .cta-bar .btn { font-size: 14px; padding: 0 8px; gap: 5px; }
  .cta-bar .ico { width: 16px; height: 16px; }
}
