/* Vitrine V14: арт-дирекции семи сайтов-примеров. Общие для мини-сайта в телефоне на лендинге (.ms)
   и для полной страницы примера (site.html). Шрифты — css/demo-fonts.css, качаются только при показе. */
.t-lashes { --s-bg:#F5ECE7; --s-surf:#FFFFFF; --s-ink:#3B2722; --s-mute:#7A6259; --s-line:#E6D6CE; --s-acc:#3B2722; --s-acc-ink:#F5ECE7; --s-soft:#EBDDD5;
  --s-disp:'Cormorant Garamond', Georgia, serif; --s-disp-w:500; --s-disp-ls:-0.01em; --s-disp-tr:none; --s-body:'Jost', system-ui, sans-serif; --s-rad:999px; --s-img-rad:200px 200px 0 0; }
.t-makeup { --s-bg:#F4EEE6; --s-surf:#FBF8F3; --s-ink:#1C1714; --s-mute:#7A6650; --s-line:#E3D8CA; --s-acc:#1C1714; --s-acc-ink:#F4EEE6; --s-soft:#E9DFD2;
  --s-disp:'Bodoni Moda', 'Didot', serif; --s-disp-w:500; --s-disp-ls:-0.015em; --s-disp-tr:none; --s-body:'Manrope', system-ui, sans-serif; --s-rad:0px; --s-img-rad:0; }
.t-nails { --s-bg:#EFE8F8; --s-surf:#FFFFFF; --s-ink:#2A1F3D; --s-mute:#6B5E7E; --s-line:#DCD0EE; --s-acc:#C2183B; --s-acc-ink:#FFFFFF; --s-soft:#E2D7F3;
  --s-disp:'Bricolage Grotesque', system-ui, sans-serif; --s-disp-w:800; --s-disp-ls:-0.035em; --s-disp-tr:none; --s-body:'Bricolage Grotesque', system-ui, sans-serif; --s-rad:18px; --s-img-rad:28px; }
.t-hair { --s-bg:#F3E7DA; --s-surf:#FBF5EE; --s-ink:#2E1B12; --s-mute:#6E5A4C; --s-line:#E2CFBC; --s-acc:#A8492A; --s-acc-ink:#FFFFFF; --s-soft:#EAD8C5;
  --s-disp:'DM Serif Display', Georgia, serif; --s-disp-w:400; --s-disp-ls:-0.01em; --s-disp-tr:none; --s-body:'DM Sans', system-ui, sans-serif; --s-rad:999px; --s-img-rad:999px 999px 24px 24px; }
.t-tattoo { --s-bg:#EDEBE6; --s-surf:#F7F6F3; --s-ink:#111111; --s-mute:#6B6862; --s-line:#CFCBC3; --s-acc:#111111; --s-acc-ink:#EDEBE6; --s-soft:#E1DED7;
  --s-disp:'Syne', system-ui, sans-serif; --s-disp-w:800; --s-disp-ls:-0.02em; --s-disp-tr:uppercase; --s-body:'Space Mono', ui-monospace, monospace; --s-rad:0px; --s-img-rad:0; }
.t-cakes { --s-bg:#E3EFE7; --s-surf:#F7FBF8; --s-ink:#3A1F2B; --s-mute:#5E6B62; --s-line:#C9DDD0; --s-acc:#B8325A; --s-acc-ink:#FFFFFF; --s-soft:#F6DCE4;
  --s-disp:'Fraunces', Georgia, serif; --s-disp-w:600; --s-disp-ls:-0.02em; --s-disp-tr:none; --s-body:'Outfit', system-ui, sans-serif; --s-rad:999px; --s-img-rad:40px; }
.t-photo { --s-bg:#F2EFEA; --s-surf:#FAF8F5; --s-ink:#1D1D1B; --s-mute:#6F6A62; --s-line:#DAD4CA; --s-acc:#1D1D1B; --s-acc-ink:#F2EFEA; --s-soft:#E6E0D6;
  --s-disp:'Italiana', Georgia, serif; --s-disp-w:400; --s-disp-ls:0.01em; --s-disp-tr:uppercase; --s-body:'Jost', system-ui, sans-serif; --s-rad:0px; --s-img-rad:0; }

/* ---------- мини-сайт в телефоне (единицы — cqw ширины экрана телефона) ---------- */
.ms { position:absolute; inset:0; background:var(--s-bg); color:var(--s-ink); font-family:var(--s-body); overflow:hidden; }
.ms-bar { height:12cqw; }
.ms-nav { display:flex; align-items:center; justify-content:space-between; padding:0 6cqw; height:11cqw; }
.ms-name { font-family:var(--s-disp); font-weight:var(--s-disp-w); text-transform:var(--s-disp-tr); letter-spacing:var(--s-disp-ls); font-size:5.6cqw; line-height:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:70cqw; }
.ms-burger { width:6cqw; height:3.2cqw; border-top:.55cqw solid currentColor; border-bottom:.55cqw solid currentColor; }
.ms-hero { margin:1cqw 6cqw 0; height:58cqw; overflow:hidden; border-radius:var(--s-img-rad); background:var(--s-soft); }
.t-lashes .ms-hero, .t-hair .ms-hero { border-radius:44cqw 44cqw 3cqw 3cqw; }
.t-nails .ms-hero { border-radius:6cqw; }
.t-cakes .ms-hero { border-radius:9cqw; }
.ms-hero img { width:100%; height:100%; object-fit:cover; display:block; }
.t-lashes .ms-hero img { object-position:50% 36%; }
.ms-h { font-family:var(--s-disp); font-weight:var(--s-disp-w); text-transform:var(--s-disp-tr); letter-spacing:var(--s-disp-ls); font-size:7.4cqw; line-height:1.02; margin:4.5cqw 6cqw 0; }
.t-tattoo .ms-h, .t-photo .ms-h { font-size:6.6cqw; }
.ms-book { display:flex; align-items:center; justify-content:center; gap:2cqw; margin:4.5cqw 6cqw 0; height:13cqw; border-radius:var(--s-rad); background:var(--s-acc); color:var(--s-acc-ink); font-weight:700; font-size:4.6cqw; letter-spacing:.005em; }
.t-tattoo .ms-book { font-weight:700; font-size:3.8cqw; text-transform:uppercase; }
.ms-book svg { width:4.4cqw; height:4.4cqw; }
.ms-alt { text-align:center; font-size:3.4cqw; margin-top:2.4cqw; color:var(--s-mute); text-decoration:underline; text-underline-offset:.8cqw; }
.ms-sec { margin:5cqw 6cqw 0; font-size:2.9cqw; font-weight:700; text-transform:uppercase; letter-spacing:.12em; color:var(--s-mute); }
.ms-prices { margin:1.6cqw 6cqw 0; list-style:none; padding:0; }
.ms-prices li { display:flex; justify-content:space-between; align-items:baseline; gap:3cqw; padding:2.4cqw 0; border-bottom:.3cqw solid var(--s-line); font-size:4.3cqw; }
.ms-prices li span:first-child { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ms-prices b { font-weight:700; white-space:nowrap; }
.ms-where { margin:3cqw 6cqw 0; font-size:3.3cqw; color:var(--s-mute); line-height:1.35; }
.ms-strip { display:grid; grid-template-columns:repeat(3, 1fr); gap:1.6cqw; margin:4cqw 6cqw 0; }
.ms-strip img { width:100%; aspect-ratio:3 / 4; object-fit:cover; border-radius:1.6cqw; }
.ms-safari { position:absolute; left:0; right:0; bottom:0; height:19cqw; background:rgba(250,250,250,.86); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border-top:.3cqw solid rgba(0,0,0,.08); display:flex; flex-direction:column; align-items:center; padding-top:2.6cqw; font-family:-apple-system, BlinkMacSystemFont, 'Instrument Sans', sans-serif; }
.ms-url { display:flex; align-items:center; justify-content:center; gap:1.4cqw; width:86cqw; height:9.6cqw; border-radius:3.2cqw; background:rgba(118,118,128,.14); color:#111; font-size:3.7cqw; font-weight:500; }
.ms-url svg { width:2.8cqw; height:2.8cqw; }
