/* ------------------------------------------------------------------ шрифт */
@font-face{
  font-family:'Manrope';
  src:url('../fonts/manrope-cyrillic.woff2') format('woff2');
  font-weight:400 800;font-style:normal;font-display:swap;
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:'Manrope';
  src:url('../fonts/manrope-latin.woff2') format('woff2');
  font-weight:400 800;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* ===========================================================================
   Лендинг NaumovLabsTrewel — вёрстка по макету:
   герой на фотографии, коллаж интерфейсов, четыре карточки, тёмный подвал.
   Подключается только страницей index.html (и языковыми версиями).
   =========================================================================== */

.lt-page{background:#fff}

.lt-wrap{width:min(1560px,calc(100% - 64px));margin:0 auto}

/* ------------------------------------------------------------------ шапка */
.lt-header{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);
  border-bottom:1px solid #eef1f5}
.lt-header-inner{display:flex;align-items:center;gap:34px;min-height:86px}
.lt-brand{display:flex;align-items:center;gap:12px;font-weight:800;font-size:23px;letter-spacing:-.5px;color:#10263d;text-decoration:none}
.lt-logo{display:grid;place-items:center;width:40px;height:36px;border-radius:10px;
  background:linear-gradient(135deg,#1b6fd6,#0f2a45);color:#fff;font-size:17px}
.lt-nav{display:flex;align-items:center;gap:30px;margin:0 0 0 12px;font-size:15px}
.lt-nav a{color:#33475c;text-decoration:none;font-weight:500}
.lt-nav a:hover{color:#1b6fd6}
.lt-header .lt-cta{margin-left:auto}
.lt-cta{display:inline-flex;align-items:center;gap:10px;padding:14px 26px;border-radius:999px;
  background:#0f2743;color:#fff;font-weight:700;font-size:15px;text-decoration:none;
  box-shadow:0 10px 24px rgba(15,39,67,.18);transition:transform .18s,box-shadow .18s}
.lt-cta:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(15,39,67,.24)}
.lt-cta span{font-size:17px;line-height:1}

/* язык */
.lt-header .language-picker{margin-left:8px;border-color:#dfe6ee;border-radius:10px}
.lt-header .menu-toggle{display:none;margin-left:auto;background:#fff;border:1px solid #e3ebf2;
  border-radius:10px;padding:8px 12px;font-size:20px;color:#10263d}

/* ------------------------------------------------------------------- герой */
.lt-hero{position:relative;overflow:hidden;isolation:isolate;min-height:min(760px,88vh)}
.lt-hero-bg{position:absolute;inset:0;background:center/cover no-repeat;z-index:-2}
.lt-hero:before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(92deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.94) 30%,
  rgba(255,255,255,.62) 52%,rgba(255,255,255,.12) 74%,rgba(255,255,255,0) 100%)}
.lt-hero-inner{display:grid;grid-template-columns:minmax(340px,.78fr) minmax(480px,1.22fr);
  align-items:center;gap:20px;padding:56px 0 40px}
.lt-eyebrow{font-size:13px;font-weight:700;letter-spacing:.08em;color:#5b7289;text-transform:uppercase}
.lt-hero h1{margin:16px 0 0;font-size:clamp(28px,3.1vw,46px);line-height:1.1;letter-spacing:-.025em;color:#0d2033;max-width:20ch}
.lt-lead{margin:20px 0 0;font-size:clamp(15px,1.05vw,17px);line-height:1.6;color:#4a6076;max-width:42ch}
.lt-trust{display:flex;flex-wrap:wrap;gap:26px;margin:30px 0 34px;font-size:14px;color:#3d5468}
.lt-trust span{display:inline-flex;align-items:center;gap:9px}
.lt-trust svg{width:19px;height:19px;stroke:#4a6178;fill:none;stroke-width:1.7}
.lt-btn-dark{display:inline-flex;align-items:center;gap:12px;padding:16px 30px;border-radius:999px;
  background:#0f2743;color:#fff;font-weight:700;font-size:16px;text-decoration:none;
  box-shadow:0 14px 30px rgba(15,39,67,.22)}
.lt-btn-dark:hover{transform:translateY(-2px)}

/* ------------------------------------------------- коллаж интерфейсов справа */
.lt-collage{position:relative;height:560px}
.lt-shot{position:absolute;border-radius:16px;overflow:hidden;box-shadow:0 30px 70px rgba(12,31,51,.28);background:#fff}

/* браузер с мини-сайтом */
.lt-shot-browser{left:9%;top:5%;width:60%;height:56%}
.lt-browser-bar{height:34px;background:#fff;border-bottom:1px solid #eef1f5;display:flex;align-items:center;
  gap:6px;padding:0 12px}
.lt-browser-bar i{width:8px;height:8px;border-radius:50%;background:#dbe2ea;display:block}
.lt-browser-dots{margin-left:auto;display:flex;gap:5px}
.lt-browser-body{position:relative;height:calc(100% - 34px);background:center/cover no-repeat}
.lt-browser-body:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,24,40,.18),rgba(8,24,40,.5))}
.lt-browser-copy{position:absolute;left:20px;top:26px;z-index:2;color:#fff;max-width:62%}
.lt-browser-copy b{display:block;font-size:20px;line-height:1.15;letter-spacing:-.02em;text-shadow:0 2px 10px rgba(0,0,0,.35)}
.lt-browser-search{position:absolute;left:20px;right:20px;bottom:18px;z-index:2;display:flex;gap:8px;
  background:rgba(255,255,255,.94);border-radius:10px;padding:8px 10px;font-size:10px;color:#7d8fa3}
.lt-browser-search span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lt-browser-search em{background:#1b6fd6;color:#fff;border-radius:8px;padding:6px 12px;font-style:normal;font-weight:700;font-size:10px}

/* телефон */
.lt-shot-phone{left:0;top:34%;width:104px;height:212px;border-radius:22px;padding:6px;background:#0f2743;z-index:3}
.lt-phone-screen{position:relative;height:100%;border-radius:20px;overflow:hidden;background:center/cover no-repeat}
.lt-phone-screen:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,26,42,.1),rgba(10,26,42,.62))}
.lt-phone-copy{position:absolute;left:14px;right:14px;bottom:20px;z-index:2;color:#fff}
.lt-phone-copy b{display:block;font-size:15px;line-height:1.2}
.lt-phone-copy small{display:block;margin-top:6px;font-size:9px;color:#dbe7f2}

/* панель управления */
.lt-shot-admin{right:0;top:6%;width:40%;height:42%;display:grid;grid-template-columns:36% 64%;border-radius:14px;z-index:2}
.lt-admin-side{background:#0d2135;color:#b9cbdc;padding:14px 10px;font-size:9.5px}
.lt-admin-side b{display:block;color:#fff;font-size:10.5px;margin-bottom:12px}
.lt-admin-side span{display:block;padding:6px 8px;border-radius:6px;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lt-admin-side span.on{background:#1b6fd6;color:#fff}
.lt-admin-main{background:#f7f9fc;padding:12px}
.lt-admin-main h4{margin:0 0 10px;font-size:11px;color:#213a52}
.lt-admin-row{display:grid;grid-template-columns:1.2fr 1fr .9fr .9fr;gap:6px;font-size:8.5px;color:#5b7086;
  padding:6px 0;border-bottom:1px solid #e9eef4}
.lt-admin-row.head{color:#8fa2b5;text-transform:uppercase;letter-spacing:.06em;font-size:7.5px}
.lt-pill{display:inline-block;padding:2px 7px;border-radius:999px;font-size:7.5px;background:#e7f6ec;color:#1c7a46}

/* мессенджеры */
.lt-chats{display:none}
.lt-chats i{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;color:#fff;
  font-style:normal;font-size:15px;box-shadow:0 10px 22px rgba(12,31,51,.22)}
.lt-chats i:nth-child(1){background:#2aabee}
.lt-chats i:nth-child(2){background:#25d366}
.lt-chats i:nth-child(3){background:linear-gradient(135deg,#f9ce34,#ee2a7b 55%,#6228d7)}
.lt-chats i:nth-child(4){background:#0077ff}

/* телефон справа с перепиской */
.lt-shot-chat{right:2%;top:52%;width:104px;height:198px;border-radius:20px;padding:5px;background:#0f2743;z-index:4}
.lt-chat-screen{height:100%;border-radius:18px;background:#f2f6fa;padding:10px;font-size:8px;color:#33475c;overflow:hidden}
.lt-chat-screen b{display:block;font-size:9px;margin-bottom:8px;color:#12283f}
.lt-bubble{background:#fff;border-radius:9px;padding:6px 8px;margin-bottom:6px;line-height:1.35;
  box-shadow:0 2px 6px rgba(18,40,63,.08)}
.lt-bubble.me{background:#1b6fd6;color:#fff;margin-left:14px}

/* ------------------------------------------------------------- карточки под героем */
.lt-cards{background:#eef2f7;padding:26px 0 40px}
.lt-cards-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.lt-card{position:relative;display:flex;flex-direction:column;background:#fff;border-radius:18px;padding:26px 24px 24px;
  box-shadow:0 16px 40px rgba(16,38,61,.07);min-height:330px}
.lt-card-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:12px;margin-bottom:16px}
.lt-card-icon svg{width:22px;height:22px;stroke:#fff;fill:none;stroke-width:1.8}
.lt-card-icon.blue{background:#2b7fe0}
.lt-card-icon.green{background:#158f6a}
.lt-card-icon.violet{background:#6c5ce7}
.lt-card-icon.amber{background:#e9a13b}
.lt-card h2{margin:0 0 8px;font-size:20px;letter-spacing:-.02em;color:#10263d}
.lt-card p{margin:0 0 16px;font-size:14px;line-height:1.55;color:#5b7086}
.lt-card ul{list-style:none;margin:0;padding:0;font-size:14px;color:#3d5468}
.lt-card li{position:relative;padding-left:24px;margin-bottom:9px;line-height:1.35}
.lt-card li:before{content:"✓";position:absolute;left:0;top:0;color:#2b7fe0;font-weight:800}
.lt-card .lt-card-visual{position:absolute;left:0;right:0;bottom:0;height:110px;
  background:linear-gradient(180deg,rgba(238,242,247,0),#eef2f7 70%)}
.lt-card .lt-mini{position:absolute;border-radius:10px;background:#fff;border:1px solid #e6ecf3;
  box-shadow:0 12px 26px rgba(16,38,61,.12);overflow:hidden}
.lt-card .lt-mini.screen{left:20px;bottom:44px;width:58%;height:70px}
.lt-card .lt-mini.screen .bar{height:12px;border-bottom:1px solid #eef1f5}
.lt-card .lt-mini.screen .img{height:calc(100% - 12px);background:center/cover no-repeat}
.lt-card .lt-mini.phone{right:22px;bottom:40px;width:32px;height:62px;border-radius:8px}

/* статистика в четвёртой карточке */
.lt-stats{display:flex;gap:14px;margin-top:18px;border-top:1px solid #eef1f5;padding-top:16px}
.lt-stats div{flex:1}
.lt-stats b{display:block;font-size:24px;color:#e9a13b;letter-spacing:-.02em}
.lt-stats span{display:block;font-size:11px;color:#7d8fa3;line-height:1.35;margin-top:2px}

/* ------------------------------------------------------------------- подвал */
.lt-footer{position:relative;color:#fff;padding:44px 0;background:#0d2033}
.lt-footer:before{content:"";position:absolute;inset:0;background:center/cover no-repeat;opacity:.42;z-index:0}
.lt-footer:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,22,36,.94),rgba(8,22,36,.72));z-index:0}
.lt-footer-inner{position:relative;z-index:1;display:flex;align-items:center;gap:34px;flex-wrap:wrap}
.lt-footer .lt-brand{color:#fff;font-size:24px}
.lt-footer .lt-brand small{display:block;font-size:12px;font-weight:400;color:#a9bccf;margin-top:2px}
.lt-footer-features{display:flex;gap:38px;margin:0 auto;flex-wrap:wrap;font-size:14px;color:#dbe6f0}
.lt-footer-features span{display:inline-flex;align-items:center;gap:12px;max-width:175px;line-height:1.3}
.lt-footer-features svg{width:26px;height:26px;stroke:#cfe0f0;fill:none;stroke-width:1.5;flex:0 0 auto}
.lt-cta.light{background:#fff;color:#0f2743;box-shadow:none}

/* --------------------------------------------------------------- адаптив */
@media(max-width:1280px){
  .lt-hero-inner{grid-template-columns:1fr 1fr;gap:10px}
  .lt-collage{height:520px}
  .lt-card{padding-bottom:110px;min-height:380px}
}
@media(max-width:1080px){
  .lt-header .menu-toggle{display:block}
  .lt-header .lt-cta{display:none}
  .lt-nav{position:absolute;top:86px;left:0;right:0;flex-direction:column;align-items:flex-start;gap:0;
    background:#fff;border-bottom:1px solid #eef1f5;box-shadow:0 18px 34px rgba(16,38,61,.10);padding:10px 24px 18px;display:none}
  .lt-nav.open{display:flex}
  .lt-nav a{width:100%;padding:12px 0;border-bottom:1px solid #f1f5f9;font-size:16px}
  .lt-header .language-picker{margin:14px 0 0}
  .lt-hero-inner{grid-template-columns:1fr;padding:40px 0 30px}
  .lt-hero:before{background:linear-gradient(180deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.9) 42%,rgba(255,255,255,.45) 72%,rgba(255,255,255,.2) 100%)}
  .lt-hero h1{max-width:none}
  .lt-collage{height:440px;margin-top:10px}
  .lt-cards-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lt-footer-features{margin:0;gap:22px}
}
@media(max-width:680px){
  .lt-wrap{width:calc(100% - 32px)}
  .lt-header-inner{min-height:70px}
  .lt-nav{top:70px}
  .lt-hero{min-height:0}
  .lt-hero h1{font-size:30px;letter-spacing:-.02em}
  .lt-trust{gap:14px;font-size:13px;margin:22px 0 26px}
  .lt-collage{height:290px}
  .lt-shot-browser{left:0;width:92%;height:64%}
  .lt-shot-phone{left:2%;top:30%;width:94px;height:190px}
  .lt-browser-copy{left:36%;top:14%}
  .lt-browser-copy b{font-size:13px;line-height:1.2}
  .lt-browser-search{font-size:9px}
  .lt-browser-search em{padding:5px 9px}
  .lt-shot-admin{display:none}
  .lt-shot-chat{display:none}
  .lt-chats{display:none}
  .lt-cards-grid{grid-template-columns:1fr}
  .lt-card{min-height:0;padding-bottom:26px}
  .lt-card .lt-card-visual{display:none}
  .lt-footer-inner{gap:20px}
  .lt-footer-features{flex-direction:column;gap:14px}
}

/* языковая версия: те же правила, пути к картинкам подставляются в разметке */

/* мини-панель во второй карточке */
.lt-mini.admin{left:20px;bottom:44px;width:60%;height:70px;display:grid;grid-template-columns:32% 68%}
.lt-mini.admin .side{background:#0d2135}
.lt-mini.admin .main{background:#f7f9fc;padding:6px}
.lt-mini.admin .main i{display:block;height:6px;border-radius:3px;background:#dfe7ef;margin-bottom:5px}
.lt-mini.admin .main i:first-child{background:#1b6fd6;width:45%}

/* мини-переписка в третьей карточке */
.lt-mini.chat{right:22px;bottom:40px;width:52%;height:76px;padding:7px;background:#f2f6fa}
.lt-mini.chat i{display:block;height:12px;border-radius:6px;background:#fff;margin-bottom:5px;box-shadow:0 1px 3px rgba(18,40,63,.08)}
.lt-mini.chat i.me{background:#1b6fd6;margin-left:22%}

/* ссылка внутри карточки прижата к низу */
.lt-card .lt-card-link{margin-top:auto;padding-top:14px;font-size:13px;font-weight:700;color:#1b6fd6;text-decoration:none}
.lt-card .lt-card-link:hover{text-decoration:underline}

/* ------------------------------------------------- настоящие скриншоты платформы */
.lt-page{font-family:'Manrope',Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
.lt-hero h1,.lt-lede,.lt-lead,.lt-card h2,.lt-eyebrow,.lt-cta,.lt-btn-dark{font-family:inherit}

.lt-shot-img{display:block;width:100%;height:100%;object-fit:cover}
.lt-shot-browser .lt-shot-img{height:calc(100% - 34px);object-position:top center}
.lt-shot-phone{padding:6px}
.lt-shot-phone .lt-shot-img{border-radius:18px;object-position:top center}
.lt-shot-admin{display:block;background:#fff;padding:0}
.lt-shot-admin .lt-browser-bar{height:26px;border-bottom:1px solid #eef1f5}
.lt-shot-admin .lt-shot-img{height:calc(100% - 26px);object-position:top center}

/* мини-скриншоты в карточках */
.lt-card-shot{margin:16px 0 0;border-radius:12px;overflow:hidden;border:1px solid #e6ecf3;
  box-shadow:0 10px 22px rgba(16,38,61,.10);background:#f7f9fc}
.lt-card-shot img{display:block;width:100%;height:140px;object-fit:cover;object-position:top center}

/* нижняя строка подвала */
.lt-footer .lt-footer-bottom{margin-top:20px;padding-bottom:6px;font-size:12px;color:#9fb4c8;position:relative;z-index:1}

/* коллаж: три настоящих экрана */
.lt-shot-browser{left:9%;top:3%;width:58%;height:60%}
.lt-shot-phone{left:1%;top:38%;width:96px;height:196px}
.lt-shot-admin{right:0;top:4%;width:36%;height:44%}

@media(max-width:1280px){
  .lt-shot-browser{left:8%;width:64%;height:56%}
  .lt-shot-admin{width:40%;height:44%}
}
@media(max-width:680px){
  .lt-card-shot img{height:96px}
  .lt-shot-browser{left:0;width:94%;height:62%}
}