/* =========================================================
   vcare.uz — static site stylesheet (minimal)
   Plain CSS, no frameworks, no JavaScript.
   ========================================================= */

/* ---------- Fonts (subset Montserrat, Latin + Cyrillic) ---------- */
@font-face { font-family: "Montserrat"; font-weight: 500; font-display: swap; src: url("../fonts/montserrat-medium.woff") format("woff"); }
@font-face { font-family: "Montserrat"; font-weight: 600; font-display: swap; src: url("../fonts/montserrat-semibold.woff") format("woff"); }
@font-face { font-family: "Montserrat"; font-weight: 700; font-display: swap; src: url("../fonts/montserrat-bold.woff") format("woff"); }

/* ---------- Tokens ---------- */
:root {
  --ink: #1d2433;        /* main text, near-black navy */
  --navy: #26324f;       /* brand navy */
  --muted: #6b7183;      /* secondary text */
  --faint: #9aa0ae;      /* tertiary text */
  --line: #efeeeb;       /* hairlines */
  --bg: #ffffff;
  --bg-soft: #fbfaf8;    /* quiet section background (very light, warm) */
  --coral: #ff9a6e;      /* brand accent — used sparingly */
  --coral-ink: #d9683c;  /* accent for small text on white */
  --wrap: 1200px;
  --header-h: 76px;
}

/* ---------- Reset / base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: var(--header-h); -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-weight: 500; font-size: 16px; line-height: 1.6;
  color: var(--ink); background: var(--bg);
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, p, ul, ol, dl, dd { margin: 0; }
ul, ol { padding: 0; list-style: none; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 32px; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  height: 52px; padding: 0 28px; border-radius: 999px;
  font-weight: 600; font-size: 15px; white-space: nowrap;
  transition: background .2s, color .2s, border-color .2s;
}
.btn--primary { background: var(--ink); color: #fff; }
.btn--primary:hover { background: var(--navy); }
.btn--accent { background: var(--coral); color: #fff; }
.btn--accent:hover { background: var(--coral-ink); }
.btn--ghost { border: 1px solid var(--line); color: var(--ink); }
.btn--ghost:hover { border-color: var(--ink); }
.btn--sm { height: 42px; padding: 0 20px; font-size: 14px; }
.btn svg { flex: none; }

/* =========================================================
   1. HEADER
   ========================================================= */
.header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255,255,255,.92);
  -webkit-backdrop-filter: saturate(180%) blur(12px);
  backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--line);
}
.header__inner { height: var(--header-h); display: flex; align-items: center; gap: 40px; }
.header__logo { flex: none; display: flex; align-items: center; gap: 10px; }
.logo-icon { width: auto; height: 36px; display: block; }
.logo-icon--lg { height: 56px; }
.wordmark { font-size: 28px; font-weight: 700; letter-spacing: -0.04em; line-height: 1; color: #2e354f; }
.wordmark--light { color: #fff; font-size: 34px; }

.nav { display: flex; gap: 26px; margin-right: auto; }
.nav a { white-space: nowrap; font-size: 15px; font-weight: 500; color: var(--muted); transition: color .2s; }
.nav a:hover { color: var(--ink); }

.header__right { display: flex; align-items: center; gap: 24px; }
.lang { display: flex; gap: 2px; font-size: 13px; font-weight: 600; }
.lang a { padding: 4px 8px; border-radius: 6px; color: var(--faint); }
.lang a:hover { color: var(--ink); }
.lang a[aria-current="page"] { color: var(--ink); background: var(--bg-soft); }
.header__phone { font-size: 15px; font-weight: 600; white-space: nowrap; }
.header__phone:hover { color: var(--coral-ink); }

/* Mobile menu: <details>, no JavaScript */
.menu { display: none; }

/* =========================================================
   2. HERO
   ========================================================= */
.hero { padding: 72px 0 96px; }
.hero__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 72px; align-items: center; }
.hero__label {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 14px; font-weight: 500; color: var(--muted); margin-bottom: 28px;
}
.hero__label::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--coral); }
.hero__title {
  font-size: 60px; line-height: 1.06; font-weight: 700; letter-spacing: -0.035em;
  margin-bottom: 24px;
}
.hero__title em { font-style: normal; color: var(--coral); }
.hero__values { display: grid; gap: 14px; margin-bottom: 44px; }
.hero__values li { display: flex; align-items: center; gap: 14px; font-size: 20px; font-weight: 500; line-height: 1.4; color: var(--ink); }
.hero__values li::before { content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--coral); }
.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; }

.facts { display: flex; gap: 48px; margin-top: 64px; padding-top: 32px; border-top: 1px solid var(--line); }
.facts dt { font-size: 26px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.2; }
.facts dd { font-size: 14px; color: var(--muted); margin-top: 4px; }

.hero__media { position: relative; }
.hero__media img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 28px; }
.hero__note {
  position: absolute; left: -28px; bottom: 32px;
  display: flex; align-items: center; gap: 12px;
  background: #fff; border-radius: 16px; padding: 14px 18px;
  box-shadow: 0 12px 40px -12px rgba(29, 36, 51, .25);
  font-size: 14px; font-weight: 600; line-height: 1.35;
}
.hero__note small { display: block; font-size: 13px; color: var(--muted); font-weight: 500; }
.hero__note-icon {
  flex: none; width: 36px; height: 36px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: #fff1ea; color: var(--coral-ink);
}

/* =========================================================
   3. SERVICE + PRICE
   ========================================================= */
.section { padding: 112px 0; }
.section--soft { background: var(--bg-soft); }
.kicker { font-size: 16px; font-weight: 700; color: var(--coral-ink); margin-bottom: 14px; letter-spacing: .01em; }
.h2 { font-size: 44px; line-height: 1.1; font-weight: 700; letter-spacing: -0.03em; }
.sub { font-size: 18px; color: var(--muted); margin-top: 20px; max-width: 32em; }

.pricing__head { text-align: center; margin-bottom: 48px; }
.pricing__sub { font-size: 20px; font-weight: 500; color: var(--muted); margin-top: 14px; }
.pricing { max-width: 480px; margin: 0 auto; }
.plan { background: #fff; border: 1px solid var(--line); border-radius: 28px; padding: 40px; display: flex; flex-direction: column; }
.plan__name { font-size: 16px; font-weight: 600; color: var(--muted); }
.plan__price { white-space: nowrap; font-size: 44px; font-weight: 700; letter-spacing: -0.03em; line-height: 1; margin: 18px 0 24px; }
.plan__price span { font-size: 17px; font-weight: 500; color: var(--muted); letter-spacing: 0; }
.checks { flex: 1; margin-bottom: 32px; }
.checks li {
  display: flex; align-items: center; gap: 14px;
  padding: 11px 0; font-size: 15px; border-bottom: 1px solid var(--line);
}
.checks li::before {
  content: ""; flex: none; width: 18px; height: 18px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d9683c' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center / 18px no-repeat;
}
.plan .btn { width: 100%; }
/* --- Price section, variant B: icon tiles + price bar --- */
.tiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.tile { background: #fff; border: 1px solid var(--line); border-radius: 22px; padding: 28px 22px; font-size: 16px; font-weight: 600; line-height: 1.4; }
.tile__icon { display: flex; width: 52px; height: 52px; border-radius: 16px; background: #fff1ea; color: var(--coral-ink); align-items: center; justify-content: center; margin-bottom: 20px; }
.pricebar { margin-top: 16px; background: var(--ink); color: #fff; border-radius: 22px; padding: 28px 36px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.pricebar__price { font-size: 40px; font-weight: 700; letter-spacing: -0.03em; line-height: 1.1; }
.pricebar__price span { font-size: 16px; font-weight: 500; color: #aab0bf; letter-spacing: 0; margin-left: 6px; }

/* --- Price section, variant C: split card --- */
.split { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); max-width: 1000px; margin: 0 auto; background: #fff; border: 1px solid var(--line); border-radius: 32px; overflow: hidden; }
.split__price { background: var(--ink); color: #fff; padding: 48px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 8px; text-align: center; }
.split__amount { font-size: 56px; font-weight: 700; letter-spacing: -0.04em; line-height: 1; white-space: nowrap; }
.split__amount span { font-size: 18px; font-weight: 500; color: #aab0bf; letter-spacing: 0; }
.split__list { padding: 40px 48px; }
.split__label { font-size: 20px; font-weight: 700; color: var(--ink); margin-bottom: 8px; }
.split .checks { margin-bottom: 0; }
.split .checks li { font-size: 17px; padding: 15px 0; }
.split .checks li:last-child { border-bottom: 0; }
.pricing__note { text-align: center; font-size: 14px; color: var(--muted); margin-top: 24px; }


/* =========================================================
   4. BEFORE / AFTER
   ========================================================= */
.ba { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: stretch; }
.ba__col { border-radius: 28px; padding: 44px; }
.ba__before { border: 1px dashed #d9d9d4; }
.ba__after { background: #fff; border: 1px solid var(--line); box-shadow: 0 30px 60px -36px rgba(29, 36, 51, .35); }
.ba h2 { font-size: 32px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.15; margin-bottom: 24px; }
.ba__before h2, .ba__before li { color: var(--muted); }
.ba li { display: flex; gap: 14px; align-items: flex-start; padding: 16px 0; border-top: 1px solid var(--line); font-size: 18px; line-height: 1.45; }
.ba li::before {
  content: ""; flex: none; width: 22px; height: 22px; margin-top: 1px; border-radius: 50%;
  background-position: center; background-repeat: no-repeat; background-size: 12px;
}
.ba__before li::before {
  background-color: #ececea;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239aa0ae' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E");
}
.ba__after li::before {
  background-color: var(--coral);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E");
}
/* =========================================================
   5. PHOTO REPORT (works)
   ========================================================= */
.rep{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"text phone" "thumbs phone";column-gap:72px;row-gap:0;align-items:center}
.rep__radio{position:absolute;top:0;left:0;width:1px;height:1px;opacity:0;pointer-events:none}

.rep__text{grid-area:text;align-self:end}
.rep__text .h2{margin-bottom:20px}
.rep__text p:not(.kicker){font-size:18px;color:var(--muted);max-width:28em}

/* example switcher (CSS only) */
.rep__thumbs{grid-area:thumbs;align-self:start;margin-top:36px}
.rep__label{font-size:13px;font-weight:600;color:var(--muted);margin-bottom:12px}
.rep__list{display:flex;gap:8px}
.rep__list label{display:block;padding:3px;border:2px solid transparent;border-radius:17px;cursor:pointer;opacity:.7;transition:opacity .2s,border-color .2s}
.rep__list label:hover{opacity:1}
.rep__list img{display:block;width:66px;height:66px;object-fit:cover;border-radius:12px}
#ex1:checked~.rep__thumbs label[for=ex1],#ex2:checked~.rep__thumbs label[for=ex2],#ex3:checked~.rep__thumbs label[for=ex3],#ex4:checked~.rep__thumbs label[for=ex4]{border-color:var(--coral);opacity:1}
#ex1:focus-visible~.rep__thumbs label[for=ex1],#ex2:focus-visible~.rep__thumbs label[for=ex2],#ex3:focus-visible~.rep__thumbs label[for=ex3],#ex4:focus-visible~.rep__thumbs label[for=ex4]{outline:2px solid var(--coral-ink);outline-offset:2px}

/* phone mockup (iPhone-style frame + Telegram-style chat) */
.phone{grid-area:phone;justify-self:center;position:relative;width:280px;max-width:100%;aspect-ratio:300/622;padding:8px;border:3px solid transparent;border-radius:52px;background:linear-gradient(#0c0c0e,#0c0c0e) padding-box,linear-gradient(140deg,#a7aab1 0%,#55585e 18%,#2c2d31 45%,#4b4e54 72%,#9ea2a9 100%) border-box;box-shadow:0 0 0 1px rgba(0,0,0,.5),0 50px 80px -30px rgba(29,36,51,.45),0 24px 40px -24px rgba(29,36,51,.4)}
.phone::after,.phone__keys,.phone__keys::before,.phone__keys::after{content:"";position:absolute;width:3px;background:linear-gradient(90deg,#3b3d42,#8e9198 55%,#55585e)}
.phone::after{right:-6px;top:27%;height:12%;border-radius:0 2px 2px 0}
.phone__keys{left:-6px;top:15.5%;height:4.2%;border-radius:2px 0 0 2px;transform:scaleX(-1)}
.phone__keys::before,.phone__keys::after{left:0;height:180%;border-radius:inherit}
.phone__keys::before{top:200%}
.phone__keys::after{top:450%}

.phone__screen{position:relative;height:100%;display:flex;flex-direction:column;border-radius:39px;overflow:hidden;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cg fill='none' stroke='%232e354f' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round' opacity='.09'%3E%3Cpath d='M14 32c0-10 8-17 18-17 0 10-8 17-18 17zM14 32l9-9'/%3E%3Ccircle cx='84' cy='22' r='3'/%3E%3Cpath d='M84 15v-3M84 32v-3M77 22h-3M94 22h-3M79 17l-2-2M91 29l-2-2M79 27l-2 2M91 15l-2 2'/%3E%3Cpath d='M52 54l2 6 6 2-6 2-2 6-2-6-6-2 6-2z'/%3E%3Ccircle cx='104' cy='66' r='2.5'/%3E%3Ccircle cx='18' cy='88' r='4'/%3E%3Cpath d='M66 110c0-9 7-15 16-15 0 9-7 15-16 15zM66 110l8-8'/%3E%3Cpath d='M104 104l1.4 4 4 1.4-4 1.4-1.4 4-1.4-4-4-1.4 4-1.4z'/%3E%3Ccircle cx='40' cy='104' r='1.6'/%3E%3Ccircle cx='112' cy='38' r='1.6'/%3E%3C/g%3E%3C/svg%3E") 0 0/120px 120px,linear-gradient(170deg,#dde6ee 0%,#d3dde8 55%,#d9e1e6 100%);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Inter,"Helvetica Neue",Arial,sans-serif;color:#000;line-height:1.3;-webkit-font-smoothing:antialiased}
.phone__screen::after{content:"";position:absolute;left:32%;right:32%;bottom:6px;height:4px;border-radius:2px;background:#000}

.phone__top{flex:none;position:relative;z-index:1;background:rgba(247,247,248,.97);box-shadow:0 .5px 0 rgba(0,0,0,.16)}
.ios-bar{display:grid;grid-template-columns:1fr 31% 1fr;align-items:center;height:38px;font-size:12.5px;font-weight:600;letter-spacing:-.01em}
.ios-bar__time{justify-self:center;padding-left:8px}
.ios-bar__island{height:25px;border-radius:13px;background:#000}
.ios-bar__icons{justify-self:center;display:flex;align-items:center;gap:4px;padding-right:4px}
.ios-bar__icons svg{display:block}

.tg-head{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 10px 7px}
.tg-head__back{display:flex;align-items:center;gap:4px;font-size:13px;color:#007aff}
.tg-head__back svg{width:8px;height:14px}
.tg-head__title{text-align:center;line-height:1.25}
.tg-head__title b{display:block;font-size:13px;font-weight:600}
.tg-head__title small{display:block;font-size:10.5px;color:#007aff}
.tg-head__ava{justify-self:end;width:31px;height:31px;border-radius:50%;background:#2e354f;display:grid;place-items:center}
.tg-head__ava img{display:block;width:23px;height:auto}

.chat{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:flex-end;gap:5px;padding:10px 10px 10px 13px}

.msg{position:relative;align-self:flex-start;max-width:82%;background:#fff;border-radius:15px 15px 15px 0;filter:drop-shadow(0 1px .5px rgba(0,0,0,.12))}
.msg::before{content:"";position:absolute;left:-7px;bottom:0;width:8px;height:14px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 15'%3E%3Cpath d='M9 0v15H1.3c-.8 0-1.1-.9-.5-1.3C5.4 10.6 8.7 6.6 9 0z' fill='%23fff'/%3E%3C/svg%3E") no-repeat 0 0/100% 100%}
.msg--media{width:86%;max-width:none;padding:2px}
.msg__imgs{display:grid;gap:2px}
.msg__imgs figure{position:relative;margin:0}
.msg__imgs img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:4px}
.msg__imgs figure:first-child img{border-radius:13px 13px 4px 4px}
.msg__imgs figcaption{position:absolute;left:5px;bottom:5px;font-size:10px;font-weight:600;line-height:1;padding:3px 7px;border-radius:999px;background:rgba(255,255,255,.94);color:#1d2433;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.msg__imgs figure+figure figcaption{background:var(--coral-ink);color:#fff}
.ex{display:none}
#ex1:checked~.phone .ex--1,#ex2:checked~.phone .ex--2,#ex3:checked~.phone .ex--3,#ex4:checked~.phone .ex--4{display:grid}

.msg p{font-size:13px;line-height:1.35;padding:6px 9px 7px}
.msg--media p{padding:5px 7px 6px}
.msg p::after{content:"";display:inline-block;width:30px}
.msg time{position:absolute;right:8px;bottom:5px;display:flex;align-items:center;gap:2px;font-size:10px;line-height:1;color:#a1a9b4}
.msg--me{align-self:flex-end;max-width:96%;background:#e1fec6;border-radius:15px 15px 0 15px}
.msg--me::before{left:auto;right:-7px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 15'%3E%3Cpath d='M0 0v15h7.7c.8 0 1.1-.9.5-1.3C3.6 10.6.3 6.6 0 0z' fill='%23e1fec6'/%3E%3C/svg%3E")}
.msg--me p::after{width:47px}
.msg--me time{color:#56a64b}
.msg--me time svg{width:13px;height:8px}

.tg-input{flex:none;display:flex;align-items:center;gap:9px;padding:6px 10px 24px;background:rgba(247,247,248,.97);box-shadow:0 -.5px 0 rgba(0,0,0,.16);color:#8e8e93}
.tg-input svg{flex:none;width:20px;height:20px}
.tg-input__field{flex:1;height:27px;display:flex;align-items:center;padding:0 11px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 .5px #c8c8cc;font-size:12.5px;color:#a1a1a7}


@media (max-width:860px){.rep{grid-template-columns:minmax(0,1fr);grid-template-areas:"text" "phone" "thumbs";row-gap:40px}
.rep__text{text-align:center;align-self:auto}
.rep__text p:not(.kicker){margin:0 auto}
.rep__thumbs{margin-top:-8px;text-align:center}
.rep__list{justify-content:center}
}


@media (max-width:640px){.phone{width:270px}
.rep__text p:not(.kicker){font-size:16px}
.rep__list img{width:60px;height:60px}
}

/* =========================================================
   6. STEPS (timeline)
   ========================================================= */
.tl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;position:relative;max-width:1000px;margin:0 auto}

.tl::before{content:"";position:absolute;top:36px;left:16.6%;right:16.6%;height:2px;background:repeating-linear-gradient(90deg,var(--coral) 0 8px,transparent 8px 16px)}

.tl li{text-align:center;position:relative}

.tl__ico{width:72px;height:72px;border-radius:50%;background:#fff;border:2px solid var(--coral);color:var(--coral-ink);display:flex;align-items:center;justify-content:center;margin:0 auto 24px;position:relative}

.tl__ico b{position:absolute;top:-6px;right:-6px;width:26px;height:26px;border-radius:50%;background:var(--ink);color:#fff;font-size:13px;display:flex;align-items:center;justify-content:center}

.tl h3{font-size:20px;font-weight:700;margin-bottom:8px}
.tl p{color:var(--muted);font-size:16px;max-width:22em;margin:0 auto}
.tl__cta{text-align:center;margin-top:56px}


@media (max-width:860px){.tl{grid-template-columns:minmax(0,1fr);gap:28px;max-width:400px}
.tl::before{display:none}
.tl li{display:grid;grid-template-columns:56px minmax(0,1fr);column-gap:18px;align-items:start;text-align:left}
.tl li:not(:last-child)::after{content:"";position:absolute;left:27px;top:64px;bottom:-22px;width:2px;background:repeating-linear-gradient(180deg,var(--coral) 0 6px,transparent 6px 12px)}
.tl__ico{grid-row:span 2;width:56px;height:56px;margin:0}
.tl__ico svg{width:22px;height:22px}
.tl__ico b{width:22px;height:22px;font-size:12px;top:-4px;right:-4px}
.tl h3{font-size:18px;margin:6px 0 4px}
.tl p{margin:0;max-width:none;font-size:15px}
.tl__cta{margin-top:40px}
}
@media (max-width:640px){.tl__cta{max-width:400px;margin-left:auto;margin-right:auto}
.tl__cta .btn{width:100%}
}

/* =========================================================
   7. REVIEWS
   ========================================================= */
.stars{display:inline-flex;gap:2px;color:#f5b301}
.rv{--g:32px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch}
.rv__card{margin:0;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:22px 22px 22px 6px;padding:28px}
.rv blockquote{flex:1;margin:14px 0 24px;font-size:17px;line-height:1.55}
.rv figcaption{display:flex;align-items:center;gap:12px}
.rv__ava{flex:none;width:40px;height:40px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-weight:700;font-size:15px}
.rv figcaption b{display:block;font-weight:600;font-size:15px;line-height:1.3}
.rv figcaption small{display:block;color:var(--muted);font-size:14px;line-height:1.3}


@media (max-width:860px){.rv{grid-template-columns:minmax(0,1fr);gap:16px;max-width:560px;margin:0 auto}
/* swipeable row on phones: add class rv--scroll (and tabindex="0") once there are 4+ reviews */
.rv--scroll{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:62%;max-width:none;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 var(--g);margin:0 calc(var(--g)*-1);padding:2px var(--g) 6px;scrollbar-width:none}
.rv--scroll::-webkit-scrollbar{display:none}
.rv--scroll .rv__card{scroll-snap-align:start}
.rv--scroll:focus-visible{outline:2px solid var(--coral-ink);outline-offset:-2px}
}


@media (max-width:640px){.rv{--g:20px}
.rv--scroll{grid-auto-columns:86%;gap:12px}
.rv__card{padding:24px 22px}
.rv blockquote{font-size:16px}
}

/* =========================================================
   8. FREE TRIAL
   ========================================================= */
.mo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);grid-template-areas:"txt tiles" "btn tiles";column-gap:72px;row-gap:0;align-items:center}
.mo__txt{grid-area:txt;align-self:end}
.mo__tiles{grid-area:tiles}
.mo__btn{grid-area:btn;align-self:start;justify-self:start}

.mo h2{font-size:42px;line-height:1.12;font-weight:700;letter-spacing:-.02em;margin-bottom:18px}

.mo__txt>p:not(.kicker){color:var(--muted);font-size:18px;margin-bottom:32px;max-width:28em}

.mo__tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}

.mo__tile{background:#fff;border:1px solid var(--line);border-radius:22px;padding:24px 20px;text-align:center}

.mo__tile small{display:block;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:14px}

.mo__tile s{display:block;color:var(--faint);font-size:15px;margin-bottom:4px}

.mo__tile b{display:block;font-size:30px;font-weight:700;color:var(--coral-ink);letter-spacing:-.02em}

.mo__sum{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;background:var(--ink);color:#fff;border-radius:18px;padding:18px 24px;font-weight:600}

.mo__sum b{font-size:22px;color:var(--coral)}
.mo__note{grid-column:1/-1;margin-top:2px;font-size:14px;line-height:1.5;color:var(--muted);text-align:center}


@media (max-width:860px){.mo{grid-template-columns:1fr;grid-template-areas:"txt" "tiles" "btn";row-gap:32px}
.mo__txt>p:not(.kicker){margin-bottom:0}
}


@media (max-width:640px){.mo h2{font-size:30px}
.mo__txt>p:not(.kicker){font-size:16px}
.mo__tile{padding:16px 8px}
.mo__tile b{font-size:22px}
.mo__sum{font-size:14px;padding:16px}
.mo__sum b{font-size:18px}
.mo__note{font-size:13px}
.mo .btn{width:100%}
}

/* =========================================================
   9. FAQ
   ========================================================= */
.fq__item{border-bottom:1px solid var(--line)}

.fq__item summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px 0;font-size:18px;font-weight:600}

.fq__item summary::-webkit-details-marker{display:none}

.fq__ico{flex:none;position:relative;width:32px;height:32px;border-radius:50%;background:#fff1ea}

.fq__ico::before,.fq__ico::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;background:var(--coral-ink);transform:translate(-50%,-50%);transition:transform .2s}

.fq__ico::after{transform:translate(-50%,-50%) rotate(90deg)}

.fq__item[open] .fq__ico::after{transform:translate(-50%,-50%) rotate(0)}

.fq__item p{color:var(--muted);font-size:16px;line-height:1.6;padding:0 56px 24px 0;margin-top:-6px}


@media (max-width:640px){.fq__item summary{font-size:16px;padding:20px 0}
.fq__item p{padding-right:0}
}
.fqa{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);grid-template-rows:auto 1fr;grid-template-areas:"head list" "aside list";column-gap:80px;align-items:start}
.fqa__head{grid-area:head}
.fqa__list{grid-area:list}
.fqa__aside{grid-area:aside}

.fqa .h2{margin-bottom:18px}
.fqa__lead{color:var(--muted);font-size:17px;margin-bottom:28px;max-width:22em}

.fqa .fq__item:first-child{border-top:1px solid var(--line)}


@media (max-width:860px){.fqa{grid-template-columns:minmax(0,1fr);grid-template-rows:none;grid-template-areas:"head" "list" "aside";row-gap:32px}
.fqa .h2{margin-bottom:0}
}


@media (max-width:640px){.fqa .btn{width:100%}
}

/* =========================================================
   10. FOOTER
   ========================================================= */
.cm{background:var(--ink);color:#fff;text-align:center;padding:72px 0 28px}

.cm__logo{margin:0 auto 22px;display:flex;flex-direction:column;align-items:center;gap:12px}

.cm__mission{font-size:18px;color:#c3c8d6;max-width:26em;margin:0 auto 32px}

.cm__icons{display:flex;justify-content:center;gap:14px;margin-bottom:22px}

.cm__icons a{width:56px;height:56px;border-radius:50%;border:1px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;color:#fff;transition:background .2s,border-color .2s}

.cm__icons a:hover{background:var(--coral);border-color:var(--coral)}



.cm__copy{margin-top:44px;font-size:13px;color:#8d95a8}


@media (max-width:640px){.cm{padding-top:56px}
}

.center-cta { text-align: center; margin-top: 40px; }

/* ---------- Request form (fields shared) ---------- */
.form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.form__field { display: grid; gap: 8px; font-size: 14px; font-weight: 600; }
.form__field input {
  width: 100%; min-width: 0;
  font: inherit; font-weight: 500; font-size: 17px; color: var(--ink);
  height: 54px; padding: 0 18px; border: 1px solid #dddcd7; border-radius: 14px; background: #fff;
  transition: border-color .2s, box-shadow .2s;
}
.form__field input::placeholder { color: var(--faint); }
.form__field input:focus { outline: none; border-color: var(--coral); box-shadow: 0 0 0 4px rgba(255, 154, 110, .18); }
.form__trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form__submit { width: 100%; height: 56px; margin-top: 6px; border: 0; cursor: pointer; font-family: inherit; }
.form__note { text-align: center; font-size: 14px; color: var(--muted); }
.form__note a { color: var(--coral-ink); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Request form section (centered, one line) ---------- */
.fa{text-align:center;max-width:920px;margin:0 auto;background:#fff6f1;border:1px solid #fde2d4;border-radius:28px;padding:64px 56px 48px}
.fa .form__field input{border-color:#f1d9cc}
.form__error{display:none;max-width:560px;margin:-16px auto 28px;padding:14px 18px;border-radius:14px;background:#fdecea;color:#b3261e;font-size:15px;font-weight:500}
.form__error a{color:inherit;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.form__error:target{display:block}
.fa .h2{margin-bottom:14px}
.fa__sub{color:var(--muted);font-size:18px;margin-bottom:40px}

.fa .form{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;align-items:end;text-align:left;gap:14px}

.fa .form__submit{width:auto;padding:0 32px;margin:0;height:54px}
.fa .form__note{grid-column:1/-1;margin-top:8px}


@media (max-width:860px){.fa .form{grid-template-columns:minmax(0,1fr)}
.fa .form__submit{width:100%}
}


@media (max-width:640px){.fa{padding:40px 22px 32px;border-radius:22px}
.fa__sub{font-size:16px;margin-bottom:28px}
.form__error{margin-top:-8px;font-size:14px}
}

/* ---------- On-page request form (free trial + form) ---------- */
.order { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 64px; align-items: center; }
.order__text { color: var(--muted); font-size: 18px; margin: 18px 0 32px; max-width: 30em; }
.order__card { background: var(--bg-soft); border: 1px solid var(--line); border-radius: 28px; padding: 40px; }
.order__title { font-size: 26px; font-weight: 700; letter-spacing: -0.02em; margin-bottom: 6px; }
.order__sub { color: var(--muted); font-size: 16px; margin-bottom: 26px; }
@media (max-width: 860px) { .order { grid-template-columns: minmax(0, 1fr); gap: 36px; } }
@media (max-width: 640px) { .order__card { padding: 28px 22px; border-radius: 22px; } .order__text { font-size: 16px; } }

/* ---------- Thank-you page ---------- */
.thanks { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px; background: var(--bg-soft); }
.thanks__box { width: 100%; max-width: 520px; background: #fff; border: 1px solid var(--line); border-radius: 28px; padding: 48px 40px; text-align: center; }
.thanks__logo { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 36px; }
.thanks__icon { width: 72px; height: 72px; border-radius: 50%; background: var(--coral); color: #fff; display: flex; align-items: center; justify-content: center; margin: 0 auto 24px; }
.thanks__title { font-size: 30px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.2; margin-bottom: 12px; }
.thanks__text { color: var(--muted); font-size: 17px; margin-bottom: 32px; }
.thanks__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
@media (max-width: 640px) { .thanks__box { padding: 36px 22px; } .thanks__title { font-size: 24px; } .thanks__actions .btn { width: 100%; } }

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 1480px) {
  .header__phone { display: none; }
}
@media (max-width: 1080px) {
  .nav { display: none; }
  .header__inner { justify-content: space-between; }
  .hero__title { font-size: 48px; }
  .hero__grid { gap: 48px; }
  .facts { gap: 32px; }
}
@media (max-width: 860px) {
  .hero { padding: 40px 0 72px; }
  .hero__grid { grid-template-columns: minmax(0, 1fr); }
  .hero__media { order: -1; }
  .hero__media img { aspect-ratio: 4 / 3; border-radius: 22px; }
  .hero__note { left: 16px; bottom: 16px; }
  .section { padding: 80px 0; }
  .h2 { font-size: 36px; }
  .pricing__head { margin-bottom: 40px; }
  .ba { grid-template-columns: minmax(0, 1fr); }
  .tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tile:last-child { grid-column: 1 / -1; }
  .split { grid-template-columns: minmax(0, 1fr); }
  .split__price { padding: 36px; }
  .split__list { padding: 28px 36px 36px; }
}
@media (max-width: 640px) {
  :root { --header-h: 64px; }
  .wrap { padding: 0 20px; }
  .wordmark { font-size: 24px; }
  .logo-icon { height: 31px; }
  .logo-icon--lg { height: 50px; }
  .header__phone, .header__right .btn, .header__right .lang { display: none; }

  .menu { display: block; position: relative; }
  .menu > summary {
    list-style: none; cursor: pointer; width: 44px; height: 44px; border-radius: 12px;
    display: flex; align-items: center; justify-content: center; border: 1px solid var(--line);
  }
  .menu > summary::-webkit-details-marker { display: none; }
  .menu__panel {
    position: absolute; right: 0; top: calc(100% + 10px); width: min(300px, calc(100vw - 40px));
    background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 10px;
    box-shadow: 0 20px 40px -16px rgba(29,36,51,.25);
  }
  .menu__panel a { display: block; padding: 12px 14px; border-radius: 10px; font-weight: 500; }
  .menu__panel a:hover { background: var(--bg-soft); }
  .menu__panel .lang { padding: 8px 6px 4px; border-top: 1px solid var(--line); margin-top: 6px; }
  .menu__panel .lang a { padding: 6px 10px; }
  .menu__panel .btn { width: 100%; margin-top: 8px; color: #fff; }

  .hero__label { margin-bottom: 18px; font-size: 13px; }
  .hero__title { font-size: 36px; letter-spacing: -0.03em; }
  .hero__values { margin-bottom: 32px; gap: 10px; }
  .hero__values li { font-size: 17px; }
  .hero__actions .btn { flex: 1 1 100%; }
  .facts { gap: 32px; justify-content: flex-start; margin-top: 40px; padding-top: 24px; }
  .facts dt { font-size: 20px; }
  .facts dd { font-size: 12px; }
  .hero__note { padding: 10px 14px; font-size: 13px; }

  .section { padding: 64px 0; }
  .h2 { font-size: 30px; }
  .pricing__sub { font-size: 18px; margin-top: 10px; }
  .sub { font-size: 16px; }
  .plan { padding: 28px 22px; border-radius: 22px; }
  .plan__price { font-size: 38px; margin: 14px 0 18px; }
  .checks li { font-size: 15px; }
  .tiles { gap: 10px; }
  .tile { padding: 20px 16px; font-size: 15px; border-radius: 18px; }
  .tile__icon { width: 44px; height: 44px; border-radius: 14px; margin-bottom: 14px; }
  .pricebar { flex-direction: column; align-items: stretch; text-align: center; padding: 26px 22px; }
  .pricebar__price { font-size: 34px; }
  .pricebar__price span { display: block; margin: 6px 0 0; }
  .split { border-radius: 22px; }
  .split__price { padding: 28px 22px; gap: 6px; }
  .split__amount { font-size: 44px; }

  .split__list { padding: 20px 22px 24px; }
  .split .checks li { font-size: 15px; padding: 12px 0; }
  .ba__col { padding: 28px 22px; border-radius: 22px; }
  .ba h2 { font-size: 26px; }
  .ba li { font-size: 16px; }
  .center-cta .btn { width: 100%; }
}
